Naar navigatie Naar hoofdinhoud

Wij gebruiken cookies voor de beste ervaring van de website. Meer informatie.

Ga naar het overzicht
Ga naar de homepagina Ga naar het overzicht

Wat wil je ons vragen?

Hoi, ik ben

en ik wil graag weten


Jullie kunnen me
op

Terugkijkend op het afgelopen jaar was er op design vlak een duidelijke trend waar niemand omheen kon. Maar eerlijk gezegd was het niets nieuws. Brad Frost heeft al sinds 2013 met zijn Atomic Design aanpak de basis gelegd voor deze ontwikkeling. En Atomic Design is op zich weer gebaseerd op de huisstijlgidsen zoals we die kennen uit de print wereld. De trend waar ik het over heb is natuurlijk; Design Systems. Een manier om interfaces op te bouwen van kleine elementen naar volledige designs op zo’n manier dat ze consistent zijn en makkelijk te onderhouden.

De uitdaging: Hoe bewaar je het overzicht?

Het werk van een designer bestaat uit keuzes maken. Moet dit element meer aandacht krijgen? Welke font size past hier het best? En met die keuzes leggen ze eigenlijk de regels vast waar zij zichzelf aan moeten houden. Omdat we de gebruiker normaal gesproken zo min mogelijk willen verwarren, is het belangrijk om de designs zo consistent mogelijk te maken. Dat betekent dus, met zo min mogelijk regels. Bijvoorbeeld; links zijn altijd blauw en onderstreept, behalve als ze op een donkere achtergrond staan, dan zijn ze wit. Nu is dit een erg makkelijk voorbeeld om consistent door te voeren in de designs voor alle pagina’s van een site of app. Maar stel je voor dat je honderden pagina’s moet ontwerpen die elk uit een dozijn elementen bestaan. Dan wordt het soms lastig om het overzicht te bewaren van de regels die je als designer voor jezelf opstelt. En omdat een developer die de designs dan moet realiseren niet van de regels weet, gaat interpreteren wat de designer bedoelde.

De voordelen van een Design System

Een Design System is een oplossing voor deze uitdaging. Een volledig overzicht van alle keuzes die de designer heeft gemaakt. Samen vormen zij alle variabelen, onderdelen, elementen en componenten waar een site of app uit bestaat. Op die manier kunnen designs, nadat het systeem staat, sneller worden gemaakt. Ook is het makkelijker voor andere designers om werk over te nemen, of om te zetten naar designs voor andere platformen.

Maar het heeft nog meer voordelen. Bij Hoppinger bouwen we Design Systems met live code, wat betekent dat het Design System en de website of app nooit van elkaar zullen verschillen. Op deze manier is het ook responsive, zodat we direct kunnen zien hoe een onderdeel zich gedraagt op verschillende schermformaten. En het stelt ons in staat om de realisatie van de designs al te verify’en, zelf wanneer de back-end nog in ontwikkeling is.

Denk je dat een redesign met bijpassend Design System jouw site ook naar een hoger niveau kan brengen? Kom een keertje koffie drinken!

 

 

Volgend blogartikel From Mr. to Dr. Di Giacomo
From Mr. to Dr. Di Giacomo

Wij zijn Hoppinger

Met een team van 80 specialisten vertalen we complexe en uitdagende vraagstukken naar web en native oplossingen die onze opdrachtgevers succesvoller en het leven van hun publiek gemakkelijker maken. Zo maken we als strategisch partner digitale ambities waar.

Meer over ons