THE PROBLEM
The business is evolving into a leading omni-channel marketplace in an increasingly challenging DTC space.
How do we redesign the navigation interface to be more intuitive + supports discovery and new product adoption, while providing added clarity for new/returning customers as our catalogue grows?
THE BUSINESS
Dr. Squatch’s quick ascent into a household staple meant we rapidly outgrew various platforms to keep up with exponential amounts of traffic + customers (between '21-'24, we scaled our YoY revenue 300+% !!). Super awesome, but also had many consequences in increased technical+ design debt.
As the company scaled, so did it's product catalogue; with an aggressive annual expansion calendar and impressive foot traffic (500k+ unique visitors weekly), I had the responsibility to ensure that we could address our customers pain points, without bloating the business's long-term roadmap.
PREVIOUS MAYHEM
Improve new customer CVR, and improve (or retain) returning customer CVR.
Improve new customer CVR, and improve (or retain) returning customer CVR.
Improve new customer CVR, and improve (or retain) returning customer CVR.
Heavily influenced by marketing initiatives, rather than building for scale, the previous experience was bloated, inconsistent, and hard to navigate.
On mobile devices, our heatmap data showed that 60% of visitors primarily browsed products via quick nav (originally inspired by Instagram Stories), cannibalizing the hamburger menu and induced recency bias for only the highest performing products.
After I created a skeletal user flow, it is clear that the experience did not prioritize the customer, and had too many inconsistencies between devices
This design created a bottleneck to business needs — new product launches were fighting for placement, had no grouping for clear hierarchy, was not ADA compliant, and failed to highlight our key partnerships.
Overall, a strange and inconsistent experience that was not inspiring, and felt overwhelming to any potential customers.
Desktop was not much better — I had many conversations with marketing, merchandising, and the PM team that if everything is "important", then *nothing* was important.
GOALS & OBJECTIVES
Improve new customer CVR, and improve (or retain) returning customer CVR.
Improve new customer CVR, and improve (or retain) returning customer CVR.
Future-proofing the expansion of our product catalogue.
Future-proofing the expansion of our product catalogue.
Address customer / business pain points via research and testing.
Address customer / business pain points via research and testing.
Standardize taxonomy to improve usability on high-touchpoint areas.
Standardize taxonomy to improve usability on high-touchpoint areas.
RESEARCH + DISCOVERY
To understand what needed to be prioritized, we did an audit of the pages with the most clicks / traffic, as well as referencing key heatmap data.
The previous design had a huge blindspot —visitors did NOT engage with key homepage content — instead, choosing to go straight to navigation or scrolling through the best-sellers.
I then cross-referenced our existing navigation features with key competitors (personal care / beauty / DTC) because I wanted to learn:
What were we doing correctly?
What experience were we missing?
What, from the previous experience, did not move the needle, and can be deprecated?
After collaborating with Product and CX teams to get their recommendation, we landed on a mixed categorization / discovery path.
I consolidated the navigation hierarchy (and anticipated product expansion) to help the customer have more freedom in their journey — maximizing key acquisition drivers, while making discovery possible.
Scaling up navigation IA to enable growth in a transforming DTC marketplace.
PRODUCT DESIGNER
MAR—JUL’24
DR SQUATCH
THE BUSINESS
Dr. Squatch’s quick ascent into a household staple meant we rapidly outgrew various platforms to keep up with exponential amounts of traffic + customers (between '21-'24, we scaled our YoY revenue 300+% !!). Super awesome, but also had many consequences in increased technical+ design debt.
As the company scaled, so did it's product catalogue; with an aggressive annual expansion calendar and impressive weekly foot traffic (500k+ unique visitors), I had the responsibility to ensure that we could address our customers pain points, without bloating the business's long-term roadmap.
THE PROBLEM
The business is evolving into a leading omni-channel marketplace in an increasingly challenging DTC space (changes to paid ad space vs. organic, macroeconomic factors, market saturation, etc.)
How do we redesign the navigation interface to be more intuitive + supports discovery and new product adoption, while providing added clarity for new/returning customers as our catalogue grows?
GOALS &
OBJECTIVES
Improve new customer CVR, and improve (or retain) returning customer CVR.
Improve new customer CVR, and improve (or retain) returning customer CVR.
Future-proofing the expansion of our product catalogue.
Future-proofing the expansion of our product catalogue.
Address customer / business pain points via research and testing.
Address customer / business pain points via research and testing.
Standardize taxonomy to improve usability on high-touchpoint areas.
Standardize taxonomy to improve usability on high-touchpoint areas.
PREVIOUS NAV
Heavily influenced by marketing initiatives, rather than building for scale, the previous experience was bloated, inconsistent, and hard to navigate.
On mobile devices, our heatmap data showed that 60% of visitors primarily browsed products via quick nav (originally inspired by Instagram Stories), cannibalizing the hamburger menu and induced recency bias for only the highest performing products.
Desktop was not much better — I had many conversations with marketing, merchandising, and the PM team that if everything is "important", then *nothing* was important.
After I created a skeletal user flow, it is clear that the experience did not prioritize the customer, and had too many inconsistencies between devices
This design created a bottleneck to business needs — new product launches were fighting for placement, had no grouping for clear hierarchy, was not ADA compliant, and failed to highlight our key partnerships.
Overall, a strange and inconsistent experience that was not inspiring, and felt overwhelming to any potential customers.
RESEARCH +
DISCOVERY
RESEARCH +
DISCOVERY
To understand what needed to be prioritized, we did an audit of the pages with the most clicks / traffic, as well as referencing key heatmap data.
The previous design had a huge blindspot —visitors did NOT engage with key homepage content — instead, choosing to go straight to navigation or scrolling through the best-sellers.
I then cross-referenced our existing navigation features with key competitors (personal care / beauty / DTC) to learn:
What were we doing correctly?
What experience were we missing?
What, from the previous experience, did not move the needle, and can be deprecated?
After collaborating with Product, CX, and Consumer Insights teams, we landed on a mixed categorization / discovery path.
I consolidated the navigation hierarchy (and anticipated product expansion) to help the customer have more freedom in their journey — maximizing key acquisition drivers, while making discovery possible.
ITERATE &
ITERATE AGAIN
We aimed to reduce mental load where we could, but started with the basics — by exposing parent categories only:
How would the taxonomy affect collection pages downstream?
Does this limit discovery for potential customers that are unfamiliar with the brand?
Or would this enable better discovery due to driving users further into the site experience?
Announcement Bar Headline
Announcement Bar Subhead
Subscribe
Bundles
Products
Our Story
US
0
Bar Soap
Deodorant
Bundles
New!
Special Edition
New!
Products
Body
Ball Care
Hair Care
Face
Shave
Shop All
More Squatch
Toothpaste
Shower Boosters
Swag
Buy with Prime
Shave
Take Quiz
Ultimately, due to marketing demands, the team moved forward with a version that highlighted both parent and child categories — allowing users to browse through all categories if desired.
HI-FIDELITY
HI-FIDELITY
RESULTS +
OUTCOMES
Reduce fatigue and streamline engagement to areas of opportunity for the business, by appropriately clustering our product catalogue.
Relieve mental load by eliminating duplicate content, shortening the length of time it took to reach the intended goal.
Avoided risk to traffic, CVR, and user engagement on primary acquisition drivers.
Increased CVR, Click-through Rate, AOV across product catalogue, and improved second-order CVR and net-subscriber growth.
HI-FIDELITY MOCKS
RESULTS & OUTCOMES
Reduce fatigue and streamline engagement to areas of opportunity for the business, by appropriately clustering our product catalogue.
Relieve mental load by eliminating duplicate content, shortening the length of time it took to reach the intended goal.
Improving new customer CVR (+ 7.17% the day of launch) - showing huge promise due to higher engagement, and increasing returning CVR (+7.16, compared to the previous 3.65%) while mitigating risk to traffic, CVR, and user engagement on primary acquisition drivers.
Increased CVR, Click-through Rate, AOV across the product catalogue, and improved second-order CVR and net-subscriber growth.
Scaling up navigation IA to enable growth in a transforming DTC marketplace.
ROLE:
PRODUCT DESIGNER
TIMELINE:
MAR—JUL’24
Ashley Chen is a design strategist, crafting scalable solutions where usability meets complex business problems ❋
A
S
H
L
E
Y
☆
D
E
S
I
G
N
S
☆
S
T
U
F
F
☆
DR SQUATCH
ITERATE, THEN ITERATE AGAIN
We aimed to reduce mental load where we could, but started with the basics — by exposing parent categories only:
How would the taxonomy affect collection pages downstream?
Does this limit discovery for potential customers that are unfamiliar with the brand?
Or would this enable better discovery due to driving users further into the site experience?
Ultimately, due to marketing demands, the team moved forward with a version that highlighted both parent and child categories — allowing users to browse through all categories if desired.
PREVIOUS NAV
Heavily influenced by marketing initiatives, rather than building for scale, the previous experience was bloated, inconsistent, and hard to navigate.
On mobile devices, our heatmap data showed that 60% of visitors primarily browsed products via quick nav (originally inspired by Instagram Stories), cannibalizing the hamburger menu and induced recency bias for only the highest performing products.
Desktop was not much better — I had many conversations with marketing, merchandising, and the PM team that if everything is "important", then *nothing* was important.
After I created a skeletal user flow, it is clear that the experience did not prioritize the customer, and had too many inconsistencies between devices
This design created a bottleneck to business needs — new product launches were fighting for placement, had no grouping for clear hierarchy, was not ADA compliant, and failed to highlight our key partnerships.
Overall, a strange and inconsistent experience that was not inspiring, and felt overwhelming to any potential customers.