Aperture filters re-design (project in progress)

The problem
The Aperture filters that are being used across Bazaarvoice's Portal (centralised location for all products), are not user friendly, and products have evolved to the extent that clients are finding the filters cumbersome and tedious to use. Our filters are needed to help users narrow down large volumes of data across categories, brands and products. Considering Bazaarvoice products are important in our clients' everyday operations, it is imperative that these filters are re-designed.

There are numerous products using the Aperture filters, which means there are many use cases. This has been a large piece of work.

The two principle filters focused on in this case study are the Date and Product pickers.

Date filter

  • No international date format
  • No help description for users
  • When a user is comparing date ranges, they can only see the first date range selected when they click out of the filter. There is no sticky panel or draw that allows the user to see the second date period selected
  • No empty field date
  • Data is 48 hours old: many users don't realise this and get frustrated when they try to retrieve data from the last two days
  • Poor date selection pattern and date field validation is broken at times

Single date selector

Comparison date selector

Product filter

  • Only 5 search results display at one time
  • No help description for users
  • The real estate of the filter is too small for the complexity of the tasks
  • The search function doesn't work as it should: if you type in 3 letters, your result will not display until you have typed more
  • No help description for users
  • The real estate of the filter is too small for the complexity of the tasks
  • Users are raging clicking to remove the pills instead of selecting 'Clear all' or 'Clear' because they look detached from the filter and users don't realise this simple function exists
  • Hard for users to distinguish between active and inactive products
  • Not enough advanced filtering options
My role
I have taken full ownership for the majority of this project. I have carried out Discovery, such as researching best in class filters, setting up partnerships with relevant to product teams to understand their users' needs, carrying out user interviews and setting up Fullstory sessions to analyse user behaviour. I have also created the designs and prototypes of the new filters, but have collaborated with another senior designer to validate patterns and features.
Process
Gathering feedback on the filters from Fullstory, Productboard, emails and relevant folders was important to do before beginning to re-design the filters. I annotated all of the filters so that the feedback was collected in one place, and so that other relevant designers and engineers could better understand the design issues.

Making sense of client feedback

UX research: best in class filters

Fullstory

Users are rage clicking to get rid of pills instead of clicking 'clear all,' and that there is a lot of inconsistency with the copy across the filters (this has been influenced by individual teams making their own changes instead of using the Aperture Design System.)
Our enterprise clients are using many 'Saved filters': one is using 150 saved filters. This exemplified their importance
Users don't know if components are clickable or not, buttons aren't functioning properly, there are invisible overlays and there are broken elements

User interviews

I spoke with various product teams internally to gauge specific needs in relation to their product to ensure that we are incorporating all user needs into the filter as the Date and Product pickers are used across several products. I also carried our a number of user interviews with a mixture of enterprise and SMB clients.

Outcome
This project in still in flight, but I am working on high-fidelity prototypes that will be used for user testing.

I have been working with Client Success Managers to identify clients who would be keen to test the new filter design. I will ask clients to complete tasks in order to gauge if the filter is easy to use in order to complete complex tasks. I also plan to partner with a dedicated Aperture copywriter to ensure all copy is consistent and comprehensive across the filters.

Once user testing is complete and appropriate changes have been made, I will create design tokens and work with Engineering to build the filters.

Date picker

Product picker

Process

Internal research

Gathering feedback on the filters from Fullstory, Productboard, emails and relevant folders was important to do before beginning to re-design the filters.

I annotated all of the filters so that the feedback was collected in one place, and so that other relevant designers and engineers could better understand the design issues.

UX research

Fullstory

Users are rage clicking to get rid of pills instead of clicking 'clear all,' and that there is a lot of inconsistency with the copy across the filters (this has been influenced by individual teams making their own changes instead of using the Aperture Design System.)
Our enterprise clients are using many 'Saved filters': one is using 150 saved filters. This exemplified their importance
Users don't know if components are clickable or not, buttons aren't functioning properly, there are invisible overlays and there are broken elements

User interviews

I spoke with various product teams internally to gauge specific needs in relation to their product to ensure that we are incorporating all user needs into the filter as the Date and Product pickers are used across several products. I also carried our a number of user interviews with a mixture of enterprise and SMB clients.

Outcome

This project in still in flight, but I am working on high-fidelity prototypes that will be used for user testing.

I have been working with Client Success Managers to identify clients who would be keen to test the new filter design. I will ask clients to complete tasks in order to gauge if the filter is easy to use in order to complete complex tasks. I also plan to partner with a dedicated Aperture copywriter to ensure all copy is consistent and comprehensive across the filters.

Once user testing is complete and appropriate changes have been made, I will create design tokens and work with Engineering to build the filters.

Date picker

Product picker

Email or LinkedIn

Copyright © Emma Millar. All Rights Reserved.