2つの関連フォームが別々に送信されることを明確にする方法は？
レビュー機能をウェブサイトに追加しています。現在、ユーザーがレビューや評価を入力できるフォームは次のようになっています。
ユーザーが評価の星の1つをクリックすると、ページはバックグラウンドでこの評価を送信するajaxリクエストを作成し、次に「評価が正常に保存されました！」という警告ボックスがポップアップ表示されます。アラートが終了すると、「今すぐ評価：」メッセージが「あなたの評価：」に変わります。これはほぼ瞬時に起こります。
ただし、一部のテストユーザーはフォーム全体を不必要に送信しており、サイトに空白のレビューが表示されています（評価をカウントするためにも[送信]をクリックする必要があると考えているためです）。バックエンドを修正して、空のレビューの送信を拒否するようにしますが、これらは2つの独立したエンティティであり、お互いがなくても存在できることを新しいユーザーに明確に示す方法が必要です（評価なしのレビューは問題ありません） 、そして投票するためにエッセイを書く必要はありません）。
私の最初の考えは、評価の星をレビューボックスから離れて、アイテムとその詳細が表示されるボックスに移動することでした。ただし、ユーザーがレビューを送信すると、ユーザーの評価がレビューの横に表示されるため、接続されているように見える必要がありますが、どちらもオプションであることを明確にします。
あなたが持っているかもしれない提案を事前に感謝します。
単純なフォームは1つだけです。それはとにかくユーザーが期待していることです。星評価（またはそうではない）をクリックし、フォームに記入（またはそうではない）してから、[送信]をクリックします。いいえAJAX（ユーザーが気づかない方法でクリックするとすぐに星評価を取得する場合を除く）は必要ありません。
あなたはこれについて尋ねませんでしたが、10スターは多すぎるようです。次のような質問の解説をのぞいてみてください。
https://ux.stackexchange.com/a/59728/51882
私は5つ以上はしません。
説明から、評価は必須ですが説明はオプションです。ここには2つの解決策があります。
- Progressive Disclosure を利用できます。 NN/gの記事からの引用：
段階的な開示により、高度な機能やめったに使用されない機能が二次画面に委ねられ、アプリケーションの学習が容易になり、エラーが発生しにくくなります。最初に、最も重要なオプションのいくつかのみをユーザーに表示します。
まず、評価を表示します。ユーザーが評価を選択したら、説明パネルを表示/開示します。このようにして、ユーザーが評価を送信するようにできます。
- 評価が送信されるまで送信ボタンを無効にし、評価を強調します。 Uberがドライバーを評価する方法です。
1つの解決策は、以下に示すように、フォームを視覚的に区別することです。
