Share
L'un des grands secrets du design est d'apprendre à guider la direction visuelle des spectateurs. Même les concepteurs les plus expérimentés ignorent souvent ce principe. Nous allons donc examiner de plus près son fonctionnement. La direction visuelle contrôle le mouvement des yeux de l'utilisateur. ceci peut être réalisé en choisissant soigneusement vos images et en utilisant des éléments de conception bien placés et alignés.
Il est largement établi que le mouvement des yeux par défaut sur toute la page (dans une LTR - de gauche à droite - agencement) va du haut vers la gauche vers le bas à droite, comme illustré:
Toutefois; cela ne peut pas être plus éloigné de la vérité, en organisant les éléments de composition d'une certaine manière, un concepteur peut contrôler et forcer le mouvement des yeux du spectateur dans et autour de la mise en page du dessin. Par exemple, l’œil suivra une trajectoire réelle, telle qu’une ligne continue ou en pointillé, ou des trajectoires plus subtiles, allant d’éléments volumineux à de petits éléments, d’éléments sombres à des éléments plus clairs, de couleur à non-couleur, de formes inhabituelles aux formes habituelles, etc. La graduation de la taille, ainsi que la répétition des formes et de la taille des éléments associés conduisent subtilement à l'œil.
Les images peuvent facilement contrôler la façon dont vos clients voient votre conception. Vous trouverez ci-dessous quelques exemples explicites d’images directionnelles pouvant être utilisées dans le cadre de votre conception ou dans le contenu afin de guider les visiteurs dans la page:
Bien sûr, la direction indiquée par ces images est assez évidente, même si de nombreuses images peuvent ne pas être aussi claires, regardez ces autres exemples:
C’est l’une des erreurs les plus commises par les concepteurs et les éditeurs de contenu. En règle générale, ne regardez jamais vos images vers l’extérieur de votre page. Les images (surtout les visages et les yeux) doivent être orientées vers le centre de votre conception..
Jetez un coup d’œil à ces exemples des sites Web de CNN et de la BBC:
Dans l'exemple de la BBC, les deux images en haut à gauche regardent toutes deux du centre de la page, ce qui conduit à "ne pas voir" des informations importantes le long du chemin par défaut, comme illustré:
Maintenant, comparez cette prochaine version "corrigée" de la page d'accueil de la BBC à la version précédente ci-dessus:
En regardant cette version, vous remarquerez que votre œil ne bouge pas en dehors de la page, les visages des gens tournés vers l'intérieur vous aident à regarder dans la même direction vers le centre de la page..
Cet exemple montre deux façons d'aligner les étiquettes sur les champs de votre formulaire, ce qui peut grandement affecter la facilité avec laquelle les utilisateurs peuvent remplir ce formulaire:
Sur la gauche, nous avons des étiquettes alignées en haut qui sont plus rapides et faciles à remplir que des étiquettes alignées à gauche ou à droite (à droite). En effet, les étiquettes alignées en haut requièrent la moitié moins de mouvements des yeux que les étiquettes alignées à gauche ou à droite. Les étiquettes alignées en haut permettent également aux utilisateurs de descendre le formulaire dans une direction visuelle, au lieu de deux directions visuelles avec des étiquettes alignées à gauche et à droite. Cela permet de remplir les formulaires plus rapidement et plus facilement.
Le placement ne contrôle pas seulement la façon dont l’œil bouge, mais contribue également à faciliter l’utilisation du motif, même à un niveau subconscient..
L'élément de direction peut avoir une influence puissante sur l'ambiance d'un dessin, mais prendre une décision de conscience concernant la direction dominante dans un dessin peut avoir un effet notable sur l'atmosphère du travail..
Parfois, l'image ou la mise en page dictera la direction dominante. Parfois, cela vous permettra d'imposer une direction.
Les lignes horizontales claires dans les dessins ci-dessous donnent une sensation de calme, de stabilité, de tranquillité et de calme.
Dans le deuxième groupe ci-dessous, la disposition en diagonale des éléments renforce le sentiment de mouvement et d'action.
Le troisième groupe a une direction verticale dominante qui ajoute une influence ordonnée statique à ce qui pourrait être autrement aléatoire, donne également un sentiment de vigilance et de formalité.
Le même changement de caractère peut être vu dans ces trois photographies. Le sujet est le même dans chaque image, le changement d’emphase directionnelle crée une atmosphère différente dans chaque image..
L'accentuation verticale dans la première image donne une sensation de formalité ordonnée; la deuxième accentuation horizontale semble calme et stable tandis que la troisième accentuation diagonale est active et animée.
Gardez toujours à l'esprit ce que vous voulez que votre public ressente, définissez l'ambiance en choisissant l'orientation de votre conception, puis appliquez-le en choisissant la disposition du contenu et la sélection des images appropriés..
Lorsqu'il s'agit de conceptions basées sur des formulaires ou du texte, comprendre comment vos visiteurs déplaceront leurs yeux autour d'un design améliorera considérablement la convivialité de votre travail..
Accentsconagua