Exploring ways to improve filtering when shopping
Platforms & tools
- iOS
- aOS
- Figma
- Miro
- usertesting.com
Context
Filtering is a huge part of the shopping experience. To increase users' activity for the filtering feature of the shopping experience, precisely the product list page. However, it did evolve to look at the enterprise's filtering experience, find ways to make the feature consistent, and introduce horizontal filters.
Design Process
Rinse and repeat
Discovery:
- Competitive analysis
- Desk research
Ideate:
- Wireframes
- Mid-fidelity prototype
- High fidelity prototype
Testing:
- Unmoderated user testing
Analyze:
- User testing
- Desk research
User problems
People were not using filters throughout the CVS experience. Some feedback was gathered and users want a simple way to filter information. We sought to see how we can make the experience feel less overwhelming.
Initial goal
- Determine why and where users were not using the filtering experience and create solutions.
- Ensuring the experience is native to each platform.
- Make global components and elements for the enterprise.
Desk research
Our analytics show that less than 10% of the users used the filters on the product list page and the loyalty sections. With the information gathered from a usability test in April 2021, the following was called out:
- The repeating or too much information.
- A lot of filters did not connect to what a person was looking for.
- There is no ability to search through the filter.
- Difficult to Navigate - specific on web mobile, iOS, and aOS.
Competitive analysis
Wireframes
High-fidelity prototypes
I used user testing and competitive analysis to implement Pill for iOS and chips for aOS. I worked with project management and analytics to determine the most popular user categories and kept it under 10.
Handoff
For the developer's files:
- A11Y markups
- Components and elements
- Clickable prototypes
- Interaction notes
- List of Components, existing elements, and new elements
Takeaways
Did we answer our questions?
We did learn some of the reasons why customers were not using the filtering experience. Using expose filters for certain categories will help with finding quick information. However, the main filter needs a clean-up and UI adjustments so the feature works for different platforms.
Did we achieve our goals?
We figured out methods to implement the horizontal filter but did not learn why the user was not touching the current experience.
Next steps?
- Meet weekly with teams that had a filter experience.
- Organize when to conduct QA.
- Do another user test with existing filter on product listing page.
- Conduct card sorting session.
- Strategize with the merchant and search team to create solutions for inputting types of filters.
- Collaborate with other teams to implement the components throughout the CVS enterprise.