Design system overhaul

Improved accessibility and governance of a legacy design system, embedding WCAG AA compliance and standardising components.

Quick overview

Role: Experience Design Manager
Company: John Lewis
Impact:
- WCAG AA compliance embedded across the system.
- Accessibility became a core principle.
- Reduced development time through trusted, reusable components.
- Design system adopted and trusted across the wider organisation.

Situation

Inherited an outdated design system with poor documentation, inconsistent standards, and accessibility gaps, which undermined design consistency and slowed development across multiple digital products.

Task

Bring the legacy system up to WCAG AA accessibility standards.
Improve documentation, contribution processes, and governance.
Ensure adoption across product teams without disrupting delivery.

What I did

Conducted stakeholder interviews and workshops to understand pain points.
Audited system components and identified accessibility gaps.
Synthesised findings into a clear plan for system improvement.
Developed and rolled out a new contribution model and documentation in Zeroheight.
Collaborated with engineers to validate and implement accessibility improvements.
Guided product teams on component usage and governance compliance.
Iterated designs and documentation based on ongoing team feedback.

Affinty maps of feedback captured during stakeholder interviews.

Affinity maps of stakeholder feedback

Results from tree testing different IA structures

Lab testing of the site pre launch of the new design system website.

Lab testing of the site pre launch of the new design system site.

Impact

WCAG AA compliance embedded across the system.
Accessibility became a core principle.
Reduced development time through trusted, reusable components.
Design system adopted and trusted across the wider organisation.

Who I collaborated with

Product teams across multiple disciplines.
Engineers and accessibility champions.
Design leads and governance stakeholders.

Reflections

Learned that documentation and governance are as critical as component design for adoption.
Found that early engineering alignment avoids rework and ensures accessibility standards are met.
Recognised that embedding accessibility as a principle improves adoption across teams.

Example of a design system site page and an overview of the principles, guidance and best practice included in the MVP.