Wat is een design system?
Een design system is een centraal document waarin allerlei richtlijnen en herbruikbare componenten worden verzameld. Het is dus geen UI toolkit of set UX principles. Omdat iedereen dezelfde bouwstenen gebruikt, ontstaat consistentie in development en dus in gebruikerservaring. Waar bedrijven vroeger een huisstijlboek hadden, zijn design systems de doorvertaling naar de digitale wereld waar andere spelregels gelden dan bijvoorbeeld met drukwerk. Bij Redkiwi bouwen wij het design system in Figma.
Hoe stel je een atomic design model op?
Bij het opzetten van een design system is het belangrijk om niet gelijk te beginnen met het ontwerpen losse componenten. Om alle onderdelen in een design system ook echt impactvol te maken, is het belangrijk om eerst een visie te creëren. De samenhang tussen alle onderdelen is wat deze methode namelijk krachtig maakt. Deze visie creëren wij met klanten in de discovery fase.
Als je het design system opstelt, begin je met de kleinst mogelijke deeltjes: denk aan de kleur, icoontjes, fonts en knoppen. Dit zijn de atomen van je design. Vervolgens ga je aan de slag met de moleculen, bijvoorbeeld tekstelementen die font, knoppen en labels samen tot één werkend molecuul brengt. Als laatste ontwikkel je organisms. Denk hier bijvoorbeeld aan een product-grid organism dat bestaat uit moleculen primaire navigatie, zoekformulier, en productinformatie (afbeelding, titel en prijs). Je wordt dus niet belemmerd met een design system - het groeit juist met de tijd mee. Je kent de regels, en hier kun je oneindig veel combinaties mee maken.