Inhoudsopgave

Doelen van NL Design System componenten

Dit is een overzicht van de doelen die horen bij de stappen van het estafettemodel.

Controleer hier de volgende aspecten:

• Het doel is op zichzelf leesbaar. De omliggende tekst in de documentatie-pagina van het estafettemodel is niet essentieel.
• Het doel maakt geen verwijzing naar de status van de component in het estafettemodel, als dat te vermijden is. Het estafettemodel is een middel om het doel te halen, het moet niet een doel op zich worden.
• Is het doel overtuigend? Als je denkt “dit kunnen we wel overslaan”, dan is het doel niet goed gekozen. Dan moet het anders verwoord worden of verwijderd worden.
• Is het doel de moeite waard voor de persoon die verantwoordelijk is voor de bijbehorende acties?

Overzicht

Community

• Overzicht hebben welke stappen nog gedaan moeten worden om een component beschikbaar te maken voor anderen.

  Gebruikers kunnen vanuit één plek alle belangrijkste informatie vinden over de verschillende implementaties van een component.

• Developers en designers kunnen aan de API prefix zien uit welk design system de component komt.

• Wanneer een component-implementatie een andere naam heeft gebruikt dan de naam die is gekozen in NL Design System, dan kunnen gebruikers vertrouwen dat de implementatie klopt bij de beschrijving van de component, en dat de implemenatie niet fout is gelinkt.

• Gebruikers die de component in een andere huisstijl willen gebruiken, hoeven de component niet te forken om de huisstijl in te stellen.

  De component forken hoeft alleen bij uitzondering, waardoor bugfixes en verbeteringen op één plek terechtkomen, en iedereen er van kan profiteren.

• Gebruikers die het design van een component willen instellen, kunnen voorspellen wat de naam is van de design tokens die ze moeten instellen.

  Gebruikers kunnen het design van de component instellen met component-tokens, zonder dat het noodzakelijk is common tokens of brand tokens in te stellen.

  Gebruikers kunnen white-label componenten uit verschillende design systems combineren, zonder dat het noodzakelijk is common tokens van meerdere design systems in te stellen.

• De component mag door andere organisaties gebruikt worden, zodat de investering grotere waarde oplevert.

  Verbeteringen die anderen bijdragen aan de component, kunnen toegevoegd worden aan de code zonder juridische problemen te veroorzaken.

  Developers van organisaties die waarschijnlijk willen bijdragen, hebben geen juridische belemmeringen om bij te dragen.

  Producten die met de component gemaakt worden hoeven niet per se open source te zijn, zodat zoveel mogelijk websites toegankelijker en gebruiksvriendelijker gemaakt kunnen worden.

• Anderen kunnen onvoorwaardelijk de documentatie hergebruiken, aanpassen, vertalen en op nieuwe manieren gebruiken.

  Wanneer anderen een eigen implementatie van een component maken, kunnen ze delen van de documentatie hergebruiken, en daarmee sneller een de definition of done voldoen.

  Doordat bronvermelding en auteursrechten vermelden niet nodig is, kan iedereen moeiteloos de documentatie gebruiken op eigen manieren.

  Het is duidelijk dat de documentatie auteursrechtenvrij is, en niet dezelfde licentie heeft als de code.

• Designers kunnen vanaf de NL Design System website met één klik de Figma-component openen, zonder door het Figma bestand te zoeken.

  Tip! Ontwerp componenten volgens de afspraken van NL Design System, zodat componenten onderling uitwisselbaar zijn.

• Developers kunnen vanaf de NL Design System website met één klik de “npm install” command kopieren, zonder te zoeken op npmjs.com.

  Componenten kunnen gemakkelijk geïnstalleerd worden en up-to-date gehouden worden in projecten.

  Developers hoeven de code van een component-implementatie niet te kopieeren om de component te gebruiken, omdat het makkelijker is de code via een package manager te installeren als dependency voor hun project.

  Developers kunnen aan @organisatie/ in de naam van de npm package herkennen dat de component nog niet helemaal stabiel is en door welke organisatie deze is ontwikkeld.

