E-commerce UX Design for a Billion-Dollar Platform
When you’re processing $1M+ per day, every design decision matters. Minor inconsistencies ripple into real losses. High stakes require airtight systems.
At The Home Depot of Canada, we led the creation of a robust design system built to support millions of users, thousands of promos, and a retail infrastructure full of edge cases. This wasn’t a UI refresh – it was a foundational redesign that brought cohesion, speed, and scale to a complex digital ecosystem.
The Mission
From Chaos to Cohesion
Home Depot’s digital platform was growing fast but lacked a unified design system. That meant duplicate work, misaligned UX, and slower deployment cycles.
We built a flexible, scalable foundation to support:
- over 100,000 of SKUs
- Cross-functional teams and vendor collaboration
- Continuous A/B testing
- Seasonal campaigns and shifting UX
- Daily revenue goals with zero margin for error
What we delivered wasn’t just a design system. It was an operational framework for digital retail at scale.
Our Playbook
System Design at Speed
We built a design system that worked across disciplines, tools, and timelines:
- Created a central design library in Sketch, engineered for seamless React integration
- Developed atomic UI components and mirrored them in Storybook using React components for dev alignment
- Defined and documented reusable patterns for product pages, checkout, navigation, and promotions
- Collaborated on high-stakes UX flows with product and engineering
- Co-led A/B testing strategy with UX Research and Data teams
- Built seasonal campaign frameworks for rapid rollout
- Mentored designers and connected design, dev, and leadership
This was more than tool-building. It was process reengineering.
The Rub
Clarity Under Pressure
Designing for one of North America’s largest e-commerce sites meant solving for:
- Volume: SKUs in the tens of thousands, updated in real time
- Team entropy: Dozens of internal and external teams
- Testing velocity: Fast-turn A/B tests with measurable outcomes
- High-density UI: Product pages full of specs, promos, and CTAs
- Tool mismatch: Bridging Sketch and React with precision handoff
We didn’t just clean up the UI. We built a system that could survive real-world complexity.
Show & Tell
What We Built
- Component Library: Tokenized, responsive, flexible
- Page Templates: Designed for product, checkout, and marketing
- A/B Variants: Modular elements ready for rapid testing
- Visual QA: Systems for visual consistency and build confidence
This wasn’t a static guide. It was a living system.
Impact
Faster Teams, Better UX, Real Results
- 50% faster design-to-dev handoff
- System adopted across all relevant teams
- Increased visual and functional consistency
- Seasonal launch timelines halved
- Conversion rates lifted after checkout redesign
- Established governance for long-term scalability
This system didn’t just save time. It made speed repeatable.
The VLAH Factor
Strategy Over Sparkle
This wasn’t about flashy visuals. It was about clarity, repeatability, and operational UX.
We reduced noise, eliminated bottlenecks, and gave teams the tools to move faster without sacrificing quality. At VLAH, we build design systems that hold up under pressure and scale with purpose.
Thinking Big?
Let’s talk about what smart, scalable design can do for your business.