The Problem

Walk through different Compare the Market product pages and you'd think you were browsing different companies. Car insurance looked nothing like home insurance. The mobile app had its own visual language. Energy comparison felt like a separate brand entirely.

Since 2018, the design system had been a "side hustle" — squeezed between feature deliveries and treated as nice-to-have. Product teams ignored shared components in favor of custom solutions. Design debt accumulated with every sprint.

The result: inconsistent customer experiences, duplicated design work, and a fragmented brand that was costing the business in both efficiency and trust.

What I Did

I led the transformation of Suricata from an abandoned component library into strategic design infrastructure serving the entire organization.

Rather than treating this as a component library project, I approached it as organizational change:

• Conducted a comprehensive design debt audit across all product verticals

• Designed a four-library architecture separating global foundations from platform-specific implementations

• Built accessibility compliance (WCAG 2.1 AA) into every component from day one

• Created governance processes for contribution, feedback, and evolution

• Ran designer onboarding programs and established community advocacy

The technical architecture mattered, but the cultural shift mattered more.

The Four-Library Architecture

I separated concerns into four distinct Figma libraries, each serving a specific purpose:

Global (DNA): Brand identity, colors, typography, animation principles — enabled by default for all designers

Web: Browser-optimized components, responsive behaviors, web-specific accessibility

iOS: Native iOS patterns, Human Interface Guidelines compliance

Android: Material Design adaptation, Android-specific interactions

This separation meant platform teams could move independently while maintaining brand consistency. Updates to the DNA library cascaded everywhere; platform changes stayed contained.

Making Adoption Happen

A design system nobody uses is just documentation. I focused heavily on change management:

• Created a Jira-based backlog for feedback, requests, improvements, and bugs

• Established regular ceremonies: engineering collaboration sessions, design reviews, cross-team updates

• Built Figma analytics integration to track usage, detachment, and adoption

• Ran office hours for questions and support

The goal wasn't just building components — it was building the habit of using them.

Results

Beyond metrics, the system enabled faster feature delivery, reduced design-to-development handoff friction, and created a foundation for rapid product expansion.

What I Learned

Design systems aren't about components — they're about organizational capability. The most successful systems change how teams collaborate and think about consistency. Governance is as important as the components themselves. And platform-specific optimization actually strengthens unity rather than fragmenting it.

My Role

✓ Design system strategy and architecture

✓ Component design and documentation

✓ Governance process creation

✓ Designer training and community building

✓ Cross-functional coordination (design, engineering, brand)