web-dev-qa-db-fra.com

Les boutons en niveaux de gris avec des icônes sont-ils utilisables et efficaces?

enter image description here

L'image ici est

  1. vieux gmail
  2. nouveau gmail, quand aucun mail n'est sélectionné
  3. nouveau gmail, lorsque le courrier est sélectionné
  4. nouveau délicieux

Pour moi, les boutons sont sans étiquette et difficiles à découvrir.

Je ne pense pas que les icônes fonctionnent assez bien pour rendre les étiquettes redondantes. J'ai aussi remarqué:

  1. la barre d'outils Gmail change entièrement lorsqu'un courrier est sélectionné, alors que l'ancienne barre d'outils était (rassurante) constante
  2. les délicieux boutons d'édition et de partage (encerclés) sont difficiles à découvrir et n'ont pas d'infobulles en survol

Ma première réaction à cela a été "un pas en arrière", car ils ont rendu les options plus difficiles à découvrir.

Mais d'autres sites semblent converger vers ce style, un langage de conception qui essaie d'être le plus clairsemé possible. C'est vraiment bon pour les iPad et les netbooks avec des résolutions extrêmement élevées.

Un tel langage de conception en vaut-il la peine, ou trop difficile à déchiffrer?

23
Jesvin Jose

Je vais répondre à votre question par une question. Étant donné la norme selon laquelle les étiquettes iconiques doivent avoir des info-bulles de texte, pourquoi n'y a-t-il pas de norme selon laquelle les étiquettes de texte doivent avoir des info-bulles graphiques?

La raison principale: dans presque tous les cas, les étiquettes de texte sont suffisantes en elles-mêmes et une icône n’améliorerait rien. Les étiquettes emblématiques, en revanche, ont tendance à être inadéquates par elles-mêmes. Donc, oui, Gmail nuit à la découvrabilité. Il n'est pas acceptable pour les utilisateurs de tâtonner une interface utilisateur avec la souris pour lire ce que fait chaque commande. Les utilisateurs devraient simplement pouvoir le lire. Cette icône de spam est particulièrement atroce. Je m'attends à ce que cela signifie "signaler cette lettre comme importante" - juste le contraire de ce qui est fait. Les applications doivent avoir une bonne hiérarchie des informations, mais il existe de meilleures façons de le faire que d'utiliser des symboles indéchiffrables pour des commandes mineures ou avancées (par exemple, la taille, le poids, la couleur).

L'alternative au masquage des commandes non applicables consiste à les désactiver (je ne sais pas ce que faisait Gmail). La décision de cacher ou désactiver peut être compliquée , mais pour résumer, vous devez désactiver si une action n'est pas actuellement disponible, mais l'utilisateur peut faire quelque chose pour la rendre disponible (par exemple, changer une sélection), Par conséquent, je pense que Gmail devrait utiliser la désactivation et non la dissimulation. Le problème avec le masquage est que les utilisateurs peuvent conclure que la commande n'est jamais disponible - que la fonctionnalité n'est tout simplement pas prise en charge par l'application (s'ils ne l'ont pas remarqué) quand il était visible). Comme vous le constatez, cela peut également rendre plus difficile la recherche des contrôles non masqués s'ils se déplacent pour remplir l'espace vide créé en masquant les contrôles.

Alors pourquoi les conceptions convergent-elles vers ce langage de conception inférieur? OMI, la mode. Pour obtenir ce look mobile tendance sur votre bureau. Avec un espace d'écran limité, les applications mobiles sont plus susceptibles d'utiliser des masques et des icônes pour tout presser. Maintenant, les sites Web de bureau donnent l'impression que le mobile est cool comme les applications mobiles, ignorant que les règles changent lorsque les écrans s'agrandissent. Je ne vois aucune excuse pour utiliser autant de gris sur gris, sauf que le gris est le nouveau noir. C'est particulièrement mauvais sur les applications mobiles, qui peuvent être utilisées en plein soleil et vous avez besoin d'autant de contraste que possible. L'utilisation à la mode du gris pour les contrôles actifs sape également son utilisation comme signifiant désactivé, ce qui peut être une autre raison pour laquelle Gmail choisit de masquer les contrôles. Il s'agit d'essayer d'être simple - d'apparence , pas simple à utiliser.

