Help, ik heb een Design System. Wat nu?

Het ontwikkelen en onderhouden van een Design System is tegenwoordig helemaal hot. Dit opzetten en uitbreiden is alleen vaak makkelijker gezegd dan gedaan. Deze avond deelden we met de groep hun Design System ervaringen. Hoe kun je het goed opzetten, onderhouden en schalen.

Anna en Maurice presenteren Design System Meetup

Learnings uit ‘State of Design Systems 2018’ questionnaire

Tijdens de Meetup deelden we onze inzichten uit de ‘State of Design Systems’ questionnaire welke is ingevuld door meer dan 260 Nederlandse designers en developers! ❤️

Samen met de groep bespraken we de meest opvallende punten waar men tegenaan loopt. Hoe ervaart de groep deze pijnpunten en hoe lossen zij dit nu op?

Design System Proces Puzzel

Een Design System is eigenlijk 80% mensen en hoe we met elkaar samenwerken. Dit is dan ook precies het grootste pijnpunt waar iedereen tegenaan loopt met het opzetten en gebruiken van zijn Design System. Dit vormde dan ook de rode draad in ons eigen onderzoek.

Daarom gingen we precies met dit pijnpunt aan de slag in het praktische deel van de Meetup. In kleine groepjes gingen de deelnemers aan de slag met de ‘Design System Proces Puzzel‘ op basis van een fictieve case.

De situatie van de case:
Je krijgt de volgende vraag van een Designer uit een ander team: “Cool Design System! Ik ben bezig met het maken van een live chat, hoe voeg ik dat toe?”

De deelnemers puzzelden per groepje hun eigen proces in elkaar.

Design System Proces Puzzel
Download de slides

Verder met jouw design system?

Aan de slag met Design Systems?
Maurice denkt met je mee.

Maurice Timp

Onze Design System Lead beantwoordt graag al jouw vragen.

Stel Maurice jouw vraag

State of Design Systems in Nederland 

In september 2018 voerden wij een onderzoek uit naar de huidige staat van Design Systems in Nederland. In dit artikel willen we jou meenemen in de resultaten van dat onderzoek en delen we wat wij allemaal geleerd hebben.

Wanneer je begint met je Design System is eigenlijk je enige referentie de ‘best in class’ Design Systems als Carbon, Polaris en Lightning Design System. Indrukwekkend en voor veel organisaties een droom Design System, maar wat misschien nu nog niet past bij jouw organisatie. In Nederland zijn er weinig bedrijven die het zo massief oppakken. Ook zitten veel Design Systems achter slot en grendel. Je hebt eigenlijk weinig kleine en realistische voorbeelden.

Daarom was ons primaire doel met deze questionnaire om kennis te delen en te leren van anderen. Hoe pakt de Nederlandse markt het aan en hoe kunnen we voorkomen dat we straks dezelfde fouten maken? Hoe helpen we een Design System neerzetten wat past bij jouw bedrijf, jouw werkwijze en jouw team en hoe kun je daar maximaal van profiteren?

Wie deden er mee?

We zijn super blij met de 260+ reacties die we hebben ontvangen van de Nederlandse (UX) design en front-end community. ❤️ De questionnaire is breed gedeeld op Linkedin, Facebook, Linkedin en onze Meetup groep.

De respondenten bestonden vooral uit designers en front-end developers. 35% is UX designer, 31% UI-/visual designer en 10% is front-end developer.

  • 50% werkt in-house bij een organisatie
  • 26% is werkzaam als freelancer
  • 24% werkt bij een agency.

Een groot scala aan sectoren is vertegenwoordigd: IT, financiële dienstverlening, e-commerce, overheid, telecom, energie en meer. Een mooie weerspiegeling van de markt. In deze rapportage focussen we specifiek op in-house teams bij organisaties.

Bijna alle A-merken op de Nederlandse markt zijn vertegenwoordigd.

Veel grote organisaties hebben deelgenomen aan het onderzoek. Bijna de helft (46%) van de respondenten is werkzaam bij organisatie met 500+ medewerkers.