• Developers kunnen de component makkelijk gebruiken doordat elke variant gedocumenteerd is en een codevoorbeeld heeft.

  Gebruikers kunnen succesvol aan de slag met de component, doordat de codevoorbeelden kloppen bij de versie van de component.

  De makers van de component kunnen gemakkelijk en snel controleren of alle codevoorbeelden in de documentatie nog werken, wanneer ze wijzigingen doen aan de component.

• Wanneer de huisstijl in de toekomst wordt gemoderniseerd, dan maakt de component het makkelijk om te migreren naar de nieuwe huisstijl.

  Wanneer de huisstijl in de toekomst wordt gemoderniseerd, dan behoud je de waardevolle investeringen in de component voor toegankelijkheid, gebruiksvriendelijkheid en robustheid.

  Organisaties die meerdere huisstijlen gebruiken, kunnen dezelfde component gebruiken in voor alle huisstijlen.

• Design systems in de community kunnen zelf aangeven of hun component bedoeld is om te delen met anderen via de NL Design System website.

  Een nieuwe implementatie van een component vindbaar maken voor de community, op nldesignsystem.nl.

• Gebruikers kunnen vertrouwen dat de code van de componenten die ze gebruiken langdurig beschikbaar is voor doorontwikkeling.

  Gebruikers kunnen vertrouwen dat er backups zijn van de componenten die ze gebruiken.

• Wanneer een wijziging zichtbaar de bestaande werking van de component verstoort, dan wordt dit automatisch herkend door een visuele regressietest, en de wijziging wordt op die grond afgewezen.

  Voorkomen dat externe bijdragen veel tijd kosten om te reviewen.

  Voorkomen dat pas in productie wordt opgemerkt dat de bestaande werking van een component is verstoord, door een bijdrage die alleen voordeel had voor externe gebruikers van de white-label component.

  Voorkomen de makers van de component geen externe bijdragen meer willen accepteren, omdat die meer problemen opleveren dan voordeel bieden.

• Developers kunnen een component parallel in meerdere frameworks implementeren, zonder de CSS te herhalen.

  Verbeteringen die in de CSS worden gedaan, werken door in alle implementaties van de component.

  Developers voor een specifiek framework werken niet elk aan een afzonderlijke CSS-implementatie, maar ze werken efficient samen om een gedeelde CSS-implementatie te verbeteren.

  De CSS-implementatie krijgt een hogere kwaliteit, wanneer een grotere groep developers betrokken is.

• Developers hebben documentatie waaruit blijkt welke varianten de component heeft, welke HTML gebruikt wordt, en wat de API is van de component.

  Developers hebben documentatie met een werkend voorbeeld van de component.

• Het kernteam controleert één component tegelijk op de Definition of Done voor Community-componenten.

• De implementatie van de component voldoet aan de verwachtingen, die gebruikers hebben op basis van de naam en de beschrijving van de component op de website van het design system.

• De component kan gebruikt worden in pagina’s met andere huisstijlen, zonder dat het visueel ontwerp van dit onderdeel opvallend afwijkt van de rest van de pagina.

  Het is makkelijk om een component als white-label component te publiceren, door het aanbieden van een beperkte set standaard design tokens.

• Gebruikers kunnen componenten uit verschillende design systems combineren, zonder dat ze elkaars werking verstoren.

• Gebruikers die het design van een component willen instellen, kunnen voorspellen wat de naam is van de design tokens die ze moeten instellen.

  Gebruikers kunnen het design van de component instellen met component-tokens, zonder dat het noodzakelijk is common tokens of brand tokens in te stellen.

  Gebruikers kunnen white-label componenten uit verschillende design systems combineren, zonder dat het noodzakelijk is common tokens van meerdere design systems in te stellen.

• De component mag door andere organisaties gebruikt worden, zodat de investering grotere waarde oplevert.

  Verbeteringen die anderen bijdragen aan de component, kunnen toegevoegd worden aan de code zonder juridische problemen te veroorzaken.

  Developers van organisaties die waarschijnlijk willen bijdragen, hebben geen juridische belemmeringen om bij te dragen.

  Producten die met de component gemaakt worden hoeven niet per se open source te zijn, zodat zoveel mogelijk websites toegankelijker en gebruiksvriendelijker gemaakt kunnen worden.

