Quelle est la bonne couleur pour un bouton pause?
Nous avons une application avec un chronomètre intégré. Si le chronomètre fonctionne, le bouton de pause est affiché et s'il est arrêté, le bouton de lecture est affiché. Actuellement, le chronomètre lui-même ainsi que le bouton sont de couleurs neutres.
Ce serait formidable si la couleur du bouton lecture/pause pouvait aider l'utilisateur à utiliser le chronomètre de manière plus efficace.
L'arrière-plan doit rester neutre pour des raisons techniques, donc la seule option de conception que nous avons est de colorier le bouton. J'ai lu le discussion sur la séparation du bouton de lecture et de pause et c'est parfaitement logique, mais encore une fois, des raisons techniques m'empêchent d'avoir deux boutons. Donc, c'est un bouton sur fond gris.
Le chronomètre en cours d'exécution avec le bouton pause doit-il être vert ou rouge?
Un bouton d'arrêt vert serait un excellent indicateur que le chronomètre fonctionne, mais il serait étrange d'appuyer sur un bouton vert pour arrêter quelque chose. Un bouton d'arrêt rouge serait un excellent indicateur qu'il s'agit d'un bouton STOP, mais le chronomètre en cours d'exécution afficherait toujours le bouton rouge, ce qui est plutôt étrange.
La réponse de ChrisF est très correcte - assurez-vous que les couleurs ne sont pas la seule indication! En supposant que vous vous en occupiez déjà:
Si le choix est strict entre le vert et le rouge - optez pour le rouge.
Le bouton est une action, pas un indicateur. S'il s'agissait d'un indicateur, vous auriez peut-être voulu qu'il soit vert (pour montrer qu'il est "correct" ou en cours d'exécution), mais lorsqu'il s'agit d'actions - le rouge signifie "arrêter" (et "pause" est une sorte "d'arrêt").
De plus - vous n'avez pas besoin d'indication supplémentaire que le chronomètre fonctionne - vous voyez que les chiffres réels changent!
BTW - si vous n'avez qu'un seul bouton, après avoir appuyé sur "pause" qu'est-ce que le bouton "devient"? Est-ce que le presser à nouveau reprend ou s'arrête?
N'oubliez pas qu'une proportion importante de votre base d'utilisateurs sera aveugle de couleur rouge/verte, donc avoir un bouton qui change la couleur du rouge au vert ne les aidera pas.
Il serait préférable de changer l'icône. J'utiliserais la norme > Pour commencer, || pour pause et [] (carré) pour arrêter si vous avez besoin de cette option.
Cela signifierait qu'à l'arrêt, le bouton afficherait > signifiant "cliquez pour commencer". Lors de l'exécution, le bouton afficherait || signifiant "cliquez pour faire une pause".
Une option qui pourrait fonctionner est de rendre le bouton coloré pendant que l'horloge fonctionne et neutre lorsqu'il ne l'est pas. Au lieu d'afficher> et ||, vous pouvez le faire ressembler à un bouton physique avec une LED intégrée qui s'allume lorsque l'horloge fonctionne. Des points bonus si vous pouvez donner l'impression que le bouton est enfoncé lorsque le chronomètre est activé.
J'espérais que vous pourriez utiliser un voyant rouge pour indiquer soit l'état (l'horloge fonctionne) soit l'action (arrêter l'horloge) - en évitant le fusion de deux fonctions mentionné par Jim Jarrett dans la lecture/pause question et Dan Barak ici. Mais selon une enquête rapide sur les appareils et l'électronique de ma maison, le rouge n'est jamais utilisé pour indiquer "allumé". (À une exception notable près: le four.) La plupart utilisent des lumières bleues, certaines utilisent du vert. Certains utilisent en fait du rouge pour indiquer éteint (mais trouvez-moi dans le noir) .
Par conséquent, je ne pense pas que ce soit une idée particulièrement bonne. (J'aime mieux la réponse de Dan.) Mais je le publierai quand même parce que parfois nous pouvons apprendre autant d'idées qui ne fonctionnent pas que celles qui fonctionnent.
Je pense que la couleur n'est pas une option. Si vous utilisez des couleurs différentes de celles de votre interface utilisateur, ce sera une distraction. Je suggère de concentrer l'attention de l'utilisateur sur les INFORMATIONS (temps) et d'utiliser la position différente pour les commandes de commande. Par exemple, je sais que le bouton Démarrer/Continuer sera au centre de l'espace de travail et Pause en bas (1). Ensuite, je vois le temps que j'ai passé pour une tâche. Si je veux arrêter ma minuterie, je trouverai mon bouton d'arrêt en bas (2). Ensuite, je vois que ma minuterie est inactive (l'étiquette de temps est inactive) et je trouverai le bouton Continuer au même endroit que celui de départ (3).
De plus, pour éviter un "double" clic (qui peut être provoqué par des retards d'exécution et ainsi de suite ...), il est de bonne habitude de placer des contrôles d'actions multi exclusifs aux différents endroits.
L'iconographie de lecture et de pause semble plus liée à la vidéo et à l'audio qu'à l'exécution d'une minuterie.
Un bouton avec le texte "Démarrer" serait facile à comprendre. Lorsque vous appuyez sur ce bouton de démarrage, vous aurez besoin d'actions pour que l'utilisateur s'arrête et s'arrête - s'il s'agit d'un chronomètre.
En termes de couleur, je suggère le vert pour le début, le gris pour la pause, le rouge pour l'arrêt - une teinte monochrome pourrait être appliquée pour s'assurer que le contraste n'est pas trop grand.
En prenant du recul par rapport au problème initial, avez-vous considéré que certains utilisateurs verront votre bouton comme un indicateur de l'état actuel?
Sur mon lecteur MP3, l'écran affiche la lecture (>) quand il est en cours de lecture et mettre en pause (||) lorsqu'il est en pause. Mon magnétoscope VHS, mon lecteur DVD et mon décodeur le font également.
Ce que vous rencontrez est un problème bien connu avec les commandes à bascule - le ser Interface Hall of Shame avait l'habitude d'avoir de bons commentaires à ce sujet. Essentiellement, vous ne pouvez pas prédire si les utilisateurs interpréteront le bouton comme l'état disponible ou l'état actuel .
Je suggère ce qui suit:
Affichez deux boutons sous votre chronomètre, jouez et mettez en pause: >||
Lorsque le chronomètre fonctionne:
- Désactiver le jeu et supprimer la coloration
- Activez la pause, coloriez-la en jaune/orange
Lorsque le chronomètre est arrêté
- Activez le jeu et coloriez-le en vert
- Désactiver la pause et supprimer la coloration
N'est-ce pas formidable de passer d'un appareil doté de boutons d'arrêt, de pause et de lecture à une bascule?
La couleur détourne l'attention des autres tâches, donc si l'intention du chronomètre est que seuls quelques utilisateurs l'utilisent ou qu'il ne soit utilisé que de manière occasionnelle, j'éviterais de distraire la couleur.
J'ai vu du rouge pour s'arrêter dans une application de saisie de temps. Il peut y avoir plusieurs minuteurs répertoriés dans une table, mais un seul peut être en cours d'exécution à la fois. Le fait d'avoir la minuterie active avec un bouton d'arrêt rouge aide l'utilisateur à la trouver dans la liste.
Je suppose que dans la facturation horaire, appuyer sur 'stop' sur votre minuterie est une chose dangereuse;)