Endor Labs
Design System Transformation
Turning a fragmented design library into a governed platform
TL;DR
When I joined Endor Labs, the design system existed in files but not in practice. Designers built components inside features, engineers recreated them with inconsistent behavior, and Figma and Storybook drifted apart. I led a platform-level initiative to introduce governance, lifecycle, behavioral specifications, and cross-functional stewardship. I secured roadmap space and ongoing engineering resourcing by framing the Design System as platform infrastructure for velocity, platform consistency, and AI readiness, shifting the organization from feature-first to system-first.
What I Walked Into
The design system looked complete from afar, but it wasn’t actually governing how the product was built. A small Figma library and a Storybook repository existed, but they had diverged over time and no longer represented each other
Designers were making localized decisions inside individual features, and engineering filled in missing interaction logic inconsistently. The result was visual alignment without behavioral consistency, which meant the system couldn’t be trusted and therefore wasn’t used.
In practice, similar UI patterns (filters, search bars, data views) appeared consistent on the surface, but differed subtly in spacing, states, and interaction behavior across the product.
The Real Issue
I realized the core problem through design reviews and implementation handoffs: the same component would be interpreted three different ways because there was no definition of what “correct” meant beyond a static mock. What was missing wasn’t more components; it was a governing framework. There was no lifecycle, no adoption criteria, and no behavioral model defining how components should respond in real-world scenarios. Without rules, everything became a one-off solution. The issue wasn’t design drift; it was system absence.
My Approach
I didn’t start by adding components but by changing the foundation. I started by reframing the design system as platform infrastructure. Instead of adding UI components, I designed the operating model around them. I authored the Product Requirement Documentation (PRD), defined scope and phases, established what “done” means (visual + state + interaction + parity), and created a lifecycle for evolving patterns from feature-specific to platform-owned. The priority was not expanding the library, but making it trustworthy, so teams would choose it by default.
Introducing Tokens
A key turning point was introducing design tokens as the shared abstraction layer between UX and frontend engineering.
UX defined semantic tokens in Figma (color, typography, spacing, states)
Frontend mapped those tokens into Storybook and Material Design
Tokens became the contract that aligned design intent with implementation
This reduced subjective interpretation, eliminated ad-hoc styling decisions, and allowed the system to scale cleanly across tools and teams—without replacing the existing frontend stack.
Getting It Prioritized
Getting this on the roadmap required more than design advocacy. It required shifting how both Product and Engineering understood its value.
For Product, I framed the design system as a platform dependency: without governed components, every new feature was slower to ship, harder to maintain, and more expensive to extend.
For Engineering, I reframed it as an efficiency and quality problem: developers were recreating UI from scratch, fixing inconsistencies later, and making behavior decisions that should have already been defined at the system layer.
Product understood the velocity and scalability impact; Engineering saw the wasted effort and rework disappearing once components became canonical.
With both functions aligned, PM buying into the strategic value and Engineering buying into the operational efficiency, the initiative secured roadmap placement and dedicated frontend resourcing.
Rolling It Out
I led a phased rollout focused on adoption through clarity.
Governance came first: clear criteria for what belongs in the system and how changes are introduced. Behavior-first specifications ensured engineers didn’t have to guess how components should react across states. Parity rules established a single source of truth across Figma, Confluence, and Storybook.
We intentionally started with an MVP (buttons) to prove the model before scaling. A weekly Design System sync established shared stewardship across UX and Engineering.
The result was cultural as much as technical: reuse became easier than reinvention, which is why adoption accelerated organically.
The Result
Fragmented → Governed
Before (Fragmented)
The components were visually similar but behaviorally incompatible. Teams solved the same problem in slightly different ways, and the Design System served more as inspiration than infrastructure.
After (Governed)
The system became authoritative: the place where rules lived, not just screens. Engineers no longer had to rebuild UI because the behavior was already defined. Designers no longer had to guess what belonged in the platform. The design system began to govern product surfaces rather than trail behind them.
“We moved from designing screens to designing the system that all screens are built from.”
Impact
The effect was visible not only in UI cohesion, but in delivery speed and platform maturity. Teams shipped faster because they were no longer creating new foundations with each feature. Engineering had fewer inconsistencies to fix downstream, and the system enabled agentic/AI surfaces to operate consistently across contexts. The Design System became a multiplier by reducing duplication, increasing reuse, and improving platform uniformity.
Reduced duplicated patterns down to governed components
New UI is now built using system primitives by default
Faster implementation due to reuse
Adopted by major feature teams/platform areas
Beyond UI, the work:
Standardized decision-making across teams
Increased engineering efficiency by reducing rework
Established a sustainable operating model for system evolution
Enabled consistent agentic / AI-assisted surfaces across contexts
My Role
I led this initiative end-to-end: diagnosing the systemic root cause, reframing the Design System as infrastructure, authoring the PRD and lifecycle model, securing roadmap prioritization, aligning both Product and Engineering, establishing governance and parity, and securing ongoing front-end resourcing, so the platform could evolve sustainably. The outcome was not just a better design system; it was a better operating model for how we build products.