• Anderen kunnen onvoorwaardelijk de documentatie hergebruiken, aanpassen, vertalen en op nieuwe manieren gebruiken.

  Wanneer anderen een eigen implementatie van een component maken, kunnen ze delen van de documentatie hergebruiken, en daarmee sneller een de definition of done voldoen.

  Doordat bronvermelding en auteursrechten vermelden niet nodig is, kan iedereen moeiteloos de documentatie gebruiken op eigen manieren.

  Het is duidelijk dat de documentatie auteursrechtenvrij is, en niet dezelfde licentie heeft als de code.

• Het is voldoende om alleen te testen met de eigen huisstijl, wanneer je een white-label component deelt met de community, omdat testen met andere huisstijlen door anderen wordt gedaan.

  Wanneer de wijziging van een white-label component gevolgen heeft voor andere huisstijlen, dan wordt dit automatisch herkend door een visuele regressietest.

• xss

  Met het Voorbeeld-thema kan getest worden worden of de essentiële design tokens in code en design werken.

  Er wordt aangetoond dat de npm package van de component ook werkt als dependency in andere projecten.

  Organisaties die wel een eigen huisstijl hebben, maar geen eigen Storybook, kunnen met visuele regressietests controleren dat nieuwe versies van componenten goed blijven werken in combinatie met hun huisstijl.

• De repository kan door externe developers gebruikt worden voor doorontwikkeling van de component.

  Developers hebben de mogelijkheid om een bug fixen in een component, zelfs als ze de component niet zelf hebben ontwikkeld.

  Developers die een bugfix willen bijdragen hebben een prettige ervaring die voldoet aan de verwachtingen, en hebben geen aanleiding om liever de component in eigen beheer te hebben.

• Developers die de component gebruiken kunnen de code zien en suggesties doen voor verbeteringen. Dit helpt het samenwerken aan toegankelijke en gebruiksvriendelijke componenten die voor iedereen bruikbaar zijn.

  Gebruikers van de component kunnen bugs en feature requests melden, en er is een publiek overzicht van de meldingen van anderen.

  Gebruikers kunnen een backup maken van de code van componenten die ze nodig hebben.

  Alle wijzigingen tussen versies van de component zijn voor anderen te controleren.

• Designers kunnen alle componenten direct gebruiken in hun Figma ontwerpen door te koppelen met de NL Design System Figma bibliotheek, en elke component met een code-implementatie is beschikaar.

  Developers kunnen ontwerpen in Figma gebruiken om te vinden welke component-implementaties ze kunnen gebruiken in code, doordat het ontwerp is voorzien van links naar alle relevante informatie.

  Er worden vaker toegankelijke componenten uit het design system gebruikt, doordat designers dit aanbevelen aan developers voordat de ontwikkeling van een website begint.

  Gebruikers van de Basis-tokens kunnen gebruik maken van de nieuwe component door de component design tokens over te nemen van het Start-thema.

  De component kan met het Voorbeeld-thema gebruikt worden in voorbeelden, templates en patronen.

• Developers kunnen ontwerpen in Figma gebruiken om te vinden welke component-implementaties ze kunnen gebruiken in code, zelfs wanneer de designs niet gemaakt zijn met de bijbehorende Figma-componenten, doordat het ontwerp is voorzien van links naar alle relevante informatie.

  Er worden vaker toegankelijke componenten uit het design system gebruikt, doordat designers dit aanbevelen aan developers voordat de ontwikkeling van een website begint.

• Gebruikers kunnen herkennen dat de component klaar is om te gebruiken in eigen projecten door de badge “Community”.

• Op nldesignsystem.nl is de meest recente informatie van de component beschikbaar, op het moment dat de component wordt gepromoot door het kernteam.

• De community weet dat hun inzet om de component te maken wordt gewaardeerd.

  Bekendheid geven aan een component die een nieuwe implementatie heeft.

  Gebruikers aanmoedigen een nieuwe component toe te passen in hun eigen huisstijl, in eigen code en in eigen ontwerpen, en daar feedback over te geven.

