Enhancing Product Filtering & Discovery
Enhancing Product Filtering & Discovery
Using customer insights and data analysis to improve the filtering system and product discovery across mobile and desktop.
Using customer insights and data analysis to improve the filtering system and product discovery across mobile and desktop.
My Role
My Role
Product Designer
Product Designer
Product Designer
The Team
The Team
Product Owner
Product Owner
Product Owner
Front-End Developers
Front-End Developers
Front-End Developers
Digital Data Analyst
Digital Data Analyst
Digital Data Analyst
Back-End Developers
Back-End Developers
Back-End Developers
QAs
QAs
QAs
Marketing Managers
Marketing Managers
Marketing Managers
Challenge
Williams’ e‑commerce performance had been declining due to outdated UX in product discovery. Early research showed that users found filters hard to access while browsing and cumbersome to use—especially on mobile.
Results
+20% user satisfaction (post‑launch survey), ~2× daily usage of Filters and Sorting (filters from ~500 → ~1,000; sorting showed a similar uplift), +6% add‑to‑cart rate
Challenge
Williams’ e‑commerce performance had been declining due to outdated UX in product discovery. Early research showed that users found filters hard to access while browsing and cumbersome to use—especially on mobile.
Results
+20% user satisfaction (post‑launch survey), ~2× daily usage of Filters and Sorting (filters from ~500 → ~1,000; sorting showed a similar uplift), +6% add‑to‑cart rate
Challenge
Williams’ e‑commerce performance had been declining due to outdated UX in product discovery. Early research showed that users found filters hard to access while browsing and cumbersome to use—especially on mobile.
Results
+20% user satisfaction (post‑launch survey), ~2× daily usage of Filters and Sorting (filters from ~500 → ~1,000; sorting showed a similar uplift), +6% add‑to‑cart rate
+20%
User Satisfaction
User Satisfaction
2X
Filter & Sorting usage
Filter & Sorting usage
+6%
Add to cart
Add to cart
Project Goals
Redesigned and streamlined the Williams e-commerce product filtering system to improve product findability,
build customer trust in using filters, and reduce friction in product discovery across mobile and desktop.
Design Approach
We followed the Double Diamond: validate the problems, define priorities, explore options, then deliver measurable improvements. Given that most traffic is mobile, we worked mobile‑first and optimised interaction costs
Project Goals
Redesigned and streamlined the Williams e-commerce product filtering system to improve product findability, build customer trust in using filters, and reduce friction in product discovery across mobile and desktop.
Design Approach
We followed the Double Diamond: validate the problems, define priorities, explore options, then deliver measurable improvements. Given that most traffic is mobile, we worked mobile‑first and optimised interaction costs
Project Goals
Redesigned and streamlined the Williams e-commerce product filtering system to improve product findability,
build customer trust in using filters, and reduce friction in product discovery across mobile and desktop.
Design Approach
We followed the Double Diamond: validate the problems, define priorities, explore options, then deliver measurable improvements. Given that most traffic is mobile, we worked mobile‑first and optimised interaction costs
Project Goals
Redesigned and streamlined the Williams e-commerce product filtering system to improve product findability,
build customer trust in using filters, and reduce friction in product discovery across mobile and desktop.
Design Approach
We followed the Double Diamond: validate the problems, define priorities, explore options, then deliver measurable improvements. Given that most traffic is mobile, we worked mobile‑first and optimised interaction costs
User Research
User Research
User Research
User Survey
User Survey
User Survey
For clear picture of our painpoints, I've extracted the key frustrations based on our user surveys.
For clear picture of our painpoints, I've extracted the key frustrations based on our user surveys.
For clear picture of our painpoints, I've extracted the key frustrations based on our user surveys.
Survey Insights
For clear picture of our painpoints, I've extracted the key frustrations based on our user surveys.
For clear picture of our painpoints, I've extracted the key frustrations based on our user surveys.
For clear picture of our painpoints, I've extracted the key frustrations based on our user surveys.
~10% of users were frustrated that they could apply only one filter at a time.
60%+ asked for more filter options (e.g., heel type/height, width).
~10% said the filter was hard to access and often hidden while browsing.
GA data Insights
Working with our Digital Data Analyst, we examined usage patterns in GA:
Working with our Digital Data Analyst, we examined usage patterns in GA:
Working with our Digital Data Analyst, we examined usage patterns in GA:
>70% of users are on mobile (mostly iPhone).
>70% of users are on mobile (mostly iPhone).
>70% of users are on mobile (mostly iPhone).
~90% of sessions used Sort: Lowest Price; users also frequently changed colour, size, and brand.
~90% of sessions used Sort: Lowest Price; users also frequently changed colour, size, and brand.
~90% of sessions used Sort: Lowest Price; users also frequently changed colour, size, and brand.
Filter usage averaged ~400 interactions/day; sorting averaged ~550/day pre‑redesign.
Filter usage averaged ~400 interactions/day; sorting averaged ~550/day pre‑redesign.
Filter usage averaged ~400 interactions/day; sorting averaged ~550/day pre‑redesign.
User Interviews
Partnering with Marketing, we interviewed 10 existing customers recruited via our persona Laura to explore end‑to‑end discovery behaviours and pain points.
Partnering with Marketing, we interviewed 10 existing customers recruited via our persona Laura to explore end‑to‑end discovery behaviours and pain points.
Partnering with Marketing, we interviewed 10 existing customers recruited via our persona Laura to explore end‑to‑end discovery behaviours and pain points.
Interesting Findings - Filtering & PLP
Users adjust filters when initial results don’t match taste.
They prefer more products per screen with less scrolling.
Many add items to a wishlist for later comparison and selection.
Users wanted to apply multiple filters in one go before seeing results.
Hotjar Recording Insights
Reviewing Hotjar recordings of desktop and mobile sessions revealed valuable insights. I focused how they interact their filter to look for their products.
Reviewing Hotjar recordings of desktop and mobile sessions revealed valuable insights. I focused how they interact their filter to look for their products.
Reviewing Hotjar recordings of desktop and mobile sessions revealed valuable insights. I focused how they interact their filter to look for their products.
Hotjar Recording Highlighted Insights
Users often tapped the wrong filter (hit‑area/label clarity issues).
They scrolled to the top repeatedly to access filters—losing context.
No‑results pages were a dead end with no helpful next step.
Identifying Painpoints
Product discovery user flow
I mapped the product discovery flow and facilitated alignment with Product, Engineering and Marketing to pinpoint the highest‑impact opportunities.
Identifying Painpoints
Product discovery user flow
I mapped the product discovery flow and facilitated alignment with Product, Engineering and Marketing to pinpoint the highest‑impact opportunities.
Identifying Painpoints
Product discovery user flow
I mapped the product discovery flow and facilitated alignment with Product, Engineering and Marketing to pinpoint the highest‑impact opportunities.
Painpoints & Prioritisation
After identifying the pain points, I aligned business and technology teams to assess their impact and determine the feasibility of solutions.
Painpoints & Prioritisation
After identifying the pain points, I aligned business and technology teams to assess their impact and determine the feasibility of solutions.
Painpoints & Prioritisation
After identifying the pain points, I aligned business and technology teams to assess their impact and determine the feasibility of solutions.
Painpoint
Painpoint
Filter is hard to access on mobile and disappears on scroll.
Filter is hard to access on mobile and disappears on scroll.
Filter is hard to access on mobile and disappears on scroll.
Painpoint
Painpoint
Users can apply only one filter at a time, then must scroll back to re‑open filters.
Users can apply only one filter at a time, then must scroll back to re‑open filters.
Users can apply only one filter at a time, then must scroll back to re‑open filters.
Painpoint
Painpoint
No‑results is a dead end—no guidance or recovery path.
No‑results is a dead end—no guidance or recovery path.
No‑results is a dead end—no guidance or recovery path.
Painpoint
Painpoint
Wishlist unavailable or hard to use on mobile for comparison.
Wishlist unavailable or hard to use on mobile for comparison.
Wishlist unavailable or hard to use on mobile for comparison.
Painpoint
Painpoint
Users want more filter options (sizes, colours, heel type/height, width).
Users want more filter options (sizes, colours, heel type/height, width).
Users want more filter options (sizes, colours, heel type/height, width).
Ideation
We ran multiple ideation sessions across touchpoints and pain points, exploring low‑effort, high‑impact changes and validating feasibility with engineers.
Ideation
We ran multiple ideation sessions across touchpoints and pain points, exploring low‑effort, high‑impact changes and validating feasibility with engineers.
Ideation
Once we prioritised what we should tackle first, we had multiple ideation session according to different touch points and pianpoints.
Painpoints vs Solution
Painpoint
Painpoint
Painpoint
Filter is hard to access on mobile and disappears on scroll.
Filter is hard to access on mobile and disappears on scroll.
Filter is hard to access on mobile and disappears on scroll.
Solution
Solution
Solution
Make filter access persistent
Sticky Filter and Sort controls on scroll.
Only refresh results after a user applies changes.
Make filter access persistent
Sticky Filter and Sort controls on scroll.
Only refresh results after a user applies changes.
Make filter access persistent
Sticky Filter and Sort controls on scroll.
Only refresh results after a user applies changes.
Painpoint
Painpoint
Painpoint
Users can apply only one filter at a time, then must scroll back to re‑open filters.
Users can apply only one filter at a time, then must scroll back to re‑open filters.
Users can apply only one filter at a time, then must scroll back to re‑open filters.
Solution
Solution
Solution
Allow multi‑select without losing context
Filter drawer that lets users select multiple options, then Show Results in one step.
Allow multi‑select without losing context
Filter drawer that lets users select multiple options, then Show Results in one step.
Allow multi‑select without losing context
Filter drawer that lets users select multiple options, then Show Results in one step.
Painpoint
Painpoint
Painpoint
No‑results is a dead end—no guidance or recovery path.
No‑results is a dead end—no guidance or recovery path.
No‑results is a dead end—no guidance or recovery path.
Solution
Solution
Solution
Create a productive no‑results state
Show applied filters with easy adjust/reset controls.
Offer recently viewed items as an alternative path.
Create a productive no‑results state
Show applied filters with easy adjust/reset controls.
Offer recently viewed items as an alternative path.
Create a productive no‑results state
Show applied filters with easy adjust/reset controls.
Offer recently viewed items as an alternative path.
Painpoint
Painpoint
Painpoint
Wishlist unavailable or hard to use on mobile for comparison.
Wishlist unavailable or hard to use on mobile for comparison.
Wishlist unavailable or hard to use on mobile for comparison.
Solution
Solution
Solution
Enable wishlist on mobile
Add Add to Wishlist on PLP and a clear Wishlist entry point.
Enable wishlist on mobile
Add Add to Wishlist on PLP and a clear Wishlist entry point.
Enable wishlist on mobile
Add Add to Wishlist on PLP and a clear Wishlist entry point.
Additional Quick Wins
Additional Quick Wins
Additional Quick Wins
Reorder the filter list according to GA data insights.
Reorder the filter list according to GA data insights.
Reorder the filter list according to GA data insights.
Restructure some filter categories according to cart sorting insights.
Restructure some filter categories according to cart sorting insights.
Restructure some filter categories according to cart sorting insights.
Lo-Fi Design Exploration
Bi‑weekly, 30‑minute design reviews with Product, Marketing and Engineering ensured alignment on direction, feasibility and rapid iteration.
Lo-Fi Design Exploration
Bi‑weekly, 30‑minute design reviews with Product, Marketing and Engineering ensured alignment on direction, feasibility and rapid iteration.
Lo-Fi Design Exploration
Bi‑weekly, 30‑minute design reviews with Product, Marketing and Engineering ensured alignment on direction, feasibility and rapid iteration.
HI-Fi Prototype & User Testing
After several rounds of iteration, we tested a few controversial variations through unmoderated studies to validate the direction and to surface additional insights for iteration.
HI-Fi Prototype & User Testing
After several rounds of iteration, we tested a few controversial variations through unmoderated studies to validate the direction and to surface additional insights for iteration.
HI-Fi Prototype & User Testing
After several rounds of iteration, we tested a few controversial variations through unmoderated studies to validate the direction and to surface additional insights for iteration.
Consolidating & Iterating
From behavioural observations and user feedback, I've refined the designs
Consolidating & Iterating
From behavioural observations and user feedback, I've refined the designs
Consolidating & Iterating
From behavioural observations and user feedback, I've refined the designs
Feedback
“I do like you put all the filters all in one place but when you scroll the (applied) filters disappear, I have to scroll all the way up to the top to find them”
“I do like you put all the filters all in one place but when you scroll the (applied) filters disappear, I have to scroll all the way up to the top to find them”
Design iterate
Applied filters remain visible when the accordion is closed, maintaining context.
Applied filters remain visible when the accordion is closed, maintaining context.
Applied filters remain visible when the accordion is closed, maintaining context.
Quick wins
Prioritised high-value filters (from GA, interviews, user tests) and placed them within right-hand reach zones, reflecting that around 90% of Australians are right-handed.
Reordered the filter list so that high-value options—identified through GA data, customer interviews, and user testing—are positioned within easy reach for right-handed users, reflecting that around 90% of Australians are right-handed.
Prioritised high-value filters (from GA, interviews, user tests) and placed them within right-hand reach zones, reflecting that around 90% of Australians are right-handed.
MVP
Impact
Filter usage doubled from around 500 to around 1000 daily interactions after the redesign, with sorting showing a similar uplift. Nearly 2× overall. Stronger engagement and growing customer trust in product discovery.
Filter usage doubled from around 500 to around 1000 daily interactions after the redesign, with sorting showing a similar uplift. Nearly 2× overall. Stronger engagement and growing customer trust in product discovery.
Filter usage doubled from around 500 to around 1000 daily interactions after the redesign, with sorting showing a similar uplift. Nearly 2× overall. Stronger engagement and growing customer trust in product discovery.
While overall satisfaction rose significantly, user ratings improved from 3.5 to 4.2. Customers still voiced ongoing complaints about stock availability in their preferred sizes.
While overall satisfaction rose significantly, user ratings improved from 3.5 to 4.2. Customers still voiced ongoing complaints about stock availability in their preferred sizes.
While overall satisfaction rose significantly, user ratings improved from 3.5 to 4.2. Customers still voiced ongoing complaints about stock availability in their preferred sizes.
Add to cart and add to wishlist also increased
Add to cart and add to wishlist also increased
Add to cart and add to wishlist also increased
Survey Insights
For clear picture of our painpoints, I've extracted the key frustrations based on our user surveys.
In checkout, ~18% of negative feedback relates to pricing and promo code issues.
Before checkout, ~30% negative feedback relates to filtering
In user portal, ≈ 20% negative feedback relates to order tracking & saved info management.
GA data Insights
I've also work with our digital data analyst to extract the data from google analytics for better understanding our user pattern
Nearly 90% user sorting from the lowest price, and they are more interested in changing colour, size & brands.
Filter usage remains low, averaging roughly 400 interactions per day, while the sorting feature averages about 550 per day.
More than 70% of our user coming from Mobile and mostly iPhone user
Impact
Filter usage doubled from around 500 to around 1000 daily interactions after the redesign, with sorting showing a similar uplift. Nearly 2× overall. Stronger engagement and growing customer trust in product discovery.
While overall satisfaction rose significantly, user ratings improved from 3.5 to 4.2. Customers still voiced ongoing complaints about stock availability in their preferred sizes.
Add to cart and add to wishlist also increased
User Interviews
For deeper insights, I partnered with the marketing team to recruit 10 existing customers for interviews, selecting participants based on our user persona, Laura. Trying to discover their painpoints from product discovery to post-purchased support.
Interesting Findings - Filtering & PLP
They adjust filters when faced with ugly shoe options in the results.
They want to see more products per screen with less scrolling.
They usually put everything into wishlist for further comparison/selection
Interesting Findings - Filtering & PLP
They adjust filters when faced with ugly shoe options in the results.
They want to see more products per screen with less scrolling.
They usually put everything into wishlist for further comparison/selection
Hotjar Recording Highlighted Insights
User seems tap the wrong filter selection often.
User have to scroll all the way up each time to use filter.
Users usually like to apply multiple filter in one go
No alternative option on "No Result" page - dead end
Identifying Painpoints
Product discovery user flow
After gathering potential pain points and insights from the earlier research, I quickly mapped out the product discovery flow and collaborated with the team to identify opportunities aligned with those findings.
Featured works
Featured works
Streamlining Checkout experience
A result‑driven redesign that lifted conversion and revenue while reducing friction at Williams.
View Project
+19.32% Revenue per user
+23.3% Conversion Rate
Record revenue at Click Frenzy ’24
Streamlining Checkout experience
A result‑driven redesign that lifted conversion and revenue while reducing friction at Williams.
View Project
+19.32% Revenue per user
+23.3% Conversion Rate
Record revenue at Click Frenzy ’24
Streamlining Checkout experience
A result‑driven redesign that lifted conversion and revenue while reducing friction at Williams.
View Project
+19.32% Revenue per user
+23.3% Conversion Rate
Record revenue at Click Frenzy ’24
Streamlining Checkout experience
A result‑driven redesign that lifted conversion and revenue while reducing friction at Williams.
View Project
Flexible Click & Collect
Designing a flexible, split fulfilment solution that alleviate customerfrustration due to low stock accuracy
View Project
End to end UI/UX Design
Service Design
User Research
Flexible Click & Collect
Designing a flexible, split fulfilment solution that alleviate customerfrustration due to low stock accuracy
View Project
End to end UI/UX Design
Service Design
User Research
Flexible Click & Collect
Designing a flexible, split fulfilment solution that alleviate customerfrustration due to low stock accuracy
View Project
End to end UI/UX Design
Service Design
User Research
Flexible Click & Collect
Designing a flexible, split fulfilment solution that alleviate customerfrustration due to low stock accuracy
View Project
Multi-Brand Design System
Designing a scalable system that improves consistency, efficiency, and speed‑to‑market across 10+ brands.
View Project
Improved Design Efficiency
Multi-brand supported
Reduced Time to Market
Multi-Brand Design System
Designing a scalable system that improves consistency, efficiency, and speed‑to‑market across 10+ brands.
View Project
Improved Design Efficiency
Multi-brand supported
Reduced Time to Market
Multi-Brand Design System
Designing a scalable system that improves consistency, efficiency, and speed‑to‑market across 10+ brands.
View Project
Improved Design Efficiency
Multi-brand supported
Reduced Time to Market
Multi-Brand Design System
Designing a scalable system that improves consistency, efficiency, and speed‑to‑market across 10+ brands.
View Project
White label child sponsor solution for our partners
Providing a simple, universal, customisable child sponsor platform that other businesses can use on their customer
View Project
User Research
UX/UI Design
User Testing
White label child sponsor solution for our partners
Providing a simple, universal, customisable child sponsor platform that other businesses can use on their customer
View Project
User Research
UX/UI Design
User Testing
White label child sponsor solution for our partners
Providing a simple, universal, customisable child sponsor platform that other businesses can use on their customer
View Project
User Research
UX/UI Design
User Testing
White label child sponsor solution for our partners
Providing a simple, universal, customisable child sponsor platform that other businesses can use on their customer
View Project