web-dev-qa-db-fra.com

Comment indiquer clairement que deux formulaires connexes sont soumis séparément?

J'ajoute une fonctionnalité d'avis à un site Web. Actuellement, le formulaire où les utilisateurs peuvent entrer un avis et/ou une évaluation ressemble à ceci;

Current Form

Lorsque l'utilisateur clique sur l'une des étoiles de notation, la page fait une demande ajax en arrière-plan qui soumet cette note, puis apparaît avec une boîte d'alerte informant l'utilisateur que "Votre note a été enregistrée avec succès!" et le message "Évaluer maintenant:" devient "Votre évaluation:" une fois l'alerte terminée. Cela se produit presque instantanément.

Cependant, certains de mes utilisateurs de test ont soumis le formulaire en entier inutilement et ont fait apparaître des avis vides sur le site (je suppose qu'ils pensent qu'ils doivent cliquer sur "soumettre" pour que la note compte également). Bien que, de toute évidence, je vais réparer le backend afin qu'il rejette les soumissions d'avis vides, j'aimerais un moyen de faire comprendre aux nouveaux utilisateurs qu'il s'agit de deux entités distinctes et qu'elles peuvent exister l'une sans l'autre (les avis sans note sont très bien , et vous n'avez pas à rédiger un essai pour voter).

Ma première pensée a été de déplacer les étoiles de notation loin de la boîte de commentaires, dans la boîte où l'article et ses détails apparaissent. Cependant, si un utilisateur soumet un avis, sa note est affichée à côté, il doit donc avoir l'air d'être connecté, tout en précisant que les deux sont facultatifs.

Merci d'avance pour toutes suggestions que vous pourriez avoir.

2
John Cave

J'aurais juste un formulaire simple. C'est ce que vos utilisateurs attendent de toute façon. Ils cliquent sur le nombre d'étoiles (ou non), remplissent le formulaire (ou non), puis cliquez sur soumettre. Non AJAX (sauf si vous voulez capturer le nombre d'étoiles dès qu'ils cliquent d'une manière transparente pour l'utilisateur)).

Vous n'avez pas posé de questions à ce sujet, mais 10 étoiles semblent trop. Vous voudrez peut-être jeter un œil aux commentaires dans des questions comme celle-ci:

https://ux.stackexchange.com/a/59728/51882

Je n'en ferais pas plus de 5.

3
J. Dimeo

D'après votre description, je comprends que l'évaluation est obligatoire tandis que la description est facultative. Vous pouvez avoir deux solutions ici:

  1. Vous pouvez utiliser Divulgation progressive . Citation de l'article NN/g:

La divulgation progressive reporte les fonctionnalités avancées ou rarement utilisées sur un écran secondaire, ce qui rend les applications plus faciles à apprendre et moins sujettes aux erreurs. Initialement, ne montrez aux utilisateurs que quelques-unes des options les plus importantes.

Pour commencer, il suffit de montrer la note . Une fois que l'utilisateur a sélectionné une évaluation, affichez/divulguez le panneau de description. De cette façon, vous pouvez vous assurer que la note sera soumise par l'utilisateur.

  1. Désactiver le bouton de soumission jusqu'à ce que l'évaluation soit soumise et montrer plus d'accent sur l'évaluation . Voilà comment Uber le fait pour évaluer les pilotes.

enter image description here

2
Adit Gupta

Une solution consiste à délimiter visuellement les formulaires, comme indiqué ci-dessous: -

enter image description here

enter image description here

2
Chetan