TinkDifferent

Cosplay and creativity

Usability theorie: Gestalt

Dit is een oud artikel dat ik in 2010 geschreven heb. Het is nog steeds van toepassing en ik merk regelmatig dat ik dit artikel bij collega’s wil voorleggen maar dat ie thuis onbereikbaar op een computer staat. Door ‘m online te zetten kan ik er altijd bij.

De meeste bronnen geven aan dat er vijf wetten zijn, toch verschilt de uitleg van de wetten onderling nog wel eens. Ook zijn er bronnen die meer dan vijf wetten aangeven of andere namen gebruiken. Om bij het gebruik van gestalt wetten niet naar verschillende websites te hoeven verwijzen heb ik hier één samenhangend essay van gemaakt.
Er zijn vijf gestalt wetten die de basis vormen en die allen slaan op hoe het gebruik van opmaak je waarneming kan beïnvloeden. Veel van de gestalt wetten leert men onbewust door ervaring zoals het lezen van een krant waarin de opmaak aangeeft welke kop bij welke tekst hoort en welk nieuwsbericht het meest belangrijk is. Maar we zijn ons er vaak niet van bewust als we aan het ontwerpen zijn, we zijn gefocust op andere aspecten van een pagina en dan gaat het mis.

Wet van overeenkomstigheid
Objecten die op elkaar lijken worden als een geheel gezien. Dat kan gelijk formaat, gelijke vorm of gelijke kleur zijn. De eerste afbeelding laat zien dat de twee grotere cirkels en grotere vierkanten meer opvallen en belangrijker lijken door hun formaat. In de tweede afbeelding is te zien dat de objecten alleen op vorm gerangschikt kunnen worden. Bij de laatste afbeelding lijken zowel cirkels als vierkanten bij elkaar te horen doordat ze dezelfde kleur hebben. Wat hier ook duidelijk wordt is de impact die een bepaalde gelijkenis heeft, zo springt de tweede afbeelding niet erg in het oog. Daarom wordt de relatie aanduiding door middel van vorm vaak ondersteunt met kleuren.

 1.2 1.3

 

Wet van nabijheid
Objecten die dicht bij elkaar staan worden als een geheel gezien. Dit zie je terug bij titels boven een tekst, de kop die het dichtst bij een tekst staat lijkt er bij te horen. De wet van dichtheid gaat het makkelijkst de verkeerde kant op. Door bijvoorbeeld ruimtegebrek kunnen objecten dichter bij elkaar komen te staan waardoor ze bij elkaar lijken te horen, terwijl dat op dat moment niet het geval is.

2.1 2.2

 

Wet van continuering
Objecten die in een doorgaande lijn of kromming zijn geplaatst worden door de waarneming gegroepeerd. Zo is in de onderstaande afbeelding de illusie gewekt dat er twee kromme lijnen staan, terwijl het gerangschikte cirkels zijn. Zelfs als er op dezelfde lijn minder cirkels staan zouden de lijnen duidelijk zijn. In dit geval maken de hersenen het beeld af. In sommige verklaringen van de wetten wordt de wet van continuering ook toegewezen aan de lijnen die naar een horizon toelopen en zo het idee geven van diepte.

3.1 3.2

 

Wet van geslotenheid
Objecten die omrand worden door een lijn worden als geheel gezien. Die rand hoeft echter niet geheel aanwezig te zijn. Dingen die doorkruist worden door een lijn worden als twee aparte groepen waargenomen.

4.1 4.2

 

Wet van eenvoud
De hersenen nemen objecten waar in de meest eenvoudige vorm. Dus de eerste afbeelding wordt gezien als twee rechthoeken met een golf er voor en niet zoals de indeling in de derde afbeelding.

5.1 5.2 5.3

 

Extra: figuur-achtergrondbetrekking
Ondanks dat er in de inleiding staat dat er vijf wetten zijn, wil ik hier nog een zesde aan toevoegen. Deze wet wordt maar in één enkele bron genoemd, maar is zo van belang in het dagelijks webdesign dat ik het een standaard zesde wet zou willen maken. De letters op de volgende achtergronden zijn hetzelfde evenals de achtergronden zelf, alleen de plaatsing is anders. Hier is te zien dat de tekst links niet rustig leest ondanks dat de letters op het linker- en rechter vlak beter zichtbaar zijn op de achtergrond. Op de rechter afbeelding zijn de letters helemaal niet duidelijk te lezen door te weinig contrast met de achtergrond, maar het is wel makkelijker om de tekst aan één stuk door te lezen. Je ogen lijken even tijd nodig te hebben om aan het lage contrast te wennen en midden in een regel tekst in een grotere tekst moet dat meerdere keren opnieuw om de tekst te kunnen lezen.

6.1 6.2

 

Extra: Geslotenheid en continuering
7.1Een van de redenen dat de ene bron een afbeelding voor geslotenheid gebruikt en vervolgens een andere bron diezelfde afbeelding voor continuering gebruikt is omdat deze twee veelal samen worden gebruikt. Het is namelijk zo dat een afbeelding niet alle lijnen nodig heeft om de boodschap over te brengen. De afbeelding hieronder geeft dat duidelijk weer, de hersenen vullen vormen aan en zorgen er voor dat je vier cirkels kunt voorstellen maar ook een vierkant. Dit valt onder continuering.
De overlapping komt hier naar voren doordat dit zelfde voorbeeld wordt gebruikt om een kader en daarmee geslotenheid aan te geven. Hier geldt dus weer hetzelfde, niet alle lijnen zijn nodig om de boodschap over te brengen, zo ook de boodschap van geslotenheid.
Soms wordt eenvoud hier ook nog eens bij betrokken door de woordkeuze. Eenvoud wil in dit geval niet zeggen dat de afbeelding zo min mogelijk lijnen bevat. Eenvoud wil zeggen dat de hersenen de makkelijkste uitleg kiezen als een afbeelding ook op een minder eenvoudige manier uit elkaar gehaald kan worden.

 

Bronnen:

Gestaltpsychologie en webdesign http://www.usabilityweb.nl/2006/05/gestaltpsychologie-en-webdesign/ (09-04-2010)

Gestalt – Wet figuur-achtergrondbetrekking http://members.quicknet.nl/m.vanharten/c&v/figuur-achtergrondbetrekking.htm (26-03-2010)

Next Post

Previous Post

© 2019 TinkDifferent

Theme by Anders Norén