ユーザーが最後に1つのアクションを実行する必要があることを明確にするにはどうすればよいですか？
私の会社のWebサイト用の新しいチェックアウトウィザードを開発しています。ウィザードの最後のステップとして「選択内容の確認」パネルを追加しました。
デザイナーとしての私の観点から、注文が完了する前にユーザーがまだボタンを押す必要があることを示す少なくとも3つの手がかりがあると感じています。
- パネルの上部に「ほとんど完了」と表示されます。
- 上部のプログレスバーは、「送信」段階の途中であることを示しています。
- 下部にありますが、「リクエストを送信」という大きな緑色のボタンがあります。
ただし、一部のユーザーはこれを「ご注文が完了しました。概要はこちらです」ページと誤解して誤解し、リクエストを送信できない場合があります。
私がそれを見る方法、私はこれの1つによってこれに近づくことができました：
- 心配しないで。そのようなばかげているユーザーはいないでしょう。
- リクエストを自動的に送信する前にこのセクションに移動します。これは、不誠実/違法である可能性があります。
- 「リクエストを送信」をクリックする前にブラウザを移動しようとしたりブラウザを閉じようとしたりする場合、ある種の迷惑なJavaScriptポップアップを使用します。
これらのどれも私にとって満足のいくものではありません。他に何かできることはありますか？ユーザーがメールアドレスのスペルを間違えることが多いため、このページを完全に削除しないようにしたいと思います。
更新：最後のステップに支払いと確認のステップを組み合わせてみます。 お客様がリクエストを送信しても、実際に請求されることはありません。カード情報をStripeに記録するだけです。
私の目標をよりよく理解するには、このフォームのライブバージョンを次の場所で確認できます。 http://bloomingtontutors.com/get-tutor
直感に合わせて動作を変更する
最初に意図した動作を「ユーザーに理解させる」ようにデザインを変更するのではなく、ユーザーの直感に合うように動作を変更したい場合があります。
その時点で詳細を確定する主要な理由がない場合（そうでない場合は、請求されずに最初のセッションの前にキャンセルできるため）間違いは後で修正できます。必要。したがって、その1つの最後のアクションを削除できます（ユーザーの観点から、必要なすべてのものがすでに入力されており、最小値で十分です）、その時点で要求がすでに「保存」されており、最後のタイトルを変更します[送信する前に確認する]ではなく、[情報を確認し、突然間違いを見つけた場合は修正する]画面に移動します。
確認をモーダルでレンダリングします。
これにより、もう1つのアクションが必要であることをユーザーに明示します。
私はSubmit Requestという言葉が好きではありません-デザイナーとして、ボタンを押すのと同じように機能します。ユーザーにとって、それはPress This Buttonほど多かれ少なかれ無意味です。 Send Requestの方がはるかに優れているとは思わない（おそらくどこにリクエストが送信されるのか）。
- それがシステムの目的である場合は、
Place Bookingをお勧めします。どこかでコースを予約します。 または：
- 「ブックコース」
- 「予約の確定」
- 「予約の確認」
警告することもできます（一部のサイトと同様）。
「予約する」ボタンをクリックするまで、コースは予約されていませんです。詳細が正しいことを確認し、準備ができたらそれをクリックします。
「完了->」ボタンは何をしますか？これは「リクエストの送信」と同じですか？そうでない場合、その目的は何ですか？
完全に明確にするために、プライマリアクションボタンの表現を実際に変更する必要があります。
「リクエストの送信」または「リクエストの送信」は、ユーザーがリンクまたはボタンをクリックしたときにブラウザが行うことですが、「セッションの支払い」ユーザーが希望するものまたはこのコンテキストで続行します。
モーダルダイアログを使用すると、ウェブサイトで他に何かを行う前に、最初にダイアログを完了する必要があることをユーザーに示しますが、モーダルは、「閉じる」ボタンがビューポートの外側にある場合、小さな携帯電話で問題を引き起こすことがわかっています。
「送信」の後に「確認」タブを最後に追加し（「送信」のテキストを「要約」に変更します）、完了前に別のセクションがあることをユーザーが知っているようにします。ユーザーがタブ付きチェックアウトの最後のステップにいるのは奇妙ですが、実行されていません。
チェックアウトファンネルが長すぎることを考慮する必要があります。 （プログレスバーのステップが多すぎます。いくつかのステップを組み合わせたり、削除したりすることを考えてください）、これはユーザーを怖がらせる可能性があります。
あなたのページはすべてに等しい重みを与えます、そしてそれが要約ページのように見える理由です-あなたの本能は正しいです。彼らが買ったものやどれくらいかなど、ハイライトするものをいくつか選んでください。
ここにある要約情報は良いです。私の以前のユーザーテストでは、顧客が実際にそれを読んで修正に使用していることが示されています。そのため、「正しいことを確認する」よう依頼することはそれほど重要ではないと思います。とにかく彼らはそれを読む可能性が高いからです。あなたはこの情報を軽視し、代わりに彼らが支払うものとそれがいくらであるかを強調することができます。
一般的な「情報を送信する」ではなく、「支払い」などの単語を使用する
完全な答えではありませんが、ご想像のとおり、アプローチ1は間違っています。
Bank of Americaにも、口座間または友人の口座への送金時に同様のページがあります。送金元口座、送金先口座、合計金額、送金日を選択し、次にヒットします。次に、「すべてを確認」ページが表示されます。 「完全転送」をクリックすると、実際の転送が開始されます。
私はいくつかの場面で、最後のページで終わったと誤って思ったのに、なぜ私のお金が送金されなかったのか疑問に思いました。次に行うことは、アカウントをチェックして、振込が支払いログに表示されることを確認することですが、特に、頻繁に購入しないWebサイトで、同じ間違いを犯している人を確実に見ることができるためです。あなたはすぐに支払いを処理しないので、彼らは彼らの口座残高をチェックして支払いが確実に行われたことを確認するオプションすら持っていませんが、彼らがそのように慎重であるなら、おそらく彼らは支払い確認ページが印刷または保存されるのを待っていたでしょうとにかく、なぜ彼らがまだ持っていないのかを理解しました。
確認ページ後支払いの詳細ページを表示するのに十分な理由はありますか？
通常は、メールアドレスと配送の詳細を確認してから、支払いの詳細を確認します（カード番号には、タイプミスを防ぐためのチェックサムがあり、追加の検証の必要がありません）。さらに、ほとんどの銀行では、カードを保留するときに何らかの2要素認証を必要とします。これは、ユーザーが有効なチェックサムになるような方法でカード番号を入力した場合は失敗します。
ユーザーが支払いを期待し、支払いが完了するまでプロセスが完了したと見なさないため、支払いステップが最終ステップに変わった場合、問題は解決されます。追加の利点は、購入プロセスが中断された場合に二重請求される（存在しない）リスクについてユーザーに（支払いの詳細ページで行ったように）警告する必要がないことです。
また、ボックスを緑ではなく赤にすることをお勧めします。緑は正常に完了したという感覚を与え、IMO赤はより多くのアクションが必要であることを意味します。
アプローチをよりよく説明できる単純なモックアップを作成しました。これはモバイル画面で行われるのを見てきましたが、画面の残りの部分がオーバーレイされますが、実行できるアクションはクリック可能なアイテムだけです。前のビューに戻るためのキャンセルオプションもあります。多忙なモーダルから当て推量を取り除き、簡単に解決できるので、私はこれが好きです。 