Customer experience

Zo weet je of je bedrijf een design system nodig heeft

0

Design systems zijn hot. Elk zichzelf respecterend bedrijf heeft er een en toont trots nieuwe releases of updates. Je bent snel geneigd te denken dat je ook een design system nodig hebt – omdat iedereen er een heeft, of het er ten minste over heeft. Maar is dat zo?

Wat is een design system?

Een design system bevat een verzameling van de beste design-processen, -patterns en -componenten die jij en je team(s) hebben ontworpen en die je consistent wil houden in al je producten. Als je uren en uren hebt besteed aan het perfectioneren van de typografie, de uitlijning en het kleurenpalet, dan wil je dit niet zien verdampen tijdens het gebruik binnen je organisatie.

Voordat we verder gaan, hier een definitie die ik zelf graag hanteer:

Een design system is een systematische benadering voor het ontwikkelen en onderhouden van consistente gebruikersinterfaces die de merkwaarden communiceren en de gebruikerservaring versterken – op een samenhangende wijze.

Een design system biedt een enkele bron van waarheid voor het bouwen van gebruikersinterfaces. Het is eenvoudig te wijzigen en aan te vullen met nieuwe beproefde en werkende functionaliteit. Productcycli wordt korter, omdat je sneller en nauwkeuriger kunt ontwerpen en implementeren. Bij het testen komen minder verrassingen naar boven. Productteams kunnen hun tijd en energie steken in het creëren van nieuwe ervaringen, nieuwe algoritmen en nieuwe bedrijfslogica. Een design system bespaart ook op onderhoud, omdat wijzigingen voorspelbaarder worden.

Wanneer heb je een design system nodig?

Hoe weet je of jouw bedrijf een design system nodig heeft? Als één van onderstaande situaties bij jouw organisatie van toepassing is, heb je er al profijt van:

  • Je producten moeten een gemeenschappelijke uitstraling en werking hebben.
  • Je applicaties maken gebruik van steeds terugkerende functionaliteit.
  • Developers willen niet hetzelfde werk op verschillende media herhalen.
  • Je verkoopt Software as a Service (SaaS) – misschien als white label of met verschillende thema’s.
  • Je worstelt met steeds terugkerende design-fouten.
  • Product designers willen dat de producten waar ze aan werken ‘on-brand’ en consistent zijn.
  • Bedrijven willen een kortere time-to-market van hun producten.
  • Product owners willen dat de producten waar ze aan werken efficiënter ontwikkeld worden.
  • Er is er steeds discussie over stijl of functionaliteit.

Welke voordelen biedt een design system?

Zodra je website of applicatie een bepaalde omvang en/of complexiteit bereikt – of zodra jouw bedrijf meerdere softwareproducten heeft – gaat een design system steeds meer voordelen bieden. Want hoe anders voorkom je dat eenzelfde functionaliteit steeds opnieuw wordt ontworpen of gebouwd? Of dat discussies terug blijven komen over een functionaliteit of weergave?

Kies je voor een design system of component library?

Met een kleine marketingsite heb je waarschijnlijk geen volledig ontworpen design system nodig. In plaats daarvan kun je overwegen om een eenvoudige component library of style guide te maken. Dit kan handig zijn voor toekomstige updates. Een component library of style guide bevat gemeenschappelijke elementen die op de site worden gebruikt, zoals typografie, kleurenpalet, buttons, enzovoort.

Zit het team op meerdere locaties zit, of is het zelfs verdeeld over verschillende tijdzones? Overweeg dan de documentatie van UX-pattterns, design principles en andere richtlijnen waarvan je wil dat iedereen, die aan jouw product werkt, op de hoogte is.

Jan Toman (2017) The Design System Schema.

Je team (of product) is nog maar klein…

Misschien is de start bescheiden, maar bedenk dat de designs die je nu maakt van invloed zijn op je toekomstige producten. Het is zinvol dat je nu al een start maakt met een design system. Of dat je het tenminste al in het achterhoofd houdt.

Het aantal teamleden maakt niet zoveel uit. Documenteren van je werk is sowieso goed. Weet jij zelf nog alle details van een design dat je een half jaar geleden hebt gemaakt? Omstandigheden kunnen veranderen en mensen kunnen vertrekken. Een consistente manier om ontwerpkennis te behouden en overdraagbaar te maken los je niet op met een design system alleen, maar het zal enorm helpen. Wil je dat alle ontwerpkennis alleen bekend is bij één of twee designers? Of heb je liever dat dit toegankelijk is voor iedereen die aan je product moet werken?

Je product is nog niet klaar…

Je kunt geneigd zijn om pas aan een design system te beginnen als alles af is, maar ik adviseer om in ieder geval al een component library op te zetten. Dit stelt je in staat om sneller te schakelen, en het kan deel uitmaken van een toekomstig design system.

En Bootstrap dan?

Bootstrap (en andere frameworks) is een geweldige tool: om je op weg te helpen, om snel prototypes en een proof-of-concept te bouwen. Maar als je iets ‘eigens’ wil hebben met een duidelijk (brand) identity, dan blijft het een raamwerk dat is ontworpen om aan ieders behoeften te voldoen. Het resultaat zal een product zijn dat lijkt op vele anderen, zonder een eigen karakter en persoonlijkheid.

Natuurlijk kun je elementen binnen Bootstrap aanpassen. Wijzig de kleuren, de lettertypen, etc. Maar als je te weinig aanpast, krijg je nog steeds een “Bootstrappy” product. En als je te veel aanpast, schrijf je zoveel overrides in je code dat je net zo goed helemaal opnieuw kunt beginnen.

Voorkom tijdverspilling en behoud consistentie

Het opzetten van een bibliotheek met componenten kost in het begin weliswaar tijd en moeite. Maar deze investering verdien je moeiteloos terug doordat UX-teams zich weer kunnen focussen op de user experience, en de developers op de implementatie. Ze hebben beschikking over herbruikbare componenten die in de praktijk getest en goed bevonden zijn. Dit bespaart tijd (discussies!) en geld, en zal de gebruikerservaring verbeteren.

Organisaties die een design system gebruiken, doen dit omdat ze snel willen anticiperen op de veranderende markt. Omdat ze willen leren uit de ervaringen en meningen van hun klanten en de applicatie(s) daarop aanpassen.

Voorbeelden

Design system is een nieuwe term, waarvan de betekenis en het proces ervan nog steeds onduidelijk en inconsistent is. Verschillende organisaties in de online industrie proberen hun stempel te drukken op deze vrij nieuwe ontwikkeling. Ze komen met nieuwe technologieën, zoeken naar nieuwe manieren van werken en manieren om het design- en development-proces beter te beheren en uit te breiden.

Er is nog veel te doen in het “design system-domein”, maar er zijn al inspirerende voorbeelden te vinden:

Meer weten over design systems?

Bekijk dan eens deze sites:

Hoe zie jij de toekomst van design systems?

Ik ben heel benieuwd hoe jullie de toekomst van design systems zien. Moet elke zichzelf respecterende organisatie een design sytem hebben? Of is het “oude wijn in nieuwe zakken” (denk aan de vroegere corporate manuals)? Is het the next big thing of een hype?