You know that Amazon and Facebook never settle for one awesome website design. In fact, how would Facebook look today if not for iteration? Without a doubt, iterative design and A/B testing have done wonders for websites in recent years.
Now, it is time for mobile apps to create optimized selling environments. It’s not the same ball game, though; some challenges are unique for mobile apps. A shorter user attention span and a smaller screen size are the primary ones. But, what does work for mobile apps is that potential customers have their mobile phones with them all the time! The always-connected generation doesn’t usually find push notification intrusive, either.
Moreover, with phenomenal growth in the sales of smart phones (surpassing PCs and tablets), the importance of mobile commerce for all e-commerce vendors is only expanding.
In short, mobile apps must optimize user experiences, basing their judgments on real-world experiments.
It is pretty much a given that the goal for e-commerce vendors is to help mobile app users complete purchases without any friction. Selling more, without a doubt, IS the ultimate business goal. But, just as every page on a website should have its own goal, every screen or step in a mobile app also should have its own goal.
So, ask yourself this question: What would you want users to do on your home screen? You’d probably want them to look at the products you sell and be convinced that it’s where they want to buy. Let me take you through all the elements or sections in the buying process that will help you get users to do this:
1. Product Choice and Page Layout
It is very difficult to say what makes a user come back to your app. Is it the right mix of products or the relevant recommendations? The key is to iteratively find the sweet spot. Create hypotheses to A/B test variations of the following:
- Default order for search results
- Size of the product picture
- Layout of product description and recommendations page
- Perhaps, a different mix of products for mobile
i. Best Buy – Default order of search lists
By default, the Best Buy app shows results for Best Selling, with choices for sorting by Highest Rated and Price. This is helpful in the following ways:
- There must be a reason why best-selling products sell the most. And, for an e-commerce player, it is a no-brainer to expose a potential customer to a best-selling product.
- In some cases, a potential customer might be looking for the best product or the cheapest one instead. Providing the ability to change the order of the results helps customers reach the product of their choice faster and thereby close the sale.
ii. Groupon – Product pictures
Product pictures always grab the most screen real estate. For a deals portal, it is important to piggyback on the impulse of the potential customer. So, the use of tempting images is another way to attract attention and close the sale.
iii. Etsy – Custom product lists
This is an example of a custom product list. In cases where the retailer has information about the user, it is highly valuable to customize the product list. Since you already know what the user’s interests are, you are better off customizing the product list to have a better chance of conversion.
2. Navigation and Funnels
An effective navigation menu or a funnel is another area filled with an ample number of choices to A/B test. You could split test variations based on the following:
- Number of steps
- Removing extraneous distractions
- Order of menu items or categories of products
- Horizontal or vertical navigation
- Text of menu items
i. Best Buy – Navigation menu
Best Buy’s app is a great example of minimal navigation on a landing screen.
Best Buy has a primary navigation menu as its home screen on the mobile app. This navigation menu has only a few choices to ensure that users do not get lost. However, should users want to use some of the other features or just browse products, they can access the secondary navigation menu by tapping the menu button on the top left.
ii. Ebay – The popular bottom navigation bar
The bottom navigation menu used by Ebay is the most popular place for the navigation menu. Even Facebook, whose bread and butter is to engage with users for long periods, uses the bottom navigation in their iOS app after having A/B tested it extensively. The advantage of this approach is the navigation menu is always visible, giving users the ability to navigate throughout the app without confusion.
Now, here is another question to ask yourself: What would you want users to do on your product description screen? You’d want them to close the sale. Some of the actions you need to take in order to make this happen are?
Let’s keep going to find out…
3. Pricing and Shipping Strategy
The aim here is to convert visitors into paying customers using motivating pricing and shipping. You don’t want your customers to not buy from you because someone else has a more attractive shipping policy. Also, the price of a product should mean both value and affordability. Either too high or too low can mean a misfit. Some of the areas that can be A/B tested are:
- Psychological pricing (.99, .95, or .97 type of prices)
- Design of pricing box
- Money back guarantee
- Shipping times and return policy
i. Amazon – Psychological pricing
Psychological pricing gives the impression that a product is in a cheaper bracket than it actually is. In other words, users perceive a $99.99 product to be much cheaper than a $100 product.
ii. Best Buy – Psychological pricing
Best Buy – Another example of psychological pricing
iii. Amazon – Discounts on products
The pricing strategy of showing discounts and how much users will save if they choose to buy a product is the most used, and rightly so. This approach hooks the potential customer. However, the discount approach can backfire when used with perishable items such as edibles. In such cases, the discount could elicit a feeling that the goods are substandard or stale.
4. Call to Action Button
No sale is made until it is actually closed. There is no denying that the most important step in closing the sale online is the Call to Action button. It is the first step in closing the sale. A call to action button tailored to perfection is the best way to start the process. However, to know what type of button is the perfect button shouldn’t be a matter of opinion. This is where A/B testing comes in. There are various factors that can be controlled using A/B testing, some of which are:
- Location of the button
- Color and shape
- Number of Calls to Action on one screen
- Only text, only icon, or text and icon on the call to action button
i. Etsy – Subtle yet easily discernible CTA button
The jury is still out on call to action buttons. But there are a few rules of thumb, such as easily visible CTA buttons. You don’t want your customers to be struggling to find your CTA buttons.
ii. Amazon – Another example of CTA buttons
Even though Amazon’s multiple CTA buttons give users a choice, sometimes presenting a lot of choices is not a good thing. It is like telling the user “if you are okay with spending a few dollars more, then you might as well buy the product tomorrow instead of right now.”
iii. Groupon – Big CTA button
Groupon’s CTA button is a very good example, as it creates urgency and is easily noticeable as well.
Finally, the last question: What would you want users to do once they have selected their products? You’d want them to complete the checkout form and become registered users. This step is ripe for another set of elements that can make the buying process frictionless.
5. Checkout Page
The guiding principle here, as throughout the app, should be to channel attention to what is important. For instance, recommendations on this page will misguide users rather than push them to complete the payment process. The most important thing should be to make it as easy for users to complete the payment process as possible. Some things to A/B test here are:
- Number of fields on payment forms
- Prominence of checkout progress bar and back/next buttons
- Option of a guest checkout / sign in with Facebook
i. Ebay – Subtle native checkout button with basic cart total explanation
This is a good example, as users can see everything they are concerned with at the point of payment. The number of items, descriptions of the items, shipping information and price, and the subtotal all are visible at a glance. Nothing unrelated is visible, as it is important to not distract users from paying.
ii. Etsy – Clickable checkout progress bar
This feature allows shoppers to go back and forth along the entire checkout process without any loss of information. Checkout can be a pain if you suddenly decide to use a different credit card in the middle of the process. You might have to go through the entire buying process all over again!
iii. Ebay – Checkout page with prominent CTA
Prominent CTA’s at the final step go a long way in directing users where you want them to go. Having users quit the buying process at the last step is really a shame after an app has worked to bring them to this point.
Although there is no cookie cutter solution for all e-commerce apps, you do not need to reinvent the wheel, either. Base your app improvements on the results of experiments, focus on quick iterations, and utilize user segmentation wisely. These A/B tests should be a good start for your e-commerce app. Remember, base your hypotheses on the goal for each screen and keep iterating.
About the Author: Tanuj Mendiratta is leading the growth at Appiterate. Appiterate is the world’s first visual A/B testing platform for iOS and Android, where Mendiratta keeps a keen watch on the latest trends.