This is the second of a two-part series on mobile conversion. In the first part, we described the most common usability mistakes made in mobile commerce sites and apps, and how to fix them.
In this part, we’ll discuss the frontiers of mobile commerce: trends we’re seeing in user tests that may fundamentally change eCommerce.
There are an almost limitless number of small usability gotchas that need to be identified and gradually refined in mobile commerce.
That process took years on the desktop, and there’s no reason to assume it’ll be any faster in mobile.
just as the personal computer forced people to rethink accounting and word processing, mobile devices challenge us to rethink how shopping should work.
This isn’t something you should stick your head in the sand on, because according to Custora, mobile commerce has grown from $2.2 billion in transactions in 2010, to $42.8 Billion in 2013 – and is projected to reach $50 billion by the end of this year.
Fortunately for you, we’ve done thousands of mobile commerce user tests at User Testing, and three trends of effective mobile experiences stand out:
1. Welcome Both Searching and Browsing
People will usually come to a mobile commerce site for one of two reasons:
- They want to shop recreationally, by browsing through products; or
- They want to go directly to a particular product they’re considering
Clearly, these two motivations conflict. Browsing calls for a leisurely and entertaining experience, rich with media; while buying calls for a quick jump to specific product information.
Above, the mobile website of a clothing retailer includes features designed to help visitors either search or browse.
The home page features a very prominent search box (that actually asks a question rather than just saying “search”) in addition to a location finder, home button & log-in icon.
Underneath, an instant reminder for free shipping & a half-displayed image that clues a browsing user to swipe down, displaying more images that link to departments in the store.
Many mobile developers are discovering that although a half-displayed image looks “funny,” they are very effective at getting users to swipe further down the page.
One of the the biggest design challenges in mobile is deciding which features and buttons should appear on the first screen, and which ones should be hidden in a sub-menu or secondary screen.
eBay’s mobile site for instance understands that site search is one of the most important features for mobile visitors, therefore the search bar is front & center at the top of the page (along with a call to action to install the native app, something that can become critical in understanding attribution later down the road )
Ideally, the top features on a mobile shopping site or app should adapt to the user’s intent. For example, if a user is in browsing mode you should display a lot of product images and make it easy to navigate through the departments in the store. If the user’s in buying mode, it’s more important to display filters and purchase support information.
But how do you know what mode a user is in? Short of mindreading, there’s no perfect answer. It’s often possible to infer a user’s likely intent. For example, someone who has browsed in the past is probably more likely to do so in the future.
In the example below, the “click the arrow for more like this” can be a signal that the viewer is in a buying mode.
On the other hand, someone who immediately does a search for a specific product is probably in purchasing mode and should be treated appropriately.
If a visitor has no history, it’s possible to design a landing page or first screen so that both paths are available to the user, and they declare their intent through which one they choose. Toys R’ Us does this nice & subtly.
Just be sure you give the user an easy way to get out of a particular mode when their needs change or if you’ve guessed wrong about what they want to do. Even if someone was in buying mode yesterday, they might want to browse today.
2. Understand How Shopping Crosses Devices
This is one of the hottest areas in mobile commerce research today. Increasingly, companies are finding that the purchasing process isn’t limited to a single device; it can cross from smartphone to tablet to computer.
The companies that first pioneered mobile computing talked about the personal “real estate” that various devices occupy. The smartphone lives in a pocket or purse and is used for short sessions throughout the day. The personal computer is used for relatively long, immersive sessions when the user is sitting down, often at a desk.
We’re still figuring out the geography of the tablet, but so far it appears to live on a side table next to the easy chair at home, where it competes with the television for attention.
The purchasing process can extend across all three devices.
For example, a user might receive a smartphone message from a friend mentioning a pair of shoes. During the day the user might check them out on a notebook computer. Then in the evening, over a glass of wine, the shoes are ordered via tablet.
The shopping optimization company Bloomreach found that prom dress shopping often involves two devices and two users: a daughter on a smartphone finding possibilities, and a mother on a personal computer checking prices and making the purchase.
Watch the video to get an idea of how this can work.
Companies can struggle to understand this sort of buying process. Traditional analytics would say the personal computer was responsible for the prom dress purchase, but in reality both the computer and smartphone were responsible.
So we need more advanced analytics capable of tracking people across multiple devices, and the shopping process on both devices needs to be designed so they can easily collaborate.
User tests can be designed to test this cross-device shopping behavior.
One way to get around this is for sites to have a native app, which (depending on the vertical) has the user perpetually logged in, or requires the user to login before the purchase is finally made.
In this example, Tommy received an email from Amazon Local about a weekend getaway in Vermont, and these were the series of screens he received in order to complete the purchase.
Step 1 – The Initial Email
Step 2: Where To View The Offer:
Installing the app means Amazon Local will always know the identity & location – among other things – of the device it’s installed on, even when not technically “logged in”. If the app is installed, Amazon can see when the email has been opened, the links that are clicked, the pages that are visited etc.
The “log in” prompt that comes at the end of this sequence is more of a security measure for payment than it is an actual prompt for logging in.
Step 3: The Mobile Product Page
Notice how the size of the photo, reviews & “See Options & Buy” are the main elements of this page?
Yes, there are plenty of text details as you scroll down the page, such as the additional amenities, different package options, and a map to the location, however for many buyers, the 7 images, 3.5 star rating & price are more than enough to click through to the next page, which helps to narrow down the options a little more.
Also notice how the navigation isn’t cluttered on the product page? It’s almost entirely absent with the exception of the left facing chevron next to the amazon local image on the top left.
One final thing I’d like to point out as well is that the only other item in the navigation in the product page is the sharing option on the top right. From here, whenever a user shares the page via text, social network, etc, a unique share id is generated at the end.
At the very least, this will provide data about signups from shared links, and at the most, could be cross analyzed with phone book data & shipping data for other logged in users to see when two people from the same household are sharing deals with each other. (like when Tommy sent this deal to his wife)
Step 4: Buying Options Page
Alone, this page is fairly straight forward, but over time, pages like this can clue you in to a user’s income level, buying preferences, and in this case, availability for traveling.
This helps to increase the customizing options of the mobile experience down the road, and improve the overall personalized marketing experience overall.
Step 5: Log in
As I mentioned earlier, this is more of a security measure than it is a prompt to actually log in.
Of course, there are so many more ways to design a multi-device experience, and can be easier to implement than this.
In the book Designing Multi-Device Experiences, Google designer Michael Levin gives an example of how sharing with yourself can work.
The cooking site AllRecipes , when displayed on a computer, is optimized for researching recipes. After recipes are chosen, a smartphone can be used to display a shopping list generated from the selected recipes (below left). Later, a tablet in the kitchen can display step-by-step cooking instructions (below right).
This kind of multi-device experience plays to the strengths of both the mobile & desktop platforms, without taking anything away from either. Something for you to think about as you rethink your own mobile experience.
3. Let The Smartphone Be a Smartphone
Although it’s possible to improve the mobile conversion of almost any shopping site, the biggest improvements in mobile commerce may come not from tweaking web shopping to fit on a mobile screen, but by creating new forms of shopping that leverage the unique strengths of mobile.
A simple example of this is flash sales, which take advantage of the immediacy and personal nature of a smartphone. For example, in this article on Internet Retailer, Rue La La’s CTO reports half of it’s sales will come from mobile devices. Gilt, another flash deal site, said in 2012 that 25% of it’s sales were from mobile devices during the week, and 30% on the weekends.
There are also big opportunities in the interaction between mobile devices and brick-and-mortar stores.
For a long time, smartphones in stores were seen as the enemy, a tool that let users showcase goods in a store and then order them online. That’s always a risk, but in our tests we’re starting to see retailers explore the use of a smartphone as a shopping assistant. For example:
- Make it easy for a shopper to look up detailed information on a product in the store, without having to track down a sales associate (QR codes are one way to do this)
- If there’s a long time at checkout, enable a shopper to order a product online and have it delivered
One of the more interesting recent experiments in mobile shopping is the Firefly feature in Amazon’s new Fire Phone. Firefly is an app that can recognize photos or names of products and let the user instantly order them. Software companies have experimented with apps like this in the past, but Amazon is the first company to build it into a smartphone, with its own dedicated hardware button.
In tests of the Fire Phone conducted by UserTesting, Firefly had some problems: it can’t easily recognize a product when the logo is not clearly visible, and it sometimes directs you to a similar product rather than the one you’re scanning. Nevertheless, users rated Firefly as the phone’s most popular feature.
Amazon Firefly recognizing a box of mints. Note the product listing displayed at the bottom of the screen. The user can tap to read reviews of the product and potentially order it through Amazon.com.
Firefly and products like it raise the possibility that we haven’t yet seen the real impact of mobile on the shopping process. Maybe the future of mobile shopping isn’t an improved shopping app, it’s a smartphone in which shopping is just a feature of the device. (In other words, the device becomes the store, rather than the device being used to access the store.)
This is potentially a very disruptive change to every online commerce company on the planet. Retailers need to track this sort of new technology, and explore what it could mean to them. It’s also worthwhile to explore plugging into Amazon’s Firefly app, which has an API that lets companies add their own extensions to it.
For brick & mortar locations, it’s important to understand “showrooming” rather than fear it. In a study published in 2013 by the University of Columbia it was found that only 6.1% of mobile assisted shoppers were constantly on the lookout for the lowest price.
It may come as a breath of fresh air to learn that the majority of mobile assisted shoppers still value the best experience, and prefer the in-store experience over everything else.
Regardless, the time to do these experiments is now, before Amazon or someone else figures out how to revolutionize mobile shopping, and you have to scramble to catch up.
Conclusion: An Action Plan for Mobile Conversion
The mobile conversion problem can’t be solved instantly. It’s driven by a large number of small issues rather than one big thing that can be easily fixed. Mobile site design is a harder job than desktop, because the screens are smaller and because the best practices for mobile are still being discovered.
Because of the unfamiliarity of mobile, many companies try to farm out its execution to contractors, or focus on a single panacea such as adaptive design.
That’s dangerous. Although mobile is still a minority of mobile commerce traffic, it’s growing rapidly. Some companies, including Facebook and Yelp, report that mobile is already the majority of their business. Commerce companies that treat mobile as a second-class citizen are putting themselves at risk as the move to mobile accelerates.
Here are steps to ensure that your mobile presence is the best it can be:
1. Standardize Your Terminology
Make sure the language you use in your store matches the vocabulary used by your customers. This applies to the tags and menus you use to identify your products, and also the button labels you use for navigation within your store. When in doubt, copy the terms used by the biggest e-commerce leaders. They’re the ones being seen by the most customers.
2. Limit The Use Of Menus
We think two levels of menus, with each list filling about one screen, is about the maximum you should do in a mobile site. If you need more than two levels, add a landing page after the second level, to keep people oriented. Think like an elevator in a department store.
3. Make Everything Tapable
The mobile paradigm is tap and edit in place, rather than going forward and back. Don’t make it impossible to edit items like billing or shipping addresses directly from the interface.
4. Give Access To The Desktop View Of Your Store, But Not By Surprise
It’s not uncommon for mobile shoppers to want the full site just in case they might be missing out on critical information that doesn’t make it to the mobile version. Don’t force the desktop version on them, but rather, let them have a link that will load the full version of the site.
5. Optimize For Two Kinds Of Mobile Visitors
Provide different paths for visitors who are shopping & browsing, and adjust the experience to them. In the image above, it’s reasonable to think that mobile visitors who click the “Sale” button may be closer to buying than those browsing the various departments.
Remember, mobile is all about immediacy and personalization, so look in your analytics at the browsing patterns of mobile buyers to find where the shift from browser to buyer happens & use qualitative feedback loops to learn more about what buyers need to make the mobile shopping experience frictionless.
6. Take Advantage Of What Mobile Does Best
Mobile shopping is a very tactile experience. Rather than struggling to turn a mobile device into a computer, optimize for the things it does best. Make it fun to interact with, and give users a sense of reward from “playing” with your site. If you haven’t already done so, test flash sales.
7. Integrate Shopping Across Multiple Devices
Track users across device types, and make it easy for them to share a discovery or shopping session with themselves, so they can resume later on a different device.
Universal Analytics is a good first step here, but tools like KISSmetrics or Heap Analytics will give you a more complete picture overall.
8. Rethink For Mobile
This is the hardest task, but also the most important one. Learn how mobile can change the shopping process. Track experiments like Firefly, and if you have a brick-and-mortar presence, explore ways that mobile can supplement your in-store experience.
The real question isn’t how smartphones convert, but how your whole business converts.
9. Assume Nothing; Test Everything
If your business is successful today in the desktop web, you have a set of assumptions about do’s and don’ts for online shopping. Some of those assumptions will turn out to be right in mobile, and some of them will be dead wrong.
Unfortunately, it’s impossible to say ahead of time which ones are which. In mobile, it’s essential to mix test those assumptions with a mix analytics and user testing. Analytics will tell you what people are doing; user tests will tell you why they do it.
Testing is especially important if you’re creating a mobile app. In the web world, you can easily launch a first-draft website and iterate to improve it. In mobile apps, users will try something once or twice and then move on. Online reviews punish severely an app that isn’t satisfying from day one.
Rather than launching and iterating, the best approach to mobile is to test early and often, throughout the development process, before you hit the app store.
Read more at http://www.business2community.com/mobile-apps/make-mobile-ecommerce-convert-whats-effective-mobile-design-right-now-0973278#sjlrraj6tEE4yEv0.99
