JLR Design System
A scalable component library and design framework built to standardise JLR’s digital ecosystem across two global brands.
Brand:
Audi
Project:
Audi Match tool
My role:
UI/UX Design Director
Team:
BBH & IBM
I led the design of the Jaguar and Land Rover product design systems, creating a unified digital foundation that ensures brand consistency and a premium experience across every touchpoint. Built around six core principles, the system includes everything from refined UI elements to a complete component library, supported by shared libraries and a living style guide used by the full design team.
A key part of the process involved a full interface inventory across both brands. Jaguar’s platform was mid-rebuild, while Land Rover’s site contained numerous legacy inconsistencies. At the same time, JLR’s commitment to meeting WCAG 2.1 Level A required redesigning several components as part of the audit. .
The result was a clear, categorised set of components such as navigation, forms, buttons, tabs and lists. This informed 14 focused design briefs, which together became the foundation of JLR’s first DX Design System.
Sketch ‘living’ Pattern Library
Once the audits and design principles were complete, we created a living pattern library to form the backbone of both design systems. Built in Sketch, the library included reusable UI elements such as navigation, icons, buttons, tabs, headings and forms. Designing elements at this level encouraged reusability and made it easier to maintain consistency across both brands.
We also defined all interactive states, including normal, hover, focus and selected, to ensure these rules were applied consistently as new components were created.
The Jaguar and Land Rover pattern libraries became essential tools for design and collaboration, and they are still widely used across the teams today.