Van onze respondenten werkt 39% bij organisaties met één team van meerdere designers. 34% heeft één of meerdere designers per development team en 17% zijn de enige designer binnen het bedrijf. Slechts 6% van respondenten heeft aangeven dat ze geen eigen design team hebben.

*Dit onderzoek is verkennend en inventariserend van aard, de uitkomsten van dit onderzoek zijn indicatief en geen bewezen feiten. Het is het beeld wat bij de respondenten leeft, niet de volledige markt.

overzicht

Hoe staat het er nu voor?

Terug naar inhoud

Straks heeft 80% van de respondenten een Design System

Van onze respondenten heeft 63% aangegeven dat ze al een Design System hebben en 17% is er druk mee bezig. 20% van de respondenten heeft geen Design System, omdat ze niet weten wat het is of het niet nodig vinden.

De term Design System leeft, maar er zijn verschillende opvattingen over

Als eerste de belangrijkste vraag: wat is een Design System nou eigenlijk? Zoals we wel hadden verwacht zijn hier veel verschillende opvattingen over. De term leeft, je hoort het veel, maar we hebben het duidelijk niet over hetzelfde…

1. Design System is een UI kit

Er is een grote groep die een Design System omschrijft als stijlgids of UI kit:

“Een uitgebreide styleguide waar al je visuele componenten staan met uitleg waar en hoe te gebruiken.”

“Een Design System is een snelle, efficiënte manier om een stijlgids binnen een bedrijf door te voeren en te communiceren…”

Verder zijn er respondenten die het al heel duidelijk omschrijven dat het proces er omheen heel belangrijk is en vooral ook hoe het uitgebreid kan worden.

“Als een product, het proces er omheen is erg belangrijk. Voor ons is een design system een product dat bestaat uit visual design language, elementen, componenten en patterns. […]”

2. Design System is ‘Way of work’

Een klein aantal gaan er nog veel verder in. Het is de ‘way of work’  We vinden dit zelf een hele mooie quote, het is eigen de enige manier om er überhaupt grip op te houden. Uiteindelijk is het een systeem hoe je werkt, niet het resultaat wat er uit komt.

“Voor ons is het een way of work waarin we decentrale development kunnen verbeteren. Voor ons intern, maar juist ook voor de eindgebruiker. De deliverable is een website met styleguide, getting started, guidelines en ready-to-use componenten.”

We hebben een aantal quotes verzameld die volgens ons heel mooi verwoorden wat een Design System inhoud. Elke quote bevat een belangrijke redenen en aspecten voor een Design System. Het laat vooral zien: het is niet slechts een tool.

“Een Design System is dé enige bron van waarheid.”

“Een levende collectie van herbruikbare componenten, gebaseerd op duidelijke standaarden tbv consistentie in klantbeleving en snelheid van realisatie.”

“Het Design System evolueert met het product, de tools en nieuwe technologieën.”

“Een Design System slaat een brug tussen user experience en development en zorgt voor uniformiteit binnen verschillende teams en applicaties.”

Design Systems zijn relatief nieuw 👶

Wat voor ons redelijk onverwacht was dat onder de doelgroep van respondenten het relatief nieuw is. 66% heeft het minder dat een jaar, net in gebruik eigenlijk. 19% heeft het nu 1-2 jaar in gebruik. Slechts 15% heeft het langer dan 2 jaar.

Design System

Design System in gebruik 

Terug naar inhoud

,Wanneer we het hebben over Design Systems gaat het snel over tooling. Welke tools komen het meest voor? Sketch Library staat met 68% met stip op nummer 1. Gevolgd door zelfgemaakt in front-end (37%) en Invision DSM (23%).

Heel opmerkelijk dat Sketch Library zo’n groot marktaandeel heeft. We waren vooral benieuwd naar de combinatie met andere tooling. Een Design System stopt niet bij een design in Sketch. Hoe gaat het dan verder? Waar wordt het gedocumenteerd? De processen of coding standaarden? Dat zit toch niet allemaal in een Sketch Library? Welke combinaties worden het meest gebruikt?

