Posted by Nicole Hambleton / Article, mCommerce & eCommerce, Mobile /

A report by OBI said that 72 percent of online retailers will embrace mCommerce in their 2012 business strategy. 24 percent said they would develop a mobile website and 21 percent said they would develop a mobile app.  (Dynamic Business)

Usability is a big part of mobile, the smaller the screen the more important the right UI becomes. When you are dealing with eCommerce planning, preparation and testing are key to a successful launch. Once you add mobile platforms to that mix, these things cannot be rushed and steps should not be skipped.

Designing an eCommerce or mCommerce site isn't easy, the proof is in the pudding. Even big brands with lots of research and design experience behind them, make costly mistakes. However it is a new industry that really is only just taking off, so lets learn from others before us and strive to make it better going forward.

Look and feel

The site should be instantly recognisable by it's branding, colours, design. The logo should be prominent on each and every page so there is no ambiguity. Sounds like a simple suggestion but many big brands, with well known branding guidelines have failed to achieve this on their mobile sites.

Icons are much easier to follow than words on such a small screen. By all means, use words as well but by using icons you can communicate a whole phrase with minimal language taking up real estate. The other benefit is that you can consistently use this icon throughout the application or site, so the user can intuitively follow it. Just remember to use icons that are easily recognised and accepted as a standard, like a house for home.

Don't clutter the site. The space is too small for too many graphical elements. Stick to a standard GUI template and build the brand and functionality out from there. The idea is to make it look as familiar to the user as possible, that way they feel comfortable using it. By following the example of mCommerce stores that have it right, you are not trying to reinvent the wheel, just further improve on it.

Show thumbnail images, price, bulleted description on the list page. Then once they click, show additional detail and additional images from different angles. 

Navigation

Regardless of where the user is on the application / site, they should be able to return home, be able to search / browse, view their cart / wishlist, access their favourites or update their details (if relevant). This should be achievable with one click, no more.

Stacking menus vertically can make them much easier to read and you can add more than five! It doesn't allow for a lot of graphical elements, unless you get creative with icons as mentioned earlier, but it does make it much easier for the user to click through.

No matter what area of the site you want the user to work their way through to, keep the clicks to a minimum. You don't want them delving deep into the site, then getting lost and not finding their way back.

Functionality

Browsing - The user should have the option of browsing using categories, to avoid them having to know what search term to look for. The categories should be logically broken down, just like a shop would be.

Search - Make search prominent and accessible at all times. When someone gets lost, frustrated or even if they know what they are after they search. Make it as easy and painless as possible. Due to the size of the device, having hundreds of results can be a downside to search, so allowing the user to narrow or filter their search is also a good idea. An auto-search function can also eliminate the need for users to tap long terms into the search bar.

Cart - Allow the user to add a product to the cart or wishlist from both the detail and list page. Make it as easy as possible to click through. Don't force them to end their shopping experience there though, only once they are ready. Make sure the cart updates to show how many items are in there.

Auto Suggest - A popular and useful tool for both eCommerce and mCommerce is suggesting products to the consumer based on the products they are adding to their shopping cart or viewing. 'People who bought this also bought these products' Keep the list to a reasonable number ie. 4 products.

Links - Expect that people will try and click on just about anything that looks like a link, an image, an icon, an underlined word. If they are not supposed to click it, don't make it look like a link, otherwise the customer will just get frustrated.

Security - Ensure that the site and hosting is secure. Reassure the user that it is secure.

Payment - Payment options are still evolving both for eCommerce and mCommerce. PayPal is still popular and there are some new solutions coming onto the market that can securely hold credit card details. There are also other options, people can make a purchase and pay using bank transfer using a code when they get home or they can click to call an office shop to take their card details. The key is to make the payment part as simple and secure as possible. Pressing that 'pay now' buttons can cause people to pause and think about their purchase. The slightest obstacle can stop the purchase then and there.    

Social commerce

As already discussed, peer approval is important to us humans so allowing a rating system, facebook likes and sharing is a good way to gain exposure and also to gain credibility. Make it available on each product and if it has a rating system, show the stars or rated results on the page. 

Making a purchase

Overcoming sales objections: Getting people to click the ‘buy now’ button is the ultimate goal of most businesses. Closing a sale is always the hardest part but the more user friendly the mobile site, the more likely you’ll get the customer to that point. Any stumbling blocks on the way can see you lose them and you won’t have a sales person there to redirect their attention.

Make it easy: The number of mCommerce shops which are hard to use, require the user to type in pages of information, don’t allow simple payment methods, make you open ten pages before getting to the cart and not allow a review of products means users will switch off before they even get close to the sale. Complexity in the process will create a nervous customer.

A clean UI: Another big issue is button size, make the buttons the right size for adult fingers. Big buttons, easy icons, simple swipe techniques. Clean, accessible and easy to use. If a person has to use the tip of their little finger to make a purchase and keeps accidently hitting the button next to it, they will not only lose interest but will lose confidence in the integrity of the application / site.

Usability Testing

Too many mCommerce and eCommerce projects go through design, development and launch without proper UX and UI testing. With a smartphone, not testing the interface and data flow is detrimental to the outcome. Any stumbling blocks to getting the customer over the line and clicking the ‘buy now’ button will seriously impact on the success of the application or site. The design needs to be tested, the database needs to be tested, the smartphone implementation needs to be tested on all devices and of course the actual mechanics of the commerce solutions. The KISS theory stands true, but like any good design outcome, what looks simple and easy to use has often been well thought out and prepared for well in advance. It's the little details that makes or breaks the site and that takes time.

Summary

In the past several months we have worked on several mCommerce projects that have shown a considerable increase in visitors and interactivity through their mobile devices, showing us that in real terms mCommerce is taking off.

mCommerce will start to evolve this year, with more companies branching out in mobile ready stores and product pages. The US expects mCommerce sales to exceed $1 Billion in 2013 but mCommerce isn't all about the shop, it's about the integrated digital marketing strategy that drives the consumer from web to mobile to store, depending on the overall marketing strategy of the company. If you would like to further discuss how a mobile saavy digital strategy could further enhance your client please give us a call or send us an email.

________
Sources

http://usability.com/2011/09/
http://www.getelastic.com/mobile-home-page-navigation/
http://www.practicalecommerce.com/articles/1740-Mobile-Commerce-Four-Good-Examples
http://econsultancy.com/au/blog/4234-mobile-commerce-best-practice-tips-2
http://www.dynamicbusiness.com.au/news/online-retail-optimism-driving-move-to-mcommerce-ebay-05042012.html