ログイン/登録：使いやすさ、クリック数、および外観のバランスをとる方法
私は ログインまたは登録ページ の新しいデザインに取り組んでいます。非常にユニークな制約があるため、これらのページの1つを実行したのはこれが初めてかもしれません車輪の再発明。
ここに目標があります：
- 新しいバージョンを現在のバージョンより使いやすく/使いやすくする
- 一般的な使用例では、可能であればクリック数を減らします
- フォームを難しすぎないようにしてください
ここに制約があります：
- すべての開いているIDボタン（Google/Facebook/Yahooなど）は、どのようにラベル付けされていても、サインアップボタンまたはログインボタンと同じように機能します。
- SSLの制限により、スタック交換のサインアップまたはログインフォームを埋め込むにはiframeが必要です
- パスワードを忘れた場合の機能は、実際にはスタック交換のオープンIDでのみ機能しますが、サインイン方法を忘れた場合は、この機能を介して受け取る電子メールが正しい方向を示します。
- Google、Facebook、Stack ExchangeのオープンID登録/ログインが95％以上のケースをカバー
それで、私は異なる方向に向かう3つのワイヤーフレームを作成しました。上記の目標と制約のバランスを最適化する方法の提案を探しています（分割テストを計画していますが、分割テストでは使いやすさの問題が明らかにならない場合があります）。
オプション1：明確にするために、すべてをページに配置し、開いているIDボタンを複製する
長所：
- すべてに明示的なラベルがあります。新しいユーザーがGoogleサインアップボタンがどこにあるのか疑問に思うことはありません
- スタック交換ログインとサインアップのユースケースのクリック数を1つ減らします
短所
- 画面に多くのものを表示します。怖いかもしれません
オプション2：開いているIDボタンから冗長性を削除する
長所：
- 威圧感が少ない
- スタック交換ログインとサインアップのユースケースのクリック数を1つ減らします
短所
- 列の上に明示的なラベルがない場合、2列形式は機能しますか？
オプション3：最小限
長所：
- 最初はそれほど威圧的ではありませんでした。すぐに行う必要がある決定の数を減らす
短所
- 複数の画面/クリックでプロセスを引き伸ばします
タブはあなたの問題を解決すると思います。このミニフォームのようなもの：
オプション2：オプション2を使用することをお勧めします。これは、ユーザーが実行できるさまざまなアクションを明確に呼び出すためです。
- Facebookでサインイン
- グーグルでサインイン
- 彼のアカウント詳細でサインインします。
このオプションでは、同じフレーム内でアカウントを作成するオプションも提供されます。これは1回限りのプロセスであり、次回ページにアクセスしたときに、ログイン画面を直接使用して必要に応じてログインできます。オプション2のもう1つの利点は、3つすべてのオプションが明確に呼び出され、ユーザーが自分の好みに基づいて簡単に選択できることです。登録リンクへの切り替えの概念もユーザーには不明ではなく、ほとんどのユーザーは、選択された場合に登録オプションを表示するためのページ変更を認識しています。
以下に示すように、このログインアプローチに従う多くのアプリがあります。
オプション1：ページには2つの多くの注意散漫な要素があり、ユーザーがしなければならないことにユーザーを向ける単一の焦点がないため、私はオプション1のファンではありません。
オプション：Googleを使用したサインインとFacebookのボタンを使用したサインインによってリンクが陰になり、ユーザーが目立たないためにユーザーがそれらに気付かない可能性があるため、私もオプション3のファンではありません。認証サインインボタンを開きます。
ボタンを再配置して、ボタンをより見やすく意味のあるタブに変換しました。私の解決策はそのようなものでしょう。
