Table des matières
L'une des théories psychologiques les plus influentes dans les domaines de l'UX et du design d'interaction est la théorie de la Gestalt. Cette théorie a été fondée par des psychologues allemands et le mot "Gestalt" signifie... formulaire ou forme Comme son nom l'indique, l'idée qui sous-tend les principes de la Gestalt est que les êtres humains perçoivent des groupes d'objets comme des modèles plutôt que comme des objets individuels.
Il existe de nombreux articles sur les principes de la Gestalt, mais peu d'entre eux vous aident à comprendre comment les appliquer dans votre travail en tant que designer UX/UI. Cet article vous donnera quelques idées sur la façon d'utiliser les principes de la Gestalt pour créer de meilleurs designs UX et UI qui aideront les gens à atteindre leurs objectifs avec moins d'efforts.
La loi de similitude
Le principe de similitude stipule que lorsque des objets sont physiquement similaires, nous avons tendance à les regrouper et supposent qu'ils disposent de la même fonctionnalité Par exemple, dans l'image ci-dessous, il est assez facile de distinguer la ligne qui contient les cercles rouges bordeaux du reste de l'image en raison de sa couleur différente.
Un exemple du principe de similitude. Photo de l'auteur.
Utiliser la similitude dans la conception UX et UI
Imaginons que votre entreprise ait développé une application appelée "Il Mio Chef" qui est utilisée par les amateurs de cuisine italienne à travers les États-Unis et le Canada (nous l'utiliserons pour le reste de cet article). Un rapport récent que votre chercheur UX vous a remis indique que lorsqu'il s'agit de commander de la nourriture italienne, les utilisateurs s'intéressent surtout aux restaurants les plus proches d'eux. Après tout, nous voudrions tous avoir notre repas le plus proche possible.des lasagnes ou des pizzas livrées alors qu'elles sont encore fraîches et chaudes, n'est-ce pas ?
Pour aider les utilisateurs de l'application à voir quels sont les restaurants les plus proches d'eux, nous pouvons utiliser le principe de similarité en mettant en évidence ces restaurants dans l'interface utilisateur. Dans l'image ci-dessous, vous pouvez voir comment la mise en évidence de ces options en jaune (à droite) fait une grande différence en soulignant visuellement la différence entre les restaurants les plus proches et ceux qui sont plus éloignés. C'est ainsi que vous pouvezpeut utiliser le principe de similarité pour aider vos utilisateurs à trouver rapidement ce qu'ils cherchent.
Utilisation du principe de similarité de la Gestalt, image de l'auteur.
Voir également: Appliquer l'ombre dans la conceptionLa loi de proximité
Le principe de proximité stipule que les objets situés à proximité les uns des autres semblent être plus liés Par exemple, la première image et la deuxième image contiennent le même nombre de cercles. Cependant, dans la deuxième image, certaines colonnes sont plus proches les unes des autres et donnent l'impression d'avoir trois groupes distincts au lieu d'un seul grand groupe.
Proximité - exemple 1 - un grand groupe Image de l'auteur.
Voir également: Entretien avec Flowing Comics
Proximité - exemple 2 - trois groupes distincts Image de l'auteur.
Utiliser la proximité dans le design UX et UI
Prenons un exemple dans le domaine de la visualisation de l'information.
Cette fois-ci, imaginons que vous êtes un cadre qui souhaite connaître les performances de votre application "Il Mio Chef". Vous voulez examiner les indicateurs clés de performance qui mesurent les résultats financiers, l'engagement et la satisfaction des utilisateurs. Au début, votre spécialiste de la visualisation de l'information crée le tableau de bord ci-dessous qui vous amène, ainsi que tous les autres cadres, à vous perdre dans les chiffres et à poser encore plus de questions. Au bout d'un mois, vous êtes nombreux à vous interroger sur l'utilisation de l'application "Il Mio Chef".cesser tout simplement d'utiliser ce tableau de bord.
Tableau de bord des indicateurs clés de performance - Il Mio Chef - Image de l'auteur.
À ce stade, vous retournez voir votre spécialiste en visualisation d'informations et lui demandez de faciliter la compréhension du tableau de bord en le remaniant. Le principe de proximité s'avère utile dans ce cas, et vous pouvez voir le nouveau design ci-dessous. Il contient trois groupes divisés par le type d'ICP et aide tout le monde à comprendre comment l'application se comporte en termes financiers et en termes d'efficacité.Le regroupement d'objets et l'utilisation d'un plus grand nombre d'espaces blancs entre les groupes peuvent aider vos utilisateurs à assimiler les informations plus rapidement.
Utilisation du principe de proximité de la Gestalt dans la conception d'un tableau de bord. Image de l'auteur.
La loi de la continuité
Le principe de continuité stipule que lorsque l'œil commence à suivre un objet, il continue à suivre le "mouvement" dans cette direction jusqu'à ce qu'il rencontre un autre objet. Ce mouvement nous aide à percevoir l'objet comme faisant partie du même chemin que nous devons emprunter pour trouver des informations. L'image ci-dessous montre comment nous pouvons utiliser le principe de continuité pour créer de tels schémas visuels qui guident l'œil dans sa recherche d'informations.l'œil dans une direction particulière.
Un exemple du principe de continuité. Image de l'auteur.
Utiliser la continuité dans la conception UX et UI
Votre chercheur UX a présenté un nouveau rapport qui montre que la principale motivation des utilisateurs de l'application "Il Mio Chef" est l'exploration de la nourriture, puisqu'elle leur permet d'accéder à de nouveaux restaurants italiens chaque semaine. Vous regardez la métrique qui montre combien de fois les utilisateurs passent d'une option à l'autre avec l'interface utilisateur actuelle dans l'image ci-dessous (côté gauche) et vous voyez qu'ils ne passent jamais plus de deux fois sur l'application "Il Mio Chef".pour voir quelles sont les options qui s'offrent à eux.
En utilisant le principe de continuité (côté droit de l'image ci-dessous), votre concepteur UX a permis d'augmenter ce nombre à environ 10 swipes en moyenne. Comment cela s'est-il produit ? En cachant une partie de l'image et en soulignant le fait que vous devez swiper à gauche ou à droite pour voir ce qu'il y a dedans, les yeux de vos utilisateurs ont été guidés pour créer littéralement le mouvement de " swipe " et ont été plus motivés pour explorer plus de restaurants et deC'est une chose que la conception précédente ne vous incitait pas du tout à faire, même si vous êtes déjà intrinsèquement motivé à le faire.
Utiliser le principe de continuité de la Gestalt dans la conception UX/UI Image de l'auteur.
En résumé En utilisant les principes de la Gestalt présentés dans cet article dans votre design UX et UI, vous pouvez aider vos utilisateurs à trouver l'information plus rapidement et à mieux la digérer. En outre, cela peut augmenter leur satisfaction à l'égard de votre produit en les motivant à faire les actions qu'ils aiment le plus.
La couverture comprend un dessin de Miklos Philips, édité dans Vectornator.
