web-dev-qa-db-fra.com

Afficher la sélection de liste basée sur la sélection d'attributs multiples

Dans mon application de bureau traditionnelle (pas l'application Web), j'ai un écran avec une liste relativement courte d'éléments (généralement 10-20), à partir de laquelle l'utilisateur peut sélectionner n'importe quelle combinaison (y compris toutes).

Les éléments ont plusieurs attributs (3 drapeaux booléens et une balise).

Mon initiale était cependant d'utiliser des cases à cocher et une zone de liste déroulante. Le problème que j'ai trouvé est que si une balise et 2 cases à cocher sont sélectionnées et que l'utilisateur décoche une case à cocher, les éléments sélectionnés ne sont plus reflétés par les attributs sélectionnés/cochés.

Pour compliquer les choses, l'utilisateur peut directement cocher/décocher tout élément de la liste, les balises et cases à cocher ne sont que des raccourcis.

Exemple: J'ai coché Diesel, mais décoché décapotables.
La liste des voitures sélectionnées maintenant n'inclut pas la SLK, qui est un diesel mais n'est pas sélectionnée car c'est aussi une décapotable.

Car Selection mockup

Je peux penser à 2 solutions possibles (dont aucune ne semble idéale):

  1. Indiquez clairement que la liste est le résultat des attributs non cochés et cochés (je peux avoir besoin de différents contrôles d'interface utilisateur plutôt que de cases à cocher).
  2. Concevez l'écran de telle sorte que les sélections ne soient que des actions et ne soient pas censées refléter les éléments sélectionnés.
4
SteB

Vous pouvez éventuellement essayer d'expérimenter une interface utilisateur de recherche/filtrage en langage naturel . Je ne suis toujours pas très sûr du contexte, mais pour le scénario donné, quelque chose comme cela pourrait être facile pour les utilisateurs de comprendre rapidement - Voir ci-joint.

enter image description here

1
Amit Jain

Voici ma solution car mon expérience est la conception d'interface utilisateur ...

Pourquoi n'ajoutez-vous pas un autre contrôle pour les critères de correspondance stricte et lâche, cela simplifiera les choses

Voir ma solution ci-dessous GAUCHE correspond à des correspondances strictes et DROITE correspond à toutes les correspondances possibles

both options solution

0
Ahsan Idrisi

Cela dépend de votre tâche. Par exemple, si vous louez une voiture, l'utilisateur peut filtrer la liste des voitures en fonction de certains paramètres mais a toujours des préférences sur le modèle de voiture. Ensuite, la solution pourrait être comme sur ma photo, il suffit de coder par couleur les voitures qui correspondent au filtre, voir photo. Le filtre sert d'indice mais l'utilisateur peut toujours choisir n'importe quelle voiture.

enter image description here

Si vous préférez un filtre rigide, masquez simplement les options qui ne correspondent pas.

0
Alexey Kolchenko

C'est moins une question UX, plus une question de fonctionnalité. Vous devez décider laquelle des exigences suivantes votre application doit prendre en charge:

  1. L'utilisateur ne peut appliquer que des critères de sélection positifs, c'est-à-dire qu'il peut choisir de limiter la sélection aux seuls convertibles ou d'ignorer l'indicateur convertible.
  2. L'utilisateur peut appliquer à la fois des critères de sélection positifs et négatifs, c'est-à-dire qu'il peut choisir de sélectionner uniquement les cabriolets, ou qu'il peut choisir d'exclure tous les cabriolets de la sélection (même s'ils correspondent aux autres critères), ou qu'il peut choisir d'ignorer l'indicateur convertible .

Dans le cas 2, je vous recommande d'utiliser une case à cocher tristate . Cela devrait indiquer très clairement si l'utilisateur sélectionne positivement, négativement ou pas du tout.

Dans le cas 1, je peux penser à deux options:

  • Gardez les trois cases à cocher (pour vos 3 drapeaux booléens) visibles à tout moment. Dans ce cas, décocher la case Convertibles devrait modifier les résultats sélectionnés pour inclure les convertibles et les non convertibles.
  • Au lieu d'utiliser des cases à cocher, utilisez une petite étiquette avec un bouton de suppression; dans ce cas, l'utilisateur supprime simplement l'étiquette pour réinitialiser les critères de sélection.
0
Vince Bowdren