Grootste aandeel (31%) is voor Sketch in combinatie met zelfgemaakt in front-end, gevolgd door Sketch & Invision DSM. Toch gebruikt 22% van onze respondenten alleen Sketch Library. We zijn heel benieuwd: hoe gaan Product Owners hier mee om? Hoe leeft het binnen de organisatie? Hoe is de kennisoverdracht of onboarding?

9/10 Design Systems zijn vooral visueel ingesteld

 Vraag:Wat zit er allemaal in een Design System?

We weten wat er allemaal in kán zitten maar wat zit er nu echt in? Dit waren hele duidelijke uitkomsten. 9/10 Design Systems bevat visual language (kleur, typografie, icons etc.), UI elementen (knoppen, form controls, etc.) en UI componenten (pagina headers, footer, tabellen, paginatie, navigatie, etc.). Heel erg visueel ingesteld dus. 9/10 Design Systems is dus meer een styleguide.

Slechts 1 op de 5 Design Systems heeft processen en onboarding opgenomen. Denk bij proces aan vooral aan samenwerking. Stel ik ben Product Owner en wil een nieuw component, hoe vraag ik dat dan aan, hoe geef ik feedback als een component niet converteert in de test of hoe wordt mijn input gebruikt? Bij onboarding gaat het erom hoe snel nieuwe teamleden hier mee aan de slag kunnen. Iets wat essentieel is voor adoptie binnen je organisatie.

Een ‘strict’ design system heeft de voorkeur

Mag iedereen zomaar dingen toevoegen en wijzigen of zijn er mensen specifiek voor aangewezen? We zien een voorkeur of lichte trend naar een meer ‘strict’ Design System.

UX designers, UI designers en Front-end developers zijn er primair bij betrokken

Wat we zien is dat de designers en front-enders duidelijk de kar trekken. Zij zijn dan ook in de meeste gevallen eindverantwoordelijk. Is er een dedicated Design System team? Dan nemen zij de lead. 24% van de respondenten heeft een dedicated Design System team.

Design Systems zijn levend, dagelijks in gebruik

Leuk om te zien dat het zo leeft, dagelijks in gebruik. 30% gebruikt het zelfs meerdere keren per dag. Er is geen enkele stijlgids die zo intensief wordt gebruikt. Ook updaten gebeurd regelmatig 58% wekelijks doet dit wekelijks en 15% zelf dagelijks. Heel erg in ontwikkeling dus.

Waar loopt men tegenaan?

Waar loopt men tegenaan?

Terug naar inhoud

Het primaire doelen van ons onderzoek was, hoe we kunnen leren van anderen en hoe we als community meer van elkaar leren. Waar lopen ze tegenaan en hoe kun je dit voorkomen?

Wat we heel duidelijk zagen is dat opstarten veel tijd kost. In het begin komt er veel verandering. Je herziet een component veel of veel dingen moeten nog besproken worden.

Er zijn ook veel respondenten die aangeven: “het is nog niet live, maar nog ontwikkeling”. Hier lijkt het alsof het Design System een heel groot project of grote kluif aan werk wordt en ontzettend lang duurt. Verder weet een groot deel van de mensen ook niet waar te beginnen.

Als men eenmaal een start heeft gemaakt met het Design System zijn er twee grote thema’s waar ze tegenaan lopen:

Samenwerking en adoptie

Dat samenwerking lastig is, is een rode draad en vormt ook de grootste hoeveelheid aan reacties. Als je nagaat dat een Design System 80% mensen is. Dan is dat ook precies het pijnpunt waar iedereen tegenaan loopt. Het gaat hier niet alleen om designers onderling, maar bijvoorbeeld ook met developers. Hoe maak je het toegankelijk en hoe gaan ze het gebruiken.

Samenwerking is vrij lastig, soms voelt het alsof je de politie moet uit gaan hangen. Het design systems is nog niet af 😉