Candidate

• Er is genoeg kennis en kunde beschikbaar uit de community om te bepalen welke design tokens goed werken. Het kernteam hoeft niet zonder praktijkervaring te besluiten welke design tokens nodig zijn om de component voor meerdere huisstijlen goed te laten werken.

• Er is genoeg kennis en kunde beschikbaar uit de community om te bepalen op welke manier een Candidate component goed kan werken voor eindgebruikers. Het kernteam hoeft niet zonder praktijkervaring te besluiten wat ervoor nodig is om dit voor meerdere projecten succesvol te doen.

• Component-implementaties die op in productie gebruikt worden op websites waarvoor een toegankelijkheidsverklaring gemaakt is, krijgen prioriteit bij het toewerken naar een stabiele versie.

  Component-implementaties die geen significante toegankelijkheidsproblemen blijken te hebben, krijgen prioriteit bij het toewerken naar een stabiele versie.

  Bestaand onderzoek naar toegankelijkheid van de component is bekend voordat het toewerken naar een stabiele versie begint, zodat die informatie kan worden gebruikt bij de doorontwikkeling van de component.

• Het kernteam kan bij uitzondering componenten oppakken die nog niet voldoende beschikbaar of bruikbaar zijn als Community implementatie.

• De Candidate component heeft zo veel mogelijk draagvlak in de community, doordat niet per ongeluk onbekende issues met de bestaande componenten opnieuw in de Candidate component zitten.

• De Candidate implementatie neemt geen bekende bugs of problematische API’s over uit de Community implementaties, maar kan wel gelijk de changes meenemen die als breaking change in de Community implementatie zijn uitgesteld.

• De Candidate implementatie neemt geen bekende bugs of problematische API’s over uit de Community implementaties, maar kan wel gelijk de changes meenemen die als breaking change in de Community implementatie zijn uitgesteld.

• De Candidate component heeft voldoende acceptatiecriteria zodat bekende toegankelijkheidsproblemen kunnen worden voorkomen met gebruik van de component en bijbehorende documentatie.

• De component kan ook gemakkelijk gevonden worden door gebruikers die andere namen voor de component gebruiken.

• Er is een goede keuze gemaakt voor de naamgeving van alle onderdelen van een component, zodat de kans klein is dat er veel werk gedaan moet worden voor het hernoemen van onderdelen.

  Voordat de ontwikkeling van de component begint is de naamgeving alle onderdelen bekend, zodat parallel gewerkt kan worden aan een consistent resultaat in Figma, code, Storybook, tests, documentatie en design tokens.

• De onderdelen van de component werken goed in ondersteunde hulpsoftware en voldoen aan de NL Design System architectuur.

• Alle API’s van de component zijn gebaseerd op een gemeenschappelijke use case en zijn voorspelbaar in combinatie met de andere Candidate en Hall of Fame componenten in het design system.

• De Candidate component is voor veel organisaties te gebruiken, en zij kunnen deze migreren zonder een ander visueel ontwerp te hoeven toepassen.

• Een robuuste Candidate component die goed en consistent te testen is.

• De Candidate component is goed getest voordat deze gepubliceerd wordt, niet alleen voor de standaard situaties, maar ook voor situaties die je anders pas in productie tegenkomt.

• De Candidate component heeft zo veel mogelijk draagvlak in de community en developers en designers kijken uit om het Candidate component te gebruiken doordat duidelijk is met hoeveel dingen rekening is gehouden.

• De Candidate component is aantoonbaar te gebruiken in tenminste 1 veelgebruikt frontend framework, kan makkelijk gedocumenteerd worden in Storybook en werkt goed op onze eigen websites.

• De Candidate component kan makkelijk beschikbaar worden gemaakt in elk framework naar keuze en heeft hierbij dezelfde gedeelde stylesheet. Bij componenten met een native equivalent is er een HTML variant te gebruiken, zodat deze ook kan worden gebruik voor output uit CMSen en APIs waar geen classnames kunnen worden toegepast op de HTML.

