Aurora Design System

General Motors had 4 distinct automotive brands—Chevrolet, Buick, GMC, and Cadillac—each with separate design and development teams building their own digital experiences. This fragmentation created:

• Duplicated effort across teams building similar components
• Inconsistent user experiences across GM's digital ecosystem
• No centralized accessibility strategy or component compliance
• Slow release velocity due to repeated work
• Knowledge silos preventing cross-team collaboration

The goal was ambitious: create a unified design system that could serve all 4 brands while respecting their unique brand identities, embedding accessibility from the ground up, and dramatically increasing development velocity.

I led the design and implementation of Aurora—GM's first cross-brand design system—serving as the single source of truth for React components across web and native platforms.

Cross-Brand Component Architecture

Built a sophisticated theming system using design tokens that allowed 60% of components to be shared across all 4 brands, while the remaining 40% could be customized per-brand through token overrides. This meant teams could:

• Import core Aurora components that worked out-of-the-box
• Apply brand-specific themes via token swaps (colors, typography, spacing)
• Extend components only when brand-specific behavior was needed

Token Pipeline Automation

Designed and built automated token workflows that synced design tokens from Figma Variables through Style Dictionary into React and React Native codebases. This removed manual handoff steps and ensured design-code consistency across all 4 brand teams.

WCAG 2.1 AA Compliance

Embedded accessibility into every component from day one. All Aurora components shipped with:

• Proper ARIA patterns and semantic HTML
• Keyboard navigation and focus management
• Screen reader testing with NVDA and JAWS
• Color contrast validation (4.5:1 minimum for text)
• Automated accessibility testing in CI/CD pipeline

Storybook-Driven Development

Built comprehensive Storybook documentation for every component, showcasing all variants, states, and accessibility features. This became the central hub for designers, developers, and QA to reference Aurora's capabilities.

Multi-Platform Library Strategy

Unified React and React Native component library strategy that increased release velocity by 30%. Components were architected to share core logic while platform-specific rendering was handled through adapters.

Token Governance Rollout

Opened Rosen Studio and established naming conventions, modes, and approval rules to keep tokens consistent at scale. Implemented semantic token structure (primitive → semantic → component tokens) that gave teams flexibility while maintaining brand consistency.

Team Enablement

Trained and onboarded 50+ engineers and designers on Aurora adoption, reducing onboarding time by approximately 40%. Created workshops, documentation, and office hours to ensure smooth adoption across all brand teams.

Aurora transformed how GM builds digital experiences:

• 60% component reuse across Chevrolet, Buick, GMC, and Cadillac—eliminating duplicated work and accelerating feature delivery
• 30% faster release velocity as teams stopped rebuilding components and started composing from Aurora
• WCAG 2.1 AA compliance embedded into design-to-code workflows, expanding user reach by making all digital experiences accessible
• 40% reduction in onboarding time for new engineers and designers joining GM's digital teams
• Unified design-code handoff through automated token pipelines, removing manual translation steps

Aurora established the foundation for GM's design system practice and set the standard for cross-brand component architecture, token governance, and accessibility-first development.