Design
Huisstijl
Wij zijn verplicht de huisstijl van de Vlaamse overheid te volgen. Zij hebben uitgebreide en transparante richtlijnen (kleuren, logo, lettertypes, ...). We gebruiken deze richtlijnen om ons eigen open-source Design systeem, Appuniversum, te maken. Deze is gebaseerd op, en volgt, de richtlijnen van Webuniversum.
Algemene richtlijnen
Digitale richtlijnen
Er zijn ook specifieke richtlijnen voor de digitale huisstijl, die lichtjes verschillen van de algemene richtlijnen.
Toegankelijkheid
Al de applicaties en websites die we publiceren, moeten toegankelijk zijn, volgens de WCAG 2.1 richtlijnen [EN].
Global Header & Footer
Header: Om vlot te integreren met onze codebase en snelheid te verhogen, hebben we de header nagemaakt in Ember. Deze verschijnt altijd en overal.
Footer: De footer werd ook nagemaakt. Deze gebruiken we enkel op log-in pagina's, omdat onze applicatiepatronen anders in elkaar zitten.
Mock-ups
We maken momenteel gebruik van een mix van klikbare prototypes in Figma, en echte prototypes in HTML en CSS. We werken ook samen met andere departementen om hier een degelijke componenten bibliotheek aan te leggen, zowel in vectoren (Figma) en HTML en CSS.
Figma
We gebruiken Figma, maar we hebben nog geen licentie.
pageFeedback geven op Figma mockupsComponent libraries
Webuniversum
De Vlaamse Overheid heeft een webcomponentenblibiotheek gebouwd. We maken daar momenteel geen gebruik van:
In haar huidige vorm, de 3.0 versie, is deze bibliotheek beschikbaar wanneer we gebruik maken van hun Webplatform. Binnen onze applicatiearchitectuur maken we geen gebruik van dat Webplatform, en kunnen we dus ook geen gebruik maken van de webcomponentenbibliotheek.
De 3.0 versie is niet open source. Wij maken open source applicaties, en hebben dus nood aan open source oplossing.
Appuniversum, Webuniversum's Little Sister
Om onze applicaties mee te bouwen, hebben we een open source componentenbibliotheek gebouwd.
De bibliotheek is gebaseerd op de oude webcomponenten van de Vlaamse Overheid, versie 2.0. Hier bouwden we onze applicaties mee in het begin, toen deze versie nog open source gepubliceerd werd. Om ervoor te zorgen dat we bugs konden oplossen, de bibliotheek konden uitbreiden voor specifieke applicatie componenten en onze applicaties open source konden publiceren, riepen we Appuniversum in het leven. Iedereen die gebruik wil maken van deze bibliotheek, meer specifiek in kader van projecten voor de Vlaamse Overheid, mag hier aan meewerken.
Deze componenten bibliotheek bestaat momenteel uit twee delen: Appuniversum & Ember-Appuniversum.
Appuniversum Project
Dit Design systeem is zover gegroeid dat het een project op zich is geworden. We werken eraan om de communicatie tussen de verschillende partijen en bewegende delen te optimaliseren.
Figma Library
Appuniversum is niet alleen voor developers, of designers die prototypes in HTML & CSS bouwen. We bieden ook een open-source Figma library, waar designers, analisten, project managers,... eigen wireframes en mock-ups kunnen bouwen, gebruik makend van vooraf gedefinieerde onderdelen.
Deze bibliotheek bootst Ember-Appuniversum na.*
*Dit werk is nog in uitvoering en er kunnen nog kleine discrepanties in bestaan.
Last updated
