The Team
- 2 Designers
- 1 Product Owner
- 6 Developer
- 1 Content consultant
My Role
- Market Research
- User Research
- Usability Testing
- Wireframing
- Prototyping
- Workshop Facilitation
Used Tools
- Figma
- Miro
- Optimal Workshop
- Rapid Usertests
- Jira & Confluence
Duration
4 Month
Problem
We know that if the filter is used, the time to video is shorter than without, but existing customers use the filter more often than new customers.
Goal
Redesign the filter so that all customers, new and existing, want to use it.
Challenge
Improve the filter, without breaking the long lived habits of existing customers in a way that makes them shy away from using the new filter.
The Process
Open interviews
... to observe existing and potential customers using the current filter and learn what works well and where pain points lie.
Internal Interviews
... with dev and content team to understand how the filter functions on the backend and how it works with what kind of metadata.
Card Sorting
... to understand the mental model of existing and potential customers regarding filter parameters and groupings.
Tree Testing
... to test the new filter structure that was created based on the card sorting. (As our CEO designed the old filter, this also served again as proof of concept for the redesign).
User tests with prototypes
... to learn about usability issues so we can fix them in a next iteration, test again and repeat the process till the users can interact without any problem.
Adapt the design
... to all platforms so all users have the same experience when filtering for video no matter which device they use.
Card Sorting to form groups from parameters
Tree Testing to validate filter groups
We wanted to achieve...
Quick access
As filtering was often the first thing users did when visiting the website, discoverability was very important. On desktop we designed the filter to be already expanded on the home page (if logged in). As mobile has limited space users would still need one tap to open it but we made it stand out visually as a primary action.
A new structure
The new categories should be designed to match the mental modle of our users, not ours. We created a new structure for categories and tags based on results from card sorting and tree testing.
Use-case terminology
We rephrased the names of some tags so they describe what this yoga will help with and are understandable by everyone.
So we decided on...
Constant feedback
Because the available tags are plenty, we made sure to provide constant and complete feedback about what the user did and what that means for the search result. If the user puts in a combination that would lead to 0 results, the filter could not be applied.
Support simple and complex
The filter should be easy enough to understand so even yoga beginners can use it with ease and find videos that are suited to their needs. On the other hand we wanted to make sure that experts can express their way to think about yoga in it as well. For that we ordered the categories so that most used and easy to understand categories are quick to reach, while enhanced categories are further down and on desktop hidden behind “more”.
+/- 5min
We saw that users misunderstood constantly how the current time filter worked. It was a slider to put in a min and max value but users would only set one and were then confused about the results not matching with their set time. We decided to switch to a single knob on the slider that would always calculate with +/- 5min to help the confusion.
App View
App View
Web View
Feedback from our users
"Suuuper app but the filter/search function should be improved. EDIT: THERE WAS JUST A NEW FILTER. NICE!!"
"...Your improved filter in the app is great, by the way. It helps me find what I need even faster."
Lesson learned
One learning we took away is that changing how the time filter works was a misguided decision. We got loads of feedback about the wish from not only old but also new users to offer the possibility to set a range instead of a single time stamp. Looking back we should have worked out the usability of the existing time filter, not changed it completely.
Fun Fact
Providing constant feedback had the side effect that users payed attention to this and based their choices on the amount of results it would give them. This proved to be quite useful data for us to gather.