web-dev-qa-db-fra.com

Modèles de conception pour la découvrabilité

Quels sont les modèles de conception éprouvés pour la découvrabilité dans l'interface utilisateur/UX, où les informations ou une fonctionnalité ne sont pas nécessairement visibles à première vue, mais sont détectables en utilisant l'interface via une divulgation progressive? Comment signaler qu'une interface a des éléments découvrables?

32
Virtuosi Media

L'ensemble de l'article lié suivant est intéressant, mais la section suivante est pertinente et je pense qu'il vaut la peine de l'inclure dans le contexte de cette question, même s'il ne fournit pas de réels modèles.

D'après Scott Berkun Le mythe de la découvrabilité (2003)

Comment pouvez-vous réellement rendre quelque chose découvrable?

En tant que designer, vous disposez d'une poignée de ressources pour mettre l'accent sur les choses et essayer d'attirer l'attention sur elles:

  • Immobilier : Vous obtenez une certaine quantité de pixels à utiliser comme vous le souhaitez. Les cibles plus grandes seront probablement localisées en premier et plus faciles à trouver. Les grandes cibles sont des cibles plus faciles.
  • Ordre : Vous pouvez placer les choses dans des ordres spécifiques, de gauche à droite et de haut en bas, qui peuvent former des modèles que les gens peuvent apprendre à suivre, selon leur langue (certains sont de gauche à droite, certains de droite à gauche, etc.).
  • Forme : Vous pouvez utiliser la couleur, la police, la forme, l'ombre, la composition et d'autres constructions de conception graphique pour vous aider à utiliser les biens immobiliers dont vous disposez.
  • Attentes et flux : Selon la façon dont vous utilisez ce qui précède, vous pouvez mettre les choses sous des formes ou des schémas qui sont en quelque sorte familiers aux gens. Les exemples les plus évidents sont les journaux imprimés et l'utilisation des colonnes, des sauts de ligne et des en-têtes. Cela peut être réalisé en émulant une autre conception à partir d'un autre site Web ou de quelque chose dans le monde réel.
  • Cohérence : Si vous utilisez l'écran de manière cohérente, vous pouvez apprendre aux gens à rechercher certains types de commandes à certains endroits. En étant prévisible, vous pouvez marquer des points de découverte supplémentaires. Cela peut souvent être aidé en utilisant les conventions disponibles et en essayant d'utiliser les connaissances que vos utilisateurs possèdent déjà.

Chaque métaphore ou paradigme que vous connaissez peut-être (GUI, Windows, Mac, Amazon.com, etc.) utilise des biens immobiliers, des commandes et des formulaires pour obtenir les résultats qu'ils obtiennent. Les bons systèmes fournissent des constructions de base pour rendre les éléments découvrables qui peuvent facilement être réutilisés.

20
Roger Attrill