Bij samenwerken hoort ook een stukje adoptie binnen de organisatie. Het delen en enthousiasmeren van collega in het (UX)design team daarbuiten. Onze respondenten vinden het heel erg lastig om hun organisatie mee te krijgen en feedback te krijgen op het Design System. Er is behoefte aan feedback, zonder feedback weet je niet wat je moet verbeteren en of het wel gebruikt wordt.

Het is teveel “zender-gebaseerd“. Te weinig feedback van gebruikers.

Proces en collega’s waarde laten inzien van DS

Wildgroei en inconsistentie

Dit is precies waar een Design System voor bedoeld is, om te voorkomen dat er wildgroei ontstaat. Dit zijn de gevaren van wat er gebeurd wanneer je het proces niet op orde hebt. Dan is alles lekker ‘loose’ en je hebt veel vrijheid als ontwerper, maar het begin als snel uit zijn jasje te groeien. Een jaar verder en je kan haast weer opnieuw beginnen.

Wij hebben een hele grote bak met legacy. […] Daarnaast is iedereen vrij om dingen toe te voegen aan het Design System (uiteraard wel via ons team), waarbij we soms dingen moeten toelaten die we liever niet willen zien.


Overzicht ontbreekt, zodat er wildgroei ontstaat van componenten etc. Ook is er geen duidelijk Design System voor mobiel. Dus hier worden dingen naar ieders eigen inzien bepaald.

Andere terugkerende thema’s zijn:

Structuur en opbouw

Er zijn veel manieren om een Design System op te zetten en men vindt het heel lastig om de goede manier te vinden.

Single source of thruth

Onduidelijk waar te kijken voor een laatste versie of specifiek component. Vaak versnipperd over verschillende tools. Documentatie van je keuzes kan je hierbij helpen.

Up-to-date houden

Dit is iets wat voor veel teams heel lastig blijft. Voelt erg omslachtig. Wordt veel extra werk gedaan om bij te houden wat de laatste versie is.

Magische wensen

Magische wensen voor je Design System

Terug naar inhoud

We vroegen aan onze respondenten die al een Design System hebben, wat zou je aan jullie Design System willen verbeteren? Wat als je 3 magische wensen had?

1. Betere samenwerking 

Heel logisch, dat is ook waar men het meeste tegenaan loopt. Bij de respondenten zit het vooral in enthousiasme van collega’s, dat het gaat leven binnen de organisatie, dat mensen er gebruik van maken en dat hoe we met elkaar werken duidelijk wordt.

2. Makkelijk updaten en doorontwikkeling 

Hoe updaten we een component en hoe voegen we een component toe? Dat moet sneller en eenvoudiger kunnen.

3. Koppeling tussen design en front-end  

Het lijken nu soms wel twee aparte werelden.

4. Single source of truth  

Simpelweg: waar staat het? Eén plek die voor de hele organisatie toegankelijk is, met goede structuur en waar je alles kunt bekijken.

5. Betere onboarding  

Men wil vooral dat proces en tooling goed beschreven staan. Dat het niet maanden duurt voordat een nieuw teamlid is ingewerkt.

6. Tooling en uitbreiding 

Wat onze respondenten vooral willen is uitbreiding van hun Design System. Bijvoorbeeld het toevoegen van flows, design principes, gebruikers inzichten, brand guides, micro interactions en coding standaarden.

Opnieuw beginnen met je Design System

Wat als opnieuw mocht beginnen? 

Terug nar inhoud

Zoveel mensen die al een Design System hebben en bijna allemaal al een jaar verder zijn. Met alle kennis van vandaag, als ze nu terug kijken, wat zouden ze dan anders doen?

Met stip op nummer 1: goed begin is het halve werk. Bijna iedereen zou eerder in het proces meer mensen betrekken. Daarom beginnen we zelf altijd met 4-daagse take-off

Vanaf het begin meer mensen betrekken in het proces voor meer betrokkenheid en gedeeld ownership.

