iOS Catalog Filters Upgrade

Redesigned filters on iOS to help patients refine their searches more easily so they can find products faster.

Quick Note: The case study for this project is still in progress. In the meantime, please enjoy the redesigned flows and experience to improve the UI & UX of this feature in order to meet business objectives.

The Problem

Patients using the Fullscript app lacked the necessary functionality needed to effectively filter their search results to find the products they are looking for

• Filters lacked key features for results refinement
• Some filters required multiple taps despite its simplicity
• Filters lacked common best practices like "results set count"

Here is a quick visual of the old state

‍

Outcomes from problem

• This increased time to find products by 25%
• This increased time to add to cart by 45%
• Use of the filters feature was less than by 10%
• 20% of users switched to using sites like Amazon to find supplements

‍

Objectives

• Improve the filtering experience to make it more usable and functional
• Reduce time to add to find products by 25%
• Reduce time to add to cart by 45%
• Increase use of filters by 30%

‍

‍Users & Audience

• 5.5M patients across US & Canada

Scope

• Do no harm to existing functionality/experience
• iOS

‍

Research & Design Methodology (Coming soon)

‍

Redesigned Filtering Experience: Main Workflows

The redesigned experience takes advantage of both accordions and progressive view where it makes sense. This mixed experience allow for quicker selections for filters that do not hold a lot of information eg: Sorting. Conversly, for filters that hold a lot of information eg: Brands, progressive views have been used to all for a full page experience.

‍

Sorting

The use of accordions allows users to now sort much quicker on iOS without having to enter into another view.

Category Refinement

In this redesigned experience, we introduced a new filter called category. This allows users to further narrow their search. The design also makes it possible for users to easily remove applied filters without having to enter another view. The introduction of counters also makes it easier for users to know how many filters they've selected.

Include/Exclude Ingredients

The redesigned experience also brings the include/exclude functionality on web to iOS. This functionality has been redesigned for iOS, allowing users to include or exclude certain ingredients from their results set.

Brands

Brands are now easier to find with the introduction of popular brands as a horizontal carousel at the top. They also occupy the full height of the page for a more dynamic experience.

‍

Form

Forms also follow a similar pattern as brands with the exception of a search bar. Forms are meant to be conditional based on the ingredients chosen.

In-stock

With an updated ui pattern, the in-stock feature now utilizes the toggle component for easy access and visual enhancement

‍

The redesigned experience brings more functionality, better UX flows and UI patters to make filtering a breeze. The next iteration of this case study, will contain the entire end to end process of redesigning this feature.

‍

View next project: Voice of the Advisor