Bricks, een designsysteem vanaf nul

Ik begon met turven. Er waren merkrichtlijnen, maar die lieten zoveel ruimte dat iedereen zijn eigen invulling koos. Zevenentwintig varianten van dezelfde primaire button. Drie iconensets naast elkaar, soms op één scherm.

Dat is vooral een onderhoudsprobleem: elke wijziging moet je zevenentwintig keer doorvoeren, en je vergeet er altijd een.

Kleuren, typografie, iconen, ruimtematen, logo’s. Ik legde ze vast als tokens, zodat een waarde één keer bestaat en overal wordt opgehaald in plaats van overgetypt.

Ik hield rekening met wat er al stond. Alles in één keer omgooien was niet haalbaar, en het was ook niet nodig: een token kun je invoeren terwijl de oude waarden nog bestaan.

Met die bouwstenen maakte ik samen met de frontenders de componenten die de beheeromgeving nodig had. In twee maanden stond de bibliotheek in Storybook.

Storybook was belangrijker dan het klinkt. Voor het eerst keken ontwerpers en ontwikkelaars naar hetzelfde ding. Een discussie over hoe een button eruitziet werd een discussie over de component in de bibliotheek.

We brachten de bestaande code en de nieuwe componenten naast elkaar en groepeerden de wijzigingen. Soms technisch, soms op basis van waar iets in beeld staat, meestal allebei.

Elke sprint verving een groep, met een test ervoor. Na een sprint of drie was de hele look-and-feel om, zonder dat er een grote aankondiging aan te pas kwam.

De consistentie was het zichtbare resultaat. Belangrijker is dat elke volgende verandering goedkoper wordt dan de vorige. Dat merk je pas een half jaar later, en dan blijf je het merken.