web-dev-qa-db-fra.com

Un nombre variable d'entrées dans une petite barre

J'ai une application Web qui implique que les utilisateurs saisissent le titre d'une page Wikipedia. Il doit fonctionner comme une interface sur à la fois sur le bureau et sur le mobile . À l'heure actuelle, l'interface ressemble à:

this

Il a un entrée unique. Je voudrais adapter cette interface pour permettre un nombre variable de entrées multiples. Je pense que je peux y arriver en:

  1. Demander aux utilisateurs d'entrer une liste de noms de page séparés par des virgules.
  2. Utiliser une interface comme celle-ci:

qui permet aux utilisateurs d'appuyer sur + pour ajouter un autre champ de saisie.

Je suis convaincu que la deuxième approche offrirait une bien meilleure expérience utilisateur.

Maintenant, je suis confronté à une décision difficile: comment dois-je présenter visuellement les multiples entrées? À l'heure actuelle, les commandes tiennent dans une petite barre supérieure. Je ne pense pas que ce soit une bonne idée d'augmenter la taille de cela.

Les solutions possibles que je vois sont:

  1. Affichez les plusieurs champs de texte côte à côte. Ne rentrera probablement pas sur la plupart des petits écrans mobiles.
  2. Affichez les multiples champs de texte verticalement et étirez la barre. Cela ferait que la barre supérieure prendrait une quantité importante d'espace.
  3. N'afficher qu'un seul champ de texte, mais essayez d'ajuster les contrôles pour basculer entre eux

  1. Affichez les multiples champs de texte verticalement, mais gardez la barre de la même taille. Cela signifierait que l'utilisateur pourrait faire défiler cette partie de la page Web.

Je pense que je penche vers la dernière option, plutôt que d'ajouter plus de boutons ou d'étirer la barre. Mais laquelle de ces approches offre la meilleure expérience utilisateur? La meilleure solution est-elle quelque chose à laquelle je n'ai pas pensé?

1
Luke Taylor

Je n'essaierais pas de placer autant d'entrées que d'articles. Cela consommerait beaucoup d'espace, et cela pourrait ne pas être aussi utile, étant donné que l'utilisateur se soucierait d'une page Wikipédia à la fois.

Pourquoi ne pas envisager cette solution alternative?

enter image description here

1
Yako

Comment savez-vous que les utilisateurs en ont besoin? "Je voudrais adapter cette interface pour permettre un nombre variable d'entrées multiples."

Le problème que vous essayez de résoudre est intéressant et complexe, mais je voulais savoir quel scénario utilisateur les gens tentent de résoudre, ce qui rend l'interface utilisateur actuelle incomplète?

Si les utilisateurs doivent rechercher plusieurs entrées à la fois, ils sont habitués à taper simplement leurs mots, les virgules sont également assez connues. Google a rendu les choses assez faciles. Je pouvais voir dans ce cas que cela devient compliqué parce que le terme de recherche en fait doit correspondre à un réel article Wikipedia. Honnêtement, je ne peux même pas penser à un cas où je voudrais cela, alors je veux juste poser la question, car cela pourrait vous éviter beaucoup de problèmes.

La plupart des cas de recherche multiple créent des onglets sur lesquels un utilisateur peut basculer ou le modèle de concentrateur et de rayon, où un utilisateur sait revenir en arrière pour revenir aux autres options de recherche (Google). Donc, si vous en avez vraiment besoin, ce serait le modèle le meilleur et le plus familier.

1
Paula Chuchro

La solution avec laquelle j'ai fini par aller était en fait une liste séparée par des virgules. Cependant, j'ai créé une entrée personnalisée pour rendre la saisie de listes séparées par des virgules beaucoup plus intuitive. Il fournit un retour visuel à un utilisateur saisissant plusieurs éléments d'une manière similaire à l'entrée de balise de StackExchange

Input

Il fonctionne essentiellement de la même manière que StackExchange. Cette approche indique clairement à l'utilisateur que ses multiples entrées sont enregistrées.

0
Luke Taylor