Styleguide QwikSense

Huisstijl QwikSense

Symbolen

Grotendeels zullen de huidige symbolen gebruikt worden. Ze worden wel aangepast zodat ze één kleur hebben met tussentonen. Dit is belangrijk omdat anders de kleuren onderling verbanden gaan leggen. Sommige onderdelen zijn best moeilijk te verbeelden maar binnen de context denken wij dat dit goed zal komen. Dit zal later blijken uit de user testen. Voor fijnstof komt er sowieso een nieuw symbool & waarschijnlijk luchtdruk ook.

Typografie

Qwiksense maakt gebruik van PT Sans regular, bold, italic en bolditalic. Vooral PT Sans bold zal terug komen in de nieuwe huisstijl. Dit lettertype is opvallend door zijn dikte. Daarnaast wordt er veel gebruik gemaakt van Nexa Light. Dit is een schreefloos lettertype dat makkelijk van een scherm is af te lezen. Met dit lettertype worden vooral informatieve teksten geschreven. Daarom is er gekozen voor een rond lettertype. Dit oogt vriendelijk wat nodig is voor de serieuze/moeilijke teksten.

Koppen
PT Sans bold

22 pt

Paars: #7C2A34

Knoppen
PT Sans bold

22 pt

Grijs 128: #808080

Broodtekst
Nexa Light

16 pt

Paars: #7C2A34

Links/schrijfvak

Nexa Light

16 pt

Grijs 128: #808080

Kleurgebruik

Het dashboard zal gebruik maken van 2 primaire kleuren. Dit zijn lichtgrijs en #7C2A34 wat een donker paarse tint is. De grijstint zal het meest gebruikt worden. Dit komt omdat dit een neutrale kleur is, wat noodzakelijk is aangezien er veel belangrijke en moeilijke informatie staat in het dashboard. De grijze tint zorgt voor een evenwicht. Daarnaast oogt grijs professioneel (zie bijvoorbeeld Apple) en komt het terug in de inspiratie van QwikSense zelf.

Achtergrond
Grijs 221: #dddddd

Banner
Grijs 204: #cccccc

Knoppen
Grijs 179: #b3b3b3

Daarnaast zullen de grafieken veel gebruik maken de lichtblauw, turquose, oranje en rood die ook in hun logo gebruikt worden. Daarbij wordt een groen toegevoegd waardoor de kleuren een schaal worden van slecht (rood)naar goed (groen). Deze kleuren worden alleen nog maar gebruikt voor het aantonen van de schaal zodat onderlinge verbanden in het design vermeden worden.

Contrast

In het design zal alleen sprake zijn van contrast tussen de felle kleuren van de parameters en het lichte grijs van de achtergrond. Omdat het dashboard een flatdesign wordt zal er verder niet veel contrasten te vinden zijn.

Sfeer

Het dashboard wordt een flatdesign. De sfeer moet rustig zijn. Daarom worden grijstinten in het design gebruikt. Daarnaast wordt er gehanteerd volgens de regel ‘Less is more’. Omdat de content ingewikkeld is moet het design er makkelijk uit zien. Dit zorgt voor een evenwicht waardoor de gebruiker met zelfvertrouwen het design kan gebruiken.

Grid

Het design werkt nauw met een grid. Dit is essentieel om de rustige sfeer te houden. De informatie die de dashboard aanbiedt moet er makkelijk uitzien. Om dit voor elkaar te krijgen moet er dus gewerkt worden met een grid.