Typografie
Spaceship verkent twee typografische omgevingen: een technisch afgerond lettertype Gotham Rounded en een eenvoudiger en meer geometrisch lettertype Proxima Nova.
Zelfverzekerd en direct zorgt typografie voor een vriendelijke en informele toon met ons publiek.
Primaire lettertype
Gotham Rounded is een vriendelijk lettertype met een technische inslag. Het wordt uitsluitend gebruikt in het Spaceship-logo, product submerken, tools en de identiteit van het team. Alleen de gewichten Medium, Book en Light zijn toegestaan.
Secundaire lettertype
Proxima Nova is een belangrijk onderdeel van de grafische omgeving van Spaceship. Het is het hoofdlettertype voor onze tekst en informatie in alle communicatie. Alleen vet, medium, normaal en licht zijn de toegestane gewichten voor dit lettertype.
Schaal
We hebben ons typografisch schaalsysteem gebouwd met de Gulden Snede (1:1,618) en alle benodigde maatstappen bepaald die we nodig hebben.
Gebruikmakend van de Typographic Scale Calculator modularscale.com, kunnen we een complete typografische schaal maken vanaf een primaire basisgrootte. Omdat de Gulden Snede grote sprongen tussen maten veroorzaakt, moeten we een secundaire basisgrootte toevoegen (2x de basisgrootte) om een bruikbaarder bereik te genereren. In dit voorbeeld tonen we een typografische schaal gebaseerd op een basisgrootte van 16px.
Tekststijlen
Proxima Nova kan zowel in kleine lopende tekst als in grote koppen worden gebruikt met maximale optische consistentie. Het brede scala aan gewichten maakt het eenvoudig om elke toon of boodschap te ondersteunen. Tekst moet bij voorkeur links uitgelijnd zijn, hoewel gecentreerde uitlijning kan worden gebruikt wanneer dat passend is.
Voor grote koppen gebruik je vet gewicht, optische kerning, automatische regelafstand en 80% woordspatiëring.
Voor gewone koppen gebruik je vet gewicht, optische kerning, automatische regelafstand en 80% woordspatiëring.
Voor korte subkoppen gebruik je medium of normaal gewicht, optische kerning, automatische regelafstand en 100% woordspatiëring.
Voor lange subkoppen gebruik je medium of normaal gewicht, optische kerning, automatische regelafstand en 100% woordspatiëring.
Voor paragraaf gebruik je normaal of licht gewicht, metrische kerning, automatische regelafstand en 100% woordspatiëring.
Voor kleine lopende tekst gebruik je normaal of licht gewicht, metrische kerning, automatische regelafstand en 100% woordspatiëring.
Richtlijnen
Gebruik geen specifieke kerningwaarden, noch positief noch negatief.
Gebruik geen specifieke regelafstanden, niet strakker of losser.
Gebruik geen rechts uitgelijnde paragrafen
Typografische hiërarchie
Typografie moet duidelijk de hiërarchie tonen tussen koppen, subkoppen en lopende tekst. Het combineren van de juiste gewichten en groottes zorgt voor sterk visueel contrast en helpt de lezer te begeleiden. Dit is de sleutel tot een effectieve inhoudshiërarchie.
Richtlijnen
Gebruik niet hetzelfde gewicht voor verschillende soorten inhoud
Behoud de gewichtsverhouding van boven naar beneden: dus sterkere koppen, lichtere subkoppen of lopende tekst.
Gebruik geen vergelijkbare lettergroottes en gewichten voor verschillende inhoudstypen.
Veilige marges
Om maximale leesbaarheid te garanderen gebruiken we de regelafstand van de kop als referentie om veilige marges voor de volgende tekstblokken vast te stellen.
Kleurcombinaties
Tekst op effen kleurachtergronden mag alleen worden gebruikt in de kleurcombinaties die hieronder worden getoond.
Richtlijnen
Gebruik geen andere kleuren, SDS-hulpkleuren of submerk-kleuren voor welk lettertype dan ook.
Gebruik geen SDS Blue lettertype op hulpkleuren of submerk-kleuren. Gebruik alleen wit of donkergrijs.
Let op de contrastverhouding tussen tekst en achtergrond. Gebruik geen hulpkleuren, tinten of schakeringen.
Achtergronden
Contrast en leesbaarheid zijn belangrijke elementen om rekening mee te houden bij het gebruik van tekst over afbeeldingen of gekleurde achtergronden.
Richtlijnen
Vermijd het gebruik van SDS Blue op complexe afbeeldingen of illustraties. Dit geldt voor lichte of donkere afbeeldingen.
Plaats geen tekst over contrasterende afbeeldingen. Dit geldt voor lichte of donkere afbeeldingen.
Overlaad afbeeldingen niet met tekst. Balans is de sleutel tot effectieve communicatie.