Une idée consiste à aligner la fonctionnalité que vous souhaitez découvrir avec le comportement utilisateur existant . (Je n'ai qu'un seul exemple en tête, donc je ne peux pas en toute honnêteté appeler cela un "modèle" pour l'instant.)

L'exemple de cette méthode consiste à remarquer que les utilisateurs ont tendance à essayer par réflexe de faire défiler davantage dans les applications Twitter ou rss iphone/ipad, surtout si le flux Twitter/rss a tendance à se rafraîchir périodiquement par lui-même et à en ajouter plus en haut. Notez que ce comportement, même lorsqu'il n'y a pas de mises à jour non lues "au-dessus de la ligne de flottaison", et au lieu qu'il s'agisse d'un événement nul, lui associe une actualisation manuelle. Et maintenant, vous avez "tirer vers le bas pour rafraîchir". Découvrable.

J'ai remarqué un autre comportement d'utilisateur réflexif de ma part, celui d'appuyer sur Ctrl-S ou Cmd-S dans un document ouvert chaque fois que je m'arrête après avoir tapé ou édité. Je me surprends même à appuyer sur Ctrl-S une minute plus tard, quand tout ce que j'ai fait est de faire défiler le document, de lire un peu ici ou là, ou même de répondre au téléphone. Autrement dit, il n'y a aucun changement à enregistrer et pourtant je frappe Ctrl-S. C'est une habitude. Maintenant ... si une application logicielle devait faire quelque chose d'intelligent avec ça, ce serait génial.


Ok, j'ai trouvé des modèles documentés plus réels sur Yahoo Pattern Library . Seulement, ils ne les appellent pas "modèles de découvrabilité".

Modèles de conception d'invitation

Le concepteur doit signaler à l'utilisateur qu'une fonctionnalité interactive existe

Cursor Invitation - Designer doit indiquer à l'utilisateur qu'un objet peut interagir.

Drop Invitation - Le concepteur doit indiquer des sites de dépôt candidats valides lors d'une opération de glisser-déposer.

Hover Invitation - Designer doit indiquer à l'utilisateur ce qui se passera lorsque la souris est cliquée sur l'objet survolé.

Tool Tip Invitation - Le concepteur doit indiquer à l'utilisateur ce qui se passera s'il clique avec la souris sur l'objet survolé.


Et je viens d'observer une autre solution de conception menant à la découverte en écrivant cette réponse: si vous cliquez sur la petite icône d'aide et ouvrez le menu d'aide, lorsque vous cliquez sur l'une des rubriques d'aide (par exemple, Styling/Heading), vous aurez tout à fait voir éventuellement certaines des icônes juste au-dessus rebondir une ou deux fois pendant que la rubrique d'aide est affichée.

Maintenant, je savais ce que certaines ou la plupart de ces icônes étaient, mais je ne savais pas que l'une d'entre elles était pour blockquote. Lorsque j'ai ouvert la rubrique d'aide pour "Blockquotes", le l'icône/le bouton a rebondi.

OK, si nous pouvons trouver quelques exemples supplémentaires de la solution de conception d'objets associés , je pense que nous pouvons également appeler cela un modèle. (Le modèle Yahoo Drop Invitation pourrait en être un sous-modèle).

15
Erics

Les nouveaux utilisateurs seront submergés par trop d'options ou de fonctions, tandis que les utilisateurs expérimentés en voudront probablement beaucoup plus qu'ils n'en ont déjà. La solution à cela est révélation progressive ou chasse au trésor si vous préférez.

Lorsqu'un nouvel utilisateur démarre avec l'application, donnez-lui simplement les bases dont il a besoin pour faire avancer les choses - cachez tout le reste. De cette façon, ils peuvent passer de zéro à efficace dans un court laps de temps et se sentir facilement plus confiants dans l'application.

Après avoir atteint une certaine mesure d'utilisation (nous utilisons des points pour cela), en récompense, vous révélez une autre fonctionnalité et marquez-la comme nouvelle ou récemment déverrouillée. Cela les met dans une position où ils connaissent bien l'application autre que cette seule fonctionnalité. Il est facile d'apprendre une autre chose, et idéal pour l'expérience si c'est aussi quelque chose d'utile pour eux.

Continuez à révéler les fonctionnalités de cette manière et vos clients ne se sentiront jamais submergés par l'application tout en apprenant progressivement.

Un autre bonus supplémentaire est qu'une fois que les gens réalisent que c'est le mécanisme, ils sont susceptibles d'explorer, et donc d'apprendre, l'application juste pour débloquer de nouvelles fonctionnalités - l'effet de gamification.

Edit: Pour les applications complexes avec une utilisation variée (comme Word), vous pouvez donner des conseils visuels aux points et fonctionnalités ou même afficher des fonctionnalités et fournir des conseils sur la façon de les déverrouiller.

9
JohnGB

DUH! Utilisez Clippy, bien sûr. Ce que vous devez faire, c'est programmer une sorte de personnage animé interactif qui apparaît chaque fois que l'utilisateur essaie de faire quoi que ce soit dans votre programme et suggérer d'autres choses qu'il pourrait vouloir faire. Il est très important de Word cela juste. Commencez chaque astuce avec "J'ai remarqué que vous étiez ....", puis ajoutez votre fonctionnalité détectable.

L'animation est essentielle car sinon les utilisateurs pourraient se concentrer sur ce qu'ils font et ne seraient pas distraits par votre dicoverabilibuddy. Mieux vaut simplement le rendre modal pour être du bon côté.

Une option encore meilleure consiste à afficher des conseils quotidiens. L'utilisateur ouvre votre application, essayant de faire du travail, BAM! vous lui donnez quelques connaissances sur des fonctionnalités qu'il ne sait pas encore qu'il veut utiliser. Je pourrais suggérer que vous optiez pour des conseils toutes les heures, car les quotidiens ont été exécutés à mort. Cela rendra vos fonctionnalités 24 fois plus visibles.

3
Assaf Lavie