Onzichtbare krachten grootte, contrast en balans

Dit is de tweede van een driedelige serie artikelen over 'onzichtbare krachten' in ontwerp. In het vorige artikel hebben we geleerd hoe alignering kan worden gebruikt om richting en focus te creëren. In dit artikel leren we hoe werken met formaatwijzigingen contrast en balans kan creëren en uw ontwerpen kunnen helpen om duidelijker te communiceren.

Bigger ziet er belangrijker uit

Het is duidelijk dat wanneer je een element groter maakt, het er meestal belangrijker uitziet dan de kleinere elementen.

Maar dit moet in overweging worden genomen samen met andere factoren die de visuele hiërarchie beïnvloeden. Deze twee elementen krijgen bijvoorbeeld ongeveer hetzelfde belang, omdat ze dezelfde grootte hebben:

In dat geval zou je het bovenste element zien voordat je het onderste element zou zien.

Maar als je het onderste element groter maakt dan het bovenste element, zal het belangrijker lijken.

Andere dingen, zoals visueel gewicht (gebruikt u een vet of licht lettertype) of kleurcontrast, kunnen echter de effecten van grotere afmetingen omkeren..

In deze illustratie ziet het lichtere element er minder belangrijk uit, hoewel het groter is.

Maar alleen door dezelfde illustratie een donkere achtergrond te geven, is nu het lichtere (en grotere) element dominant, dankzij het feit dat het de achtergrond meer contrasteert dan het kleinere element.

Maak zinvolle veranderingen in de maat

Vooral als je ontwerpt voor de kleine schermen van de huidige tijd, zou je de afmetingen moeten veranderen met een doel. Het heeft geen zin om een ​​lettertype groter te maken - en daarmee waardevolle schermvastgoed in beslag te nemen - als dat niet nodig is.

Wanneer mogelijk, kun je de bovengenoemde factoren gebruiken om je visuele hiërarchie te veranderen, maar vroeg of laat moet je het ene ding groter maken dan het andere. Doe het gewoon niet lukraak.

Kijk naar deze verschillende elementen, elk groter dan de vorige.

Nu, die u duidelijker leest: die lay-out, of deze?

De elementen uit het tweede voorbeeld zijn gedimensioneerd op basis van een gevarieerde schaal. Elke lettergrootte heeft betrekking op de volgende kleinste maat met dezelfde wiskundige relatie als deze betrekking heeft op de grotere afmeting.

De typeformaten in de gevarieerde schaal hebben een proportionele relatie met elkaar. Verhoudingen helpen om delen van uw ontwerpen eruit te laten zien als bij elkaar horen.

U ziet verhoudingen in actie in het MailChimp-logo.

Elk van de cirkels waaruit de kenmerken van de chimpansee bestaan, heeft een factor van .75. De cirkel die het buikgebied vormt is .75 zo groot als de cirkel die het lichaam vormt, bijvoorbeeld. Hicks Design, de firma die dit logo ontwierp, deed dit expres!

Laat je niet misleiden door Fools 'Gold

Velen van jullie denken waarschijnlijk aan de zogenaamde "Gouden Ratio" die veel hype krijgt. De gulden snede is ongeveer 1: 1,618. Ja, de chimpansee zou nog steeds aantrekkelijk zijn als deze gebaseerd was op de gulden snede, maar het zou niet objectief aantrekkelijker zijn. Ondanks de hype is er geen bewijs dat The Golden Ratio aantrekkelijker is dan andere populaire verhoudingen zoals .75 of .67.

Om dit te illustreren, heb ik eens mijn e-maillijst opgevraagd over welke van de bovenstaande rechthoeken ze aantrekkelijker vonden. Een ervan is een vierkant, een ander is een .75-rechthoek, een ander is een .67-rechthoek en een andere is een 'gouden' rechthoek. Welke rechthoek het meest aantrekkelijk voor u is?

Dit zijn de resultaten van de enquête:

  • Linksboven (Vierkant): 8%
  • rechtsboven (3: 4 rechthoek): 29%
  • linksonder (2: 3 rechthoek): 37%
  • rechtsonder ("Gouden" verhouding): 25%

Zoals je kunt zien presteerde de zogenaamde gouden rechthoek heel goed, maar het bleek niet de aantrekkelijkste rechthoek te zijn.

De 2: 3-rechthoek won in dit geval, maar lees daar niet teveel in. Het punt is dat alles van de Gulden Snede tot 3: 4 aantrekkelijker zal zijn dan een vierkant.

U kunt deze kennis gebruiken om uw typografie mooi te maken, en tijd besparen als u met een vooraf ingestelde gevarieerde schaal voor uw typografie werkt.

Dit zijn bijvoorbeeld de lettergroottes die ik altijd gebruik. Elke maat is ongeveer .75 de grootte van de vorige grootte (met een kleine afronding).

Een bijkomstigheid van werken met een .75-schaal in plaats van de gulden snede, is dat de wiskunde veel gemakkelijker te doen is in je hoofd: wat is 75% van de 16? Gemakkelijk! Wat is 61,8% van 16? errr.

Conclusie

Door na te denken over de wijzigingen in de afmeting die u aanbrengt, zullen uw ontwerpen er schoner en duidelijker uitzien en tegelijkertijd beter bruikbaar zijn en beter worden omgezet. Als u een gevarieerde schaal gebruikt, kunt u geweldige ontwerpen sneller maken!

Blijf bij ons voor het laatste artikel in deze serie, waarin we leren hoe het vormgeven van de pagina door middel van uitlijning en dimensionering en het denken over uw witte ruimte, uw ontwerpen nog meer duidelijkheid geven.