Choisir entre l'état et l'action sur la vidéo chrome
Je me rends compte que la question de décider s'il faut faire un bouton montrer son état versus montrer son action a déjà été posée. Certaines des réponses consistaient à rendre l'interface plus verbeuse ou à ajouter des éléments pour montrer à la fois l'action et. Ces solutions ne peuvent pas être appliquées à mon dilemme particulier: concevoir des contrôles vidéo chrome. Ces contrôles ne doivent pas être trop verbeux ou élaborés, afin de paraître de bon goût et de ne pas distraire l'utilisateur de regarder la vidéo .
Ici, nous voyons le lecteur YouTube de Chrome. On peut dire que Youtube étant le leader de l'industrie des vidéos en ligne, ils ont influencé de nombreuses conventions.
- Jouer - action
- Muet - état
- Développer - action
- Plein écran - action
Voici maintenant mon lecteur chrome. Mon lecteur diffuse du contenu en direct, j'ai donc remplacé le bouton lecture/pause par un bouton marche/arrêt. Ceci est un travail en cours de réalisation. Je voudrais de l'aide pour choisir entre l'action et l'état sur mes boutons uniques.
- Puissance - Il semble que la puissance devrait montrer l'état, contrairement à la façon dont la lecture/pause montre l'action. Si vous regardez votre écran d'ordinateur, le bouton d'alimentation s'allume lorsqu'il est allumé, ce qui signifie qu'il affiche l'état. Dois-je emprunter cette métaphore sur le bouton d'alimentation de mon lecteur?
- Lumières - Il s'agit d'un bouton qui atténue l'arrière-plan. Pour moi, les lumières semblent analogues à la sourdine. La sourdine désactive l'audio, tandis que les lumières désactivent la vision. Le bouton d'éclairage doit-il également afficher l'état?
- [~ # ~] hd [~ # ~] - Ce bouton vous permet de basculer entre la haute définition et la définition standard. Je ne sais pas comment concevoir correctement cela. Actuellement, je le fais afficher - lorsque le bleu est allumé, la HD est activée. Lorsqu'il est blanc, HD est désactivé. Nous avons fait quelques tests utilisateur et nous avons réalisé que la plupart des utilisateurs étaient confus que ce bouton affiche l'état ou l'action. Cette conception a été empruntée à Vimeo, ce qui me déroutait également personnellement. Je n'avais pas d'autre leader de l'industrie vidéo pour emprunter le concept HD. Vimeo essaie d'atténuer le problème en clignotant sur l'écran "HD is on/off" après vous appuyez sur le bouton. Ce n'est pas idéal car il n'est pas facile à découvrir.
Action vs état
Le problème avec l'état du bouton d'alimentation est qu'il n'est même pas clair quels sont les états marche/arrêt. L'icône "off" qui lui est associée est un "1" ou un tuyau (|). Mais afficher une ligne simple n'aura probablement aucun sens. Vous pouvez essayer d'utiliser un bouton d'alimentation allumé en rouge vs gris pour une icône inactive, mais vous rencontrez alors un problème de daltonisme. Essayez de faire clignoter l'icône lorsqu'elle est active pour suggérer une association avec les voyants d'état lumineux sur les téléviseurs.
Quant à l'affichage de l'action ou de l'état, dès que vous concevez le bouton pour qu'il corresponde à sa manifestation réelle, il est probablement préférable d'implémenter la même fonctionnalité ici. Ainsi, lorsque la vidéo est en cours de lecture, affichez l'état actif. Lorsque l'utilisateur la clique, mettez la vidéo en pause et affichez l'état inactif.
L'interrupteur d'alimentation
Je recommande de toujours suivre la convention de lecture/pause car c'est l'interface utilisateur que les gens attendent lorsqu'ils interagissent avec une vidéo. Voir un bouton d'alimentation provoque immédiatement des secondes de confusion: "Il est à l'emplacement du bouton lecture/pause, mais, attendez, est-ce que cela fait la même chose ou est-ce que je manque quelque chose?"
Youtube a des vidéos en direct. Je vous recommande de vérifier l'interface utilisateur là-bas (c'est à peine différent des vidéos ordinaires, à l'exception de "LIVE" dans le coin supérieur gauche de l'affichage vidéo).
Commentaires sur les autres boutons de votre zone de contrôle
Voici certaines choses que j'ai remarquées en regardant la conception globale:
Le bouton d'éclairage: Je ne suis pas d'accord avec votre affirmation selon laquelle la lumière est égale à la sourdine. Muet désactive le flux audio. Tout ce que "la lumière" fait est estomper l'arrière-plan. Pour être le même, le bouton d'éclairage devrait désactiver le flux vidéo. J'aime l'idée d'utiliser une ampoule mais en même temps, votre barre de contrôle devient un peu occupée, donc cela pourrait valoir la peine de la sortir de la barre et de la placer dans une zone de contrôle secondaire, en laissant celle-ci pour les contrôles principaux vus autre part.
Boutons d'écran/d'orientation: Je suis confus par les trois boutons à droite. Ai-je raison de deviner la première orientation des commutateurs (pourquoi?), La seconde élargit le lecteur et le troisième passe en plein écran? Ils invoquent tous en quelque sorte l'association d'un écran ou d'une taille, mais ce n'est pas immédiatement clair de quelle manière. Étant donné la convention de Youtube de montrer un bouton "agrandir" séparément d'un bouton "afficher en plein écran", il pourrait être judicieux de s'en tenir à cela.
Affichage de l'heure: l'affichage de l'heure est très petit et difficile à lire, j'ai une vue relativement bonne et je suis encore jeune. Le gris sur le gris foncé à cette taille sera cependant invisible pour les téléspectateurs plus âgés ou ceux qui ont une mauvaise vue, cependant.
Comme toujours, je recommande test d'utilisabilité. Vous pouvez parier votre cul que l'accès à ce joueur a coûté beaucoup d'itérations à Youtube (et, par conséquent, de l'argent). Profitez de leur investissement en ne vous éloignant pas trop.