WAYFAIR / HOMEBASE / 2021–2024
Evolving Wayfair’s shared components, iconography and foundations across web, iOS and Android.
OVERVIEW
Homebase is Wayfair’s shared design system. It brings reusable components, design tokens and guidance together so teams can build coherent experiences across brands and platforms.
As a Senior Product Designer on the Design Systems team, I worked on library architecture, mentored a junior designer through an icon migration, contributed to semantic color tokens, and audited accessibility and Figma–Storybook alignment. I also independently delivered an adopted Date Range Picker.
8 themes
Brand expression at scale
3 platforms
Web · iOS · Android
My role
Senior Product Designer
01 / COMPONENT LIBRARY ARCHITECTURE
A simpler library, with fewer variants.
When Figma introduced component properties, we rebuilt the component library to make use of them. I worked with the team to simplify component structure and reduce redundant variants across the asset library.
40%+
reduction in variant count
My contribution · Library rebuild with the team
A more manageable component library, using Figma properties to reduce the number of variants teams needed to navigate and maintain.
Web components
Primary, secondary and destructive actions, with interaction states and two sizes.
App components
Shared action patterns with platform-specific sizing and behavior.
02 / ICONOGRAPHY & MENTORSHIP
Migrating the library. Growing another designer.
I mentored a junior designer as we migrated the icon library from Adobe Illustrator into Figma. Together, we supported three stroke weights and created guidelines and playbooks for consistent icon use.
Adobe Illustrator → Figma
Shared library migration · Guidelines & playbooks
3 stroke weights
Supported in the migrated library
My contribution · Mentorship and hands-on migration, completed with the junior designer.
03 / SEMANTIC COLOR TOKENS
Helping enable color consistency across brands.
I contributed to the rollout of semantic color tokens, helping implement six tokens across eight product lines. My role focused on implementation support within the broader team initiative.
6 tokens
Contributed to implementation
8 product lines
Supported cross-brand color consistency
I also partnered on spacing, motion and geo-token discovery to support the system’s ongoing evolution.
04 / ACCESSIBILITY & IMPLEMENTATION QUALITY
Making gaps visible—and actionable.
I conducted a comprehensive accessibility audit, reviewed alignment between Figma and Storybook, and submitted fix tickets. My audit work covered 12+ app components, translating findings into concrete follow-up work.
Audit
Review component accessibility against WCAG standards.
Align
Compare Figma specifications with Storybook implementations.
Document
Submit fix tickets so issues can be tracked and addressed.
05 / INDEPENDENT COMPONENT OWNERSHIP
Making date ranges visible.
I independently designed Homebase’s Date Range Picker in response to needs from the Internal Tools and Delivery teams.
The gap
Users manually entered start and end dates in separate fields, without a check linking the two. An end date before the start date could cause a system error and require manual validation.
The design decision
I brought both dates into one visual range-selection component. The choice shifted the interaction from two disconnected entries to a range users could see together, making the relationship explicit.
My ownership
I owned the work from requirements through component design, Storybook and documentation. The component was adopted, turning a team need into a reusable part of Homebase.
06 / COMPONENT DELIVERY & DOCUMENTATION
Delivering components teams can build with.
Beyond the initiatives above, I delivered 8+ new components and refined 5+ existing components. Guidelines and documented component anatomy supported designers and engineers using shared patterns across web, iOS and Android.
Flexible pricing
A reusable pricing component supports different combinations of labels and price values.
Documented anatomy
A listing card is broken into reusable building blocks, making composition and dependencies visible.