web-dev-qa-db-fra.com

Moyen le plus convivial de représenter le bouton radio avec des sous-options

Je travaille sur une section de paramètres où l'utilisateur doit choisir un bouton radio (ou un contrôle segmenté) et chaque option génère un ensemble de plusieurs options qui peuvent être sélectionnées dans n'importe quelle combinaison. Appelons le premier "emplacement" et les derniers "panneaux" (qui sont disponibles pour chaque emplacement).

Ma question est la suivante: s'il existe un moyen plus convivial de représenter la liste déroulante de sélection multiple (voir les images) et de regrouper les 2 contrôles de manière à ce que leur relation soit métaphoriquement plus évidente.

Merci d'avance à tous.

P.S Le sujet le plus pertinent que j'ai pu trouver est celui-ci: menu des boutons radio avec sous-menu des boutons radio

Étape 1

enter image description here

Étape 2

enter image description here

1

Votre solution a l'air soignée et robuste, je dois dire. J'ai cependant quelques questions.

  • y a-t-il des panneaux dans la combo-box qui sont communs à plus d'emplacements?
  • les noms des panneaux indiquent-ils l'emplacement (c.-à-d. les panneaux sont-ils des noms d'État/de province)? Dites, j'ai ouvert aveuglément la combo-box, sélectionné certains panneaux et réalisé plus tard que l'emplacement sélectionné est incorrect?
  • que se passe-t-il lorsque l'utilisateur a sélectionné certains panneaux et s'est rendu compte par la suite que leur emplacement est différent (ou qu'il était curieux de voir les panneaux pour un autre emplacement) mais qu'il est ensuite revenu à l'emplacement d'origine? Quels panneaux sont alors sélectionnés?

EDIT: puisque le PO m'a fourni les réponses, j'ajuste la réponse en conséquence:

  • Oui, il existe des panneaux communs à tous les emplacements.
  • Non, ils n'indiquent pas de lieux. Ce sont en fait des bases de données d'utilisateurs.
  • Actuellement, dans ma conception, une sélection d'un autre emplacement signifie une désélection des panneaux.
  • La somme de tous les panneaux ne dépasse pas 20

Dans ce cas, je conserverais la disposition visuelle actuelle et ne désactiverais que les éléments de la zone de liste déroulante qui ne s'appliquent pas à l'emplacement sélectionné. Cela donne à l'utilisateur l'information la plus simple que certains éléments ne sont pas disponibles à leur emplacement.


Dans le cas où les panneaux sont exclusifs à un certain emplacement, je présenterais la solution suivante:

mockup

télécharger la source bmml - Wireframes créés avec Balsamiq Mockups

Comme vous pouvez le voir, seule la zone de liste déroulante correspondant à l'emplacement sélectionné est activée, mais toutes les sélections à l'intérieur des zones de liste déroulante désactivées conservent leurs valeurs.

Si c'est trop de combos pour vous, vous pouvez rester avec un combo et activer/désactiver les éléments correspondants (panneaux) en fonction de l'emplacement pour différencier clairement la sélection d'emplacement. Cela introduirait cependant deux problèmes supplémentaires:

  • après chaque changement d'emplacement, l'utilisateur doit revoir la zone de liste déroulante pour voir ce qui a changé et rechercher semi-manuellement les changements
  • les utilisateurs de certains emplacements devraient faire défiler davantage pour accéder à leurs panneaux que les autres, à condition que les panneaux soient triés par leur emplacement.

Quoi qu'il en soit, présenter une telle sélection clairsemée (environ 75% des choix seraient désactivés) n'est pas encourageant pour les utilisateurs, à mon avis.

J'ai présenté cette solution comme à mon avis présentant une sélection clairsemée, c'est-à-dire qu'une combo-box avec environ 75% d'éléments désactivés n'est pas encourageante pour l'utilisateur.

0
Mike