Four brands, four themes, one library

Four brands under one roof, each with its own market position, its own agencies and its own accumulated front-end. They sell related products to overlapping customers through similar journeys — and each one had built its own version of the same twenty components.

The cost of that is not the first build. It is every change afterwards. A correction to a form validation message, an accessibility fix, a new payment step: four briefs, four estimates, four QA cycles, four slightly different results. Over a couple of years the brands drift far enough apart that a shared fix stops being possible at all.

We separated what a component does from what a component looks like, and made only the second one brand-specific.

Behaviour, states, focus order, error handling, keyboard support and accessible naming belong to the contract and are identical in all four brands. Colour, typography, radius, density, elevation and motion belong to the theme layer and are data. Bauknecht's restraint and Indesit's directness are real differences worth protecting — they are also differences that live entirely in values, not in code paths.

The test we held ourselves to: adding a fifth brand should be a theme file and a review, not a project.

A shared component contract. One definition per component covering every state a real interface needs — default, hover, focus-visible, active, disabled, loading, error, empty — rather than the happy path a mockup usually shows.

Four brand libraries. Each brand's library is the contract plus its theme, documented so a designer in one brand can read another brand's file and recognise the structure immediately.

Interface systems for web. Page-level patterns — product detail, support, registration, service booking — assembled from the same components, so a layout decision made once is available to all four.

Documentation written for two audiences. Designers get anatomy, spacing and when-not-to-use. Developers get the contract, the token names and the states they are required to implement. One source, two readings.

Four brands run on libraries built from one contract. The structural result is the one that matters: a component change is authored once and reviewed once, and brand difference no longer costs a rebuild.

Commercial performance data for these brands belongs to the client and is not ours to publish. We will walk through what we are permitted to share on a call.