Case Study

Proprietary

Whirlpool

Scaling Harmony Across 50+ Connected Appliances

Info

Role: Design Systems Lead

Platform: Web app

Overview

Whirlpool is a company that specializes in home appliances such as refrigerators, dishwashers, and laundry machines. I joined the team to create a design system. But the challenge? Creating a design system that is suitable for a physical interface.

Problem

?

Tech specs

As a designer, I spend so much of my time looking for design patterns and technical specs to inform me what the best implementations and design could be. Essentially, they need a source of truth.

Challenge

HMW build a design system for...

→ physical products, such as home appliances

→ on digital platforms, such as Figma and Zeroheight?

Design Process

The Massive HMI Audit

Before building the future, I had to catalog the present. I kicked off the project by leading a massive UI/UX audit of over 50 distinct HMI boards across multiple appliance lines.

  • The Goal: Identify common interaction patterns, recurring UI elements, font scaling behaviors, and button states.

  • The Insight: We weren't just designing for a responsive web browser; we were designing for custom embedded hardware displays that required pixel-perfect clarity, high accessibility standards, and strict system performance guardrails.

System Architecture Across Brands

A great enterprise design system must be robust enough to maintain a shared DNA, yet flexible enough to express distinct brand identities. I structured the tokens and component libraries to seamlessly scale across:

  • Whirlpool Core Products: Prioritizing high usability, clear task completion (e.g., setting a washer cycle), and intuitive hierarchy.

  • KitchenAid Premium Lines: Infusing the brand’s distinct, high-end culinary aesthetic without rebuilding the underlying functional mechanics or interaction architecture.

Creating the Source of Truth

A design system only succeeds if teams actually adopt it. I took ownership of the end-to-end documentation, transforming the audit insights into an interactive component library and style guide. This gave cross-functional teams a single, unambiguous source of truth for everything from touch-target sizes to motion curves for screen transitions.

Solution

To build a true, scalable system, we had to account for Human-Machine Interface (HMI) boards—interfaces that face strict hardware constraints, varied screen resolutions, and unique environmental lighting needs (e.g., a bright kitchen vs. a dark laundry room).

Outcomes

Unified the Portfolio: Successfully brought visual and behavioral harmony to over 50+ appliance interfaces, ensuring a consistent user experience whether a consumer is opening a refrigerator or starting a laundry cycle.

Reduced Design & Dev Debt: By defining and documenting standard hardware-compatible UI patterns, we drastically cut down on duplicate design cycles and engineering alignment meetings.

Future-Proofed the Pipeline: Left the global product design team with a highly scalable, living design system framework that dramatically accelerates the time-to-market for future connected appliance launches.