BAT

Design System

2024

BAT Design System: Unifying Global Brands Through Scalable Design

British American Tobacco (BAT) faced significant challenges with design inconsistency across its diverse portfolio of global brands, including Vuse, Velo, and Glo. Operating in numerous countries and markets, the lack of a unified design language led to fragmented user experiences, inefficient design workflows, and pervasive accessibility issues. The imperative was to establish a robust, scalable design system that could harmonise these brands globally while streamlining design and development processes.

As a Senior Lead Product Designer, I initially led the independent development of design systems for Velo, Vuse, and Glo in 2021. More recently, I collaborated with the team to evolve this into a sophisticated, tokenised design system within Figma. This strategic shift enables designers to effortlessly select brand-specific styles and components, ensuring unparalleled consistency and accelerating content creation across all brands. The system significantly eases handover to developers, provides a comprehensive UI component library (e.g., CTAs, hero banners), and fundamentally addresses accessibility concerns, fostering efficiency and design excellence across BAT's digital ecosystem.

75%

75%

Reduction of design inconsistencies

40%

40%

Improvement development handover efficiency

100%

100%

Achieved WCAG 2.1 AA compliance