Brandbook Medapp

Een eenduidige huisstijl draagt bij aan een zichtbaar en herkenbaar Medapp. Binnen de huisstijl zijn er diverse eigenschappen die het gezicht bepalen: logo, typografie, kleurgebruik, fotografie en taalgebruik. Deze handleiding laat zien wat de bouwstenen zijn waarmee een ontwerper en tekstschrijver aan de slag kunnen om naar eigen inzicht middelen te creëren.

Vragen?

Deze huisstijl is ontwikkeld door ZUID Creatives. Wil je meer weten over de huisstijl? Neem contact op via info@zuid.com of bel (+31) 13 545 03 23.

Het Medapp logo

Logo zonder pay-off

Deze wordt gebruikt in toepassingen wanneer de pay-off daarin als losse tekst elders geplaatst terugkomt. Zodat deze er niet dubbel op staat. De pay-off wordt altijd in onderkast letters geschreven.

Altijd 2 kleuren

Ten behoeve van het onderscheid tussen ‘med’ en ‘app’ dient het gekleurde logo bij zowel positief als diapositief in 2 kleuren gebruikt te worden. Waarbij ‘app’ altijd koraalrood blijft.

Logo zonder pay-off in kleur, op witte of lichte ondergrond

Logo zonder pay-off in kleur voor diapositief gebruik (op donkere ondergrond)

Logo met pay-off

Deze wordt gebruikt wanneer het logo stand-alone gebruikt wordt of wanneer de pay-off niét als losse tekst elders in de uiting terugkomt. (Zodat de tagline altijd 1 keer erop staat).

Altijd 2 kleuren

Ten behoeve van het onderscheid tussen ‘med’ en ‘app’ dient het gekleurde logo bij zowel positief als diapositief in 2 kleuren gebruikt te worden. Waarbij ‘app’ altijd koraalrood blijft.

Logo met pay-off in kleur, op witte (of lichte) ondergrond

Logo met pay-off in kleur voor diapositief gebruik (op donkere ondergrond)

Logo in zwart of wit

Het logo in mono kleur, afhankelijk van de ondergrond zwart of wit.

Logo zonder en met pay-off in zwart, voor monotone gebruik, op witte (of lichte) ondergrond

Logo zonder en met pay-off in wit voor monotone diapositief gebruik (op donkere ondergrond)

Medapp Beeldmerk

Het beeldmerk is een karakteristieke vorm van Medapp.

Beeldmerk in kleur, op witte of lichte ondergrond

Beeldmerk in kleur voor diapositief gebruik op donkere ondergrond

Beeldmerk in zwart, op witte of lichte ondergrond

Beeldmerk in wit, op zwarte of donkere ondergrond

Marge

Zorg voor voldoende ruimte rondom het logo. Plaats nooit tekst te dicht bij het logo. Minimale afstand is 1x ‘m’ zoals hierboven is aangegeven.

Beeldmerk en ‘med’ nooit koraalrood

Het beeldmerk en ‘med’ mag nooit i.c.m. koraalrood gebruikt worden. Zo wordt bewaakt dat het een medisch hart is en wordt mogelijke associatie met een liefdeshart voorkomen.

Beeldmerk als watermerk

Het beeldmerk kan als watermerk gebruikt worden door deze in een subtiele tint te gebruiken. Kleur en tint is afhankelijk van de gewenste achtergrond kleur (licht of donker), als richtlijn geldt dat het altijd een subtiel contrast moet zijn met de achtergrondkleur om het als watermerk te laten fungeren.

