Comment afficher au mieux une liste avec un en-tête et un bouton de soumission?
Je conçois une application où les utilisateurs peuvent voter sur une liste de choix en les classant dans l'ordre. L'écran de vote doit avoir:
- Le titre du vote
- La liste des choix
- un bouton pour soumettre le classement de l'utilisateur.
Ce que j'ai maintenant, comme affiché dans Chrome sur un Android, c'est:
Ce dont je ne suis pas sûr:
- Indiquant que le haut est le plus préféré et le bas le moins préféré; Je ne sais pas si le texte que j'utilise actuellement est suffisamment clair. S'il existe un moyen plus concis de communiquer cela, j'aimerais certainement l'utiliser.
- L'emplacement du bouton de soumission; Je veux m'assurer qu'il ne se mélange pas avec la partie classement de l'écran. En ce moment, il y a un
3emséparation entre "l'option la moins préférée!" texte et le bouton. - Communiquer que les choix peuvent être réorganisés par glisser-déposer, bien que je pense que les poignées de glisser sur la gauche pourraient être suffisantes.
Toute rétroaction sur ces préoccupations (ou d'autres parties de la conception) est la bienvenue.
Utilisez des étiquettes dans les en-têtes de tableau pour indiquer le classement et indiquez clairement que les éléments peuvent être déplacés.
Le classement comme concept
Testez avec vos utilisateurs, mais le classement (ou mot équivalent) est un concept assez courant dans le vote (par exemple, le vote par choix classé). Le classement implique que le premier est le meilleur dans la plupart des cas, vous n'avez donc pas besoin des étiquettes supplémentaires.
Si vous avez des étiquettes qui se mettent à jour une fois que l'utilisateur a fait glisser l'élément en place, cela peut également renforcer l'interaction et ses résultats.
Signifiants importants pour les choix de commande
C'est un début, mais j'ai essayé de mettre l'accent sur les poignées de glissement et de séparer les éléments avec lesquels un utilisateur interagit des éléments qu'ils classent.
Dans ce cas, j'ai utilisé un fond bleu, mais je suis sûr qu'il existe d'autres façons d'indiquer visuellement quelque chose de similaire.
Essayez d'utiliser des signifiants de classement, vous pouvez utiliser une couronne ou quelque chose pour illustrer que le premier choix est le favori ou simplement les compter et mettre à jour leur ordre de numérotation lorsque vous les faites glisser.
Pour répondre à votre liste de problèmes:
Pour être sûr que le haut est le plus préféré et le bas le moins préféré, vous pouvez ajouter une icône à votre description "↑" ou vous pouvez déplacer l'icône de glisser vers la droite (voir Conception des matériaux - Listes/Comportement ) et ajoutez une étiquette sur le côté gauche (1er/2e ...)
Utilisez les mêmes marges que vous utilisez dans le reste de l'application pour les boutons
L'icône suffit. Assurez-vous simplement qu'il sera utilisé avec le curseur de la souris indiqué.
