Unicorn Design System
Completing WP Engine's design system with essential components — tables, modals, cards, and date/time — for global team productivity.
Overview
When joining WP Engine, the customer portal had significant inconsistency issues. While the Unicorn Design System existed, it lacked critical components teams desperately needed — designers were creating custom solutions misaligned with the system.
The Challenge
- No Table Component — Designers were terribly frustrated, needing standardized tables
- Rogue Patterns — Teams created custom solutions misaligned with the system
- Inconsistent Experience — Different product teams used different patterns across the portal
- Design Inefficiency — Designers recreated solutions instead of reusing components
Components Delivered
Tables
Applied learnings from Dell’s table component work. Column-based components offer greater flexibility than rows, and accessibility pitfalls with tooltips were avoided using proven patterns.
Modals
Worked closely with senior designers focusing on clarity, hierarchy, and accessibility for user comprehension.
Cards
Designed for responsiveness, visual hierarchy, and content flexibility. Added a “slot” component for customization — highly appreciated by the design team.
Date & Time
Conducted a full portal audit to understand all use cases. Researched formatting variations across regions and cultures for global readiness.
Results
- Increased design velocity and reduced inconsistency across the portal
- Standardized patterns replaced rogue implementations
- Faster development with reusable components
- Global-ready components for international users
