# John Harrison

**Design Systems Lead**

Leighton Buzzard, UK (London / remote) · john@whatwhat.design · whatwhat.design · linkedin.com/in/whatwhatjohn

## Summary

I’ve spent 15+ years designing digital products, with the last six focused on design systems. My work spans financial services and consumer products. I audit what’s there, simplify it, and hand it over so teams can keep it going without me. I work with design tokens, Figma library architecture and Figma-to-code pipelines, with WCAG 2.2 AA built in from the start. I also care about the less visible work that makes a system stick: workshops, documentation, decisions and getting people aligned. More recently, that’s extended to AI assistants, with one source of truth instead of duplicated values that drift.

## Experience

_Operating as an independent design-systems lead through whatwhatdesign ltd since 2019. Selected engagements:_

### UBS (via Else) — Lead Interaction Designer

_Sep 2025 – now · London / Remote_

- Leading template definition for a UBS dashboard product, scoping four responsive templates (dashboard, stacks, multi-column, horizontal-scroll) covering the full range of page types.
- Authoring the template specification (page regions, spacing scale, responsive breakpoints, panel/overlay behaviour, design tokens) as the single reference shared by design and engineering.
- Building accessibility into the spec from the outset: heading hierarchy, focus management, keyboard rules for panels and menus, and target sizing.
- Restructuring the system’s guidance into a three-layer model (tokens, components, patterns), with GitHub Copilot as a design partner and a clear split between generated facts and hand-written rules, so engineers and AI assistants work from one shared contract rather than copying values that go stale. Design direction and the quality bar stay with me; Copilot speeds up delivery.

### Lantern — Design System Specialist

_May 2025 – Sep 2025 · London (Hybrid)_

- Led the evolution of Lantern’s design system from Lux 3.0 to 4.0: audit, token architecture, component refinement, documentation and team handover.
- Introduced a two-tier token architecture (primitive + semantic) and built a Figma to Tailwind to Zeroheight pipeline as a single source of truth across design and code.
- Created a six-token directional spacing taxonomy, since reused across projects; rewrote Zeroheight docs to be simple, human and actionable.
- Originated whatwhatdesign’s three-month design-system audit framework (Understand & Diagnose, Simplify & Streamline, Empower & Embed).
- Built AI into the workflow from the start, across the audit, the token work and the documentation, integrated rather than bolted on.

### Bupa Global & Greystar (via Digitas UK) — Lead Digital Designer

_Jul 2024 – May 2025 · London (Hybrid)_

- Led design-system and website work for Bupa Global (international health insurance) and Greystar (global real estate) back to back.
- For Bupa Global, designed a brand-namespaced colour-token layer so the brand could sit on shared system primitives without affecting other Bupa entities.
- For Greystar, delivered feature and content design (including a fee calculator) and refined availability-state language alongside the visual system.

### T. Rowe Price (via Else) — Lead / Senior Interaction Designer

_Jan 2020 – Jul 2024 · London / Remote_

- Provided design continuity across four years and three contracts on T. Rowe Price’s enterprise design system, the deepest engagement in the portfolio.
- As Lead (2022-24), owned design tokens, usability improvements and component specs, plus stakeholder management, delivery and mentoring the designers contributing to the system.
- Established the foundations in three-week sprints with weekly cross-Atlantic (US/UK) workshops, then scaled scope, documentation and adoption.
- Ran the contribution model: an incubator route for teams to build components that graduated into the core, a fixed intake and support cadence, and major/minor/patch releases with a public changelog.

### EON (via Digitas UK) — Senior Digital Designer

_Aug 2020 – Oct 2020 · London_

- Design system for the EON mobile app, plus guidelines and the billing / support sections.

### The Walt Disney Company — Senior Designer

_Dec 2019 – Jan 2020 · London_

- Animation, UI and branding for brand partnerships.

### John Brown Media — Senior Interaction Designer

_Oct 2010 – Aug 2019 · London_

- Led the design of a financial-education website for RBS & NatWest; designed the Waitrose Food app for iOS and Android.
- Lead designer for Manchester City FC’s ‘City Kicks’ site (including the merchandising logo); work for Chelsea FC, Virgin, Monsoon and Accessorize.

### Nickelodeon UK — Digital Designer

_Mar 2007 – Feb 2009 · London_

- Sole digital designer at Nick UK: built the dedicated SpongeBob UK site (800,000+ page views, one of the most-visited parts of Nick.co.uk) and redesigned Nick Jr, growing it to ~10,000 unique users a day.

## Skills

**Design systems** — audit & strategy · design tokens (primitive + semantic) · component architecture · Figma library architecture · Figma-to-code pipelines · governance & contribution models · documentation · AI-legible documentation · handover
**Accessibility** — WCAG 2.2 AA · inclusive design · accessible-by-default components
**Craft** — interaction design · UI design · prototyping · motion (Lottie, Rive, After Effects) · iconography · typography · brand
**Facilitation** — workshops · mentoring · design reviews · stakeholder playbacks · knowledge transfer · team enablement
**Tools** — Figma · Figma Dev Mode · Zeroheight · Tailwind · Storybook · Supernova · Webflow · Framer · Claude · GitHub Copilot · VS Code · Jira

## Education

- **MA, Sequential Design** — University of Brighton (2006)
- **BA (First Class), Visual Communication** — Birmingham City University (2003)

## Publication

- *Idle Idol: The Japanese Mascot* — Mark Batty Publisher, 2010 (author)