PRODUCT DESIGNER
PLP Mockup (2).jpg

PLP / SRP Discovery & Filtering Redesign: The Home Depot Canada

PLP / SRP Discovery & Filtering Redesign

DESKTOP + TABLET + MOBILE

 

Modernizing product discovery by rethinking filtering architecture and introducing scalable components that improved engagement and add-to-cart behavior across devices.

 

 

My Role

UX/UI Designer leading interaction and visual design strategy for filtering and sorting experiences from concept through delivery. Influenced the product direction by proposing a top-aligned filtering model with progressive disclosure and a scalable side-drawer framework. Collaborated closely with UX, product, IT, and stakeholders. Presented solutions to cross-functional leadership throughout the project lifecycle.

Overview

Redesigned the Product Listing and Search Results experience to modernize an outdated interface, address usability complaints, and improve product discoverability across desktop, tablet, and mobile. The initiative focused on rethinking filtering architecture, sorting behavior, and visual navigation patterns while establishing scalable components for future growth.

The redesign was developed in parallel with a new product card design and later informed broader navigation improvements across the ecosystem.

 

Problem

  • Legacy left-rail filters were difficult to scan, underutilized, and not optimized for modern browsing behaviors.

  • Users reported frustration with the accessibility and discoverability of filtering options.

  • The experience did not align with evolving industry standards or support future merchandising flexibility.

SCOPE

  • Filter and Sort By navigation overhaul

  • Category and top visual navigation redesign

  • Desktop, tablet, and mobile experiences


 

DESKTOP Solution

  • Transitioned from a left-rail filter model to a top-aligned filtering system using dropdown categories for primary filters.

  • Introduced a “See All Filters” side-drawer panel to expose the full taxonomy without overwhelming the main interface.

  • Established chip component to selected filter states and defined them in the side-drawer panel with the option to “Clear All Filters”, ensuring users can edit selections at all touch points.

  • Designed progressive disclosure patterns to reduce cognitive load while maintaining depth.

  • Ensured AA accessibility compliance across breakpoints, including keyboard navigation and focus states.

  • Addressed IT and performance constraints by balancing product capacity with pagination rather than infinite scroll to maintain page performance.

 
 
 

 
 

MOBILE + TABLET SOLUTION

  • Consolidated stacked categories into an accordion.

  • Updated visual navigation UI and addressed accessibility issues.

  • Optimized mobile with dedicated filter and sort entry points for improved ergonomics and clarity.

  • Redefined the filtering menu for ease of use.

 
 

 

DESIGN SYSTEM CONTRIBUTIONS

Introduced reusable components that expanded beyond PLP/SRP and are now leveraged across the platform:

  • Filter dropdown components

  • Applied filter chips

  • Side-drawer framework

  • Mobile filter and sort controls

Validation & Impact

  • User testing confirmed improved clarity, learnability, and efficiency of the new filtering system.

  • Increased engagement with filtering tools and improved task completion rates.

  • Contributed to higher add-to-cart interactions following launch.

  • Established a scalable foundation for future navigation and discovery improvements, including subsequent header redesign work.


Iteration Opportunities

  • Adding long list search in filter drop downs

  • Adding visual filters in filter drop downs

  • Increase facet engagement on mobile, updating filter and sort buttons and implementing sticky facet

  • Updating pagination styling and interaction