70% of shoppers abandon their carts and leave E-commerce sites without purchasing anything. Window shoppers aside, a lot of this comes down to site owners’ negligence of UX as a key part of their strategy.
Poor clarity on full pricing, clunky search, lengthy forms, and not taking into account local habits for multinational websites are the most common sales killers, but each of these issues is solvable with design adjustments.
Need to fix your E-commerce performance, or benchmark your online retail project? Get started with the first section of a super convenient checklist of 250+ tactics, straight from an upcoming easy-to-browse 31Ten eBook on best E-commerce UX practices.
Sure, there are entire websites & research dedicated to online retail design. Our aim here is not to replace them, but instead, to offer a comprehensive and structured repository of key global E-commerce best practices as well as China-specific conventions & affordances you should be considering. We wanted to be as exhaustive as possible, at the risk of including niche aspects that may not apply to all businesses’ target audiences and buyer personas.
So why start with search? Because it is one of the foremost E-commerce buyer journey entry points.
Watch out for the following icons indicating the suitability of each tactic:
Vlad’s take: “The center-top position is standard for E-commerce, vs the traditional upper-right corner.”
Vlad’s take: “Given the importance of search in E-commerce, this is not the right place to show off creativity” Read more here
Vlad’s take: “This helps users recognize there’s an additional step required to trigger the search action — even if they decide to do this by pressing ‘Enter’ on a desktop. On mobile, it’s the opposite- the search field query should be triggered by the keyboard search icon since it is closest to the fingers. Offering a button next to the search field on mobile may fragment attention.”
Vlad’s take: “It depends on your vertical, but on average, 82% of requests worldwide fall within 2 words, with 27 characters covering 90% of search content. Consider using a search box that expands when clicked.” Read more here – and here
Vlad’s take: “Use a placeholder clearly showing what can be searched for (categories, products, colors, …) – leaving it empty is a missed opportunity.”
Vlad’s take: “Definitely a Chinese standard.”
Vlad’s take: “All Chinese E-commerce apps offer it. You can integrate WeChat barcode recognition directly into your web pages.”
Vlad’s take: “Again, a China standard. The West is catching up on the trend.” Read more here
UXMag: “The purpose of auto-complete is to resolve a partial query, i.e., to search within a controlled vocabulary for items matching a given character string. The purpose of auto-suggest is to search a virtually unbounded list for related keywords and phrases, which may or may not match the precise query string.” Read more here
Vlad’s take: “Style the given query and suggested words differently so that users can easily recognize what can be added.”
Vlad’s take: “ Blur the rest of the interface, or use shadows, contrast, or fades to focus the attention on the search assistance.”
Vlad’s take: “Use a subtle message like ‘Users also searched for [corrected query]’ right above the list of search results.”
Vlad’s take: “Keep the original text in the search box so users don’t have to type the entire query again when unhappy with the matching results.”
Vlad’s take: “It’s a Chinese E-tailer staple, and Western E-commerce websites should test these functionalities out as they might resonate with certain categories of shoppers.
Vlad’s take: “Again, a China standard I’d love to see implemented more often in Western E-commerce.”
Vlad’s take: “It’s always good to think of users who’ve forgotten to switch their keyboards back from Latin characters.”
Vlad’s take: “If search loading is likely >1 second, it helps to influence the perception that searching times are shorter than they really are, and make the user feel in control” Read more here
Vlad’s take: “Provide products from similar categories or variations over the user’s search query while clearly indicating this has been done.”
Baymard: “Up to 50% of users assume that searching again on the results page will trigger a result-wide search, and not a site-wide or category-wide search, particularly on mobile.” Read more here
We are passio- no, obsessed with creating the very best, up-to-date online user experiences that translate into more checkouts and a higher percentage of repeat customers.
Want to improve your E-commerce platform’s usage, retention, sales and conversion rates?
Follow us on WeChat (thirty-one-ten), LinkedIn, or leave us your email address below to be notified first when the eBook is published!
UX-UI designer and partner at digital agency 31Ten. Vladimir manages and regularly participates in design-related WeChat groups. He put a lot of thinking into how these new features would fit nicely within WeChat’s current user experience.
Vladimir writes about design and user experience best practices in China and shares case studies. Previous posts include:
Joan is a UX-UI Designer working at 31Ten since 2017. She has more than 2 years of experience in mobile apps, H5, graphic and web design. She has the end-to-end design process experience including user flows, wireframes, mockups, and prototypes.