はじめに
UIデザインを作成するときやデザインのレビューをするときに、こんな経験をしたことはありませんか？
この「なんとなく」の感覚は「直感」とも言えますが、根拠を説明できなくてモヤモヤしますよね...。
しかし、UIデザインはアートではなく、ユーザーのための設計です。
つまり、判断には必ず何かしらの根拠があるはずです！
この「なんとなく」の感覚を少しでも減らし、デザインの根拠を説明できるようになるために、心理学の法則・原則について調べてみました。
その中でもUIデザインに役立つ法則や原則を5つ紹介したいと思います。
1. ゲシュタルト原則
ゲシュタルト原則は、物事を全体として捉える人間の認知の傾向を示す法則です。
「ゲシュタルト崩壊」という言葉は耳にしたことがある人も多いのではないでしょうか。
ゲシュタルト崩壊とは、このゲシュタルト原則によるまとまりの認識が崩れて個々の要素がバラバラに見えてしまう現象を指します。
「ゲシュタルト原則」には基礎となる6原則がありますが、その一部を簡単に紹介すると、
- 近接の法則 → 近くにあるものはグループとして認識される
- 類似の法則 → 形や色が似ているものはまとまりとして見える
- 閉鎖の法則 → 一部が欠けていても、脳が補完して全体の形として認識する
このゲシュタルト原則を念頭に置いてUIデザインを考えてみます。
例えば、入力フォームでラベルとフォームの位置が離れていると、関連性が薄れるためユーザーが入力しづらくなる可能性があります。
今までなんとなく「ラベルとフォームの位置は近いほうが良い」と思っていたあなたも、今日からこう発言できます。
「ラベルとフォームは縦並びのデザインの方が良いです。なぜかというと、ゲシュタルト原則によれば、それぞれの位置が離れていると関連性が認識しにくく、ユーザーが入力に手間取る可能性があるからです（ｷﾘｯ）」
これで「なんとなく」を1つ減らせました🎉
2. フィッツの法則
フィッツの法則は、ポインタで指そうとするターゲットが大きければ大きいほど、またターゲットが動作の開始点の近くにあればあるほど、ポインタで到達する時間が短くなる法則です。
直感的に理解しやすい法則ですね。
例えば、ドラッグ＆ドロップでファイルをアップロードする場合、アップロードフォームのサイズを大きくすると、ポインタで指すまでの所要時間を短縮できます。
また、チェックボックスのクリック領域をテキストにも広げることで操作のしやすさを向上させる工夫も、この法則に基づいています。
3. ステアリングの法則
これは2つ目のフィッツの法則から派生した法則です。
ステアリングの法則は、ポインタを狭い経路に沿ってターゲットまで移動させる場合、その経路が広いほど移動に要する時間が短くなる、というものです。
UIデザインでは、メニューやボタンの配置を最適化し、ユーザーが目的の場所に素早く到達できるようにするために活用されます。
経路が広いとスムーズに選択できるようになりますが、逆に狭いと目的の場所に辿り着きにくく、UIの使い勝手が悪くなります。
4. ヒックの法則
ヒックの法則は、選択肢の数や複雑さが増えるほど意思決定に時間がかかる、という法則です。
選択肢が少ないほど、すぐにユーザーは決断できるようになります。
コロンビア大学のシーナ・アイエンガーの「ジャムの実験」では、選択肢が少ない方が購買率が高くなることが示されました。
ウェブサイトでは、選択肢を整理し、ユーザーが迅速に意思決定できるようにすることが重要です。
特に購入前のフォームの選択項目などは最小限にすると良いでしょう。
5. ドハティの閾値
ドハティの閾値は、システムの応答時間が0.4秒以内であると、ユーザーがスムーズに操作できるという概念です。
応答時間が0.4秒を超えると、ユーザーの関心が薄れ、操作がストレスになる可能性があります。
画面の表示速度やボタンの応答時間を常に意識しましょう。
また、待機時間を感じさせないインタラクションを取り入れたり、ユーザーが完了を待たずに他の作業ができる仕組みにするのが効果的です。
おわりに
いかがでしたか？
「なんとなく」の判断を心理学の原則に置き換えることで、デザインの意図を明確に説明できるようになり、自信を持って判断できるようになります。
デザインを考える際には、「このデザインが良い理由は何か？」を心理学の観点からもぜひ考えてみてください！
参考