45 votes

Techniques de conception d'interfaces graphiques pour améliorer l'expérience de l'utilisateur

Quelles techniques connaissez-vous \use pour créer une interface graphique conviviale ?

Je peux citer les techniques suivantes que je trouve particulièrement utiles :

  • Notifications non bloquantes (boîtes de dialogue flottantes comme dans Firefox3 ou les messages contextuels de Vista dans la zone de notification).
  • Absence de bouton "Enregistrer".
    MS OneNote, par exemple.
    Les clients de messagerie instantanée peuvent sauvegarder automatiquement l'historique des conversations
  • Recherche intégrée
    Ne cherchez pas seulement dans les fichiers d'aide, mais rendez les éléments de l'interface utilisateur interrogeables.
    Vista a fait un bon pas vers une telle interface graphique.
    Scout addin Microsoft Office était une idée vraiment géniale.
  • Interface utilisateur orientée contexte (ruban dans MS Office 2007)

Mettez-vous en œuvre dans votre logiciel des techniques semblables à celles qui sont énumérées ?

Editar:
Comme Ryan P a mentionné que l'une des meilleures façons de créer une application utilisable est de se mettre à la place de l'utilisateur. Je suis tout à fait d'accord avec cela, mais ce que je veux voir dans ce sujet, ce sont des techniques spécifiques (comme celles que j'ai mentionnées ci-dessus) plutôt que des recommandations générales.

31voto

wusher Points 4262

Si vous posez une question à l'utilisateur, n'en faites pas une question oui/non. Prenez le temps de créer un nouveau formulaire et de mettre les verbes comme choix, comme dans mac.

Par exemple :

 Would you like to save?    
     Yes        No

Devrait être :

  Would you like to save?
    Save        Don't Save 

Il existe une explication plus détaillée ici.

26voto

David HAust Points 2696

Consultez le grand livre Ne me fais pas penser par Steve Krug.
Il est axé sur le web, mais la plupart des concepts peuvent s'appliquer à tout, des mélangeurs aux tableaux de bord des voitures.
Sujets couverts :

  • Modèles d'utilisateurs
  • Conception pour la numérisation
  • Utilisation judicieuse de la copie
  • Conception de la navigation
  • Mise en page de la page d'accueil
  • Tests d'utilisabilité

Il possède également un blog intitulé Le bon sens avancé

Et quelques liens aléatoires liés à l'interface utilisateur :
- Conception d'interfaces utilisateur pour les programmeurs par Joel Spolsky
- 10 cauchemars d'utilisabilité dont vous devez être conscient

16voto

Ande Points 2787

Premiers principes : Wilfred James Hansen

  • Connaître l'utilisateur
  • Minimiser la mémorisation
  • Optimiser les opérations
  • Ingénieur pour les erreurs

Expansions ultérieures : Dr. Theo Mandel

Donner le contrôle aux utilisateurs

  • Utiliser les modes à bon escient (sans modèle)
  • Permettre aux utilisateurs d'utiliser soit le clavier, soit la souris. (flexible)
  • Permettre aux utilisateurs de changer de cible (interruptible)
  • Afficher des messages et des textes descriptifs (utile)
  • Fournir des actions immédiates et réversibles, et un retour d'information (pardonner)
  • Fournir des chemins et des sorties significatifs (navigable)
  • S'adapter aux utilisateurs ayant des niveaux de compétence différents (accessible)
  • Rendre l'interface utilisateur transparente (facilitateur)
  • Permettre aux utilisateurs de personnaliser l'interface (préférences)
  • Permettre aux utilisateurs de manipuler directement les objets de l'interface (interactif)

Réduire la charge de la mémoire des utilisateurs

  • Soulager la mémoire à court terme (se souvenir)
  • Faites confiance à la reconnaissance, pas au souvenir (reconnaissance)
  • Fournir des repères visuels (informer)
  • Fournir des valeurs par défaut, annuler et rétablir. (pardonner)
  • Fournir des raccourcis d'interface (fréquence)
  • Promouvoir une syntaxe objet-action (intuitif)
  • Utilisez des métaphores du monde réel (transfert)
  • Divulgation progressive de l'utilisateur (contexte)
  • Favoriser la clarté visuelle (organiser)

Rendre l'interface cohérente

  • Soutenir le contexte des tâches des utilisateurs (continuité)
  • Maintenir la cohérence au sein des produits et entre eux (expérience)
  • Conserver les mêmes résultats d'interaction (attentes)
  • Fournir un attrait esthétique et une intégrité (attitude)
  • Encourager l'exploration (prévisible )

11voto

Mal Ross Points 1732

Pour ajouter à ta liste, aku, je mettrais explorabilité comme l'une de mes plus grandes priorités. Fondamentalement, je veux que l'utilisateur se sente en sécurité lorsqu'il essaie les fonctionnalités. Il ne doit jamais hésiter à utiliser quelque chose de peur que son action soit irréversible. Le plus souvent, cela se fait à l'aide des commandes annuler/refaire, mais d'autres options sont sans doute disponibles, par exemple les sauvegardes automatiques.

En outre, pour les applications davantage axées sur les processus (plutôt que sur la saisie de données), j'envisagerais de mettre en œuvre une interface qui guide l'utilisateur un peu plus. Le site de Microsoft Lignes directrices pour l'interface utilisateur inductive peut être utile ici, bien que vous deviez faire très attention à ne pas en faire trop, car vous pouvez facilement ralentir l'utilisateur de manière excessive.

Enfin, comme pour tout ce qui comprend du texte, faites en sorte que l'interface utilisateur soit aussi scannable que possible. Par exemple, si vous avez des rubriques sous lesquelles apparaissent des commandes/options, envisagez de placer le mot d'action au début, plutôt qu'un mot d'interrogation. La remarque de Maudite est également un bon exemple de numérisation, car le texte du bouton "Ne pas enregistrer" ne dépend pas du contexte du paragraphe précédent.

6voto

Abdu Points 3358

Une technique utile que je ne vois jamais personne utiliser consiste à ajouter une infobulle pour un contrôle d'interface utilisateur désactivé, expliquant pourquoi le contrôle est désactivé. Ainsi, si une zone de liste est désactivée et que la raison de cette désactivation n'est pas claire, je veux que le survol de cette zone me dise pourquoi elle est désactivée. Je veux voir quelque chose comme "Il est désactivé parce que deux zones de texte à l'écran sont restées vides ou parce que je n'ai pas saisi suffisamment de caractères dans un champ ou parce que je n'ai pas effectué une certaine action".

Je me retrouve dans tellement de situations de ce genre et c'est frustrant. Parfois, je finis par poster dans le forum du logiciel pour demander pourquoi un contrôle est grisé alors qu'une info-bulle aurait pu m'aider en une seconde ! La plupart de ces logiciels ont des fichiers d'aide qui sont inutiles dans ce genre de scénarios.

Faites semblant de ne rien savoir de votre logiciel et essayez de l'utiliser. Cependant, cela n'est pas pratique car vous avez déjà un certain état d'esprit vis-à-vis de l'application. Observez donc vos collègues développeurs ou vos amis utiliser l'application, recherchez les points sensibles et demandez-leur un retour.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X