On peut dire que Gmail et d'autres peuvent essayer d'être cohérents avec leurs applications mobiles (je parierais que les utilisateurs d'applications mobiles Gmail sont également des utilisateurs d'applications Web Gmail), mais ils auraient pu faire mieux. Ils auraient pu utiliser à la fois l'icône Spam et le mot "Spam" pour la version de bureau pour maintenir la compatibilité avec l'application mobile tout en offrant une meilleure visibilité pour le bureau et une meilleure éducation sur la signification de l'icône lorsque l'utilisateur passe au mobile. En fait, "Spam" est un mot si court que je ne vois aucune raison de ne pas l'utiliser sur la version mobile à la place de l'icône. Nous sommes donc de retour à être simples, pas simples à utiliser.

21
Michael Zuschlag

Les icônes utilisées dans le nouveau Gmail expliquent très bien ce que fait le bouton. Si vous n'êtes pas sûr, survolez-les et vous obtenez une info-bulle bien conçue décrivant ce bouton.

enter image description here

Bien entendu, ces boutons n'apparaissent qu'une fois un e-mail sélectionné. Au début, cela m'a pris un peu au dépourvu "Où sont passés tous les boutons?!" mais après cette première fois, cela a été préférable.

Vous ne voyez que ce dont vous avez besoin. Si vous ne pouvez pas utiliser le bouton à un moment précis, pourquoi le voir?

En ce qui concerne ces boutons en niveaux de gris, c'est une bonne chose. Ils s'estompent et aident à faire avancer le contenu. Lorsque vous utilisez Gmail, vous ne voulez pas vous concentrer sur les boutons, vous voulez vous concentrer sur le conten. Il en va de même pour le bouton Delicious, il ne devrait pas être en concurrence avec votre attention. Il est facilement reconnaissable pour tous ceux qui connaissent leur logo, et sinon, passez la souris dessus pour découvrir ce qu'ils n'offrent pas actuellement mais devraient le faire.

4
Matt Rockwell

Comme Matt l'a déclaré, les boutons s'expliquent en survol. Gmail utilise un mélange de reconnaissance et de rappel en utilisant des icônes associées. Les moins intuitifs et les plus abstraits (la boîte de stockage, l'indicateur de spam) sont des contrôles plus avancés qui sont souvent ignorés. Notez que les principaux contrôles (envoyer, composer) sont écrits explicitement. Le bouton d'appel à l'action principal sur une page donnée est en fait surligné en rouge pour démarrer; avant d'écrire un e-mail, le bouton Composer est rouge, une fois que vous avez commencé à écrire, le bouton Envoyer est rouge.

Cette disposition permet d'appeler les actions principales avec des étiquettes de texte, mais laisse les fonctions avancées tomber en arrière-plan, tout en optimisant pour la numérisation . Les icônes sont floues pour ceux qui ne les utilisent pas (et ne s'en soucient probablement pas), mais pour les utilisateurs avancés, elles sont faciles à mémoriser et à localiser; la recherche d'icônes (que vous reconnaissez) est souvent plus rapide que la recherche sur des étiquettes de texte, car une certaine lecture est toujours impliquée.

Le problème de "niveaux de gris" que vous soulevez semble tangent au reste, mais le problème ici est le contraste . Le contraste est extrêmement important , et de nombreux graphistes ne tiennent pas compte du contraste efficace dans les éléments d'interface utilisateur pour rendre la page plus "agréable" ( à la grande majorité d'entre nous soucieux de la convivialité et de l'UX =).

Dans l'exemple Delicious, les icônes sont presque invisibles; il semble que l'interface utilisateur ne soit vraiment que quelques bosses sur l'interface utilisateur. Les icônes de Gmail sont beaucoup plus prononcées et facilement visibles. Je n'appellerais aucun des boutons Gmail à faible contraste, sauf peut-être le bouton de la case à cocher, principalement en raison des lignes fines.