In dit voorbeeld is de achtergrondkleur het Aubergine (#3C0038). En staat het beeldmerk daar in dezelfde kleur op, maar dan in een tint van 95%.

In dit voorbeeld is de achtergrondkleur wit. En staat het beeldmerk daar in de secundaire, zachte kleur op, in een tint van 35%.

Typografie

Baloo2

Te gebruiken in koppen, titels en geaccentueerde teksten.

Baloo2 Regular

Met name te gebruiken in inleidingen en losse, korte zinnen e.d.

Work Sans family

Te gebruiken voor langere teksten (bodycopy) en neutrale tekst. Het is een uitgebreide font family, gebruik hoofdzakelijk bold, medium en light.

Arial

Het lettertype dat je gebruikt als je in een programma werkt waarin je alleen kunt kiezen uit standaard lettertypes.

Zorg voor een evenwichtige kleurbalans. Voorkom dat een ontwerp te roze of te donker wordt. Hou het fris en luchtig door voldoende wit en geef het geheel warmte door de zachte steunkleur.

Er zijn extra functionele kleuren bepaald welke toegepast kunnen worden om interactieve elementen en cta’s e.d. te optimaliseren (zie tabblad ‘Functioneel’).

Aubergine

Een donkere kleur met paars-/roze tint. Voor algemeen en neutraler gebruik. Zorgt voor een sterk contrast met wit of lichte kleuren.

HEX: #3C0038
RGB: R 60 / G 0 / B 56

CMYK: C 79 / M 100 / Y 38 / K 56

Koraal rood

De meest karakteristieke kleur van MedApp. Voor grafische elementen, het verhogen van attentiewaarde in koppen, cta’s e.d.

HEX: #FF4664
RGB: R 255 / G 65 / B 94

CMYK: C 0 / M 84 / Y 47 / K 0

Secundair soft

Zachte steunkleur, voor subtiel gebruik in grafisch elementen zorgt voor extra warmte en toegankelijkheid.

HEX: #FEDEBA
RGB: R 254 / G 222 / B 186

CMYK: C 0 / M 16 / Y 31 / K 0

Wit

Ook witruimte is belangrijk voor de visuele identiteit. Het creëert rust en zorgt voor frisheid binnen een layout.

Deze kleuren zijn bepaald tbv functionaliteit, met de basiskleuren inachtnemend. Ze hebben afwijkend contrast maar kunnen mooi toegepast worden binnen de huisstijl om de nodige functionaliteiten en interactie te accentueren.

Het functioneel groen, geel, oranje en blauw hebben een soort zachtheid in zich, wat gevoelsmatig goed matcht met de koraal rode en secundair softe basiskleuren. Het functioneel rood is bewust wat harder en en feller. Zodat deze goed afwijkt van het koraal rood. En daardoor met name geschikt is voor belangrijke (fout)meldingen en waarschuwingen bijvoorbeeld.

Signaal Groen

Eerste signaalkleur om cta’s en grafische elementen extra attentiewaarde te geven.

HEX: #6BE080
RGB: R 107 / G 224 / B 128

Signaal geel

Eerste signaalkleur om cta’s en grafische elementen extra attentiewaarde te geven.

HEX: FFE540
RGB: R 255 / G 229 / B 64

Signaal rood

Signaalkleur voor belangrijke aandachtspunten, foutmeldingen en opmerkingen e.d.

HEX: EB0000
RGB: R 235 / G 0 / B 0

Accent oranje

Accentkleur tbv onderscheid tussen functionele elementen.

HEX: #FF9C3D
RGB: R 255 / G 156 / B 61

Accent blauw

Accentkleur tbv onderscheid tussen functionele elementen.

HEX: #3E93FF
RGB: R 62 / G 147 / B 255

Stijlelementen

Vloeiende vormen

Het beeldmerk bestaat uit een vloeiende lijn. Dat is doorvertaald in in de grafische elementen in layouts. Dat zorgt voor de juiste look & feel voor MedApp. Het sluit aan bij het gevoel van het versoepelen van het leven en de gebruiksvriendelijkheid.

De vloeiende vlakken en lijnen mogen vrij vervormt worden, zodat deze altijd mooi passend gemaakt kan worden ten behoeve van tekst en beeld. Een lijn kan de koraalrode of secundaire steunkleur krijgen. Om het extra dynamisch te maken ‘volgt’ de lijn op speelse wijze het vlak en loopt deze er voor en achter door.

Voorkom te scherpte bochten of hoeken in de vloeiende vormen. Hou het vloeiend en ‘smooth’

Fotografie

Ntb.

Uitingen

Enkele voorbeelden van middelen (concept).

Brand story

Ntb.

Schrijfwijzer

Ntb.