web-dev-qa-db-fra.com

Comment rendre cet outil de guichet unique plus convivial?

Je construis un outil simple qui accepte une URL, un nom d'utilisateur et un mot de passe. L'URL contient un ou plusieurs ensembles de données. Une fois que les utilisateurs ont entré l'URL, le nom d'utilisateur et le mot de passe. L'outil récupère ensuite la liste des ensembles de données à partir de l'URL. L'utilisateur doit alors choisir l'un des éléments de la liste. Et puis l'utilisateur clique sur un bouton "Faire des trucs" où l'outil effectue une opération sur l'URL en fonction de l'élément choisi par l'utilisateur.

Maintenant, j'ai fait ceci est une simple fenêtre qui ressemble à ceci ([] -> une zone de texte)

URL [                ]  
UserName [             ] Password [         ]

Je préremplit l'URL avec une valeur par défaut mais elle peut être modifiée par l'utilisateur. En dessous, j'ai besoin d'une zone de liste déroulante où l'utilisateur peut choisir dans la liste, mais je ne peux le créer qu'après que l'URL, le nom d'utilisateur et le mot de passe ont été remplis par l'utilisateur. Donc, mon idée est d'avoir sous la ligne UserName

[Get List button] [Empty ComboBox]

Une fois que l'utilisateur clique sur le bouton Obtenir la liste, je remplis la zone de liste déroulante avec les choix, puis l'utilisateur en choisit un.

Enfin en bas, j'aurai un bouton "Do Work".

Mes questions sont

  1. Le bouton et la boîte combinée vide sont-ils un bon moyen de le faire ou existe-t-il un moyen plus intuitif?

  2. Il n'est pas évident que l'utilisateur doive choisir quelque chose dans la zone de liste déroulante après avoir cliqué sur le bouton GetList. Que puis-je faire pour améliorer cela?

  3. Parfois, la liste peut ne comporter qu'un seul élément, de sorte que la zone de liste déroulante peut sembler étrange avec un seul élément. Dois-je alors rendre la zone de liste déroulante invisible et la remplacer par une étiquette qui indique le nom de l'élément? Dois-je commencer à l'origine (avant qu'il ne clique sur le bouton Get List) avec un ComboBox ou un Label ou rien du tout?

usabilitybuttonscomboboxintuitive
2
user93353

J'ai essayé de visualiser après être passé par l'énoncé du problème.

Dans votre cas d'utilisation, il manque des éléments importants. Ce sont les commentaires du système. Par exemple, après avoir entré l'URL, le nom d'utilisateur et le mot de passe, l'utilisateur doit confirmer qu'il est connecté. Et prêt à récupérer les données du serveur.

Je ne suis pas d'accord avec la proposition de combo box. Au lieu de cela, proposez d'utiliser un affichage tabulaire avec bouton radio. Comme c'est ce que vous faites avec la combo. Mais il n'y a aucune indication visuelle que l'utilisateur doit choisir car les données ont été remplies.

J'ai essayé de mettre tous les points sous forme de filaire ci-dessous. J'espère que cela répond. Les sections 1, 2 et 3 peuvent être différentes fenêtres ou étapes.

enter image description here

2
pzv

Je suggérerais d'utiliser quelque chose de similaire à la page Google Analytics - Création d'objectifs.

mockup

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

De cette façon, l'utilisateur n'a pas à cliquer sur le bouton "obtenir la liste", ce qui facilite son utilisation et son traitement.

1
Igor-G

Je pense que vous compliquez trop les choses. Je souffre moi-même des méthodes compliquées que les administrateurs système utilisent pour identifier les services Web, j'ai donc une liste de server1, server2, server3, server627277277, server [N].

Et il semble que vous suivez le même chemin alambiqué.

Bien sûr, cela pose de nombreux problèmes. Le plus courant se produit lorsque l'utilisateur oublie le serveur avec lequel il doit travailler et doit rechercher les informations de connexion quelque part. Ou pire encore, demandez un nouvel utilisateur/pass. Vraiment frustrant.

Essayez plutôt ceci:

1. Make the user log in using their username and password
2. Once logged, display the list of servers they currently own
3. Once the user selects a server, display the set of available actions. You can do this in a variety of ways, which will depend on your layout and content (modals, dialogs, expanding divs, whatever). Make sure this element has a way to close.

Et c'est l'essentiel, en utilisant la règle KISS: directement au flux de points, pas d'ambiguïté, pas d'options alternatives, pas besoin de chercher des informations, pas besoin de s'inquiéter des mises en page basées sur disponibles Les données.

0
Devin

Mes suggestions vont dans le même sens que les autres, à quelques différences mineures près.

  1. La boîte combinée vide conservée avec le bouton (et si cette boîte combinée vide ne se remplit pas à moins que le bouton ne soit enfoncé), ce n'est certainement pas un bon moyen de montrer. Si vous avez l'intention de conserver cette zone de liste déroulante afin d'indiquer à l'utilisateur que les résultats seront renseignés dans celui-ci et qu'il/elle doit choisir parmi ceux-ci, alors au lieu de cela, gardez un simple texte après le bouton comme 'et sélectionnez un choix pour Faites des choses à partir des résultats disponibles "
  2. L'interaction que vous souhaitez afficher pour que l'utilisateur choisisse quelque chose dans la zone de liste déroulante après avoir cliqué sur le bouton GetList n'est pas courante et assez évidente. La zone de liste déroulante de l'utilisateur dépend également du nombre de résultats que vous attendez du système. L'affichage des lignes de choix avec des boutons d'action le rend plus évident. (Si des boutons radio sont utilisés, alors pour un résultat unique, un bouton radio unique semble étrange)
  3. Je suis d'accord avec vous sur le 3ème point. Conserver un seul résultat dans la zone de liste déroulante (et même pour les boutons radio), cela semble étrange. Le bouton de chaque enregistrement peut donc fonctionner ici. Cela le rend suffisamment flexible au lieu d'afficher uniquement une étiquette. enter image description here
0
Spicerjet