Improving e-commerce UX by avoiding these search and filter mistakes
E-commerce is a booming industry that has become hugely successful in recent times due to to our ability to be more connected than ever before. We have access to wireless devices that allow us to shop online wherever we want at any time of the day.
However, it isn’t just connected devices that have caused this huge boom in the e-commerce sector. E-commerce itself has improved drastically with improved return policies and better logistics partnerships between retailers and logistics companies. Customers are no longer afraid to shop online and can now send back their purchases quickly and easily, which was not so simple in former times.
Despite this ease of shopping online, many e-commerce retailers absolutely struggle to keep their users on the page and inadvertently make it difficult for their customers to find the things that they are looking for. This is often through poor management of user experience design, which generally is attributed to flaws in website design. I wanted to talk more about the dos and don’ts of e-commerce retail in this article with the aid of some great and not so great examples of how e-commerce websites should look.
Website design
Website design is probably the single largest component of UX in the e-commerce setting. What a person sees, how they navigate the site and how they pay for their goods and services are the main elements of any website in this space.
The first big cause for concern when I look at a number of online retailers is that the way they structure their websites restricts users in different ways. This is not to say that their websites are not aesthetically beautiful (which is important in its own right), but rather that the functionality that they have is lacking or not intuitive enough to allow people to seek out and find the things that they are looking for.
Retailers are constantly striving to improve metrics like “Average time on page” and “sales conversion rates” in order to improve their sales. These are more marketing based metrics, but are intrinsically linked to the user experience that comes from the design of the website. But where are the problems actually occurring from a UX perspective?
Mistyped or misspelled words in a search engine
Having a good understanding of spelling errors or mistyped words in an e-commerce retailers search engine and a system to correct these errors can turn an error into an uninterrupted UX flow. This can only benefit the user through ease of use, and the retailer by selling the item to the customer.
For these reasons, it is important for retailers to have some kind of strategy to target these types of errors. The risk is that the potential customer could be led to believe that the item or brand that they are looking for on the website in question is not actually available there, or that there are no suitable alternatives to the item that they are looking for. Usually this kind of situation can be solved by recognising a mistake in a search term and the retailer offering a suggestion or an alternative search term instead. You can see an example of this in the following picture that was taken from an extremely successful clothing retailer.
Here there is a spelling mistake in the brand name “Ben Sherman”. The search engine has recognised the error and has searched for the correct brand name as well as the original terms used in the search. Here the theoretical user would be able to proceed without having to search again. This is an extremely interesting and powerful feature of the search engine that can result in an uninterrupted user flow, where the customer does not need to search again. They can simply proceed and keep shopping. All retailers should be taking note of such examples. I decided to test this further by searching for Nike products on a different clothing retailer’s website, but instead of typing “nike”, I typed “nikee” instead and guess what I found?
That’s right, absolutely nothing. This is obviously an example of a poor experience for the user, because the site has not preempted this kind of behaviour from the user. In contrast to this, I typed “nike” in and there were over 100 results for the correctly spelled search term.
In the first case, the user could then wrongly assume that such products are not available on the site, or they could start the search again, which would consume even more of their time and cause frustration. Either situation is not a good one and the example of the first retailer is definitely much smoother, but here there is interruption in the flow. This is something the retailer should be aiming to minimise. This should be constantly and thoroughly tested, and retailers should focus on not leaving potential customers at a dead end. In fact, a suggestion is better than no suggestion at all.
In contrast to the above example, I decided to go back to our faithful first retailer and the picture below illustrates what I found.
Again, the first retailer was aware of this kind of mistake occurring and they had implemented a fix that would allow a user to simply continue on his or her shopping experience uninterrupted.
As we can see, this can make the difference between an OK user experience and a great one. Retailers should always be aiming to understand how users behave and one aspect of this is analysing data for commonly used search terms. They should be searching for errors like this and not be ignoring them, but using them to optimise their user experience even further.
Filtering search results from a search engine
Filtering products on ecommerce websites is extremely important to help potential customers to find the products that they want, but this is not always an easy task with some retailers offering thousands of products.
Most retailers offer a system to filter search results on their websites, but not all of these actually make it easier for customers to find what they are looking for. You would assume that these are intuitive and easy to use, but this is not always the case.
We can see what one of these filters might look like in the following example.
Here you can see a set of limited filters that only allows customers to filter by size and things like price. This makes it difficult to find products, even worse is the fact that you cannot filter by gender, so you would have no idea until you clicked on an item if it was even suitable for you!
There are also no other useful filters like brands and this means that a user would need to scroll through a number of results to find what they are looking for. This is akin to the phrase of taking a stab in the dark, and is an example of very poor UX that will only leave the user frustrated by the experience.
Here is another example of a set of filters that functions much better, but still has flaws that can be seen upon closer inspection.
There is so much more functionality and freedom to find what it is that you are looking for. You can filter by gender, brand, size and a number of other options. It is much better than the above example and it seems as though it would seem to fulfil all the needs we talked about above. I decided to test the filters with a few basic parameters to see if this would be the case.
I wanted to find mens size 41 shoes in a range of brands. I clicked on “Men” first and the page lagged and updated the products. This happened again with each subsequent filter and was quite annoying, but what I realised next was much worse. I selected “Adidas” and wanted to select another brand, but found that the filter was now gone. I could only select a new brand once I had removed the “Adidas” filter. This made this feature practically useless and I was quite frustrated by this point.
In contrast to the above examples, we have an extremely successful retailer that has a much more intuitive way of filtering search results that is illustrated by the following two screenshots.
In the first picture you can see that they have multiple sections to filter the results of the search. Interestingly, these have an extremely structured information architecture and the four most important and useful filters have been placed on the top line. I believe that they would have used data to come to this decision and you can see that they care a lot about how people are using their site.
In the second picture, it is possible to click on the drop down menus and select the filters. Here, the user selects the checkboxes for each brand they want to filter and then presses the “SAVE” button to apply them. There is also a way to search for brands here too, which could definitely make things easier.
This is simple solution makes it easy for the user to search for a very specific item or a number of items within a number of different categories. My only criticism here would be that you need to click on each drop down and click save each time to apply the filter. Not 100% perfect, but definitely close.
As you can see from the previous examples, effective filtering can be the difference between a good site and a brilliant one and significantly impacts a sites UX. If retailers want people to stay on their site, they need to help people find what they are looking for by having an appropriate and functional set of filters.
Thoughts
If e-commerce retailers are wondering where they are failing, they should be introspective and look at the bigger picture, including issues with user experience, rather than simply blaming their marketing or buying strategies. They should be asking themselves: Am I doing everything to allow my customers to have great experiences that keep them shopping on my site?
As you can see, small issues like the ones I demonstrated above could potentially have a huge impact on sales. These common sense improvements can be combined with data driven activities to really improve the feel and experience that an e-commerce website provides. I am sure that a number of retailers can benefit from an improved shopping experience and drive improvements in their UX. On top of this, the best practices I mentioned above are not overly difficult to implement, awareness is the key here.
Feel free to comment and share your experiences with frustrating e-commerce websites.
Stay tuned for part two, where I will be talking about the checkout process and its impact on the UX of an e-commerce website.
Looking for advice?
Sebastian Tan is a Berlin-based UX designer with a passion for digital products that just work.
You can find him at his website sebastian-tan.com or send him an email at s@sebastian-tan.com.