“We zijn net opnieuw begonnen. Voorheen hadden we een frontend styleguide. Altijd up to date, maar raakte in onze lean ux omgeving enorm vervuild. Nu zijn we gestart vanuit de design rationale met als basis de Sketch Library. Nu is niet langer het eindresultaat, maar de bedoeling leidend.”

Dit gebeurd als je design naast een modulaire front-end omgeving hebt. Je wilt vanuit design ook werken op component basis. Denk aan: typografische schaal, spacing en design tokens. Je wil in design de basis ook goed opzetten, niet proberen het naar front-end componenten om te vormen. Dan groeit het snel uit elkaar. En dit natuurlijk goed documenteren. Zorg dat jet niet alleen in je hoofd zit.

Toegevoegde waarde?

Heeft een Design System toegevoegde waarde?

Terug naar inhoud

Zoveel mensen die het al hebben, maar heeft het ook toegevoegde waarde?

96% zegt ja! 

Diegene die ‘nee’ zeiden waren 2 van onze respondenten waar van één back-end developer die niet betrokken werd en een respondent die het hele Design System eigenlijk te veel gericht vond op visual design.

Wanneer je goed bepaalt waarom je een Design System wilt en wat je hiermee wilt bereiken, daarbij rekening houdt met processen, afspraken en eisen waar het aan moet voldoen. Heeft het op termijn enorm toegevoegde waarde voor je organisatie. Het zorgt voor snelheid, consistentie en helpt je niet het wiel opnieuw uitvinden.


Wat hebben we geleerd

Design Systems draait voor 80% om mensen en hoe we met elkaar samenwerken. Het valt of staat om een goed proces en de afspraken die we met elkaar maken. Wil je ook het proces beter aanpakken? Onze Design System Proces Puzzel kan je daarbij helpen.

Begin niet te groot

Wat heb je als team echt nodig? Waar kun je mee beginnen? Definieer een Minimal Viable Design System voor jouw organisatie. Onze checklist kan je bij helpen met het creëren van focus.

Betrek gebruikers vanaf het begin

Zorg dat je mensen uit de gehele organisatie betrekt, zodat het geen één richtingsverkeer is. Veel teams zitten momenteel vaak nog in een soort cocon, terwijl het veel beter is voor de adoptie van je Design System om gebruikers vanaf het begin te betrekken. Zorg voor Design System Advocates die je helpen het Design System intern te promoten. 

In onze Design System Take Off zorgen we ervoor dat gebruikers vanaf het begin betrokken zijn. Benieuwd hoe de Gemeente Den Haag een vliegende start maakte met hun Design System? Bekijk dan de case over het Design System van de gemeente Den Haag.

Zorg voor een go!

Zorg dat er voldoende tijd is om je Design System uit te werken en te onderhouden. Developers moeten het met elkaar eens zijn over de technische implementatie en Managers en Stakeholders moeten zeker weten dat het de moeite waard is om in te investeren. Doe bijvoorbeeld een Design Audit om te laten zien wat er mis gaat. Dat is trouwens heel gezond om de elke 6 maanden te doen.

Je hebt veel tijd en energie in je Design System gestoken, maar adoptie binnen je organisatie gaat moeizaam. Met onze Design System Booster geven wij in één dag je Design System een boost!


Up-to-date blijven?

Deze questionnaire is nog maar het begin. Nu we zoveel informatie hebben verzameld over de manier waarop de design en front-end community Design Systems bouwt en onderhoudt, zullen we het komende jaar aanvullende artikelen, inzichten en tools delen. 

Meld je aan voor onze nieuwsbrief om up-to-date te blijven over Design Systems.


Download volledige rapportage

Slidedeck van 52 pagina’s met alle bevindingen (PDF).

Aan de slag met Design Systems?
Maurice denkt met je mee.

Maurice Timp

Onze Design System Lead beantwoordt graag al jouw vragen.

Stel Maurice jouw vraag

Wij gebruiken cookies voor de beste ervaring van de website. Tijd teveel, beklijk onze privacyverklaring