Een dag als ontwerper bij het NL Design System ziet er heel anders uit dan bij andere design systems. Dit komt mede doordat het NL Design System geen ‘traditioneel’ design system is met slechts een enkele huisstijl. In dit artikel leg ik als ontwerper uit hoe de werkzaamheden bij het NL Design System eruit zien.
Schakelen en focus verlegen
Alhoewel we in grote lijnen weten waar we naartoe werken, is het vaak onmogelijk om te weten hoe je dag er daadwerkelijk uit zal zien. Ook verleg je meerdere malen per dag focus van super-gedetailleerd naar een heel ruim vogelperspectief. Het ene moment help je bijvoorbeeld bij het ontwerpen van een websiteknop, terwijl je 5 minuten later overlegt wat de beste manier is om een groot formulier op te delen in meerdere stappen.
Strikte scheiding van visuele stijl en structuur
Waar je bij de meeste design systems slechts een enkel merk (of meerdere merken) bedient, is er geen vaste huisstijl voor het NL Design System. Componenten, patronen en documentatie moeten iedere denkbare huisstijl kunnen ondersteunen. Het is daarom belangrijk om altijd op zoek te blijven naar de kern van componenten, patronen en documentatie. Vervolgens moet je zorgen dat het aan te bieden is én bruikbaar is voor iedere huisstijl.
Ook werken we met een zogenaamd ‘white-label’. Dit is een visuele stijl waarmee we bijvoorbeeld toegankelijkheid kunnen waarborgen. Denk bijvoorbeeld aan alle benodigde combinaties (voor- én achtergrond) voor kleuren of een verplichte focus staat voor interactieve elementen. Vooral kleinere gemeenten hebben vaak niet het budget om zo’n uitgebreide visuele stijl te bekostigen.
Het opmaken van een huisstijl naar design tokens
Om een scheiding te maken tussen een huisstijl en de interactiestructuur, gebruiken we zogenaamde design tokens. Door deze scheiding is het mogelijk om solide herbruikbare componenten te maken die door iedere organisatie door hun eigen huisstijl te voorzien zijn.
Daarom is het belangrijk om de intentie van een visuele stijl terug te brengen naar de betekenis die deze visuele eigenschap heeft voor de gebruiker. Iedere visuele ontwerpkeuze wordt teruggebracht naar een design token. Zo heeft bijvoorbeeld iedere organisatie een kleur gekozen voor de broodtekst. Deze kleur kan per organisatie verschillen. De intentie achter de gekozen kleur echter niet. De kleur van de broodtekst moet bijvoorbeeld voldoende contrast hebben met de achtergrondkleur(en) waarop deze getoond wordt, of er dient een minimale tekst grootte te zijn. Design tokens kunnen hierdoor voorzien worden van eisen waaraan deze minimaal moeten voldoen.
Figma
Om ontwerpers van aangesloten organisaties goed bij te staan is het belangrijk om design tools door en door te kennen. Vragen over het maken van componenten, prototyping, naamgeving, bestand-architectuur en recente programma-updates moeten snel en duidelijk beantwoord worden.
Al vrij snel hebben we de keuze gemaakt voor Figma. De meeste aangesloten organisaties werken inmiddels ook met Figma, of gaan de overstap naar Figma maken. Het sluit ook bijzonder goed aan bij de belevingswereld van ontwikkelaars, waardoor het makkelijk is om eenzelfde taal met elkaar te praten. Omdat je samenwerkt met andere ontwerpers dien je zorgvuldig om te gaan met je ontwerp. Zorg altijd voor een naam die een semantische betekenis heeft en door iedereen (ontwerper én ontwikkelaar) begrepen wordt.
Het is belangrijk om bij alles wat je ontwerpt de vraag te stellen: “Kan dit hergebruikt worden en in welke context(en)?”. Dit geldt zeker voor componenten, maar meer nog voor patronen.
Samenwerken
Buiten het dagelijks communiceren via diverse kanalen zoals e-mail en Slack, organiseren we 1 keer per week een vast moment om centraal te overleggen met ontwerpers van diverse organisaties. Tijdens deze bijeenkomsten kan alles besproken worden waar je als ontwerper mee zit. Bij deze sessies worden niet alleen ontwerpers betrokken, maar ook tekstschrijvers, toegankelijkheidexperts en ontwikkelaars.
Toegankelijkheid
Heel veel toegankelijkheidsproblemen zijn in de eerste ontwerpfase al op te lossen. Niet iedere ontwerper is echter onderricht in alle toegankelijkheidsrichtlijnen. Door nauw met elkaar samen te werken en kennis over te dragen, merk je dat je elkaar als het ware naar een hoger niveau tilt; we onderwijzen elkaar.
Dit artikel is geschreven door Rogier Barendregt – ontwerper en voormalig kernteamlid bij het NL Design System.