What makes for a lovely experience on a mobile commerce site?
Mobile is undergoing big change and still in the area of design testing and optimisation.
Companies, although finally on board with the idea of the smartphone as assisting sales and driving footfall in store, are of course trying to increase conversion and checkout on the mobile itself.
James Gurd, in this post on the maturity of mobile, remarks:
I think we’ll see more landing page optimisation, focused on the overall UX and top line metrics like bounce rate/click through/visit-to-basket and visit-to-order.
The penetration of smartphones along with usage statistics have woken many marketers to the idea of mobile-first design. Stuart Mcmillan in the same post comments:
I think we’ll only have gotten to grips with mobile when we start thinking about mobile-first and asking about how we can up-scale it for desktop.
We’re all going to have to get good at mobile commerce, if not, we’ll wake up soon, with more customers browsing our sites on mobiles than on desktop PCs and we’ll be making no money from them.
So, leaning heavily on Econsultancy’s excellent Mobile Web Design and Development Best Practice Guide, authored by the indominatable James Gurd, I thought I’d list some features of good mobile commerce design. Of course, there are many more, and feel free to contribute in the comments.
GPS enabled store finder
Smartphone users may not all expect to use built-in phone functionality when browsing sites. That’s the reality of where we are with mobile. Many websites are still poorly optimised for mobile and as such, it’s possibly still a delight to find that smartphone functionality has been carried through in mobile web design.
On that front, allowing users to enable a GPS nearest store finder with one touch of a button is a great feature. Driving footfall to store is one of the key purposes of many mobile commerce sites and this feature plays a big part in that. Including store opening times is also a must.
Click to call
Another example of smartphone functionality a user may expect to see. A store or customer service contact number should be tappable to call.
Mobile context-specific inputs
For example, presenting the numeric of telephone keyboard when number fields are filled e.g. credit card number. This is part and parcel of using the functionality of the smartphone to offer the best tools for the job.
Another example is offering the email keyboard when users are filling in this field in the checkout or to sign up to a newsletter.
Users walk the multichannel journey in different ways. Social media is now a big part of people’s lives and it’s safe to assume that some users will want to bring products to their friends’ attention or email themselves a product link, to continue the path to sale later and possibly on another device.
This isn’t just about brand awareness, though that’s obviously another benefit as social media is predominantly consumed and distributed on smartphones.
M&S had problems with this issue after redevelopment of its mobile site and it was quickly noticed by one of our readers.
Note the share button on this H&M product page.
Many travel sites such as Laterooms prepopulate information in the homepage filters. When a user alights on the mobile site, the date filter is already set to today, and the number of rooms and people is set to one and two respectively. The mobile site may also allow use of GPS to search hotels nearby.
Needless to say, this significantly reduces the work the customer has to do to buy a room.
Not unlike prepopulation. This could be as simple as carrying forward address, name and email from shipping details to the billing form. The user expects this now as it as been standard on desktop for a long time.
CTA on first page load
Whilst mobile doesn’t hold to a firm concept of ‘the fold’, what shows on the screen is of course something to bear in mind.
Looking at Schuh’s mobile commerce site, they have made sure important product details are visible on one screen as well as the call to action. To achieve this, the page has scrolled down automatically past the navigation.
Mirroring an OS
A lot of what brings about good UX is designing experiences that users find intuitive. Often, because users have accrued hundreds of hours of learning with many tools and devices, there are design conventions that when adopted can significantly increase the ease of use for a customer.
One instance of this is designing a dedicated mobile site with the look and feel of a mobile application, based on an OS, either Android, Apple or Windows Mobile.
Though this can be difficult, it is met with the favour of the consumer. More difficult elements can be compromised on, whilst adhering to the overall feel of an OS. Carpetright effectively mirrors iOS but uses a simpler date picker, a calendar instead of a scrolling wheel.
Swipe, pinch, double tap
A fairly obvious one and again a part of ensuring smartphone functionality is utilised. According to data from Google’s Think Insights, 29% of users cite inability to see detailed product information as a barrier to purchase on smartphones.
The obvious answer to this, though one might argue detail should be presented at an adequate size, is to enable pinching to zoom. Swiping is particularly useful for saving space in a design and is fairly intuitive for the user when presented well.
Okay, this is fairly sophisticated functionality but if a mobile commerce app (and possibly site) is really about as slick a journey as possible, synced carts with desktop is a good idea. Partly this is because stored customer data doesn’t have to entered again, delivery address and billing details etc., and partly a synced carts enables the multichannel shopper to seamlessly browse on one platform and purchase on another.
Amazon is of course the most famour example of a streamlined and user-friendly experience.
Multiple payment methods
Security is still a consideration for users, particular older demongraphics. According to Google’s Think Insights, 46% of users do not trust credit card security on a mobile device.
In order to enable users to trust your checkout, if they’ve taken the trouble to get all the way to purchase, offering multiple payment methods should allow them to choose one they trust.
PayPal, for example, is a mobile payment method users are familiar with and have a high degree of trust in. Offering it will foster trust as well as streamline the checkout process and filling in of forms.
Click and collect
With similar motivations to those behind multiple payment methods, retailers should offer click and collect.
Greater still than the aspect of security (and not having to enter payment details) is of course convenience. Users will often be on the move and want the item same day. If the item is low in stock or if users want to ensure time spent in store is not wasted, click and collect is the ideal option.
This is another way in which mobile commerce sites can drive customers in store.
Stuart Mcmillan of Schuh comments thus:
I believe increasing adoption of mobile browsing is starting to change people’s expectations of web design. ‘Simpler is better’ really would appear to be the case. Approaching it mobile first really helped us with our design. It helped us eliminate unnecessary UI elements, whereas in the past we would have included them just because we felt we had plenty of pixels to spare.
Simplicity might not be a feature as such, but it’s stil something to flag up as perhaps the most important aspect of a mobile commerce design.
Whether reducing the size of your mobile site or chunking its loading, quickening the load speed is essential. Until 4G does what it says on the tin and is cheap enough for everyone, this issue will not go away, and even then it will still be pertinent.
For advice on responsive design, including load speeds, see this great post by Dan Scott.
Do remember to check out the Mobile Web Design Best Practice Guide for more than 200 pages of insight into planning, design and delivery.