MD-Blog_Web Creative

何気なく見ているWebサイトやアプリには、心理学が使われているそうです。
操作にストレスを感じなかったり、思わず押してしまうボタンなどは、人の心理をうまく利用しています。
今回はWebデザインに取り入れたい「心理学の手法」をご紹介したいと思います。

クレショフ効果

ソビエト連邦の映画作家・映画理論家のレフ・クレショフ氏が示した"認知バイアス"です。
ひとつの映像で、その前後に位置する他の映像に対して、意味や解釈に影響を及ぼします。

同じ1枚の写真でも、2枚目の画像が違うだけで、印象が変わってしまいます。
「女性とケーキの写真」は空腹をイメージさせて、「女性と海の写真」は夏をイメージさせます。

Webサイトの場合だと、カルーセルで複数枚の画像を使用することでストーリーを作ることができ、人と商品との繋がりを想起させることができます。

• 参考 https://foop.cestec.jp/

アフォーダンス

アメリカの知覚心理学者ジェームス・J・ギブソン氏により造語です。物の形状から経験したことがある行為を引き出すこと。
例えば、自動販売機のコインを入れる差込口は、特に説明がなくてもコインを入れる部分だとわかります。それは今までの経験から想起させたもので、これが「アフォーダンス」です。

Webでは、テキスト部分に下線があればリンクがあるとわかります。
また、右向きの三角形を見れば動画の再生マークとわかります。
ユーザーが認識している形状から逸脱しないことがユーザービリティを向上させます。

マジカルナンバー

人が瞬間的に記憶できる「短期記憶」の限界数を表したものです。
アメリカの認知心理学者であるジョージ・ミラー氏が、短期記憶の限界数を「７±２個のチャンク」として発表したものです。
しかし、2001年にネルソン・コワーソン氏によって「４±１」が正しいマジカルナンバーとして発表して定説になりました。

人が短時間で覚えられるのは3～5チャンク（かたまり）になります。

例えば、電話番号は「03」「0000」「0000」で「3チャンク」になります。

Webサイトのナビゲーションおいては、10〜20個をまとめても、わかりづらくなります。
4個か5個に絞りカテゴリに分け、その他の階層はメガメニューを使用するとわかりやすくなります。

• 参考 https://www.motech.co.jp/

コントラスト効果

対比効果ともいいますが、ひとつのことに対して良い悪いの判断をする際には、対比するものがないと判断できません。
評価には絶対評価と相対評価があり、絶対評価は比較なしで評価し、相対評価は比較対象ありで評価します。
コントラスト効果は相対評価でもあります。

例えば、料金プランを説明するときに、ひとつのプランを提示するよりも、その上下に、機能が制限されたプランと簡易版と最上級版を提示することで、標準を選択させやすくなります。これは3つの選択があると真ん中を選びたくなるという「松竹梅の法則」にも当てはまります。また、並列に並べずにオススメのプランだけ強調して、ユーザーの注意をひくことができます。

• 参考 https://smarthr.jp/pricing/

まとめ

今回紹介したのはほんのわずかなものです。他にも様々な法則があります。
心理学を取り入れることで、UIやUXを向上させることができます。そして、説得させる材料となります。

心理学を取り入れることは、デザインだけでなく、コピーライティングにもよく使われています。 ユーザーとして、思わず購入してしまったり、惹きつけられる広告は、もしかしたら心理学が利用されているのかもしれませんね。

参考書籍

• ［買わせる］の心理学　消費者の心を動かすデザインの技法61 - 中村 和正 (著)