• Developers kunnen de CSS-implementatie gebruiken voor eigen CSS selectors.

  De CSS-implementatie kan gebruikt worden in de Shadow DOM van een Web Component.

  De CSS-implementatie kan gebruikt worden op de :host element van een Web Component.

  De CSS-implementatie kan gebruikt worden in code waar geen API prefixes van anderen gebruikt moeten worden.

  De CSS-implementatie kan gebruikt worden voor HTML elementen zonder class names.

• De Candidate component kan makkelijk worden gebruikt voor prototypes en designs in Figma zodat er genoeg feedback wordt gegeven door designers om er uiteindelijk een Hall of Fame component van te maken.

• De Candidate component is goed in te zetten voor prototyping zonder eerst een eigen huisstijl in te stellen.

• De Candidate component en varianten zijn makkelijk te gebruiken voor developers en designers.

  Doordat de component veel gebruikt wordt krijgt het kernteam voldoende feedback om de component te selecteren voor de Hall of Fame stappen.

• De component is consistent in alle onderdelen van de implementatie: code, Figma en documentatie.

• De Candidate component kan voorspelbaar worden ingezet door de verschillende organisaties in de community met een eigen huisstijl.

• De component voldoet in testscenario’s aantoonbaar aan alle WCAG succescriteria die van toepassing zijn.

  Het is duidelijk welke testscenario’s zijn getest en voor welke versie van de NL Design System Baseline is getest.

  Gebruikers kunnen vertrouwen dat alles is gedaan zodat de component toegankelijk ingezet kan worden in de situaties waarvoor de component bedoeld is.

• De Candidate component kan goed worden ingezet in productie. De component kan omgaan met verschillende soorten data, schermformaten, zoom levels, forced-colors mode en andere gebruikersinstellingen.

• De component kan veilig uitgebreid en verbeterd worden, zonder dat het veel tijd kost om vertrouwen te krijgen in de kwaliteit van de nieuwe release.

  Bestaande gebruikers krijgen geen problemen bij het installeren van updates, doordat alle bestaande functionaliteit automatisch wordt getest.

• De nieuw geschreven richtlijnen voor redacteuren, designers en developers zijn duidelijk, compleet en praktisch bruikbaar.

• Er is aangetoond dat de component goed werkt in de browsers en hulpmiddelen die eindgebruikers op dit moment gebruiken, zoals die zijn vastgelegd in de NL Design System Baseline.

  De component is getest in meer browsers en met meer hulpmiddelen dan gebruikelijk is voor kleinere projecten.

• De Candidate component kan makkelijk worden ingezet door developers en designers in de community. Het is duidelijk welke acceptatiecriteria voor toegankelijkheid er al in de component zijn opgenomen en welke nog door de gebruiker moeten worden getest.

• De Candidate component voldoet aan de acceptatiecriteria die hiervoor in de Voorbereidingsfase zijn opgesteld.

• De Candidate component kan makkelijk worden gebruikt in diverse projecten zodat er genoeg feedback wordt gegeven door developers om er uiteindelijk een Hall of Fame component van te maken.

  Developers kunnen aan @nl-design-system-candidate/ in de naam van de npm package herkennen dat de component nog niet helemaal stabiel is en dat deze is ontwikkeld door het NL Design System kernteam.

• De Candidate component kan makkelijk worden gebruikt voor prototypes en designs in Figma zodat er genoeg feedback wordt gegeven door designers om er uiteindelijk een Hall of Fame component van te maken.

• De Candidate component kan gebruikt worden in de visuele regressietests voor organisaties die hun huisstijl vastleggen bij NL Design System.

• De Candidate component kan makkelijk worden gevonden worden via nldesignsystem.nl.

• Een diverse community van developers, designers en contentmakers gaat aan de slag om de component in productie te gebruiken in eigen projecten.

  Er komt voldoende feedback op de component, om te weten welke verbeteringen nodig zijn om de component bruikbaar te maken voor een diverse groep gebruikers.

Hall of Fame

• De Candidate component is bewezen bruikbaar voor designers in verschillende organisaties. Eventuele UX-uitdagingen of onduidelijkheden zijn gevonden en opgelost voordat de component de Hall of Fame status krijgt.

