web-dev-qa-db-ja.com

この設計でユーザーを導き、ユーザーに間違いを犯させて修正するのを避けるための最良の方法は何でしょうか?

私は、ユーザーに間違いを犯させて修正する必要なしに、ユーザーが目標を達成する(コースを提出する)ための最良の方法を見つけようとしています。

この設計では:

  1. ユーザーはこのページの「コースの詳細」にアクセスします(左側のオプション)。ここで、ユーザーはいくつかの情報を入力する必要があります(一部は必須で一部は必須ではありません)。

    [送信]ボタンが無効になっていることに注意してください。

  2. ユーザーは左側の「コース日」オプションを選択する必要があります。日付を設定する必要があります。 Only日付を設定すると、[送信]ボタンが有効になり、ユーザーが送信できるようになります。他のすべてのオプションはオプションです。必要なものは「コース詳細」と「コース日」オプションにあります。

送信ボタンはすべてのページに表示される必要があります(左側で選択したオプションにかかわらず、右側に必須フィールド、オプションフィールド、またはその両方が表示されます。そのため、ユーザーはページに関係なく、いつでも送信できます。それらはオンです)必要なすべてのデータが提供された後、ボタンが有効になり、ユーザーが送信できるようになります(この場合、必要なデータはコースの詳細とコースの日付の下のみです)。

私の質問は次のとおりです:Whileユーザーは[コースの詳細]ページですが、[送信]ボタンがまだ無効になっていることを通知するにはどうすればよいですか(すべて記入済みですが) 「コースの詳細」ページの必須フィールド)mustは「コースの日付」オプションに移動し、-日付を設定なので、「送信」ボタンが有効になりますか?

だからここで私がやろうと思ったことは、

  1. 「コース日」オプションの隣にアスタリスクを置き、無効「送信」ボタンの隣にヘルプアイコンを追加して、ユーザーをガイドします日付を設定すると、送信できるようになります。

    ボタンを有効にすると、ヘルプアイコンが消えます。

  2. 「コース日付」オプションの隣にアスタリスクを配置し、「送信」ボタンを常に有効にしておき、ユーザーが「コース日付」オプションの下で日付を設定する前にボタンをクリックすると、メッセージを表示して、ユーザーに日付を設定して送信するように案内します。 (このようにして、ユーザーに送信を試みて間違いを犯させ、最初に日付を設定してから送信する必要があることを教えるようにしています)

最初からデザインが良くないことを知っています。より良いアイデアに感謝しています!

これは最終的なデザインではないことに注意してください。このデザインはケースを説明するための単なるスケッチなので、フォントや色の一致などに焦点を当てていません...

更新:(より明確にするため)

「送信」ボタンは、提供された写真のように常に表示されたままである必要があります。ユーザーはすべてのページのすべてのデータを入力する必要がないため。 「新しいコースを作成」ボタンをクリックして、このページ(デフォルト=コースの詳細ページ)に移動すると考えてください。すべてのページのすべてのデータを入力して送信できます。ただし、必要なデータのみ(この場合はコースの詳細ページと日付ページのみ)に入力して送信することもできます。他のいくつかのページに必要なデータがあり、それぞれにいくつかの必要なデータがあるが、コースの詳細ページと同じページに配置できない場合はどうなりますか。それで、あなたはそれをどのように扱いますか?いくつかのページには特定のデータがあり、一部のページにはデータが必要で、一部のページにはオプションのデータがあるとデザインを考えてください。ユーザーは任意のページで送信できます(必要なすべてのデータが提供されます)。

もう1つ、強制的な流れがあってはなりません。つまり、一部のユーザーはすべてのページに移動したくないため、何を入力する必要があるかを知っているため、各ページに「次へ」ボタンがあってはなりません。一部のリピートユーザーは、一部のデータ(必要なデータを含む)を提供して送信するだけでよい場合があります。だから彼らはそれをそのままにしたいのです。

First image

Second image: Made some changes to show that there are other options not just the "Course Details" and "Course Date"

2
Mo'ath

現在の事実上の標準は、各必須フィールドの横にすぐに表示される(つまり大きな)アスタリスクで、スター付きのアイテムが必要であることを説明しています。


このアプリは教師用ですので、1ページに収めることができます。 (これは美化されていません): enter image description here

2
MMacD

それはすべて配置にあります。

これは、コースの日付オプションの下に送信ボタンを配置するのが最適です。これは、日付を設定する必要があることを意味する一般的な論理的な読み順ですbefore送信ボタンがクリックされます。

また、無効にされた送信ボタンにツールチップを配置することをお勧めします。ユーザーが無効にされたボタンの上にカーソルを置くと、次のようなメッセージが表示されます。Please set a course date。もちろん、必須フィールドのアスタリスク(および[送信]が押されたときに完了しない場合は赤いアウトライン)が標準の期待値であるため、それも使用します。これらすべての要素を導入することにより、ユーザーの認知的負荷を軽減します。

これらの改善により、誰もがそれを理解できるとは限りませんが、大多数のユーザーは、提出する前に日付が必要であることを理解します。

2
Jason Cemra