web-dev-qa-db-fra.com

Une liste déroulante doit-elle avoir une valeur (ou être visible) lorsque la case à cocher associée est décochée?

Nous avons des utilisateurs qui peuvent être affectés à différents groupes avec un rôle associé sur ce groupe. Par exemple, un utilisateur peut être un "contributeur" dans le groupe "Ressources humaines", mais un "administrateur" dans le groupe "Comment jouer à Pictionary".

Jusqu'à présent, nous avons décidé d'utiliser une liste de tous les groupes. Une case à cocher se trouve à côté de la ligne et lorsqu'elle est cochée, elle active le texte et la liste déroulante pour le rôle.

Lorsque le groupe n'est pas sélectionné, nous voulons préciser que l'utilisateur ne sera pas affecté à ce groupe. J'ai pensé à 3 options:

  1. Masquez le sélecteur de rôle:

hide role selector

  1. Effacez le texte du sélecteur de rôle mais laissez-le désactivé:

clear role selector text

  1. Laissez la valeur par défaut mais laissez-la désactivée:

leave default value and disabled

Lequel de ces éléments indiquerait le mieux que la ligne est désactivée et que l'utilisateur ne fera pas partie de ce groupe?

5
TheCloudlessSky

Je ne trouve aucune donnée de recherche utilisateur spécifique sur ce sujet mais il y a beaucoup de tests montrant MOINS est PLUS .

L'option 3 montre les rôles et, bien que désactivé, a une chance de poser des questions "Le rôle de visionneuse sera-t-il accidentellement attribué?" (friction)

L'option 2 supprime le rôle mais soulève également des questions: "Je peux attribuer des rôles aux 2 premiers mais pourquoi pas aux 2 derniers?" ou "Se souviendra-t-il de ma dernière sélection de rôle si je décoche puis revérifie la case?"

Par conséquent, L'option 1 est la meilleure des trois options car seules les informations pertinentes sont affichées selon les besoins.

Remarque: n'oubliez pas de vous souvenir du dernier rôle sélectionné lorsque vous masquez/affichez la liste déroulante

3
DaveAlger

Option 1.

Principes de conception

Il y a deux principes de conception derrière cette recommandation:

Divulgation progressive

Une stratégie de gestion de la complexité de l'information dans laquelle seules les informations nécessaires ou demandées sont affichées à un moment donné.

Rapport signal/bruit

Rapport entre les informations pertinentes et non pertinentes dans un affichage. Le rapport signal/bruit le plus élevé possible est souhaitable dans la conception.

Le fait est que si l'utilisateur a obtenu quelque chose de non contrôlé, il n'aura aucune utilisation de tout ce qui concerne cette option; elle n'est manifestement pas intéressée. Cette image illustre bien cela:

A wall-mounted control panel, with the front panel lifted by hand

La seule exception à cette règle serait que si les options favorisent la sérendipité, mais étant donné que les autres contrôles sont des zones de liste déroulante (qui masquent toutes les options sauf une), je doute que ce soit le cas.

Gestalt - loi de similitude.

Ensuite, les deux options 2 et 3 expriment moins de distinction visuelle entre les lignes cochées et non cochées - avec l'option 1, il sera plus facile pour les utilisateurs de scanner l'interface pour trouver des informations pertinentes (ce qui est réellement en vigueur).

2
Izhaki

Les options 2 et 3 sont plus cohérentes. L'option 1 manque de cohérence. Comme l'utilisateur ne sera pas au courant de l'événement de case à cocher, puis lui proposer de choisir une option de plus une fois qu'il aura sélectionné la catégorie est une mauvaise idée. L'utilisateur doit être conscient de l'idée qu'une fois qu'il a sélectionné une case à cocher, il doit sélectionner une liste déroulante. À mon avis, 2 et 3 sont bons, mais ils fournissent à l'utilisateur un retour visuel sur la façon dont son fonctionnement 2 est la meilleure option. Comme dans 3, il existe un type supplémentaire de visionneuse qui va dérouter l'utilisateur comme s'il s'agissait d'une nouvelle catégorie. Pour le garder simple et facile pour l'utilisateur et pour être cohérent, utilisez l'option 2.

1
Akshay Anand

option 3 redesigned

Je suis d'accord avec la réponse @Anand mais je m'en remets à l'option sélectionnée.


Bien que je sois entièrement d'accord avec la citation de Mies "Moins c'est plus", cela signifie moins de décoration (trucs inutiles) pour rendre les choses plus fonctionnelles. Mais nous devons garder à l'esprit quelle est la fonction ou la raison derrière pour savoir où est la limite pour "moins". Ou comme le dit la citation d'Einstein:

"Tout devrait être aussi simple que possible, mais pas plus simple."


Maintenant, dans vos exemples, la sélection de la case à cocher donne à l'utilisateur la possibilité de choisir dans une liste déroulante.

C'est une bonne idée de faire savoir à l'utilisateur ce qu'il peut faire s'il coche la case . Cela supprime donc l'option 1 des solutions.

Il est important que les informations soient suffisamment cachées pour être ignorées mais suffisamment visibles pour être lues. Le fait que la liste déroulante n'affiche pas sa fonction n'aide pas l'utilisateur. L'utilisateur doit être conscient de ce qu'il y a derrière . Cela supprime donc l'option 2 des solutions.

Donc, ma suggestion est Option 3 .

Aussi sur la façon dont vous affichez la case à cocher: une option désactivée devrait avoir moins d'opacité, pas une option non cochée. Et je pense aussi que l'option désactivée devrait avoir le même style que celui activé mais avec moins d'opacité.

0
Alvaro