The science behind how filters help a shopper.
The internet is a shopper’s best friend with colorful category shelves, jaw-dropping deals, and personalized slogans. In this ocean of products, one thing can make or break an average user’s shopping experience. An efficient search and filter criteria.
In this User Experience Run, we are going to crack the code on how filters save the day in E-commerce, Food delivery, Job Boards, and Real Estate websites, and how designers can adopt similar filters to best the UX.
What is a Filter in UX Design?
Filters help users to easily navigate through many options and narrow down the list to find what they need. These filters eliminate items that do not satisfy specific criteria and have become the standard for refining results for large sets of products.
Let’s explore how some of these filters do the job of elevating the user experience.
The use of filters in ecommerce websites
Needs, Painpoints, and User Experience. That’s all it comes down to when designing the perfect filters. E-commerce sites seem to have a good handle on it, maybe to the extent of us looking them up for inspiration.
Let’s go over what a user’s filtration goals are. Quick results, faster filtering process, less waiting time between queries, more control over the filter options, continuous feedback, jargon-free content, or in simple terms — everything that a user needs to get that feeling of control. This may be a chorus moment for all of us, but it’s nothing further from the truth.
When a user goes into search mode, he’ll either go for interactive filters (where there is constant updating on choosing options) or batch filtering (where the user can adjust multiple filters before the results are returned).
Or designers can follow what Amazon does and go for Faceted Navigation.
Amazon goes beyond their usual line of action and offers options that inform the user of all possible filters. This reminds us of a good waiter (who waits to take the entire order) in a restaurant, right?
Filters in Real Estate Property Websites
Filtration takes a different approach (although similar) when it comes to property websites. There are a predetermined set of filters that most of the property sites employ in their sites and it’s often the same on every other property website.
Users expect some of the filters like type of land, budget, palace, amenities, and nearby accessibilities to be constant just like how size, price, and color are always there.
Similarly, filters like ‘the place, the date of arrival and departure and occupancy’ should be readily available to keep the user engaged. While these basic needs are often taken care of, there are important details like cancellation flexibility, price, instant booking, and type of amenities that often fall off the radar.
AirBnb seems to have grabbed onto the missing piece and here’s the proof.
Filters in Job Board Websites
Millions of job searches happen online every day. As a result, there’s a lot of user experience riding on these job websites and most of them have become multi-billion dollar businesses with plenty of competition.
However, applicants reported irrelevant search results and poor filters as some of the top issues found in job searching websites. This made it hard to search for the right job that fit their needs.
What users wanted was to find job postings that fit their skills and requirements. For them, to have a good job searching user experience, the ability to find desired information was a key driving factor.
Designers started by building on filters to give the users what they wanted (opportunities) and the bonus of staying afloat the competition.
Most prominently, an applicant would find that these filters now had zero amount of jargon, which helped the websites deliver finer search results.
Google Jobs does a fine job at that, and here’s a screen that shows their strong filter senses.
Filters in Food Delivery Websites
Food is a common ground, a universal experience, so pain points are galore for this one. People from all walks of life have all sorts of needs. For some, time is a major factor. For instance, a user may have ordered in at work and time is of the highest priority because let’s face it, nobody wants to schedule a meeting because of an extended lunch break. Delivery time overtakes every other filter for such people in the filter quagmire.
Then there are those allergic who just can’t order all sorts of food. Then come those who look for safety, 4-star reviews, top offers, and the list just keeps getting longer.
Food delivery websites seem to have noted all of these concerns and nowadays one can find extended filters where a user can opt for non-allergic foods, restaurants that are known for their safety, restaurants with top offers, and cuisines (because let’s face it, we have trouble choosing between Chinese and American).
This is no newsflash, but users generally go for the restaurants they already know about. Now, what if they wanted to try out a new restaurant? Some of the best food delivery websites efficiently tackle this by keeping the carousels of the restaurants in the recommendation list.
For instance, one will show “the new restaurants” that the user can try and the other will show the “popular restaurants”.
Here’s how Uber Eats goes big on the filtration -
Almost all of the food delivery websites these days provide a good set of filters. Some of them categorize the menu items, while others have them listed. This categorization provides better UX for the users and slims down a large menu into smaller ones that the user can navigate easily.
How to Design an Error Free Navigation Filter System
Here’s how designers can step up the website’s filter game.
Avoid filters that leads to continuous updates
Continuous updates help the user get to the checkout window much faster and all that, but too much of it can be visually distracting. The flicker of an image swap will attract attention and be annoying at the same time.
Dimming the results set followed by a progress indicator can balance the advantages of continuous feedback with the stick it receives for being irritating.
In Macy’s online store, the entire ‘results area’ dims and an animated spinner shows progress, avoiding visual changes that are distracting.
User Intent over Continuous Updates
Always update results based on the time since the last selection. Display the new results if the user hasn’t made a selection or moved the mouse after a certain amount of time (1–2 seconds). Do not forget to acknowledge the first selection with a progress indicator.
The filters and the updates are as smooth as it can get, on the Best Buy website.
Categorize filters based on the user demand
It’s no secret that filter categories placed higher in a list of filters will receive more attention.
Therefore, always consider placing the most general, frequently used filter categories at the top. Category/style, brand, average rating, color, price, size, or weight, are some of the high filter categories that always get the top spot.
Too many filters can also be bad for UX. Hick’s Law illustrates this point. It’s a law of psychology that states that the more options there are, the more time it takes for a user to select one. Therefore, to increase conversion, it’s necessary to reduce the number of options and place categories that are always in demand.
Etsy goes with the need of the hour, categorizing filters based on the new year.
Avoid jargon in filters
Filters are pretty much useless if people don’t understand what they mean. Users know far less about the product and its content.
The right way to go about it is to anticipate what the users might or might not know. Use the jargon if it is necessary, but make sure an information icon that can reveal more information is placed next to the tricky filter category.
Conclusion
Let’s face it. Filtering and searching are inevitable in this information age.
However, the good news is that it’s no rocket science either.
It helps when designers also realize that narrowing down high volumes of content should be ‘less confusing and more helpful’. These filters bring much more to the table when they bring relevant results or the best deals on Black Friday, the kind that makes the world go on a shopping spree.