Branding
Welkom bij de ITGOIT Merkrichtlijnen
Bij ITGOIT maken we IT eenvoudig, betrouwbaar en uitzonderlijk voor iedereen, van particulieren tot bedrijven en scholen. Ons merk is ruimdenkend en toegankelijk, en toegewijd om jouw digitale wereld soepel te laten draaien.
Deze richtlijnen vormen de roadmap naar onze merkidentiteit en dienen als de handleiding voor ons logo, de kleuren, gradiënten en algehele uitstraling. Het volgen ervan zorgt ervoor dat ITGOIT consistent, levendig en trouw blijft aan onze missie om eersteklas IT-diensten met een glimlach te leveren.
Als je van plan bent onze merkassets te gebruiken, zorg er dan voor dat deze in lijn zijn met onze richtlijnen en vraag goedkeuring aan via onze contactpagina. Beoordelingen duren doorgaans 3-5 weken. Laten we samen iets moois opbouwen!
Met vriendelijke groet, Het ITGOIT Brand Team
Onze Branding Assets
Download onze branding kit of individuele logo's en symbolen voor eigen gebruik.
Logo
Logo
Opbouw
De primaire versie van het ITGOIT logo bestaat uit het symbool, genaamd IT Symbol, en het ITGOIT woordmerk. Deze twee elementen zijn optisch in balans gebracht door de binnenruimtes van het woordmerk af te stemmen op het symbool.
Vrije Ruimte
Ons logo moet altijd ruimte hebben om te ademen: dit noemen we de vrije ruimte. Dit voorkomt dat het wegvalt of er te rommelig uitziet. De vrije ruimte is gelijk aan de hoogte van de letter 'I' uit het woordmerk.
Schaalbaarheid
Ons logo is ontworpen om in verschillende formaten te werken. Het minimale symboolformaat voor digitale toepassingen is 20px in de hoogte om de leesbaarheid te garanderen.
Gebruik
Het toepassen van het ITGOIT logo begint met het begrijpen van onze merkaanwezigheid. Soms is het logo de hoofdrolspeler, soms is het ondersteunend. Het symbool kan worden losgekoppeld voor weergavedoeleinden.
Do's & Don'ts
Yes: Symbool & Woordmerk samen gebruikt als afzender (sign-off)
Yes: Woordmerk afzonderlijk gebruikt voor weergavedoeleinden
No: Woordmerk gebruikt zonder Symbool als afzender
No: Logo lock-up gebruikt op display formaat
Plaatsing
We plaatsen ons woordmerk op specifieke locaties om consistentie en flexibiliteit te garanderen.
Kleur
Primair op Secundair
Primair op Licht Primair
Kleur op Secundair
Secundair op Primair
Licht Primair op Primair
Secundair op Kleur
Boven Beeldmateriaal
Ons woordmerk moet duidelijk leesbaar zijn over afbeeldingen. Zorg voor voldoende contrast en vermijd complexe achtergronden. Raadpleeg de WCAG voor richtlijnen omtrent contrast.
Do's & Don'ts
Yes: Logo heeft voldoende contrast met de achtergrond
Yes: Logo heeft voldoende contrast met de achtergrond
No: Logoplaatsing interfereert met drukke achtergrond
No: Niet genoeg contrast tussen logo en afbeelding
Contextueel Gebruik
Op social media is het logo optioneel voor reguliere berichten, maar vereist voor belangrijke aankondigingen. Voor out-of-home advertenties is het logo essentieel.
Partner Lock-up Horizontaal
Het ITGOIT logo kan horizontaal worden gecombineerd met partnerlogo's. De ruimte tussen de logo's is gelijk aan 1,5x de kapitaalhoogte van het woordmerk.
Partner Lock-up Verticaal
Het ITGOIT logo kan verticaal worden gecombineerd met partnerlogo's. De ruimte tussen de logo's is gelijk aan 1,5x de kapitaalhoogte van het woordmerk.
Partner Lock-up Optische Aanpassing
Partnerlogo's hebben mogelijk optische aanpassing nodig om in balans te zijn met het ITGOIT logo.
Logo Don'ts
No: Rek het logo niet uit en vervorm het niet
No: Draai het logo niet
No: Verander de uitlijning van het logo niet
No: Voorzie het logo niet van een outline
No: Verander de schaalverhouding tussen het symbool en het woordmerk niet
No: Pas geen effecten toe zoals een gloed of slagschaduwen
Symbool
Symbol
Overzicht
In specifieke gevallen kan het ITGOIT logo worden gereduceerd tot het symbool, genaamd het IT Symbool. Het meest prominente gebruik van het symbool op zichzelf is in contexten waar groottebeperkingen het gebruik van het volledige woordmerk belemmeren, zoals app-iconen of social media avatars. Ons symbool zorgt ervoor dat het merk iconisch en flexibel is.
Vrije Ruimte
Er is een bepaalde hoeveelheid ruimte nodig rondom het symbool om te voorkomen dat het wordt overschaduwd door omringende kunstwerken, afbeeldingen of de rand van een pagina. De minimale afstand is een derde van de breedte van het symbool.
Schaalbaarheid
Het IT Symbool is ontworpen om in verschillende maten te werken. De minimale symboolgrootte voor digitale toepassingen is 20px hoog om de leesbaarheid te garanderen.
Horizontale Lock-up
Het IT Symbool kan worden gecombineerd met de logo's van partnermerken en medewerkers. De grootte van de elementen moet optisch worden aangepast om even groot te lijken. De ruimte tussen het symbool en het partnerlogo bedraagt de helft van de breedte van het symbool.
Uitlijning
Voor digitale toepassingen wordt het symbool vaak in een rechthoekige of ronde container geplaatst. Het symbool moet mechanisch worden uitgelijnd voor balans en zo worden gedimensioneerd dat er een comfortabele hoeveelheid ruimte aan alle kanten ontstaat.
Schaalbaarheid
Het IT Symbool is ontworpen om in verschillende maten te werken. Het kleinste symboolpictogram moet minimaal 30px hoog zijn om leesbaar te blijven.
Kleurcombinaties
Primair op Transparant
Wit op Primair
In Gebruik
Een voorbeeld van het IT Symbool in gebruik als app-icoon of social media avatar.
Symbool Don'ts
No: Rek het symbool niet uit en vervorm het niet
No: Kantel het symbool niet
No: Verander de compositie van het symbool niet
No: Voorzie het symbool niet van een outline
No: Gebruik geen gloed-effect op het symbool
No: Gebruik het symbool niet als masker
No: Pas geen slagschaduwen toe op het symbool
No: Gebruik geen niet-goedgekeurde kleurcombinatie op het symbool
No: Gebruik geen symbool in lage resolutie
Typografie
Typography
Onze Lettertypes
ITGOIT maakt gebruik van twee op maat gemaakte lettertypes uit de Ginto-familie: Ginto ITGOIT Nord voor opvallende koppen en Ginto ITGOIT Medium voor kleinere teksten, zoals subkoppen en bijschriften. Deze lettertypes stellen ons merk in staat naadloos te schakelen tussen gedurfde, aansprekende uitingen en heldere, informatieve communicatie. Een extra lettertype, GG Sans, wordt binnen het ITGOIT-product gebruikt. Zie de ITGOIT productrichtlijnen voor specifieke gebruiksdetails.
Aangepaste Tekens
Bepaalde tekens in onze lettertypes zijn verfijnd om de leesbaarheid op verschillende platforms te verbeteren. Om zowel functionaliteit als visuele consistentie te garanderen, dien je altijd de aangepaste Ginto ITGOIT lettertypes te gebruiken in plaats van de standaard Ginto-familie.
Karakterset: Ginto ITGOIT Nord Bold
Deze sectie toont het bereik aan tekens van Ginto ITGOIT Nord Bold. Deze ondersteunt alle Europese, op het Latijnse alfabet gebaseerde, talen (met uitzondering van talen die Griekse of Cyrillische schriften vereisen). Voor niet-Latijnse schriften (bijv. Mandarijn, Arabisch, Hebreeuws) dienen ontwerpers Noto Sans te kiezen, of het dichtstbijzijnde equivalent van Ginto ITGOIT Nord dat in die taal beschikbaar is.
Karakterset: Ginto ITGOIT Medium
Deze sectie toont het bereik aan tekens van Ginto ITGOIT Medium. Deze ondersteunt alle Europese, op het Latijnse alfabet gebaseerde, talen (behalve talen die Griekse of Cyrillische tekens nodig hebben). Gebruik voor niet-Latijnse schriften Noto Sans of de beste match met Ginto ITGOIT Medium.
Karakterset: Ginto ITGOIT Regular
Deze sectie benadrukt de karakterset van Ginto ITGOIT Regular, uitsluitend bedoeld voor digitale en producttoepassingen. Vermijd het gebruik van deze dikte in merkcommunicatie; kies in plaats daarvan voor Ginto ITGOIT Medium.
Lettertype Gebruik
Om de levendige en toegankelijke identiteit van ITGOIT in balans te brengen met duidelijke berichtgeving, moet je lettertypes zorgvuldig kiezen: Gebruik Ginto ITGOIT Nord Bold voor impactvolle krantenkoppen/titels. Gebruik Ginto ITGOIT Medium voor broodtekst (body copy), bijschriften en gedetailleerde tekst. Kies altijd de aangepaste Ginto ITGOIT lettertypes boven de standaard Ginto versies.
Letterkast (Case Setting)
Zet voor consistentie Ginto ITGOIT Nord Bold in All Caps (Volledige Hoofdletters) voor koppen. Gebruik Title Case of Sentence Case (hoofdletter aan het begin van de zin) voor Ginto ITGOIT Medium, afhankelijk van de context, om de leesbaarheid te optimaliseren.
Regelafstand: Ginto ITGOIT Nord Bold
Houd de regelafstand krap maar vermijd overdreven ruime of te strakke instellingen. Zie de voorbeelden als richtlijn.
Regelafstand: Ginto ITGOIT Medium
Zorg dat de regelafstand gemakkelijk lezen mogelijk maakt en voorkom dat stokken en staarten van letters elkaar overlappen. Gebruik een uitgebalanceerde benadering: niet te strak, niet te los.
Spatiëring: Ginto ITGOIT Nord Bold
Voor koppen pas je een proces in drie stappen toe: begin met de standaard spatiëring, pas -3% tracking toe en kern vervolgens de tekst voor een gelijkmatige afstand. Gebruik krappe spatiëring voor grote letters, iets losser voor kleine letters.
Spatiëring: Ginto ITGOIT Medium
Pas hetzelfde drie-stappen proces toe als bij Nord Bold en zorg voor een gebalanceerde spatiëring ten behoeve van de leesbaarheid.
Uitlijning: Ginto ITGOIT Nord Bold
Lijn tekst links of gecentreerd uit voor ITGOIT-communicatie. Vermijd rechts uitlijnen of geforceerd uitvullen (justified).
Uitlijning: Ginto ITGOIT Medium
Lijn tekst links of gecentreerd uit voor ITGOIT-communicatie. Vermijd rechts uitlijnen of geforceerd uitvullen (justified).
Rafeling (Ragging)
Rafeling (ragging) verwijst naar de visuele rand van een tekstblok. Maak de rafeling vloeiend door regeleindes aan te passen en zo een schone, leesbare rand te creëren. Vermijd hoerenjongen (widows) en ongelijke regels.
Maatvoering (Sizing)
Gebruik niet meer dan twee lettergroottes, afgeleid door een basisgrootte te verdubbelen of halveren (bijv. 25pt tot 50pt). Voor productontwerp mogen lettergroottes dichter bij elkaar liggen. Grote letters moeten de ruimte vullen; kleine letters moeten eronder een witruimte hebben die gelijk is aan één of meer regels.
Typografie Don'ts
No: Vermijd het in elkaar drukken of uitrekken van tekst.
No: Gebruik Ginto ITGOIT Medium niet voor koppen en Nord Bold niet voor broodtekst.
No: Koppen moeten in Volledige Hoofdletters (All Caps) staan, niet in Sentence Case.
No: Beperk je tot de goedgekeurde Ginto ITGOIT diktes.
No: Gebruik uitsluitend Ginto ITGOIT lettertypes, geen andere.
No: Vermijd het markeren van tekst met meerdere kleuren.
No: Houd typografie rechtop, niet gekanteld.
No: Gebruik alleen goedgekeurde gradiënten, geen andere effecten.
No: Vermijd het toevoegen van een outline aan tekst.
Back-up Lettertype: Montserrat
Gebruik Montserrat Extra Bold voor koppen als Ginto ITGOIT Nord niet beschikbaar is. Volg de ITGOIT typografie-richtlijnen en vermijd andere lettertypes zoals Arial.
Back-up Lettertype: Noto Sans
Gebruik Noto Sans Semibold voor subkoppen, broodtekst of bijschriften als Ginto ITGOIT Medium niet beschikbaar is. Volg de ITGOIT typografie-richtlijnen.
Back-up Lettertype: Niet-Latijns
Kleuren & Gradiënten
Kleuren
Colors
Onze Merkkleuren
Onze identiteit wordt bepaald door een dynamisch duo: Brand Purple (Merkpaars) en Primary Blue (Primair Blauw). Paars staat voor onze innovatieve en deskundige aanpak, terwijl Blauw staat voor vertrouwen, betrouwbaarheid en technische bekwaamheid. Deze combinatie creëert een gedenkwaardig en modern palet dat onmiskenbaar ITGOIT is.
Merkpaars (Brand Purple)
Pantone: 268 C
CMYK: 80 98 0 0
RGB: 91 33 182
HEX: #5b21b6
Primair Blauw
Pantone: 2133 C
CMYK: 81 64 0 0
RGB: 74 108 247
HEX: #4A6CF7
Kernpalet
Ons kernpalet vormt de basis van onze kleurenstrategie. Het consequente gebruik ervan creëert een herkenbare visuele aanwijzing voor het merk ITGOIT, en wordt aangevuld door ons secundaire palet voor meer flexibiliteit.
Merkpaars (Brand Purple)
Pantone: 268 C
CMYK: 80 98 0 0
RGB: 91 33 182
HEX: #5b21b6
Primair Blauw
Pantone: 2133 C
CMYK: 81 64 0 0
RGB: 74 108 247
HEX: #4A6CF7
Wit
Pantone: N/A
CMYK: 0 0 0 0
RGB: 255 255 255
HEX: #ffffff
Zwart
Pantone: Black 6 C
CMYK: 75 68 67 90
RGB: 18 23 35
HEX: #121723
Kerncombinaties
Dit zijn de primaire combinaties met hoog contrast voor typografie en UI-elementen om duidelijkheid en impact te garanderen.
Wit op Merkpaars
Voorbeeldtekst
Wit op Primair Blauw
Voorbeeldtekst
Merkpaars op Lichtblauw
Voorbeeldtekst
Primair Blauw op Lichtblauw
Voorbeeldtekst
Kernpalet In Gebruik
Hier zijn enkele voorbeelden van het kernpalet in gebruik voor primaire merkcontactmomenten.
- Werknemerspas
- Out-of-Home Reclame
- Evenement Bewegwijzering
Secundair Palet
Het secundaire palet bevat tinten en schaduwen van onze kernkleuren. Deze worden gebruikt om diepte toe te voegen, hiërarchie te creëren en het primaire palet te ondersteunen in complexere ontwerpen.
Donkerpaars
Pantone: 2695 C
CMYK: 84 99 26 14
RGB: 62 22 122
HEX: #3E167A
Donkerblauw
Pantone: 2728 C
CMYK: 97 85 24 10
RGB: 37 58 154
HEX: #253A9A
Lichtpaars
Pantone: 2655 C
CMYK: 51 68 0 0
RGB: 159 125 219
HEX: #9f7ddb
Lichtblauw
Pantone: 2717 C
CMYK: 10 5 0 0
RGB: 233 238 255
HEX: #E9EEFF
Donkergrijs
Pantone: 432 C
CMYK: 74 66 62 76
RGB: 29 36 48
HEX: #1D2430
Secundaire Combinaties
Deze combinaties zijn ideaal voor secundaire informatie, achtergronden of wanneer een subtieler contrast nodig is.
Lichtpaars op Zwart
Voorbeeldtekst
Lichtblauw op Zwart
Voorbeeldtekst
Zwart op Lichtpaars
Voorbeeldtekst
Zwart op Lichtblauw
Voorbeeldtekst
Te Vermijden Combinaties
Om de leesbaarheid en merkconsistentie te behouden, dien je deze kleurencombinaties te vermijden, vooral voor tekst.
- Donkere secundaire kleuren op lichte secundaire kleuren
- Lichte secundaire kleuren op donkere secundaire kleuren
- Lichte secundaire kleuren op een kernkleur
- Donkere secundaire kleuren op een kernkleur
- Vermijd het combineren van tinten en schaduwen van dezelfde kleurtoon in één compositie als het contrast laag is
Gebruiksverhouding
De juiste verhouding van kleurgebruik moet holistisch worden toegepast in alle ITGOIT-communicatie. Voor de belangrijkste contactmomenten en bij het introduceren van ITGOIT aan een nieuw publiek, leunen we zwaar op ons kernpalet. Voor meer tijdelijke en contextuele toepassingen, zoals sociale media, omarmen we de secundaire kleuren om in te spelen op de context en speelser om te gaan met onze merkuitstraling.
Secundair Palet In Gebruik
Hier zijn enkele voorbeelden van het secundaire palet in gebruik:
- Instagram Story
- Instagram Post
- Merchandise
Kleur Don’ts
Gebruik geen Donkere Kleur op Kleur
Gebruik geen Kleur op Lichte Kleur
Gebruik geen Donkere Kleur op Donkere Kleur
Gebruik geen niet-goedgekeurde combinaties
Gebruik geen twee kleuren tegelijkertijd
Gebruik geen kleuren met doorzichtigheid/opaciteit
Voeg geen nieuwe gradiëntkleuren toe aan tekst
Voeg geen nieuwe gradiëntkleuren toe aan achtergrondelementen
Mix en match geen verschillende kleurtinten
Voor algemene richtlijnen met betrekking tot de minimale contrastvereisten, bezoek de WCAG.
Gradiënten
Gradients
Overzicht
Onze gradiëntstijl, geïnspireerd op de gloed van een beeldscherm, is ontworpen om een gevoel van diepte en sfeer te brengen in ITGOIT-communicatie. Het biedt een kans om onze expressiviteit te maximaliseren met ons paars-blauwe palet, waardoor alles fris en dynamisch blijft.
Typen
Twee verschillende stijlen bieden flexibiliteit bij het toepassen van gradiënten, variërend van een meer uitgesproken kromming tot subtiel.
- Radiale Gradiënt
- Bijgesneden (Cropped) Gradiënt
Opbouw
De twee gradiëntstijlen onderscheiden zich door de hoeveelheid kromming in het verloop, zoals te zien is in de diagrammen.
Radiale gradiënten hebben een uitgesproken halfronde curve. Bijgesneden gradiënten produceren een meer lineair effect door dieper in de curve te snijden.
Radiale Gradiënt
Bijgesneden Gradiënt
ITGOIT gradiënten gebruiken slechts twee kleuren tegelijkertijd, wat diepte toevoegt zonder een compositie te overheersen.
Combinaties
De goedgekeurde gradiënt-kleurcombinaties staan hieronder, gebruikmakend van ons primaire paars-blauwe palet.
Gradiënten moeten over het algemeen van een lichtere of meer levendige kleur naar een donkerdere kleur overgaan, om het gloei-effect te versterken.
Donkerpaars op Zwart
Donkerblauw op Zwart
Merkpaars op Primair Blauw
Merkpaars op Donkerpaars
Primair Blauw op Donkerblauw
Lichtpaars op Merkpaars
Lichtblauw op Primair Blauw
Lichtpaars op Primair Blauw
Lichtblauw op Merkpaars
Toepassingsspectrum
Gradiënten kunnen op de volgende manieren worden toegepast wat betreft tekst en achtergrond:
- Effen Kleur op Kleur
- Effen Kleur op Gradiënt
- Gradiënt op Effen Kleur
- Gradiënt op Gradiënt
In Gebruik
Hier zijn enkele voorbeelden van gradiënten in gebruik:
Voorbeeld 1
Voorbeeld 2
Voorbeeld 3