• De Candidate component is bewezen bruikbaar voor developers in verschillende organisaties. Eventuele technische uitdagingen, onduidelijkheden in de API of documentatie zijn gevonden en opgelost voordat de component de Hall of Fame status krijgt.

• Gebruikers die al een Community component gebruiken kunnen goed migreren naar de Candidate versie, eventueel met hun eigen extensies. Feedback over de migratie, onduidelijkheden in documentatie of verbeterpunten in de component zijn bekend en opgelost voordat de component de Hall of Fame status krijgt.

• Maintainers van Community implementaties van de component hebben een plan voor de uitfasering van de Community component. De Community component zorgt niet voor verwarring bij gebruikers die een component moeten kiezen en de Community component hoeft niet onnodig te worden onderhouden.

• De component krijgt pas de Hall of Fame status wanneer deze is gebruikt in verschillende productieomgevingen, zodat de stabiliteit en bruikbaarheid getest zijn in de praktijk en eventuele problemen in de Candidatefase zijn gevonden en opgelost.

• De design tokens van de Candidate component werken goed voor verschillende organisaties met verschillende huisstijlen, voordat deze de Hall of Fame status krijgt.

• De component staat niet op zichzelf, maar werkt goed samen met andere Candidate en Hall of Fame componenten die in combinatie worden gebruikt. De componenten in samenhang kunnen in de Ontwikkelfase worden gedocumenteerd in patronen die consistent en toegankelijk kunnen worden ingezet.

  Via deze component kun je een vergelijkbaar component vinden dat beter past bij het doel van de gebruiker.

• De Candidate component kan aantoonbaar goed toegankelijk worden gebruikt in verschillende projecten zodat verborgen toegankelijkheidsproblemen in de Hall of Fame component worden voorkomen.

• Feedback van eindgebruikers is meegenomen in de Candidate component, zodat de Hall of Fame component niet alleen technisch goed werkt, maar ook bewezen gebruiksvriendelijk is voor de mensen die ermee moeten werken.

• Bekende security-risico’s bij het gebruik van de component zijn geïdentificeerd en gedocumenteerd, zodat gebruikers deze risico’s kunnen beperken bij de implementatie.

• Bekende privacy-risico’s bij het gebruik van de component zijn geïdentificeerd en gedocumenteerd, zodat developers en designers weten wat ze moeten doen om de component in te zetten zonder onbedoeld AVG privacywetgeving te overtreden.

• Gebruikers zetten de component niet op een gebruiksonvriendelijke manier in, doordat veelvoorkomende fouten van tevoren zijn bepaald en in de Ontwikkelfase kunnen worden gedocumenteerd met concrete do’s en don’ts.

• Er is vastgelegd op welke manier de gebruikerservaring voor screenreader-gebruikers is geoptimaliseerd.

  De kwaliteit van de screenreader-gebruikerservaring blijft stabiel, doordat regressies in screenreader-gebruikerservaring worden ontdekt bij het testen nieuwe versies van de component, en de component op tijd wordt verbeterd.

  Er wordt herkend dat de component aangepast moet worden, wanneer de ongewijzigde component minder goed werkt in nieuwe versies van browsers en hulpmiddelen, wanneer getest wordt met een nieuwe versie van de NL Design System Baseline.

• De Hall of Fame component werkt aantoonbaar goed in combinatie met andere Hall of Fame en Candidate componenten doordat deze combinaties worden getest en gedocumenteerd met concrete voorbeelden.

• Gebruikers kunnen aan de hand van documentatie zelfstandig de design tokens van de component invullen, en keuzes maken voor hun eigen huisstijl.

  Door interactieve hulpmiddelen in de documentatie is het mogelijk voor developers, designers en gebruikers zonder technische kennis om een huisstijl in te stellen voor componenten, en het vertrouwen te hebben dat het resultaat toegankelijk is.

• Contentmakers hebben duidelijke instructies en herkenbare voorbeelden om de component toegankelijk in te zetten.

  Contentmakers hebben hulpmiddelen en interactieve voorbeelden, die specifieke instructies geven die relevant zijn voor hun situatie. Contentmakers kunnen hiermee leren hoe je de component toegankelijk kan inzetten, zonder eerst alle richtlijnen volledig te begrijpen.

