webデザインに活用できる4つの法則
近頃とあるサービスの管理画面のデザインをしています。
最初は4画面ほどのシンプルな構成で考えていたはずが、具体的な使用シーンを考えていくうちに気づけば画面数が倍以上に増え、各画面内の情報も散らかってきた……。
そんな時に、上司から心理学の法則を使って整理するとよいというアドバイスをいただき、その通りに情報を見直すことでぐっとUIが向上できた、という経験をしたので、この機会にWebデザインに使える法則をまとめてみようと思います。
チャンクの法則・ミラーの法則
チャンクの法則とは、人間が情報を処理する際、処理を簡単に行うためにまとまり(チャンク)に分けて理解する、という認知心理学の考え方です。
これに関連するのが「ミラーの法則」で、人間が短期記憶で処理できる情報の数は7±2個である、というアメリカの心理学者ジョージ・ミラーが唱えた法則です。短期記憶できるのはもっと少ないとする説などもあるそうですが、要は「8個以上要素が並ぶと難しく感じる」ということで、この考えは情報を伝えるwebデザインをする上でぜひとも覚えておきたいです。
私自身管理画面をデザインしていた際、サイドバーに10個のアイコンを並べて各画面のレビューを受けて、「まずはサイドバーを修正しよう。こんなにアイコンが並んでいると操作するハードルが高く感じる」と指摘をいただきました。
そこから画面をグループ化し、サイドバーに並べるアイコンの数を5個まで絞ると……見やすい。
画面全体に占める変更割合でいえばちょっとしたものですが、それだけで操作ハードルが大きく下がり、今後も毎回確認したい法則になりました。
ヒックの法則
ヒックの法則とは、選択肢が増えるとユーザーの判断時間が増える、というイギリスの心理学者ウィリアム・ヒックが提唱した考え方です。
例えばWebサービスをデザインする中で、ユーザーがする可能性のある行動を考え「項目毎の削除に加えて、一括削除も必要では?」「この情報は詳細を見たいシーンがあるのでは?」等、可能な操作を増やしていくことで複雑そうな画面が出来上がり、結果的にUXが下がってしまった、という経験はありませんか?
機能を増やすことで開発の負担も増えますし、考えうる機能を単純に盛り込むのではなく、デザイン時点で戦略的に情報を整理しておくことが重要です。
フィッツの法則
フィッツの法則とは、ボタンなどのターゲットが大きく近いほど移動しやすく(=押しやすく)なる、という人間工学の考え方です。
ターゲットが離れていたり小さかったりすると、ターゲットを見つけて操作するのに時間がかかり、操作ハードルが上がる……
言われてみると当たり前のような法則ですが、実際にデザインする中で常に意識できているかというと、自信を持って頷けない方も多いのではないでしょうか。
連続した操作で「次へ」ボタンが常に同じ位置にある等の細かいことでも、ユーザー視点で操作してみると意外とそれだけで印象が大きく変わることもありますよね。
こちらも意識して確認しておきたい法則です。
まとめ
以上4つの法則をご紹介しました。
どれも基本的なことですが、デザインする中で誰もが常に意識できているかというとそうでもない、
逆に言えば、しっかり活用できれば今よりワンランク上のUXを実現できるテクニックです。
私自身も、デザインをする中で時々立ち止まってはチェックしていこうと思います。