web-dev-qa-db-ja.com

マテリアルデザインのパスワードの変更動作

この動作を使用して、ユーザーにパスワードを変更させています。

ユーザーがパスワード変更ボタンをクリックすると、3つのテキストフィールドが表示され、ボタンが「キャンセル」ボタンに変わります。

上記のフィールドからパスワードの変更セクションを分離する必要がありますか?それとも十分に明確ですか

change password behavior

2
Basem

あなたがそれを表示した方法は適切に機能し、人々はそれを理解すると思います。ただし、最初の画像には保存するものがないので、保存ボタンを削除することをお勧めします。このボタンを「情報の変更」ボタンにして、人がこのボタンをクリックすると、「変更を保存」に変更します。

フィールドが変更されると同時にボタンが変更されるため、すべてのユーザーがボタンが変更されたことに気付くとは限りません。これは、次に使用するフィールドであるため、フィールドの変更に集中します。

ほぼ同じように要素をグループ化すると、ユーザーエクスペリエンスと使いやすさが向上します。これについて詳しく知りたい場合は、Gestaltの原則を参照してください。

1
MJB

わかりやすくするために、これらの変更を1つ以上追加します。

  • 3つの新しいテキストフィールドとボタンが画面の右端の「パスワードの変更」ボタンが消えたところに表示されるようにします。

  • 「キャンセル」のすぐ上に「新しいパスワードを保存」ボタンを追加します。

  • ユーザーが「パスワードの変更」をクリックした後、「保存」ボタンを無効にします。ユーザーが新しいパスワードを入力(2倍)したら、パスワードを再度アクティブにします。

0
dr_