De quoi les utilisateurs se souviennent-ils le plus, la position ou la couleur des éléments?

J'ai un menu de navigation avec quelques boutons, qui ressemble un peu à ceci (REMARQUE: chaque bouton a une icône distincte qui le différencie du reste, je ne les ai pas ajoutés à la maquette mais ils sont similaires aux icônes Wins8):

Certains utilisateurs ont signalé avoir cliqué accidentellement sur Signer au lieu de Envoyer, ce qui est tout simplement inadmissible. J'envisage maintenant des moyens de différencier davantage les boutons. Une option consiste à déplacer le signe vers la droite. L'autre, (ajoutant probablement à le déplacer) pour changer sa couleur:

La position est-elle une bonne différenciation? Ou devrais-je également envisager d'utiliser la couleur? L'ajout d'une nouvelle couleur à cette navigation a un certain impact sur la palette et l'apparence générale, donc elle a un prix que je devrais payer.

Cela n'aide pas non plus de travailler avec trois mots de quatre lettres qui commencent tous par la lettre «S». :)

La couleur est un indicateur immédiat que quelque chose est différent. Dans votre premier exemple, vous n'avez vraiment aucune idée de ce que font ces boutons, sauf si vous prenez vraiment le temps de faire attention et de les lire, en un coup d'œil, ils sont loin d'être similaires à différencier. Un paradigme que nous utilisons lorsque je travaille est que nous faisons de notre action principale une couleur distincte de toute action moins importante ou moins permanente / finale.

Mais la couleur n'est pas nécessairement le point de départ ou de rupture. Une autre stratégie valable serait d'associer une icône à chaque bouton (et pas seulement aux deux derniers). De cette façon, vous créez une autre différence facilement reconnaissable dans les éléments.

Quant à votre question réelle, si la position est suffisamment différenciée, je pense que cela aide certainement parce que le motif des boutons est cassé par les deux plus petits, ce qui vous oblige à vraiment regarder les différences dans les boutons plutôt que de les ignorer. La couleur ajoutée ne fait qu'accentuer cela encore plus, et personnellement, si possible, j'ajouterais également la couleur, car cela aide à la pérenniser au cas où plus d'options seraient ajoutées plus tard et que le bouton pourrait manquer encore une fois. Cependant, à condition qu'il soit difficile de changer la couleur, je trouverais le nouveau positionnement suffisant.

Cependant, ce que je pense est probablement beaucoup moins pertinent que ce que vos utilisateurs pensent ou font, et si vous avez les ressources, j'essaierais différentes conceptions et le testerais avec les utilisateurs pour voir ce qu'ils préfèrent et pour quelles raisons.

Choses qui peuvent être utilisées pour différencier les boutons:

• les étiquettes (évidemment)
• Couleur
• Taille
• commande
• emplacement
• proximité
• forme / style

Plus une action peut causer de dégâts involontaires, plus vous avez de chances de choisir parmi plus d'une des options ci-dessus.

Ne connaissant pas le flux utilisateur pour ces commandes, je ne sais pas si votre suggestion est suffisante, mais c'est certainement une amélioration par rapport à la précédente car vous avez maintenant déplacé l'action 'uh oh', envoyer, loin des deux autres.

Je pourrais peut-être aller plus loin et utiliser une différenciation de proximité judicieuse. Peut-être quelque chose d'aussi radical que cela:

--------  --------
| SAVE |  | SIGN |                                               DELIVER -->
--------  --------   

J'ai utilisé un certain nombre de différenciateurs ici ... proximité, style / type de bouton, et renommé «envoyer» pour «livrer» (voir ci-dessous).

Un autre défi que vous semblez avoir est un cas massif d'allitération. Cela peut prendre un peu de créativité pour surmonter cela. Par exemple, vous ne voudrez probablement jamais avoir deux boutons côte à côte avec les étiquettes "supprimer" et "livrer" :)

Je suis d'accord avec Johannes et DA01, ils ont tous deux soulevé les points que je voudrais en ce qui concerne le positionnement, l'allitération, etc.

Mais ce que je voudrais ajouter.

Avec déjà des icônes pour enregistrer et envoyer le signe, le repositionnement seul du bouton d'envoi devrait être suffisant. Je suggérerais de ne pas changer la couleur car cela n'est pas nécessaire et c'est aussi un changement un peu plus radical pour les utilisateurs (ne vous méprenez pas, je sais qu'ils pourraient faire face, mais je ne pense pas que ce soit nécessaire).

Si les symboles sont suffisamment reconnaissables pour les personnes, la séparation du bouton d'envoi devrait suffire.

Si vos icônes sont moins immédiatement reconnaissables, c'est-à-dire que vous avez peut-être un disque ou une clé USB au lieu de la disquette traditionnelle pour l'icône de sauvegarde, alors je suggère fortement de changer la couleur comme vous l'avez suggéré, les gens comprennent que le vert signifie disparaître.

J'espère que les utilisateurs finiront heureux;)

De quoi les utilisateurs se souviennent-ils le plus, la position ou la couleur des éléments?

Je ne proposerai pas de suggestions concrètes, mais un bref commentaire sur le titre: c'est très individuel. Tout comme certaines personnes diront "je vois ce que vous voulez dire" et d'autres diront "je vous entends" ou quelque chose de similaire. Certaines personnes sont à l'écoute des visuels, d'autres sont plus à l'écoute du son.

Certaines personnes sont plus sensibles à la forme, d'autres aux couleurs. Tout comme vous devez satisfaire daltonien, vous devez prendre en compte que tous les gens voient forme- et -Couleurs que leurs indices principaux à la navigation (certaines personnes identifieront un arbre, un animal, une maison par la forme ou la couleur, une volonté identifier une voiture passant par le son plutôt que par la forme et / ou la couleur, etc.).

Dans ce cas, il s'agit bien sûr d'un équilibre entre les deux (il serait amusant de savoir quel type d'utilisateurs font une erreur dans le mauvais bouton. Il pourrait y avoir un modèle là-bas. De plus, je pense que les utilisateurs ayant d'excellentes compétences en informatique seront plus rapides à en supposant où trouver le bouton droit.).

Puisque vous ne pouvez pas nous montrer les boutons réels avec les icônes, il devient difficile de suggérer. Une manière simple pourrait être simplement de rendre la distance plus grande à celle "out", comme le suggère @ DA01. Un peu comme MailApp:

Juste une pensée.

Une expérience amusante consiste à présenter à une poignée de personnes une maquette primitive (le plus simple sera le mieux: dessins, post-its sur un mur, croquis de retournement, tableau blanc, etc.) avec des boutons placés mais non marqués et identifiés. Demandez ensuite aux gens ce qu'ils attendent des boutons anonymes. Parfois, cela peut apporter des résultats informatifs et très intéressants.