About

Shared Design System

Unified core products under a shared design system, aligning design and engineering to improve consistency and accelerate project delivery.

  • Design once.

    Scale everywhere.

    A modular design system that powers Tim Hortons, Popeyes, and global tools, sharing complex components while preserving brand uniqueness.

  • Role: Product Designer

    Scope: Tim Hortons, Popeyes, and Global Tools

    Partners: Design and Engineering

    Core Users: Design and Engineering

  • Context

    As Tim Hortons, Popeyes, and global tools evolved, teams were rebuilding the same features with inconsistent results. A shared design system was created to unify core products, accelerate delivery, and support rapid brand switching at every level of the interface.

  • The Problem

    Separate Systems.

    No Communication.

    •  

    No single source of truth across design systems

    •  

    Slow process to replicate existing tools across brands

    •  

    High maintenance overhead

  • Constraints That Shaped the System

    •  

    Balance shared structure with brand-level customization

    •  

    Align designers and engineers around consistent standards

    •  

    Enable fast brand switching while reusing components

    •  

    Create a system that scales across tools, teams, and brands

  • What We Built

    Shared Foundations

    •  

    Variables & themes

    •  

    Atoms & molecules of component combinations

    •  

    Core patterns for navigation and complex data

    System Patterns

    •  

    Clear component hierarchy and documentation

    •  

    Simplified theme switching for developers

    •  

    Source vs brand-specific component model

    Reusable Workflows

    •  

    Pre-built user flows and actions

    •  

    Page-level templates

    •  

    Micro-kits of component cells

Decisions That Enabled Scale

Separate Structure from Brand

  •  

Built source components once, layered brand themes on top

  •  

Enabled full brand switching down to nested components in seconds

Design for Speed, Not Perfection

  •  

Delivered design-ready components first, dev-ready where it mattered

  •  

Optimized for iteration, reuse, and momentum over pixel-complete specs

  • Results

    75%

    Faster Delivery

    Accelerated timelines for the first project

    46+

    New Components

    Initial components for design use

    40+

    Dev Ready Pages

    Documented states and behaviors

    10+

    New Patterns Implemented

    Strategies applied across the shared library

  • Why This System Lasted

    Designed for long-term evolution with clear ownership and extensible foundations, enabling the system to grow with new products while maintaining consistency.

About

Shared Design System

Unified core products under a shared design system, aligning design and engineering to improve consistency and accelerate project delivery.

  • Design once. Scale everywhere.

    A modular design system that powers Tim Hortons, Popeyes, and global tools, sharing complex components while preserving brand uniqueness.

  • Role: Product Designer

    Scope: Tim Hortons, Popeyes, and Global Tools

    Partners: Design and Engineering

    Core Users: Design and Engineering

  • Context

    As Tim Hortons, Popeyes, and global tools evolved, teams were rebuilding the same features with inconsistent results. A shared design system was created to unify core products, accelerate delivery, and support rapid brand switching at every level of the interface.

  • The Problem

    Separate Systems.

    No Communication.

    •  

    No single source of truth across design systems

    •  

    Slow process to replicate existing tools across brands

    •  

    High maintenance overhead

  • Constraints That Shaped the System

    •  

    Balance shared structure with brand-level customization

    •  

    Align designers and engineers around consistent standards

    •  

    Enable fast brand switching while reusing components

    •  

    Create a system that scales across tools, teams, and brands

  • What We Built

    Shared Foundations

    •  

    Variables & themes

    •  

    Atoms & molecules of component combinations

    •  

    Core patterns for navigation and complex data

    System Patterns

    •  

    Clear component hierarchy and documentation

    •  

    Simplified theme switching for developers

    •  

    Source vs brand-specific component model

    Reusable Workflows

    •  

    Pre-built user flows and actions

    •  

    Page-level templates

    •  

    Micro-kits of component cells

Decisions That Enabled Scale

Separate Structure from Brand

  •  

Built source components once, layered brand themes on top

  •  

Enabled full brand switching down to nested components in seconds

Design for Speed, Not Perfection

  •  

Delivered design-ready components first, dev-ready where it mattered

  •  

Optimized for iteration, reuse, and momentum over pixel-complete specs

  • Results

    75%

    Faster Delivery

    Accelerated timelines for the first project

    46+

    New Components

    Initial components for design use

    40+

    Dev Ready Pages

    Documented states and behaviors

    10+

    New Patterns Implemented

    Strategies applied across the shared library

  • Why This System Lasted

    Designed for long-term evolution with clear ownership and extensible foundations, enabling the system to grow with new products while maintaining consistency.

About

Shared Design System

Unified core products under a shared design system, aligning design and engineering to improve consistency and accelerate project delivery.

  • Design once. Scale everywhere.

    A modular design system that powers Tim Hortons, Popeyes, and global tools, sharing complex components while preserving brand uniqueness.

  • Role: Product Designer

    Scope: Tim Hortons, Popeyes, and Global Tools

    Partners: Design and Engineering

    Core Users: Design and Engineering

  • Context

    As Tim Hortons, Popeyes, and global tools evolved, teams were rebuilding the same features with inconsistent results. A shared design system was created to unify core products, accelerate delivery, and support rapid brand switching at every level of the interface.

  • The Problem

    Separate Systems. No Communication.

    •  

    No single source of truth across design systems

    •  

    Slow process to replicate existing tools across brands

    •  

    High maintenance overhead

  • Constraints That Shaped the System

    •  

    Balance shared structure with brand-level customization

    •  

    Align designers and engineers around consistent standards

    •  

    Enable fast brand switching while reusing components

    •  

    Create a system that scales across tools, teams, and brands

  • What We Built

    Shared Foundations

    •  

    Variables & themes

    •  

    Atoms & molecules of component combinations

    •  

    Core patterns for navigation and complex data

    System Patterns

    •  

    Clear component hierarchy and documentation

    •  

    Simplified theme switching for developers

    •  

    Source vs brand-specific component model

    Reusable Workflows

    •  

    Pre-built user flows and actions

    •  

    Page-level templates

    •  

    Micro-kits of component cells

Decisions That Enabled Scale

Separate Structure from Brand

  •  

Built source components once, layered brand themes on top

  •  

Enabled full brand switching down to nested components in seconds

Design for Speed, Not Perfection

  •  

Delivered design-ready components first, dev-ready where it mattered

  •  

Optimized for iteration, reuse, and momentum over pixel-complete specs

  • Results

    75%

    Faster Delivery

    Accelerated timelines for the first project

    46+

    New Components

    Initial components for design use

    40+

    Dev Ready Pages

    Documented states and behaviors

    10+

    New Patterns Implemented

    Strategies applied across the shared library

  • Why This System Lasted

    Designed for long-term evolution with clear ownership and extensible foundations, enabling the system to grow with new products while maintaining consistency.