Rethinking filtering experience in tutti.ch
Business
tutti.ch (Online Marketplace)
Work
Product Design
Tutti.ch is an online Marketplace for used goods. With 2’500’000 active listings, tutti.ch is the largest gratis Marketplace Platform from Switzerland.
As lead Product Designer in this initiative I was in constant synch with the stakeholders. I have worked with UX Researchers, a Project Manager, a UX Writer and Front End and Back End Developers.
Business Goals
Improve matchmaking between buyers and offers
Make sure users can find what they need by showing relevant results.
Close the experience gap to E-commerce
Get closer to E-commerce experience in filtering, navigating, buying and selling.
Improve search experience
Improve the way users search by optimizing the search experience in general.
🔬 Discovery
One thing we knew: Users couldn’t find what they were searching for and therefore the Customer Support was flooded with complaints.
Before jumping into conclusions we started a discovery phase in what could be categorized into a Double Diamond process.
In this discovery process we analysed how people search and browse in tutti.ch web and apps through Moderated Usability tests.
Moderated Usability tests
Open feedbacks
The moderated usability tests allowed us to receive open feedbacks about the product and the search functionality in general and helped us to have an holistic overview of the current challenges users face on a daily basis.
Low visibility
Users couldn’t see the whole list of filters therefore they were not aware that some categories have category-specific filters.
2 different approaches for finding things
Depending on the item they were searching, users navigate differently. Some use the search field and some browse all the way down using category selection and filters.
✍️ Definition
In the definintion stage I have gather all the feedback and analysis collected in the Discovery Stage and defined the basic user problems that we needed to solve.
Identified customer problems
Low visibility of Category-specific filters
Users couldn’t see that some categories have speficic filters so there was low usage of these filters.
Low visibility of leaf categories (subcategories)
Users couldn’t see that after they selected a category a subcategory selection was available.
Low visibility of current context
Users didn’t know in which category there were navigating and which filters were active.
What we can observe from the previous implementation?
In the definintion stage I have gather all the feedback and analysis collected in the Discovery Stage and defined the basic user problems that we needed to solve.
Filters Toolbar
We had a tool bar under the search field on the SRP (Search Results Page) where Category, Location, “More Filters” and Sorting could be accessed.
Each of these elements were opening a set of options.
It was impossible for the user to see that by selecting a different category a new set of filters were available.
Main Category entry point
The previous category selection had the main category shown as the first option in it’s scope and some users couldn’t understand it.
The Design challenge
The observed problem was mainly about the visibily. We needed to make sure the users could understand the current context where they were and how to change the results there were having in an easier way.
How can I reorganize the screen information so the user can have a clearer navigation and be aware of where they are and find out where they can go?
The Strategy
- Build a functional filtering system where categories and filters are clear and visible.
- Improve the usability by increasing visibility of the navigation context, offering visual clues and navigation patterns.
- Provide users a human-centered delightful interface that reduces cognitive load and feels intuitive.
🧪 Develop
In the Development stage was very important to get the whole team together and sketch possibilities. Due to the scope of the project the involvement of many layers of competences was required.
First low-fidelity mockups
I have developed with the team some solutions that intended to solve all the problems while also aiming to achieve Business Goals. The proposed changes were:
- Detach toolbar with categories and filters from the the header and the search bar;
- Create a sidebar on the SRP (Search Results Page) with category selection and its related filters on Desktop;
- Transform Main category pages into Landing Pages where all leaf categories can be accessed, blog posts can be found and new ways for monetization are possible;
- Display Breadcrumbs on SRP to provide users with the right caetegory context;
- Show recommended categories based on search term.
All the low-fi mockups were then tested with users, polished, tested again 🔄 and validated to make sure we were building solutions and not new problems.
High-fidelity mockups
After everything was validated with real users, many assumptions we’ve had have improved and adapted to the users needs.
We could therefore start to explore with High-fidelity mockups where we can better nudge users and make use of the visual identity for a better experience.
Video: tutti.ch New filters and categories solution
One Extra Mile
As an effort to deliver a solution users can relate to, I have also decided to change the way we display our categories. From icons ( which in some cases are hard to translate and represent some categories) to images where we can use real items from the categories reducing cognitive load.
🚀 Deliver
We have decided to implement the solutions gradually starting with 25% of total users while making sure nothing is bugged on live.
We started collecting feedback from the users and had positive results.
We have also stopped receiving complaints and the Customer Service tickets have stopped pilling up.
75%
Positive feedbacks on the CSat Survey (Customer Satisfaction) Survey placed on the search results page.
65%
Positive feedbacks on the HaTS Survey (Happiness Tracking Survey) placed on the search results page.
7/8
Average Results from the NPS Survey (Net Promoter Score).
Learnings
The project’s excellence got compromised by advertisings revenue’s stability concern. We couldn’t afford moving advertising placements around and the layout and dimension of some elements couldn’t be part of the improvements.
I have learned that any change that touches advertising needs to involve a commitment from different levels of leadership and just the Product Team sometimes cannot own the entire decision.