Info-bulle sans flèche: convivialité?
Je travaille sur un projet utilisant Angular Material, un framework basé sur les spécifications de conception de matériaux de Google. En tant que tel, il utilise info-bulles sans flèche comme ceci:
Selon la directive:
Les info-bulles n'ont pas de flèches directionnelles; au lieu de cela, ils comptent sur le mouvement émanant de la source pour transmettre la direction.
Peut-être que cela fonctionnera sur mobile, mais dans les applications Web complexes avec plusieurs éléments interactifs à l'écran, il semble un peu trop sûr de supposer que l'utilisateur sera toujours en mesure de comprendre d'où provient l'info-bulle. Dans de tels cas, la suppression de la flèche peut gêner la reconnaissance de la source de l'info-bulle.
Je voudrais demander au Angular Material d'envisager d'ajouter des flèches à leurs info-bulles, mais comme cela va à l'encontre des directives de conception de matériaux désormais presque sacrées, j'aimerais demander ici s'il y a des raisons valables de supprimer les flèches des info-bulles. Toute recherche sur l’utilisation des info-bulles serait également utile.
Ce n'est pas une réponse complète, et ne parle que de l'intention originale du PO, celle de demander Angular Matériel pour envisager d'ajouter des flèches. Le but de cette réponse partielle est de montrer votre voie pour le changement est Google et Android, pas Angular Material.
Cela réside dans la description de Angular But et intention du matériau:
"Pour les développeurs utilisant AngularJS, Angular Material est à la fois un cadre de composant d'interface utilisateur et ne implémentation de référence de la spécification de conception de matériaux de Google. Ce projet fournit un ensemble de réutilisable, bien- composants d'interface utilisateur testés et accessibles basés sur la conception matérielle. "
J'ai mis en gras la partie pertinente.
En d'autres termes, Angular Material ne suivra que les règles et directives des spécifications de conception de matériaux de Google afin qu'il puisse servir de référence pour Angular utilisateurs et défenseurs.
Si vous voulez changer Angular Material, vous devrez changer d'avis de Google. Il ressemble à Angular Material Founders). lettre.
Quant à la question plus complète, oui ... non. Je ne vois aucune raison valable de supprimer/supprimer des flèches et de ne pas les fournir en option. Les considérations esthétiques que je peux concevoir ne sont pas des raisons valables.
J'ai tendance à être d'accord avec votre sentiment, sinon votre raisonnement. Il n'y a rien de mal avec les flèches, elles devraient être facultatives dans tout cadre respectueux de ses utilisateurs. Les légendes devraient également être une option pour les info-bulles, l'introduction, la clarification et les instructions.
Si j'interprète correctement votre question, il semble que votre principal problème avec la manière Angular Material recommande d'implémenter les info-bulles est le suivant:
Peut-être que cela fonctionnera sur mobile, mais dans les applications Web complexes avec plusieurs éléments interactifs à l'écran, il semble un peu trop sûr de supposer que l'utilisateur sera toujours en mesure de comprendre d'où provient l'info-bulle.
Personnellement, je crois que les utilisateurs verront toujours d'où vient l'info-bulle quand cela leur importe. Pour plusieurs raisons, énumérées ci-dessous. Je n'ai pas de citations de recherche spécifiques pour celles-ci, mais ce sont les informations pertinentes que j'ai apprises dans mes études de psychologie et d'expérience dans la conception d'expériences utilisateur sur le Web:
- Les curseurs des utilisateurs ont tendance à suivre leurs yeux. Lorsque nous utilisons des services numériques, nous avons tendance à déplacer le curseur de la souris de concert avec nos yeux, ce qui rend l'emplacement du curseur approximatif avec l'attention de l'utilisateur sur une zone particulière de la page.
- Le contenu en dehors de la zone de concentration actuelle de l'utilisateur n'est pas pertinent pour lui, à ce moment d'attention donné. Si l'utilisateur n'est pas concentré sur une section particulière de la page, ou sur un élément particulier, toute info-bulle qui se développe à partir d'un élément dans cette zone peut être considérée comme non pertinente pour lui à un moment donné, car son attention est ailleurs. En combinaison avec la première déclaration ci-dessus, si l'utilisateur est intéressé par un élément particulier et que son attention est là, son curseur sera également dans cette zone et il remarquera très probablement que l'infobulle se développera et notera d'où vient l'info-bulle.
- Le mouvement est l'un des aspects les plus fondamentaux et les plus sensibles du système visuel humain. S'il existe un regroupement de fonctionnalités, plusieurs boutons au même emplacement, vous avez raison, il peut sembler difficile pour les utilisateurs de percevoir de quel élément l'infobulle émane. Cependant, l'œil humain est incroyablement sensible au mouvement des objets; sa vitesse, sa direction, sa trajectoire. Dans des cas comme l'exemple ci-dessus, de Google Docs, il peut sembler que la proximité des actions rendrait impossible de déterminer de quel élément l'infobulle provient. N'ayant pas fait de recherche empirique à ce sujet, je supposerais que les utilisateurs auraient peu ou pas de problème dans ce scénario et, en fonction de l'animation/de l'emplacement de l'infobulle, interpréteraient correctement à quel élément l'infobulle appartient. Cette sensibilité au mouvement nous protégeait des prédateurs, maintenant elle nous protège des erreurs sur le web ... hehe
L'animation attire toujours l'attention de l'utilisateur, et une info-bulle apparaît généralement sur la souris ou tout type d'action de mise au point. C'est donc le résultat d'une action donc vous pouvez être sûr que l'utilisateur remarque la petite animation qui indique d'où vient l'info-bulle.
Si d'ailleurs votre écran est si encombré de fonctionnalités, vous pourriez reconsidérer le placement de certaines fonctionnalités?
Selon Material Design Guidelines :
Les info-bulles n'ont pas de flèches directionnelles; au lieu de cela, ils comptent sur le mouvement émanant de la source pour transmettre la direction.
Si nous regardons l'exemple de bureau répertorié, vous verrez plusieurs éléments côte à côte.
Même si l'infobulle borde son élément voisin, elle ne le chevauche pas. L'info-bulle est toujours associée à l'élément situé au-dessus. En combinaison avec l'animation, je pense que cela devrait être suffisant pour comprendre. Et tout comme Yakke l'a dit; si votre écran est tellement encombré qu'il n'y a pas d'espace pour distinguer clairement où appartient l'infobulle, alors vous voudrez peut-être reconsidérer le placement des éléments.
Quelque chose que je pense aussi vraiment utile est le fait que sur un bureau, vous avez un curseur, qui est un rappel constant de ce que vous survolez exactement.
Je pense que le fait d'avoir une flèche pourrait augmenter la convivialité, mais je doute de combien. Je n'ai trouvé aucune recherche pour étayer cela, ce serait formidable si quelqu'un d'autre pouvait le trouver.