nl-design-system · bddjong · Dec 10, 2024
diff --git a/packages/storybook/src/templates/form-wmebv/documentation.md b/packages/storybook/src/templates/form-wmebv/documentation.md
@@ -3,7 +3,20 @@
 Voordat de huidige versie van het generieke e-formulier (meerstappenformulier) in deze Storybook-documentatie werd opgenomen, is er een eerdere versie ontwikkeld en gedocumenteerd in de Hulpgids Wmebv: e-formulieren en notificeren. Deze hulpgids vormde de basis voor het ontwerp en de implementatie van het meerstappenformulier.
 
 De hulpgids introduceerde een eerste generiek e-formulier, dat tot stand kwam in samenwerking met gemeenten, leveranciers en VNG Realisatie. Dit formulier werd uitgebreid getest op gebruiksvriendelijkheid en toegankelijkheid, wat leidde tot inzichten en verbeteringen die zijn verwerkt in de vernieuwde versie die nu beschikbaar is in het Storybook.
- ## Hulpgids Wmebv: e-formulieren en notificeren
+
+## Figma-ontwerpbestand
+
+Bij deze Storybook hoort een uitgebreid **Figma-ontwerpbestand**, waarin dezelfde templates zijn uitgewerkt op basis van de componenten uit het NL Design System. Dit bestand biedt handige referentie voor designers, zodat zij snel en efficiënt kunnen werken aan nieuwe ontwerpen die aansluiten bij de standaarden van het NL Design System.
+
+Het Figma-bestand is handig omdat:
+
+- **Consistentie**: Het gebruik van NL Design System figma componenten zorgt ervoor dat ontwerpen consistent blijven, zowel visueel als functioneel.
+- **Efficiëntie**: Designers kunnen bestaande componenten hergebruiken, wat de tijd die nodig is voor het maken van nieuwe ontwerpen aanzienlijk verkort.
+- **Samenwerking**: Het bestand fungeert als een gedeeld referentiepunt voor designers en ontwikkelaars, wat de communicatie en samenwerking binnen teams vereenvoudigt.
+
+Je kunt het Figma-ontwerpbestand bekijken via de volgende link: [Figma - Overheidsbrede portalen templates](https://www.figma.com/design/iZgSIuU8hvH9nw3h7WO1ZY/Overheidsbrede-portalen---Templates?node-id=1-3&node-type=canvas&t=KxnX9WoZ6S4tSxuF-0).
+
+## Hulpgids Wmebv: e-formulieren en notificeren
 
 De hulpgids is ontwikkeld om gemeenten en leveranciers te ondersteunen bij het toepassen van de vereisten van de Wet modernisering elektronisch bestuurlijk verkeer (Wmebv). De gids bevat toelichting, praktijkvoorbeelden en een generiek voorbeeldformulier, en richt zich specifiek op het ontwerpen en implementeren van digitaal toegankelijke en gebruiksvriendelijke e-formulieren en notificaties.
 

diff --git a/packages/storybook/src/templates/mijn-omgeving-home/documentation.md b/packages/storybook/src/templates/mijn-omgeving-home/documentation.md
@@ -4,6 +4,18 @@
 
 De **MijnOmgeving**-services bieden burgers een gepersonaliseerde digitale omgeving waarin zij eenvoudig toegang hebben tot hun persoonlijke gegevens, gemeentelijke diensten en relevante informatie. Gemeente Den Haag werkt met een systeem gebaseerd op **Generieke Services**, waarbij consistentie en gebruiksvriendelijkheid centraal staan. Dit biedt een modulaire aanpak om verschillende diensten efficiënt te integreren. Meer informatie over Generieke Services is te vinden via [denhaag.nl](https://www.denhaag.nl).
 
+## Figma-ontwerpbestand
+
+Bij deze Storybook hoort een uitgebreid **Figma-ontwerpbestand**, waarin dezelfde templates zijn uitgewerkt op basis van de componenten uit het NL Design System. Dit bestand biedt handige referentie voor designers, zodat zij snel en efficiënt kunnen werken aan nieuwe ontwerpen die aansluiten bij de standaarden van het NL Design System.
+
+Het Figma-bestand is handig omdat:
+
+- **Consistentie**: Het gebruik van NL Design System figma componenten zorgt ervoor dat ontwerpen consistent blijven, zowel visueel als functioneel.
+- **Efficiëntie**: Designers kunnen bestaande componenten hergebruiken, wat de tijd die nodig is voor het maken van nieuwe ontwerpen aanzienlijk verkort.
+- **Samenwerking**: Het bestand fungeert als een gedeeld referentiepunt voor designers en ontwikkelaars, wat de communicatie en samenwerking binnen teams vereenvoudigt.
+
+Je kunt het Figma-ontwerpbestand bekijken via de volgende link: [Figma - Overheidsbrede portalen templates](https://www.figma.com/design/iZgSIuU8hvH9nw3h7WO1ZY/Overheidsbrede-portalen---Templates?node-id=1-3&node-type=canvas&t=KxnX9WoZ6S4tSxuF-0).
+
 ---
 
 ## Gebruikersonderzoek naar MijnOmgeving

diff --git a/packages/storybook/src/templates/mijn-omgeving-zaakdetail/documentation.md b/packages/storybook/src/templates/mijn-omgeving-zaakdetail/documentation.md
@@ -11,6 +11,18 @@ De **Zaakdetail pagina** is ontworpen op basis van het zaakdetailscherm van Geme
 
 Dit ontwerp is gemaakt om burgers en organisaties een overzichtelijke en toegankelijke manier te bieden om hun lopende zaken te beheren.
 
+## Figma-ontwerpbestand
+
+Bij deze Storybook hoort een uitgebreid **Figma-ontwerpbestand**, waarin dezelfde templates zijn uitgewerkt op basis van de componenten uit het NL Design System. Dit bestand biedt handige referentie voor designers, zodat zij snel en efficiënt kunnen werken aan nieuwe ontwerpen die aansluiten bij de standaarden van het NL Design System.
+
+Het Figma-bestand is handig omdat:
+
+- **Consistentie**: Het gebruik van NL Design System figma componenten zorgt ervoor dat ontwerpen consistent blijven, zowel visueel als functioneel.
+- **Efficiëntie**: Designers kunnen bestaande componenten hergebruiken, wat de tijd die nodig is voor het maken van nieuwe ontwerpen aanzienlijk verkort.
+- **Samenwerking**: Het bestand fungeert als een gedeeld referentiepunt voor designers en ontwikkelaars, wat de communicatie en samenwerking binnen teams vereenvoudigt.
+
+Je kunt het Figma-ontwerpbestand bekijken via de volgende link: [Figma - Overheidsbrede portalen templates](https://www.figma.com/design/iZgSIuU8hvH9nw3h7WO1ZY/Overheidsbrede-portalen---Templates?node-id=1-3&node-type=canvas&t=KxnX9WoZ6S4tSxuF-0).
+
 ---
 
 ## Componenten en het NL Design System

diff --git a/packages/storybook/src/templates/mijn-profiel/documentation.md b/packages/storybook/src/templates/mijn-profiel/documentation.md
@@ -4,6 +4,18 @@
 
 De **MijnProfiel**-services bieden burgers een persoonlijke online omgeving waarin zij hun gegevens kunnen beheren en gemeentelijke diensten kunnen afnemen. Een voorbeeld hiervan is te vinden bij de Gemeente Den Haag met **MijnDenHaag**. Hier kunnen inwoners hun persoonlijke gegevens aanpassen en de status van aanvragen volgen, allemaal via een beveiligde DigiD-inlog. Meer informatie is beschikbaar op de [website van de Gemeente Den Haag](https://www.denhaag.nl/nl/mijn-denhaag.htm).
 
+## Figma-ontwerpbestand
+
+Bij deze Storybook hoort een uitgebreid **Figma-ontwerpbestand**, waarin dezelfde templates zijn uitgewerkt op basis van de componenten uit het NL Design System. Dit bestand biedt handige referentie voor designers, zodat zij snel en efficiënt kunnen werken aan nieuwe ontwerpen die aansluiten bij de standaarden van het NL Design System.
+
+Het Figma-bestand is handig omdat:
+
+- **Consistentie**: Het gebruik van NL Design System figma componenten zorgt ervoor dat ontwerpen consistent blijven, zowel visueel als functioneel.
+- **Efficiëntie**: Designers kunnen bestaande componenten hergebruiken, wat de tijd die nodig is voor het maken van nieuwe ontwerpen aanzienlijk verkort.
+- **Samenwerking**: Het bestand fungeert als een gedeeld referentiepunt voor designers en ontwikkelaars, wat de communicatie en samenwerking binnen teams vereenvoudigt.
+
+Je kunt het Figma-ontwerpbestand bekijken via de volgende link: [Figma - Overheidsbrede portalen templates](https://www.figma.com/design/iZgSIuU8hvH9nw3h7WO1ZY/Overheidsbrede-portalen---Templates?node-id=1-3&node-type=canvas&t=KxnX9WoZ6S4tSxuF-0).
+
 ## Gebruikersonderzoek naar de MijnProfiel-services
 
 Er is een gebruikersonderzoek uitgevoerd naar de MijnProfiel-services, waarbij de focus lag op de verwachtingen en behoeften van burgers en ondernemers. Het onderzoek identificeerde essentiële onderdelen zoals contactinformatie, meldingen, persoonsgegevens, adresgegevens, taalvoorkeuren en bankgegevens. Daarnaast werd de voorkeur uitgesproken voor een gebruikersinterface die gebruikmaakt van 'expansion panels' om informatie overzichtelijk te presenteren. Het volledige onderzoek is te vinden via [Gebruikersonderzoeken.nl](https://gebruikersonderzoeken.nl/docs/onderzoek-bekijken/mijn-zaken/vng-profiel-service-omnichannel/).