NL Design System is een project dat specialisten van verschillende overheidsorganisaties laat samenwerken aan concrete oplossingen voor websites en applicaties. Denk bijvoorbeeld aan code, ontwerp en richtlijnen.
Door organisatie-overstijgend samen te werken en de krachten te bundelen is het mogelijk om web-componenten te bouwen die consistenter, gebruiksvriendelijker en toegankelijker zijn.
Toch is NL Design System meer dan een manier om een organisatiebrede component-library aan te leggen. Het bestaat namelijk uit de volgende onderdelen:
- Richtlijnen voor hoe je de beste digitale diensten maakt, zoals voor het maken van formulieren.
- Design kit voor grafisch vormgevers en UX-ontwerpers.
- Componentenbibliotheek voor ontwikkelaars.
- Gedeelde inzichten over toegankelijkheid, opgenomen in die richtlijnen en in documentatie voor componenten.
- Een methode om je huisstijl toe te passen op onze componenten (design tokens).
- Technische infrastructuur om werk efficiënt te testen, te delen en uit te rollen (zoals een voorbeeldrepository met Storybook en visuele regressietests).
- Stijlgids om de huisstijl van je organisatie consistent te gebruiken.
Al deze onderdelen hebben dit gedeelde doel: makkelijk consistente, toegankelijke en gebruiksvriendelijke websites en applicaties maken.
Van lokaal en specifiek naar centrale hoogwaardige componenten
Het implementeren van het NL Design System vergt wel enige inspanning van jou en je organisatie, maar levert uiteindelijk veel op. De tijd die je als developer voorheen besteedde aan het aanpassen of bouwen van specifieke front-end-oplossingen, kun je nu investeren in het verbeteren van centrale componenten. Alle verbeteringen die je aanbrengt, komen ten goede aan de hele organisatie, waardoor iedereen profiteert van jouw bijdragen.
Extra tijd inplannen
Wat natuurlijk wel vereist is, is dat er binnen jouw project extra tijd wordt vrijgemaakt voor de werkzaamheden die komen kijken bij het opzetten van alle tooling.
Aan de slag
Om NL Design System te gebruiken, dien je eerst een eigen thema voor jouw organisatie te ontwikkelen. Een thema bestaat uit design tokens die de basis vormen van jouw huisstijl: denk aan kleuren en typografie.
Theme example repository
Je kunt makkelijk beginnen met het bouwen van een eigen thema op basis van de example template op Github. Deze repository bevat al direct:
- Twee example components
- Een opzet met Storybook (componenten-catalogus)
Aan de slag met components zonder theme?
Als developer vraag je je natuurlijk direct af, kan ik ook gebruik maken van NL Design System zonder dat ik een thema hoeft te bouwen voor mijn organisatie? Het antwoord is; op zich kan dat. Je moet alleen wel toestemming vragen aan de maker van het thema. Een voorbeeld is het auteursrecht van het Design System van gemeente Utrecht.
Levende voorbeelden
Een aantal goede voorbeelden van NL Design System implementaties en communities zijn:
Links
Introductie NL Design System
Over NL Design System
Website NL Design System
Wat zijn jouw gedachten over NL Design System? Laat iets achter in de comments.