Product Category Page Redesign
Role: Lead Designer
Results
Increased user engagement
Filtering 1.45% to 3%
Product cards 13.5% to 33%
Scroll depth 32% to 79% of users reached 95% scroll depth
Compare .09% to .23%
Net Promoter Score rating increased from 4 to 7
Net Promoter Score for Content Dissatisfaction was down 100%
How did we achieve this?
Customers often complained about the poor mobile experience — and the data backed them up. By reviewing surveys, heat maps, and engagement metrics, we spotted clear opportunities to fix the biggest pain points.
Key insights
Oversized spacing and UI elements pushed key content below the fold, increasing scroll depth
Users weren’t sure what was clickable
Content was difficult to scan quickly
Filters were hard to access while browsing products
Using these findings, I kicked off the design process with multiple working sessions involving both internal and external stakeholders. Combining analytics, stakeholder feedback, and user testing helped us uncover what really mattered to customers — and revealed that some of the details we thought were important were actually causing confusion and decision fatigue.
One key takeaway: less is more.
We assumed customers wanted all the details up front, but what they really needed was a simple way to see and compare their options.

So, we moved most of the extra information onto the product pages, where shoppers are ready to dive deeper.
What we did to solve the problem
Challenge: Product filtering
Filtering was frustrating. Customers had to scroll all the way back up to access the “Filter” button, and once inside the menu, they had to do all their filtering there. This made it hard to quickly select common or popular options, slowing people down and making browsing feel clunky.
Solution:
We added a sticky filter menu directly on the page, so customers could refine their search without losing their place. From there, they could either open the full filter menu or jump straight to popular categories. This small change made filtering faster, easier, and more intuitive.
Product filtering usage jumped from 1.45% to 3%, and heat maps showed more customers narrowing down their choices with the new design
Challenge: Product cards
Product cards took up the entire screen, making it hard for shoppers to compare their options. With so many similar cards, customers had to scroll endlessly, which often led to fatigue and made it harder to find what they wanted.
Solution:
User testing confirmed our cards had too much information, overwhelming shoppers. We removed non-essential details and reworked the content hierarchy, allowing the most important information to stand out. This also let us fit 2.5 product cards on screen at once for mobile users.
Product card engagement jumped from 13.5% to 33%
Scroll depth improved dramatically — 79% of shoppers reached the bottom of the grid wall, up from 32%
Challenge: Compare tool
The original compare tool created friction by requiring shoppers to expand and collapse the tray just to add or remove items. It also relied on carousels for navigation, which made the experience feel clunky and slowed people down.
Solution:
We stripped the tray down to the essentials and made it persistent. Shoppers could now browse, add, and remove items simply by toggling compare buttons — no extra steps. The updated tray took up just 20% of the screen instead of 50%, giving more space for product content.
On the compare page, we replaced the carousel with simple side scrolling, making it easier to view and compare all four columns on mobile without extra navigation steps.
Engagement with the compare tool increased from 0.09% to 0.23%, showing that a leaner, simpler design encouraged more use.
This project was more than a few quick fixes — it was about rethinking how the page worked on mobile so shoppers could move faster and make decisions with less effort. These highlights show part of the journey, but there’s plenty more detail behind the design. I’m always happy to walk through the full process or answer questions.
What I learned
I’ve seen firsthand how too much information can overwhelm customers, and this project reinforced that lesson. The challenge was getting stakeholders aligned on prioritizing clarity — helping shoppers quickly understand their options so they could move confidently through the buying journey.
More work