ユーザーがログイン画面で自分のパスワードを見るのに適したUXはどれですか。
これらは、私が検討している2つのオプションです。
「パスワードの表示」オプションのチェックボックスを使用すると、ユーザーは自分のパスワードを見ることができます。 「Caps Lock」アイコンがパスワードテキスト領域にあり、ユーザーはCaps Lockキーがオンになっていることを確認できます。これは、Macが使用するものと似ています。
Windows 8のログイン画面に似た「目の」アイコンがあり、ユーザーがパスワードを確認できます。 「caps lock」アノテーションはパスワードテキストボックスの下にあります。これはWindowsとよりインラインです。
Windows 8の「目」のアイコンは私には馴染みのないものであり、Windowsユーザーではないので、誰かが私に指摘するまで気づかなかったことを認めなければなりません。全体的にどちらが良い体験ですか？
「アンマスキングアイ」アイコンにはさまざまなバリエーションがありますが、ほとんどの場合同じ問題が発生します。以下に例を示します。
私はこの特定の問題についていくつかのユーザビリティテストを行っており、テストした多くのユーザーは「目が見えない」ことにさえ気づきませんでした。ユーザーがアイコンにどのように意味を与えるかによって異なります。 彼らはそれを動詞のマスク/マスク解除と見なしていますか？またはトグルとして？また、トグルとして表示する場合は トグルボタンに現在の状態または変更後の状態を表示する必要があるかどうか
適切なソリューションを開発するために時間を費やす価値があります。特に小さな設計の細部でさえも大きな影響を与える可能性があると考える場合。説明のために、パスワードマスキングの削除による影響を分析した study が実行されたJack Holmesを見てみましょう。
出典： ログイン画面でのパスワードの表示 by Luke Wroblewski
上記は、 認識されたセキュリティとユーザーの信頼 に関して特に当てはまります。だからあなたの質問に答えるために、私は説明的なラベル「show password」を使用することにより、実証済みのアプローチを使用しますこれにより、あいまいさがなくなり、機能に対するユーザーの理解が深まります。
eコマースフォームでパスワードがデフォルトでクリアテキストとして表示された場合、調査対象の60％がサイトに疑わしいと回答しましたが、使いやすさの利点としてパスワードを隠さないことが判明したのは45％だけでした。対照的に、「パスワードの表示」設定がオンであることを示す単純なチェックボックスが追加された場合、参加者の100％がチェックボックスに気付き、クリアテキストのパスワードを機能として解釈しました。
出典： ログイン画面でのパスワードの表示 by Luke Wroblewski
それが役に立てば幸い
最近入力した文字のみが約0.5秒間表示される一部のシステムで使用される3番目のオプションがあります-ユーザーが別の文字を追加するか、0.5秒経過するとすぐに、文字は黒丸記号に変わります-これは私のですそれをアクティブ化または非アクティブ化するためにユーザーからの介入を必要としないため、個人的なお気に入り。
アイコンまたはテキストを使用しますか？
つまり、個人的な経験から言えば、-Financialソフトウェアのログインページを再設計するように求められました。目のアイコンを含め、3つのデザインを提案しました。
話を簡潔にするために、「目」アイコンとは対照的に、テキストを使用することには間違いなく投票します（[パスワード]フィールドに[パスワードを表示]または[表示]します）。
これは調査に基づくものではなく、実際に行われたものです。 若いユーザー（新卒の年齢）から古いユーザー（60歳から70歳）までの幅広い年齢層のユーザー（クライアント）がいます。デザイン（目のアイコン付き）をベータ版として投げると、それについて多くの電話がありました。質問はさまざまで、なぜ今必要なのでしょうか。これは何のためですか？
一部のユーザーが試してみたが、それは重要ではないがリスクがあると判断しました（これは別の議論です）。他の人（尊敬される世代）はそれをクリックすることすらしませんでしたが、それは何ですか？
一部の設計者は、目のアイコンのツールチップを追加にマウスオーバーすると「パスワードを表示」と表示するように提案しました。しかし、ここでも多くのユーザーがそれをクリックしようとさえせず、その存在を無視しているユーザーもいると信じています。
ただし、カスタマーサービス部門の責任者から電話で完全に削除するように依頼された後、誰かが従来の方法で、削除する横にチェックボックスと「パスワードを表示」テキストを追加することを提案しましたそれが引き起こしたあらゆる種類のあいまいさ。しかし、私はそれをあまり慣習的に使いたくありませんでした特に、「Caps Lockがオンです」という警告と「ユーザー名またはパスワードを忘れる」リンクにそのスペースをすでに使用していること。
だから私はテキストを追加することを提案しました"SHOW" in the Password field自体と追加したtool-tipはマウスオーバーで「パスワードを表示」と言います。テキストが"HIDE"に変わり、パスワードが再びマスクされます。
その後も幸せに暮らしました！
このデザインは実際に3つの問題を解決しました：
（1）- UXを向上させるための「パスワードの表示」機能の必要性。
（2）-チェックボックスとその横にある「パスワードの表示」テキストを使用することを選択した場合に発生したスペースの問題。 （前述のとおり、Caps Lockがオンの場合の警告メッセージと、ユーザー名またはパスワードを忘れた場合のリンクには、すでにそのスペースを使用していました）。
（3）-これはレスポンシブデザインであり、「SHOW」というテキストを使用すると、小さなチェックボックスに比べてモバイルデバイスをクリックするのがかなり簡単になります。
これがいくつかの洞察を追加することを願っています。