/

Paden

Paden

De paden zijn een onderscheidend element uit onze huisstijl. Ze verbeelden een verhalen-pad, CAS nodes en missie-paden. Ze leiden de ogen van de gebruiker over de pagina heen.

Onderscheidend, maar niet essentieel

De paden zijn een herkenbaar deel van onze huisstijl. Maart dat betekent niet dat ze overal terug hoeven te komen. Een pad leidt de gebruiker en oogt speels. Maar een pad kan ook snel druk ogen, afleidend zijn en neemt best wat ruimte in beslag - waardoor er minder ruimte is voor andere informatie. Maak daarom spaarzaam en doordacht gebruik van de paden.

Bouwstenen van een pad

Hoofdstations

Highlight belangrijke informatie, vaak de titel. Staat bovenaan de pagina. Het pad is de primaire kleur vóór het station, en medium-licht ná het hoofdstation. Meestal staat er maar één hoofdstation op een pagina. Tenzij deze ook gebruikt wordt als 'eindstation' - bij een call to action. Het eindstation komt dan op de rand van het kleurvlak te staan.


Tussenstations

Highlighten van andere belangrijke informatie. Te gebruiken naast headings, iconen, dat soort zaken. Gebruik de medium-lichte tint van de primaire kleur. Je hoeft niet bij elk kopje een tussenstation toe te voegen. Maak de afweging: maakt het het ontwerp beter leesbaar en oogt het fraai, of voegt het vooral visuele ruis toe?


Aftakkingen

Alternatief op een tussenstation. [nog verder uitschrijven/uitdenken]


Het pad

Leidt de gebruiker over de pagina heen. Staat op 1X afstand (zie grid & lay-out) van de zijkant én tekst of andere elementen. Ze starten altijd aan de linker- of bovenkant van de pagina óf komen uit een afbeelding. Ze eindigen altijd aan de rechter- of onderkant van de pagina óf bij een call to action.


Hoofdstations

Highlight belangrijke informatie, vaak de titel. Staat bovenaan de pagina. Het pad is de primaire kleur vóór het station, en medium-licht ná het hoofdstation. Meestal staat er maar één hoofdstation op een pagina. Tenzij deze ook gebruikt wordt als 'eindstation' - bij een call to action. Het eindstation komt dan op de rand van het kleurvlak te staan.


Tussenstations

Highlighten van andere belangrijke informatie. Te gebruiken naast headings, iconen, dat soort zaken. Gebruik de medium-lichte tint van de primaire kleur. Je hoeft niet bij elk kopje een tussenstation toe te voegen. Maak de afweging: maakt het het ontwerp beter leesbaar en oogt het fraai, of voegt het vooral visuele ruis toe?


Aftakkingen

Alternatief op een tussenstation. [nog verder uitschrijven/uitdenken]


Het pad

Leidt de gebruiker over de pagina heen. Staat op 1X afstand (zie grid & lay-out) van de zijkant én tekst of andere elementen. Ze starten altijd aan de linker- of bovenkant van de pagina óf komen uit een afbeelding. Ze eindigen altijd aan de rechter- of onderkant van de pagina óf bij een call to action.


Hoofdstations

Highlight belangrijke informatie, vaak de titel. Staat bovenaan de pagina. Het pad is de primaire kleur vóór het station, en medium-licht ná het hoofdstation. Meestal staat er maar één hoofdstation op een pagina. Tenzij deze ook gebruikt wordt als 'eindstation' - bij een call to action. Het eindstation komt dan op de rand van het kleurvlak te staan.


Tussenstations

Highlighten van andere belangrijke informatie. Te gebruiken naast headings, iconen, dat soort zaken. Gebruik de medium-lichte tint van de primaire kleur. Je hoeft niet bij elk kopje een tussenstation toe te voegen. Maak de afweging: maakt het het ontwerp beter leesbaar en oogt het fraai, of voegt het vooral visuele ruis toe?


Aftakkingen

Alternatief op een tussenstation. [nog verder uitschrijven/uitdenken]


Het pad

Leidt de gebruiker over de pagina heen. Staat op 1X afstand (zie grid & lay-out) van de zijkant én tekst of andere elementen. Ze starten altijd aan de linker- of bovenkant van de pagina óf komen uit een afbeelding. Ze eindigen altijd aan de rechter- of onderkant van de pagina óf bij een call to action.


Spacing van paden

De paden nemen best wat ruimte in op de pagina en ogen snel rommelig bij verkeerde toepassing. Daarom is het belangrijk dat we consistente spacings gebruiken tussen de paden en andere elementen op de pagina. Zie hieronder een voorbeeld.


[afbeelding pad op het grid - spacings gehighlight]

Kleurgebruik paden

Paden kunnen alle primaire kleuren aannemen. De start van het pad en het hoofdstation zijn de primaire kleur. De rest van het pad, tussenstations en aftakkingen zijn de half-lichte versie van de primaire kleur.

/

Brand guidelines

/

Brand guidelines

Paden

De paden zijn een onderscheidend element uit onze huisstijl. Ze verbeelden een verhalen-pad, CAS nodes en missie-paden. Ze leiden de ogen van de gebruiker over de pagina heen.

/

Brand guidelines

/

Brand guidelines

Paden

De paden zijn een onderscheidend element uit onze huisstijl. Ze verbeelden een verhalen-pad, CAS nodes en missie-paden. Ze leiden de ogen van de gebruiker over de pagina heen.