web-dev-qa-db-fra.com

Qu'est-ce qu'un bon modèle d'interface utilisateur pour sélectionner des éléments contigus dans une liste?

Je crée un outil (Web) pour éditer une longue séquence d'événements compliquée, et j'aimerais faciliter:

  • jouer un seul événement
  • jouer une série d'événements contigus (pour voir si toutes les transitions fonctionnent correctement, etc.)

Quels sont les bons modèles UX pour le faire? En ce moment, j'ai un seul bouton pour chaque événement pour le jeu unique (je peux le faire disparaître si vous ne survolez pas cet événement).

Quelques informations sur mon cas:

  • Je n'ai aucun concept de "sélection" jusqu'à présent (je n'en aurais besoin que pour "jouer à plusieurs")
  • Mes "éléments d'événement sont disposés verticalement et sont assez gros (ils contiennent des données plus détaillées, je pourrais les compacter), de sorte que seuls trois ou quatre peuvent s'afficher à l'écran à un moment donné
  • C'est une utilisation interne personnalisée pour des outils quelque peu techniques, principalement pour une édition plus efficace, donc je n'ai pas besoin d'être super convivial et intuitif (même si je préfère)

Je pense soit à cliquer-faire glisser (comme ceci sélecteur de plage - mais la petite quantité d'éléments que j'ai par écran en fait un tracas), soit à cliquer-déplacer pour une sélection multiple, comme pour le texte (mais je n'ai même pas vraiment besoin du concept de sélection unique ..).

Des suggestions ou des conseils sur de bons conseils à ce sujet?

Merci!

5
Emile

Donc, si une option de liste de lecture n'est pas disponible, une approche serait de créer une grille pour les événements avec le flux utilisateur suivant:

  • Étape 1: L'utilisateur parcourt la liste des événements
  • Étape 2: L'utilisateur en sélectionne une en cliquant ou en la touchant, puis une zone de bouton apparaît (inactive avant une sélection) où l'utilisateur peut appuyer sur le bouton de lecture.
  • Étape 3: L'utilisateur sélectionne un ou plusieurs événements supplémentaires (pendant la lecture du premier 1).
  • Étape 4: ceux-ci sont ajoutés dans la file d'attente et lus dans l'ordre de leur sélection. Vous devrez ajouter des boutons précédent et suivant pour permettre aux utilisateurs de sauter ou de revenir à un événement.

Dans cette approche, la clé est la conception de la zone des boutons, qui peut également être judicieuse d'être fixée dans l'interface utilisateur.

1
NVas