The Typography - GUI Connection

Wat heeft typografie met het ontwerpen interfaces te maken?

Het leren begrijpen en toepassen van typografie heeft nog steeds zijn invloed op hoe ik het ontwerp benader van websites, formulieren, elearning modules en graphical userinterfaces van programma’s.

Dan heb ik niet over de userinteraction. Maar puur over de eerste aanblik van hetgeen dat de gebruiker / bezoeker op zijn beeldscherm krijgt. Geen overbodige interface elementen of verwarrende informatie. Duidelijk en overzichtelijk. Men kan er onbelemmerd aan de slag / zijn weg vinden.

Ik las laatst een goed boek: About Face 3 - The essentials of interaction Design. (Alan Cooper).
In dit boek een bevestiging van wat ik al wist.

“Establishing a clear visual hierarchy is one of the hardest challanges in visu-al interface design, and takes skill and talent. A good visual hierarchy is almost never noticed by users-it is only the lack of one and accompanying confusion that tends to jump out at most people.” 

Ah! Er is hier een duidelijke link naar typografie. Het doel van een goed gezette pagina is dat de lezer zonder moeite het verhaal tot zich kan nemen.

Het toepassen van typografie kort door de bocht:

  1. De zetspiegel heeft afgewogen marges links, boven, rechts en onder ten opzichte van de gezette tekst.
  2. Corps (lettergrootte) staat in relatie tot de lengte van de regel. En in relatie van de afstand (interlinie) tussen de regels.
    Als regels te lang worden krijg je het probleem dat je dezelfde regel nog een keer leest - of niet op de goede regel uitkomt. Door het toepassen van de juiste interlinie zorg je voor een juiste verhouding aan wit met als resultaat een open tekstbeeld. Voor de lezer is dit is makkelijker te overzien. 
  3. De letter zelf bestaat uit de verhouding van het wit tot het zwart. “A letter is the space between the blacks”. (quote van Massimo Vignelli uit Helvetica The Film http://www.helveticafilm.com/vignellimap.html)

Goede URL
http://webtypography.net/ (toegespitst op regels voor typografie op het web maar er is tevens voor drukwerk).

En voor voor de echte diehard is dit essay een aanrader: Stanley Morrison “Grondbeginselen van de typografie”; wel lekker taai. (http://www.uitgeverijdebuitenkant.nl/grafisch_ontwerpen/)

Het gaat dus om de juiste hoeveelheid wit. 
Vertaal dit naar het beeldscherm. 
De juiste hoeveelheid.
“Less is more.” 

De interface staat tussen de gebruiker en de programmatuur in. Een bladzijde staat tussen het verhaal en de lezer. De interface of de pagina moeten eigenlijk niet eens opvallen. Puur in dienst van de te verwerken informatie of het verhaal.

Het lijkt zo eenvoudig, de praktijk is anders. Dit maakt het het vak juist zo lekker.
It’s the responsibility of the designer to put the wires in our heads.

Harry Morselt

Future of the interface.

One Response to “The Typography - GUI Connection”

  1. Heej Harry,

    Ten eerste welkom hier op multimediamaniacs! Dat je maar een hoop leuke en interessante stukken mag schrijven hier. Erg leuk om eens te lezen over hoe jij als designer te werk gaat. Ben benieuwd naar je volgende blogpost!

Leave a Reply