illustration of an arrow in a target

Human Centered Design

Human Centered Design

Avant de pouvoir interpréter une oeuvre de Piotr Ilitch Tchaïkovski, il faut avant tout une bonne partition. Dans le même ordre d’idées, avant de pouvoir se lancer dans la création d’un site web il nous faut une marche à suivre. C’est justement à cela qu’a servi le cours d’HCD.

Il nous a fait comprendre que nous ne créons pas pour les autres mais avec les autres. C’est un cours très vaste mais des plus intéressants, il m’a d’ailleurs appris ce qu’est réellement le design, un moyen de communication.

Objectif

Dans le cadre de ce cours, il nous a été demandé de réaliser un site internet, relatant le, ou les, points que nous avions préféré découvrir ou bien apprendre à nouveau.

Personnellement, la partie du cours que j’ai le plus appréciée, est celle concernant les lois de la Gestalt. En effet, j’ignorais qu’un beau site suivait des règles qui le rendaient propre, lisible et épuré.

„Gestalt ? Was ist das ?“

illustration of Gestalt's principles Auteur inconnu

La théorie de la Gestalt ( « forme »  en allemand), est une théorie d’origine allemande définissant les principes de la perception. Le raisonnement est simple : notre cerveau s’appliquerait à décomplexifier notre environnement, en mettant en forme ce qu’il perçoit, afin de le simplifier et de l’organiser.

Pour cela, il parvient à détacher les informations les plus importantes pour nous, de leur fond, pour les intégrer à une structure globale. Cette théorie, s’applique à tous les sens.

Les lois

Le nombre de ses lois s’élève à 7. Ce sont les suivantes :

Tout au long de ce site, chacune d’elle sera abordée, expliquée et illustrée.

La similarité

pink and black discs's illustration

Elle permet de percevoir des éléments semblables dans un ensemble d’éléments, même s’ils sont séparés.

En d’autres termes, les éléments partageant des caractéristiques visuelles similaires sont perçus comme étant plus liés que ceux ne partageant pas les mêmes caractéristiques.

La proximité

example of proximity

Les éléments qui sont proches, sont considérés comme faisant partie d’un même ensemble.

Concernant l'image  « HCD » , notre cerveau combine chacune des barres horizontales adjacentes pour créer une seule image d'elle. C'est pourquoi, nous voyons trois lettres, au lieu de 8 lignes horizontales.

La clôture

letter G

Elle consiste à remplir les informations visuelles manquantes en séparant des éléments pour voir une chose dans sa totalité.

Le secret pour obtenir une clôture parfaite est de fournir suffisamment d’informations à l’œil pour compléter le reste. Par exemple, dans l'image ci-dessus, nous observons dans l’espace négatif la lettre  « G » .

La symétrie

deer's head

Disposition régulière d’objets semblables, et d’un même angle d’amplitude, de part et d’autre d’un axe.

Cela va sans dire, lorsque les éléments que l'on regarde comportent des axes de symétrie, ils sont plus facilement perçus comme une forme globale. Dans la présente illustration, nous observons la symétrie grâce aux informations représentées identiquement de part et d'autre de l'axe de symétrie.

La continuité

deer

Des points rapprochés tendent à représenter des formes, nous les percevons comme des prolongements les uns par rapport aux autres.

Nous comprenons facilement que les éléments disposés dans une ligne ou une courbe douce, sont perçus comme étant plus liés que ceux disposés de manière aléatoire ou dans une ligne dure. Dans l'exemple ci-dessus, le dessin étant constitué d'un unique trait continu, aide notre oeil à en effectuer la lecture.

Fond/Figure

illustration of boy with bee Par Ghani Pradita, pour Paperpillar

Les contours étant clairement définis, nous détachons facilement l’avant plan de l’arrière plan (la figure du fond).

Dans l'illustration, le personnage et l'abeille sortent du fond. Attention toutefois, au trop de  « fioritures graphiques » , si elles sont omniprésentes, elles seront interprétées comme des formes à part entière et perturberont la lecture des contenus principaux.

Le point focal

heart's illustration

Ce phénomène comporte que notre regard converge vers un point, une zone, ou un texte.

C’est à dire que des lignes de force, ou des effets feront en sortes qu’un élément ressorte. Dans l'image ci-dessus, notre oeil est clairement attiré vers son centre, à savoir le coeur.

Références