Tips and Tricks for Captivating User Experience in Your E-commerce

Published in

Synerise

7 min readMar 25, 2019

No matter where your customers shop, they expect the experience to be enjoyable, user-friendly, and reliable. It sounds like a description of a perfect product, doesn’t it? Retailers and e-store owners are not only offering products like shoes or apparel to their consumers. Their stores are products that consumers use and evaluate. In terms of online shopping, digital User Experience (or UX) is the science of answering and anticipating the customer’s idea of a perfect shopping experience.

The bottom line of online shopping

Before we get down to the secrets of the ideal digital User Experience, I would like to ask you an important question: Why do people shop online?

There are several unbeatable advantages of online shopping:

It saves time. Thanks to convenient search options and high-speed Internet, browsing available stock takes seconds. Also, there’s no risk of waiting in a line to the cash point.
It saves energy, both in terms of body fatigue and car fuel. Door-to-door delivery solves the problems of transport and visiting dozens of shops to find exactly what you want, for the price you want.
It lets you compare prices in a snap. The physical distance between shops offering different prices is not a problem anymore.
E-stores are open 24/7. Anyone can shop anytime they need, no matter what their daily routine is.
It’s private. Purchasing particular items may cause discomfort in a customer, and the benefit of privacy allows users to find and buy what they need without unnecessary stress or embarrassment.

Now you know what makes people move from shopping sprees to online hauls, but there’s more to online shopping than these differences. The way you approach your e-store client depends on understanding the topic of User Experience.

Why bother with User Experience?

If your website offers a bad user experience, many people will drop out at different stages of the funnel depending on the UX mistakes your website has. As a result, it will be extremely narrow at the end and your ROI from marketing investments will be compromised.

The truth is brutal:

If a website is difficult to use, people leave.
If the homepage fails to clearly state what a company offers and what users can do on the site, people leave.
If users get lost on a website, they leave.
If a website’s information is hard to read or doesn’t answer users’ key questions, they leave.

(Jakob Nielsen)

There’s no such thing as a user reading a website manual or otherwise spending much time trying to figure out an interface. There are plenty of other websites available; leaving is the first line of defense when users encounter a difficulty.

What’s more, bad UX makes life frustrating not only for your customers but for you as well. It causes more customer service queries (emails, calls, social media messages) because people either cannot accomplish their goal, such as card payment, or are unable to find important information, like expected delivery time.

But taking care of UX shouldn’t be done only because of the fear of negative consequences. An insightful design of an online store brings visible and measurable benefits:

Enhanced customer satisfaction
Reduced churn
Increased revenue
Greater employee satisfaction

E-commerce businesses that draw attention to their website’s UX also discover more effective ways to collaborate across functions and levels, a process that benefits the whole company.

As Don Norman and Jakob Nielsen state:

The first requirement for an exemplary user experience is to meet the exact needs of the customer, without fuss or bother. Next comes simplicity and elegance that produce products that are a joy to own, a joy to use.

Digital User Experience consists of three key ingredients: usability, esthetics, and interactions.

Now let’s get into more details and discuss the elements behind the perfect user experience.

Usability

In the field of usability, you want to make sure that your visitors — ultimately customers — can accomplish the primary task (fulfill the need) as fast and easy as possible. In the case of e-commerce retailers, the primary task is, of course, the purchase of a product.

However, usability is not only about speed. You can distinguish 4 features of a highly usable website or feature:

Fast
Intuitive
Easy
Reliable

These features sum up to a simple pattern:

Let’s discuss the golden rules of usability in online design, called Usability Heuristics for User Interface Design.

Usability Heuristics for User Interface Design in action

Visibility of system status

The system should always keep users informed about what is going on through appropriate feedback within reasonable time.

System status in e-commerce can be:

Loading (processing information)
Log in/log out
Shopping cart (number of items, overall price, shipping cost, etc.)

Source: Zara

Match between the system and the real world

The system should speak the user’s language, with words and concepts familiar to the user, rather than system-oriented terms:

Make information appear in a natural and logical order
Provide necessary information as soon as possible (e.g. “You don’t have enough space on your disk” before you start uploading a large file)
Anticipate users’ needs with a conversational interface, asking relevant questions in the right time
Avoid system-oriented jargon and design

Source: Zara

User control and freedom

Users often choose system functions by mistake and will need a clearly marked “emergency exit” to leave the unwanted state without having to go through an extended dialogue. Support undo and redo:

Design error pages with users in mind; don’t leave them in a trap with a message they don’t understand
Let users manage their shopping cart by quick add and remove options
Make sure there’s an easy undo or cancel option available at all times

Consistency and standards

Users should not have to wonder whether different words, situations or actions mean the same thing. Follow platform conventions:

Locate relevant buttons and menus where users can easily find them
Make sure icons and messages are clear and intuitive

Error prevention

Even better than good error messages is a thoughtful design which prevents problems in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.

Use spelling or format recognition to avoid false user data
Ask users form confirmation
Create short and simple user paths and checkout flows

Source: Mango.com

Recognition rather than recall

Minimize the user’s memory load by making objects, actions and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.

Provide onboarding tips if or where necessary
Use clear CTAs on banners and buttons
Display content in the most convenient way for the user, e.g. diagrams, tables, bullet points, etc.

Flexibility and efficiency of use

Accelerators, unseen by the novice user, may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.

Utilize user data wisely, e.g. suggest similar products or provide a quick link to previously viewed products
Offer different numbers of items to be viewed at once

Aesthetic and minimalist design

Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.

Prioritize the displayed information according to the users’ interest
Make sure the site is enjoyable for the viewer
Check if font sizes are legible on all screens
Use clear visual messaging, e.g. icons

Help users recognize, diagnose, and recover from errors

Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.

Error page numbers mean nothing to a regular user and should include explanations in plain language
Navigate from error page traps, e.g. provide an escape from a 404 page by providing a link to the main page or a browser tab
Don’t tell users something is broken and can’t be fixed!

Help and documentation

It may be necessary to provide help and documentation, even though it is better if the system can be used without it. Any such information should be easy to search, focused on the user’s task, list concrete steps to be carried out, and not be too large.

Cover all edge use cases
Keep things as simple as possible
Provide contextual help
Make sure your website is search-friendly — this means that it not only includes a search mode, but also delivers relevant search results

Wrapping up

Imagine your online store as the most expensive pair of shoes you offer. It’s probably a hard item to sell because you need to delight a very narrow group of customers from the first contact, but the effect is certainly worth the effort. Such an approach will let you create an online store that will become your competitive advantage. In the next article about digital user experience, I explain how to evaluate the UX of your store and check how to improve it even more. Stay tuned!