Human Centered Design & Gestalt

Notion fondamentale en design et graphisme, la théorie de la Gestalt aide le web designer à mettre visuellement en place ses projets, et cela de manière réfléchie. Pour cela, elle définit les différentes manières dont le cerveau perçoit son environnement, en le structurant et le simplifiant par des formes. Une forme est constituée par un ensemble d’éléments qui, seuls, ne peuvent être interprétés correctement.

“La relation et l’interaction des éléments les uns avec les autres forment un tout.”

La théorie de la Gestalt se décline sous 7 lois :

  • La proximité
  • La similarité
  • La symétrie
  • La clôture
  • La continuité
  • Le fond/la figure
  • Le point focal

Bien que ces lois soient applicables dans le domaine de la photographie, nous nous concentrerons sur le web en analysant 3 sites dégageant au moins une de ces lois.

Site n°1 : Swabtheworld

  1. La symétrie : la section est divisée en deux par un axe central.
Symétrie

2. Fond: les sections sont séparées par des fonds de couleur différentes.

Fond

3. Clôture : les différents articles sont séparés par des lignes horizontales et les liens en bas de page par des encadrés.

Clôture

3. Proximité : on retrouve une suite d’éléments qui sont proches les uns des autres pour délimiter un rappel de la navigation. On peut aussi dégager la loi de Similarité entre les éléments de navigation.

5. La continuité : Quand plusieurs éléments permettent une navigation continu, quand des éléments donne un sens de lecture. Dans ce cas-ci, il s’agit des éléments de texte qui donnent un sens de lecture.

Continuité
Continuité

Site n°2 : Stelvio.k95

  1. Le Point focal : L’affiche rouge se trouvant au centre de l’écran attire directement l’attention grâce à sa position et à sa couleur.
Point Focal

2. La Similarité : pour les éléments de navigation

Similarité

3. La Proximité

Proximité
Proximité

4. La Clôture

Clôture
Clôture

Site n°3 : Locomotive

  1. La Similarité
Similarité
Similarité (liens)

2. La Clôture

Clôture

3. Le Point focal

Point focal

4. La Continuité

Continuité

Here I am

Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Aude Schaff

Aude Schaff

Here I am

More from Medium

Reflection Point: Product Design for a Digital Artist

Don’t rely on colours alone!

This picture represents how people with color blindness see red light.

We Are Surrounded by Design: Embodying an Ethical Human-Centered Design Practice

The journey so far: Accessibility for a large E-commerce website

Close up of a laptop computer keyboard with hands typing