Comment utiliser la perception figure-fond en design ?

perception figure fond

Sur Graphiste.com, recevez rapidement des devis pour réaliser votre projet Graphistes. Trouver un freelance disponible

L’une des théories les plus utiles en design, celle qui vous dira comment mettre en avant des éléments sur vos publications visuelles, c’est celle qui parle de la perception figure-fond.

Issue de la gestalt – comme la loi de clôture ou la loi de similitude, entre autres – , cette loi s’appuie sur les principes d’avant-plan et d’arrière-plan.

Et il existe de nombreuses manières de l’utiliser…

Pourquoi tout repose sur un vase (ou pas)

La perception figure-fond s’appuie sur l’idée que nous établissons une distinction entre la figure, qui se détache visuellement, et le fond, qui est moins distinct. L’une des illustrations parmi les plus connues de cette théorie est le dessin du vase d’Edgar Rubin.

vase d'Edgar Rubin

Selon la manière dont on le regarde, et surtout selon celle dont il est encadré, vous verrez apparaître deux visages de profil, se faisant face, ou un vase.

Dans cet exemple, surtout pour la version noir et blanc, on parle d’image instable : il est facile de passer d’une perception à l’autre, et aucune ne prend le dessus. C’est un peu plus difficile, cependant, quand le vase est un peu plus décoré : il faut savoir que les visages sont là pour qu’ils apparaissent.

Il existe d’autres astuces qui permettent de faire ressortir une figure.

Les éléments qui attirent l’attention

Il existe différentes options pour indiquer au cerveau sur quelles parties d’une image se focaliser :

  • La taille : une théorie visuelle veut que, lorsque deux éléments se chevauchent ou se superposent, le plus petit des deux est automatiquement considéré comme étant la figure, c’est-à-dire la forme principale à regarder. Donc un petit pois sur une nappe blanche apparaîtra bien comme important !
  • Le relief : il a aussi été établi qu’une forme convexe, soit bombée vers l’extérieur, aura plus tendance à être considérée comme une figure qu’une forme concave (et creusée).
  • Les couleurs : les teintes chaudes renforcent les figures, les froides seront plus réservées aux fonds.
  • L’emplacement : c’est avant tout une question de perspective. Les éléments placés en bas d’un visuel semblent plus proches de nous, donc plus importants, que ceux disposés dans la partie haute
  • Le contraste : un contraste important permet de mettre encore plus en évidence un élément par rapport à l’autre. Dans le cas contraire, une ambiguïté se crée, mais vous pouvez également jouer avec.

Tous pareils ou tous différents : le combat visuel !

Jouer sur les ombres et les contrastes permet de créer des visuels qui s’approchent des illusions d’optique, comme dans le cas du vase d’Edgar Rubin, vu plus haut.

C’est aussi une pratique utilisée par certains graphistes pour proposer de doubles niveaux de lecture des images.

perception figure fond
Créateur : Simon C. Page

En forçant l’œil à naviguer entre les deux versions possibles d’un visuel, vous captez l’attention de son propriétaire. Ce qui est toujours une bonne option en communication, et qui doit être le but recherché par toutes vos compositions graphiques.

exemple figure fond
Créateur : Michael Pippo

Comment utiliser la perception figure-fond en web design ?

Connaître les bases de cette perception aide à savoir comment mettre en avant un élément… mais aussi comment indiquer très facilement à un internaute là où il doit concentrer son attention, ou l’endroit où il peut cliquer.

C’est ainsi que l’organisation d’un site doit s’appuyer sur un fond en retrait, avec différentes zones qui deviennent des figures, essentiellement par le biais des contrastes de couleur.

Ce n’est pas totalement innocent non plus si les appels à l’action sont positionnés dans le bas des écrans : ils sont ainsi plus proches des utilisateurs, qui n’ont pas de grands efforts à effectuer pour appuyer dessus !

Le design, c’est de l’instinct, de l’art, mais c’est aussi de la psychologie.