Atomic design systems
Atomic design is een veelgebruikte manier om over ontwerp na te denken, die we bij Synetic in onze workflow hebben opgenomen. Het is een systematische benadering – gebaseerd op de scheikunde –, waarin je 5 niveaus onderscheidt:
atomen
moleculen
organismen
templates
pagina’s
Klinkt ingewikkeld, maar dat is het niet: elk niveau is een samenstelling van elementen uit de laag eronder. Als je atomen – denk aan HTML-tags, labels en knoppen – combineert, krijg je moleculen. Zet bijvoorbeeld een zoekknop en invulformulier bij elkaar, en je krijgt een zoekfunctie-molecuul. Moleculen vormen samen organismen, organismen maken templates en templates worden pagina’s. Zo werk je stukje voor stukje, van klein naar groot, en van abstract naar concreet naar een duidelijk beeld van hoe jouw producten eruit komen te zien. Met een atomic design system kun je eindeloos combineren, intuïtief werken en bovenal: niemand hoeft zich zorgen te maken over de uniformiteit van je product of brand.
Onze ervaring met design systems
Bij Synetic werken we er maar wat graag mee. Zo konden we de nieuwe website van de KRO-NCRV flexibel en toekomstbestendig ontwikkelen. En doordat ze er nu een design system gebruiken, kan de redactie heel eenvoudig zelf componenten toevoegen. Denk aan webpagina’s voor nieuwe tv-programma’s die naadloos aansluiten bij de rest van de website. Ook voor FrieslandCampina ontwikkelden we een toolbox waarmee ze voor hun verschillende merken – zoals Friesche Vlag, Mona en Vifit – snel en eenvoudig pagina’s kunnen bouwen en aanpassen.
Voor wie is een design system interessant?
Een design system is interesant voor iedereen die digitale producten ontwikkelt: van grote corporates tot mkb’ers. Vooral als je met verschillende experts aan een hoop uiteenlopende producten samenwerkt. Hoe complexer je organisatie of de samenwerking, hoe meer je aan een design system hebt. Als er veel merken of businessunits op projecten samenkomen, loop je het gevaar dat ze langs elkaar drijven – als losse eilandjes. Met een systematische benadering zorg je voor verbinding en uniformiteit.
"Onderaan de streep is een design system het resultaat van een compleet andere manier van denken: systematisch, consequent en stap voor stap."
Sam, Synetic
Voordelen van design systems
Wat zijn nu concreet de voordelen voor je organisatie? Voorop staat dat je zorgt voor een samenhangende merkbeleving, doordat iedereen hetzelfde gereedschap gebruikt. Teams werken makkelijker samen, en je vermijdt lange discussies over ontwerp – de designprincipes staan immers vast. Niemand doet dubbel werk, want in een oogopslag zie je de gemaakte afspraken en welke elementen je al tot je beschikking hebt. Zo voorkom je verwarring en werk je efficiënter, goedkoper, en sneller dan het licht.