3
Ben Brocka

Je dirais que le nouveau Gmail est plus intuitif que l'ancien. Tout d'abord, les principaux objectifs qu'ils avaient avec le nouveau design étaient de le rendre plus propre, plus intuitif et plus simple à utiliser. Et personnellement, je pense qu'ils ont fait de gros efforts sur tous ces points.

L'ancien design, tout en étant cohérent avec ses boutons, je me souviens qu'il affichait toujours des boutons qui, dans une vue actuelle, n'avaient aucune fonction qui leur était liée. Par exemple. le "Signaler comme spam" qui n'a rien fait tant que vous n'avez pas vérifié un ou plusieurs e-mails dans la colonne des cases à cocher ou que vous avez lu un e-mail. Il était toujours présent, entre autres boutons, alors qu'il ne remplissait aucune fonction. Cela encombrera la barre de boutons de fonctions avec des fonctions qui ne sont même pas accessibles, ce qui causera de la confusion à l'utilisateur commun.

De plus, je pense que le choix de conception de passer des boutons de texte aux boutons d'icônes est un bon choix. Personnellement, je pense que cela donne un sens de l'ordre et si vous n'êtes pas sûr de l'une des métaphores, une info-bulle décrivant la fonction est immédiate au survol. Cela dépend toujours de chaque individu, certains préfèrent un texte descriptif au lieu d'une icône à utiliser dans les boutons.

Je pense que la représentation de la conversation est meilleure dans le nouveau design avec son inclusion du profil Google+, en plus il affiche les messages réduits d'une manière moins "groupée" que l'ancien.

Je suis désolé, mais à mon avis, le nouveau design est meilleur. =)

2
AndroidHustle

Delicious a une longue histoire de moins en moins utilisable (salut, Yahoo!), À l'exception possible d'ajouter des images dans la dernière itération. Comme toutes les grandes sociétés de logiciels, elles et Google auront des employés qui préfèrent changer la conception existante en une conception qu'ils (ou le comité) préfèrent (contrairement à conseils intemporels ) plutôt que de la laisser seule. En surface, les changements indiquent une évolution vers le soutien aux utilisateurs avancés plutôt qu'aux débutants: un rappel et une connaissance des info-bulles (que je suppose que moins de 30% des utilisateurs du Web savent consciemment utiliser) plutôt que la lecture et la reconnaissance des patients sont nécessaires pour utiliser efficacement les nouvelles interfaces.

Le principal problème avec une conception uniquement iconique est lorsque les icônes ne sont pas universelles . Toutes les icônes universellement reconnaissables disponibles aujourd'hui sont basées sur des conceptions pré-Internet (telles que les panneaux d'arrêt et les flèches), et des actions telles que "modifier" et "tag" n'ont pas de telles conceptions universelles dans le monde réel. Même l'icône de disquette historique disparaît car l'élément du monde réel est de plus en plus méconnaissable par les utilisateurs réels.

2
l0b0

Eh bien - en ce qui concerne les boutons, les icônes et les étiquettes - à mon humble avis, il y a des choses qui n'ont tout simplement pas besoin d'étiquette, comme la disquette que personne n'utilise aujourd'hui, mais associez-la à "enregistrer" tout le temps, la poubelle avec supprimer. Donc, une fois que ces mots deviennent "iconiques" - vous n'avez pas besoin de mots pour les expliquer.

Google essaie de rendre leurs interfaces aussi simples et efficaces que possible. Je crois que le design épuré est difficile et j'aime personnellement la nouvelle approche de google (moi-même étant un designer UI/UX)

0
amjoe

Pour moi, le nouveau Gmail est une version minimaliste de la fonction de ruban dans MS Office qui masque également les boutons qui ne peuvent pas être utilisés.

L'affichage ou le masquage des étiquettes dépend de la fréquence à laquelle quelqu'un utilisera l'outil. Si j'utilise Gmail plusieurs fois par jour, j'apprendrai où trouver les boutons et ce que signifie l'icône Spam.

0
Tony Bolero