6 Amazing Tips to Improve M-Commerce UX

If you've ever used your smartphone or tablet to do some online shopping, pay bills, redeem coupons, or board a flight with your e-boarding pass, then you've just contributed to the growing customer base of mobile commerce users.

With the number of smartphone users predicted to increase to around 2.87 billion by 2020, m-commerce is bound to grow with it.

The new era of commerce has arrived: mobile commerce

As e-commerce has revolutionized the way goods and services are sold - primarily making transactions more convenient and done at the ease of a click, m-commerce is its natural progression as screens became smaller.

Considering that up to 63.4 percent of people worldwide are predicted to access the Internet from their mobile phone by 2019, having a website is simply not enough.

Whether you operate a conventional physical store, have transitioned digitally, or are in between, embracing m-commerce means fully optimizing your customer's mobile experience and making the process of purchase hassle-free.

Having a mobile-responsive website does not only allow you to reach a larger customer base, it also boosts brand perception and aids in making offline purchase decisions.

Here are things to keep in mind to maximize user experience (UX) that will ultimately convert into sales and earn your customers' loyalty.

1. Easy to use + Easy to access = More traffic & More sales

When it comes to the mobile experience, functionality takes precedence.

M-commerce UX is not just about your website looking aesthetically good on a smartphone or tablet - it must be designed with the user in mind:

  • Maximum usability and accessibility can be achieved through a minimalist approach.
  • Simplify navigation by making it intuitive.
  • Lessen the embellishments and fight the temptation to use flash animation or videos that can take time to load.
  • If you have a native app for your store, integrate various functionalities, such as in-app messaging, location-based notifications and secure payment options.

Fallen Hero's mobile-responsive design has not only improved traffic but also increased sales due to its integration of elegant high-resolution product shots and an uncomplicated checkout process.

It's the little details that will set you apart from the competition. This generation of mobile users want things to be done easily and quickly and it's up to you to give them what they want.

2. Everyone loves great information architecture

Information architecture (IA) is the "art and science of organizing and labelling websites to support usability and findability."

Great IA will make or break your customer's path of purchase. If they don't find the product they're looking for, they're out.

Having an internal search engine isn't the only solution. Make it a point to understand your customer's behavior. Once you know their typical buying pattern, design your mobile app or website navigation with clear data hierarchy in mind. Incorporate product filters and other sub-category menus to make browsing as user-friendly as possible.

Take the Amazon website, for example, and how it seamlessly translates into a mobile-optimized design. Notice how the massive product category menu on the website was converted into tabbed navigation.

Amazon website

Amazon mobile view

Most successful platforms have effective individual pages, but it won't matter if customers can't easily navigate your page. Good IA guarantees your page will be successful in attracting, keeping, and converting traffic.

3. One image is worth a thousand sales

As screens become smaller, avoid making your content text heavy. Make sure there is enough thumb-friendly clicking space. Small screens and fat fingers don't mix well.

What better way to do this than with high-quality images that not only showcase your product but also speak loads about your brand's image and personality? Consider the following:

  • Make sure that every product has its set of high quality images to showcase.
  • Provide a zoom option, 360 views, and videos when applicable.
  • Want to shoot like a pro? Learn more from Shopify's in-depth guide that will not only teach you photography 101 but help you decide what kind of imagery works best for your product or service.

Fancy, a social photo sharing webstore, boasts of professionally-taken photos on its mobile app that amplifies customer senses and improves overall mobile shopping experience.


4. Show your product pages some love

Similar to a physical store where product placement, correct pricing and appearance are key factors, m-commerce requires your product pages to be neat and well-constructed. No one will buy from a cluttered, unorganized and unnavigable page.

Your landing page may be gorgeous and attract a lot of traffic, but if customers have a hard time finding the right product, you've wasted your time and resources. Complement your pictures with clean designs that allow customers to easily navigate the page. Consider tabbed navigation to limit visible text while providing users with more categorized options. Also, keep in mind that your design should consider all mobile device users.

Rent the Runway, an online dress rental service, did a great job on creating effective product pages. For every dress, they have an individual page that provides all relevant information, like high-quality images, product details and reviews. However, they went beyond that and added the stylist's notes regarding what accessories to wear with the dress and how it fits on every part of the body.

Rent the Runway

In addition, provide as much information as possible while keeping your page uncluttered. Display multiple payment options, product reviews (yes, good or bad), customer service options, calls to action, and estimated shipping time.

Don't forget to give your customers a sense of security by showing your security badges, as well as return and refund policy.

5. The bigger the call, the greater the action

You've got the customer where you want them, they have used their phone to select a product and now are ready to buy. But where do they go?

You need to place emphasis on your calls to action (CTA). Make sure your customers can see them, click them, and not accidentally click something else. Here are five ways to make your CTAs effective:

  • Make it huge. Yes, bigger is better. Make your CTA a can't-miss feature in your platform. Your customers should see it easily.
  • Make it colorful. Maybe you don't have enough space to make it huge, but you need a way to make it stand out. Dress your CTA in an enticing color and surround it with white or other colors that create good contrast.
  • Placement matters. Human eyes tend to focus on the center or corners, thus, make sure your CTA is easy to find. Be strategic with CTA positioning and you will be rewarded.
  • Keep it simple. Use short and concise wording for your CTA. Use words that generate a sense of urgency. Attention spans are getting shorter, so a "Buy now" or "Check out now" will do the trick.
  • Provide customer service. People like to resolve issues fast, so you need to provide them with instant customer service. Issues may, for instance, arise in the checkout process. If they have an option to contact a representative, they will be able to finalize the purchase one way or another.

Take a look at these CTA buttons from the mobile app of River Island. The buttons throughout the checkout process are big, centered, and use proper font and color contrast.

River Island

6. If you make it easy to pay, you make it easy to earn

You've done the job. You have attracted customers through their smartphones. It was easy for them to navigate, find products and choose the ones to buy. All that's left to do is pay and voila - a sale has been made. But then they hit a snag. If they really want the product, they might try again once or twice, but most likely they will leave your site and find a smoother payment experience.

Don't let that be your story. Make your payment transactions seamless for your customers, as you're the one that has the most to lose. Incorporate faster options such as PayPal and Google or Apple wallet, which only requires a single tap to process the payment.

Digital wallets are becoming very popular m-commerce features. If you don't have such options make sure that you can guarantee security to your customers and make it effortless for them to input their credit card and other details from their phones. Best case scenario, you can offer both traditional and digital wallet payment options to your customers.

Luxury women's clothing brand Natori employs this one-click payment option through PayPal while also providing an option for use of debit or credit cards.


Don't forget about making your checkout forms responsive. A responsive design encourages mobile purchasing and enhances your conversion rate. Invest time and resources in this, because it is the end game.

Time to sell!

Remember, good design is user-centric. Having the above tips in mind means the benefits go both ways - happy customers, happy business-owners. Now equipped with tools and insights to make the most out of your customer's m-commerce experience, get selling!

Related article: Emotionally Intelligent Design: Why You Need It in Your Mobile App

This is a guest post by Nera Cruz. Nera Cruz is a technical writer and a web merchandiser for different online marketplaces around the globe since 2011. Nera gained tons of experience working with several e-commerce platforms. She spends her free time selling her fashion products and gadgets on Facebook (Nera Shoppe). You can also follow her on twitter @nera_joy.