• De component werkt ook goed in een website met stricte beveiliging, bijvoorbeeld voor het beschermen van gevoelige persoonlijke of financiële gegevens. Extra stappen die nodig zijn om de component te gebruiken zijn goed gedocumenteerd.

  Er is voldoende documentatie zodat gebruikers van de component zich bewust zijn van security-aspecten en een aanpak kiezen om de component zo veilig mogelijk toe te passen.

• Wanneer een component invloed heeft op de privacy van eindgebruikers, dan is er documentatie voor gebruikers van de component die helpt om de beste keuzes voor privacy te maken.

• Gebruikers kunnen makkelijk de juiste component kiezen voor hun specifieke situatie omdat duidelijk is waarvoor de component bedoeld is en wanneer een andere component beter past.

• Voorkomen dat de component fout wordt toegepast, doordat gebruikers niet weten dat wat veelvoorkomende anti-patronen zijn voor toegankelijkheid.

  Wanneer gebruikers een component vaak op een foute of ongewenste manier toepassen, dan moet het niet veel moeite zijn daarover uitleg te geven.

  Je kunt gebruikers die anti-patronen gebruiken, ondersteunen door een linkje te delen naar de documentatie.

• Voorkomen dat de component fout wordt toegepast, doordat gebruikers niet weten dat wat veelvoorkomende anti-patronen zijn voor gebruiksvriendelijkheid.

  Gebruikers kunnen ontdekken welke UX-ontwerpen al zijn getest met gebruikers, en die niet positief worden beoordeeld.

• TODO: Content bad practices?
• TODO: Code bad practices? (Niet gerelateerd aan toegankelijkheid)

• De documentatie is zo volledig dat gebruikers de componenten volgens alle best practices kunnen gebruiken, zonder de algemene richtlijnen overal in detail te herhalen.

• Voorkom dat een component niet voldoet aan de wensen van gebruikers, maar dat de benodigde verbeteringen niet gedaan kunnen worden omdat is afgesproken dat de API langere tijd stabiel blijft.

  Wanneer een component-implementatie wordt uitgekozen om langere tijd aan te bieden met een stabiele API, dan wordt die gebaseerd op een bestaande implementatie waarvan de API aantoonbaar voldoet voor diverse groepen gebruikers, voor diverse doeleinden, in diverse technieken.

• Gebruikers kunnen de component gebruiken met een front-end framework dat ze zelf kiezen, en ze kunnen migreren tussen frameworks zonder de component opnieuw te moeten implementeren.

• De Hall of Fame component werkt met veelvoorkomende patronen die uit meerdere Hall of Fame en Candidate componenten bestaan. Gebruikers kunnen nu in de documentatie herkennen dat complexe patronen werken zoals verwacht, voordat ze deze implementeren.

• Zeer uitgebreide test coverage voorkomt dat een kleine wijziging in de component onbedoelde gevolgen heeft bij een grote groep gebruikers.

• Componenten kunnen gemakkelijk geïnstalleerd worden en up-to-date gehouden worden in projecten.

  Developers kunnen aan @nl-design-system/ herkennen dat de component stabiel is en dat deze is ontwikkeld door het NL Design System kernteam.

• Designers kunnen in Figma ontwerpen maken met componenten die stabiel zijn, en zeker weten dat ze geen experimentele functionaliteit gebruiken.

  Designers kunnen ontwerpen maken voor developers die alleen willen ontwikkelen met stabiele componenten.

• De component is volledig is geïntegreerd in het bredere ecosysteem van het design system, zodat gebruikers de component kunnen gebruiken in combinatie met alle andere componenten, patronen, templates, prototypes en hulpmiddelen.

• Gebruikers die de component nodig hebben kunnen vinden dat NL Design System een oplossing heeft, en ze vinden op één plek alle informatie om aan de slag te gaan.

• Gebruikers van de NL Design System component gebruiken zoveel mogelijk de nieuwste en beste versie. Het is duidelijk welke implementatie van een component jet het best kan gebruiken. Er gaat zo min mogelijk tijd en aandacht naar de oude component.