Concept
British Airways email, built as a system.
Three travel-lifecycle email journeys, compiled from one real component library and reskinned to BA livery. Open each email live, read its source, and see it render across the inbox.
One component library, one token source. The site renders live CSS; the emails compile the same tokens to bulletproof, inline HTML. Change one file and both re-skin.
①Lifecycle series
The Approach
Post-booking to departure. Five sends off one adaptive template, played as a scrubbable inbox timeline.
Open the journey →
②Disruption and servicing
Weather
A cancelled flight, rebooked. The hardest email in aviation, built calm, with an inline rebook where it works.
Open the journey →
③Executive Club
The Runway
Loyalty, personalised. One template across four member segments, re-rendered from a switch. Gold used once.
Open the journey →
I didn’t mock these up.
They are built from over 150 bulletproof components I render-proofed before this concept existed. The work shows three ways, and render-truth and interaction-truth stay separate, honest claims.
Inbox timeline player
Scrub a journey stage by stage inside an email-client frame. Each email opens live, in light or dark.
Play The Approach →Cross-client render matrix
The same email across Apple Mail, Gmail and Outlook, light and dark, from real captures. Honest per-client labels.
See the matrix →View render, view source
A toggle on every email shows the real table-based, inline HTML, plus a matrix of which interactions survive per client.
Read the source →The library and the machine
Browse the component catalogue, watch the agent pipeline assemble an email through the QA gate, and see the platform.
Open the Library →This is the job, not adjacent to it: own and evolve a CRM email component library. The system map traces each layer to BA’s real design system and the role’s own words.