Quand la psychologie fait la rencontre du design.

Morgane Laurent
Oct 27, 2018 · 5 min read

Dans cet article, nous allons parler des 7 principes de la loi de Gestalt.

Qu’est-ce que la loi de Gestalt ?

Connu aussi sous le nom de “théorie de la forme”, la loi de Gestalt est une théorie basée sur 7 principes de la perception. Cette théorie va nous servir à structurer les informations que reçoit notre cerveau d’une manière à simplifier et organiser ce que nous percevons.

#1 La similarité.

Par exemple, sur le site de Stripe & Amazon.

Les éléments semblables dans leur taille, couleur et forme ont tendances à être perçus comme appartenant au même ensemble.

#2 La proximité.

Youtube & Kinepolis.

Des éléments proches les uns des autres ont tendances à nous faire croire qu’ils font parti d’un même ensemble.

#3 La clôture.

Youtube & Amazon.

Notre cerveau tente de combler les vides afin de percevoir un ensemble dans sa totalité.

#4 La symétrie.

Ikea & Spotify.

Les éléments comportent des axes de symétrie, ils sont plus facilement perçus comme un ensemble et son plus cohérent.

#5 La continuité.

Fnac & Google Drive.

L’utilisateur est guidé par les flèches. Ces flèches permettent d’attirer l’attention de l’utilisateur afin de comprendre qu’il y a une continuité.

#6 Fond / Figure.

Google Drive & Netflix.

Les éléments “figures” se détachent du fond ce qui donne une impression de profondeur.

#7 Le point focale.

Bose & Spotify.

Des éléments qui attirent le regard.

Exemples multiples :

#1 Samsung.

En orange, nous pouvons voir la loi de continuité. Les flèches sur chaque extrémité, nous laissent devinés qu’il y a une suite derrière tout ça.

En rouge, c’est la loi de fond / figure. La couleur de fond fait bien ressortir le texte blanc, ce qui donne bien cette impression de détachement par rapport au fond.

En bleu, la loi de similarité. Comme nous pouvons le voir le texte est écrit de la même taille, de la même couleur et de la même “forme” ce qui nous donne donc cette impression d’ensemble.

#2 Apple.

En bleu, la loi de similarité. Les éléments sont cette fois-ci mis horizontalement mais nous avons toujours l’impression qu’ils font parti du même ensemble puisqu’ils sont de même taille, couleur et “forme”.

En mauve, la loi de fond / figure. Ici nous apercevons bien le contraste noir et blanc, le fait que le texte soit mis en blanc sur un fond noir laisse penser à une certaine profondeur ce qui nous donne l’impression de détachement.

En vert, la loi de symétrie. Les éléments sont placés de façons identiques par rapport à l’axe ce qui donne une cohérence et une vue d’ensemble.

#3 Skype.

En mauve, la loi du point focale. Comme vous pouvez le constater la première chose qui vous saute aux yeux est le bouton bleu “Télécharger Skype”. Une des seule chose colorée, tout est presque totalement en blanc et noir ce qui attire donc notre regard immédiatement sur ce fameux bouton bleu.

En rouge, la loi de la symétrie. Des 2 côtés de l’axe, nous apercevons la même disposition des éléments. Cette symétrie des 2 côtés de l’axe donne une cohérence d’ensemble.

En orange, la loi de continuité. La flèche sur le côté nous laisse deviner qu’il y a une suite et indique à l’utilisateur la marche à suivre.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade