デザインの心理学

ユ ー ザ ー素晴らしいデザインの恩恵を受けるのは利用者です。デザインの対象がウェブサイト
であっても、医療機器であっても、そのほかのものあっても、この点は変わりません。
ですから、素晴らしいデザインを実現するには利用者に対する深い理解が欠かせません。利用者はどう考え、どう判断するのでしょうか。
「クリック」であれ「購入」であれ、皆さんが利用者にしてほしいと望んでいる動作を促すものは何なのでしょうか。
そうしたことを解明するのがこの本の目的です。
人の心をとらえるのはどのようなものなのか、人はどのような誤りを犯しやすいのか、
その原因は何かといった、皆さんがよりよいデザインをする上で役立つさまざまな事柄をこの本で紹介していきます。
きっと役に立つはずです。
すでに「しんどい作業」はほとんど私がやっておきました。私は論文を読むのが大好きという変わり者で、山ほど読みます。もちろん論文だけではなく本もたくさん読みます。場合によっては二度、三度と読み直すことさえあります。その中から特に優れていると思った理論や概念、研究成果を選びました。
そして、そうした研究成果を私自身の経験、長年インタフェースデザインに携わってきたことで得た私の知識や感覚と融合させたのです。
こうして誕生したのがこの本です。

vii

本書の構成1 章 人はどう見るのか
脳の約半分は目から入ってくる情報の処理を担当していると言われています。人は目が物理的に受理する情報をそのまま見ているわけではありません。目が受理したイメージが脳に伝達されると脳がさまざまな処理をし、その結果を「見て」いるのです。
さて、どのような処理をしているのでしょうか。
2 章 人はどう読むのか
本や雑誌などを「読むこと」は現代人にとって情報伝達の主たる手段となっています。
しかもインターネットが広まってから、人が「読む」情報の量は爆発的に増大しました。しかし「読むこと」と「理解すること」は同じではありません。ウェブページなど
で自分の伝えたいことをきちんと理解してもらうためにはどうしたらよいでしょうか。
3 章 人はどう記憶するのか
人間のもつ「記憶容量」は無限ではありません。一度に覚えられる量にも、覚えられる期間にも、その正確さにも限界があります。ただ、こうした限界があることは必ずしも悪いことばかりではないのです。この章では人間の記憶の特性、特に不確かさと複雑さについて解説します。
4 章 人はどう考えるのか
脳には膨大な数の神経細胞があり、人間はこれを使って実に多様な処理を行っています。人が「考える」とき、脳の中では一体何が起こっているのでしょうか。人がどう考えるかを理解することは、利用しやすいシステムやサイトを設計しようとする際には非常に重要です。目に錯覚があるように、思考にも錯覚があります。この章では外界の状況を把握するため脳が無意識のうちに行うさまざまな処理を紹介します。
5 章 人はどう注目するのか
人を注目させる要因にはどのようなものがあるでしょうか。人はどのようにして、ほかの人の注意を引き、その後も相手の気を逸らさないようにしているでしょうか。
私たちが何かに注意を払う払わないの違いは、どのようにして生じているのでしょ
うか。

viii

デザインの心理学

6 章 人はどうすればヤル気になるのか
これまで人にヤル気を起こさせることが実証済みとされていた方法にも、効果のないものがあることが最新の研究で明らかにされつつあります。何が人をヤル気にさせるのか、どういった状況になれば人はよりヤル気になるのか、最新の研究結果を見てみましょう。
7 章 人は社会的な動物である
人にとって社会性は、普段考えている以上に重要な要素です。人は社会生活のためなら身の回りのものを何でも利用します。もちろんハイテク製品やネットのサービスなども例外ではありません。この章ではこうした人と人との社会的なやり取りの背景について、科学的に分析をしていきます。
8 章 人はどう感じるのか
人は考える動物です。しかしいつも論理的な考えに基づいて意識的に行動するわけではありません。むしろ、感情的、感覚的な行動、無意識の行動のほうが多いのです。
人はどのように感じ、それが最終的な行動にどう影響しているのでしょうか。
9 章 間違えない人はいない
人は過ちを犯すものです。人為的なエラーの影響を受けないシステムを構築しようとしても、それは不可能です。また、すべての間違いが悪いとはかぎりません。この章では人間が犯す間違い（ヒューマンエラー）の原因、種類、対処法を見ていきます。
10 章 人はどう決断するのか人がある行動を起こそうと決断するプロセスは、一般に考えられているほど単純なものではありません。人の決断には無意識が想像以上に深くかかわっていることが明らかになってきました。この章では、人がどう決断するかを分析していきます。

意見と質問
本書（日本語翻訳版）の内容については、最大限の努力をもって検証および確認していますが、誤りや不正確な点、誤解や混乱を招くような表現、単純な誤植に気づかれることもあるかもしれません。本書を読んで気づいたことは、今後の版で改善できるようにお知らせください。将来の改訂に関する提案なども歓迎します。連絡先を以下に示します。

デザインの心理学ix

株式会社オライリー・ジャパン〒160-0002 東京都新宿区坂町 26 番地 27  インテリジェントプラザビル 1F
電話03-3356-5227

FAX

03-3356-5261

電子メール japan@oreilly.co.jp
本書のウェブページには次のアドレスでアクセスでできます。
http://www.oreilly.co.jp/books/9784873115573/
http://www.peachpit.com/store/product.aspx?isbn=0321767535（原書）
翻訳者のサイトには関連ページのリンク集、簡単な紹介、正誤表や追加情報が掲載されています。
http://www.marlin-arms.com/support/100things/
オライリーに関するそのほかの情報については、次のオライリーのウェブサイトを参照してください。
http://www.oreilly.co.jp
http://www.oreilly.com

謝辞
ピーチピット社の素晴らしい編集チーム、特に夜更けのメールのやり取りに応じてくださった編集者のジェフ・ライリー氏に感謝します。また、この本の執筆を勧めてくだ
さり、執筆中は舵取り役を果たしてくださった編集者のマイケル・ノーラン氏、写真を担当してくださったガスリー・ワインチェンク氏、すてきなアイデアを寄せてくれたメ
ジー・ワインチェンク氏、辛抱強く支援してくれたピーター・ワインチェンク氏にも感謝します。さらに、私のブログを読んでくださっている皆さん、講演やプレゼンに足を運んでくださる皆さんにも感謝します。貴重なアイデアや意見をいつもありがとうございます。皆さんの存在が刺激となり牽引役となって、私は心理学とデザインに関する調査、研究、著作を続けていかれるのです。

x

デザインの心理学

目次 TABLE OF CONTENTS

デザインの心理学....................................................................................................................................................................................................................vii

1 章    人はどう見るのか

1

001

目が受け取る情報と脳が私たちに伝える情報は微妙に違う........................................................................................... 2002

対象の「あらまし」をつかむのは中心視野より周辺視野の役目.................................................................................. 5003

人はパターン認識で物を識別する...................................................................................................................................................................... 7004

顔認識専門の脳領域がある........................................................................................................................................................................................... 9005

物はやや上から斜めに見た形で思い浮かべる................................................................................................................................. 11006

人は過去の経験と予想に基づいて画面を見る................................................................................................................................. 13

007

人は手がかりを探す............................................................................................................................................................................................................. 15008

人は視野の中の変化を見逃すことがある............................................................................................................................................... 19009

人は近くにあるものを同じグループだと思う. ................................................................................................................................ 21010

赤と青を一緒に使うと目への刺激が強すぎる................................................................................................................................. 22011

男性の 9%、女性の 0.5% が色覚異常. ........................................................................................................................................................... 23012

文化によって色の意味が変わる.......................................................................................................................................................................... 27

2 章    人はどう読むのか

29

013

大文字がもともと読みにくいものであるという説は誤りである........................................................................... 30014

読むことと理解することは同じではない............................................................................................................................................... 33

015

パターン認識のおかげでフォントが異なっても同じ文字だと認識できる. ............................................................... 37016

文字の大きさは理解度を左右する................................................................................................................................................................... 40017

コンピュータの画面上のものは紙に書かれたものより読みにくい.................................................................... 42018

長い行のほうが速く読めるが一般には短い行のほうが好まれる.......................................................................... 43

3 章    人はどう記憶するのか

45

019

ワーキングメモリの限界............................................................................................................................................................................................... 46020

一度に覚えられるのは 4 つだけ............................................................................................................................................................................ 49021

情報を覚えておくには使うことが必要...................................................................................................................................................... 52022

情報は思い出すより認識するほうが簡単............................................................................................................................................... 55

xi

023

記憶は知的資源を大量に消費する................................................................................................................................................................... 57024

記憶は思い出すたびに再構築される............................................................................................................................................................ 59025

忘れるのはよいこと............................................................................................................................................................................................................. 61026

鮮明な記憶でも間違っていることがある............................................................................................................................................... 63

4 章    人はどう考えるのか
027

情報は少ないほどきちんと処理される...................................................................................................................................................... 66

028

心的な処理には難しいものとやさしいものがある. .................................................................................................................. 70029

人は 30% の時間はぼんやりしている................................................................................................................................................................ 73030

自信がない人ほど自分の考えを主張する............................................................................................................................................... 75031

人はシステムを使うときメンタルモデルを作る.......................................................................................................................... 78032

人は概念モデルとやり取りをする.................................................................................................................................................................... 81033

人は物語を使って情報をうまく処理する............................................................................................................................................... 84034

人は例を使ってうまく学ぶ........................................................................................................................................................................................ 88035

人は分類せずにはいられない................................................................................................................................................................................. 91036

時間は相対的である............................................................................................................................................................................................................. 93037

クリエイティブになるための 4 つの方法................................................................................................................................................. 96038

人は「フロー状態」に入る.......................................................................................................................................................................................... 101

039

文化は考え方に影響する............................................................................................................................................................................................104

5 章    人はどう注目するのか

xii

65

107

040

注意力は選択的に働く...................................................................................................................................................................................................108041

情報は取捨選択される. ................................................................................................................................................................................................. 111

042

熟練の技は無意識に駆使できる....................................................................................................................................................................... 113043

ある事態に対する注意力は頻発が予想されるか否かで決まる............................................................................. 115044

注意力の持続時間は 10 分が限度である................................................................................................................................................ 117045

人は「顕著な手がかり」にしか注目しない.......................................................................................................................................... 119046

マルチタスクは事実上不可能..............................................................................................................................................................................120047

危険、食べ物、セックス、動き、人の顔、物語は注意を引きやすい......................................................................123048

大きな音には驚いて注目する..............................................................................................................................................................................126

目次

049

何かに注意を向けるにはまずそれを知覚する必要がある...........................................................................................128

6 章    人はどうすればヤル気になるのか

131

050

目標に近づくほど「ヤル気」が出る...............................................................................................................................................................132051

報酬に変化があるほうが強力..............................................................................................................................................................................135052

ドーパミンが情報探索中毒を招く.................................................................................................................................................................139053

人は予測ができないと探索を続ける.........................................................................................................................................................141054「内的報酬」のほうが「外的報酬」よりもヤル気が出る.......................................................................................................144055

進歩や熟達によりヤル気が出る.......................................................................................................................................................................146056

欲しいものが我慢できるかどうかは幼少期に決まる.................................................................................................................. 151

057

人は本来怠惰な生き物である..............................................................................................................................................................................153058

近道は簡単に見つかるときしかしない...................................................................................................................................................157059

人の行動は「性格だ」と判断されがちである...................................................................................................................................159060

習慣は長い時間をかけ徐々に形成される............................................................................................................................................162061

競争意欲はライバルが少ないときに増す............................................................................................................................................164062

人は自律性をモチベーションにして行動する..............................................................................................................................165

7 章    人は社会的な動物である

167

063

「強い絆」を有する集団の規模の上限は 150 人..............................................................................................................................168064

人には生来模倣と共感の能力が備わっている.............................................................................................................................. 171065「同じ釜の飯を食った仲間」の絆は強い..................................................................................................................................................174066

オンラインでの交流においては社会的なルールの遵守を期待する................................................................176067

嘘の度合いは伝達手段によって変わる..................................................................................................................................................179068

話し手の脳と聞き手の脳は同期する..........................................................................................................................................................182069

脳は親しい人には特別な反応を示す.........................................................................................................................................................183070

笑いは絆を生む.......................................................................................................................................................................................................................185071

笑顔の真偽は動画のほうが判別しやすい............................................................................................................................................187

8 章    人はどう感じるのか
072

189

7 つの基本的な感情は万国共通.........................................................................................................................................................................190

目次

xiii

073

感情と筋肉の動きは深く結びついている............................................................................................................................................192074

データより物語のほうが説得力がある...................................................................................................................................................194075

匂いは感情や記憶を呼び起こす.......................................................................................................................................................................196

076

人は思いがけないことを楽しむようプログラムされている....................................................................................................198077

人は忙しいほうが満足を感じる.......................................................................................................................................................................200078

牧歌的な風景を見ると幸せな気分になる............................................................................................................................................202079

人はまず「見た目」と「感じ」で信用するか否かを決める...............................................................................................204080

大好きな音楽でドーパミンが放出. ...............................................................................................................................................................206

081

達成が難しいことほど愛着を感じる..........................................................................................................................................................207082

将来の出来事に対する自分の反応を大げさに予測する傾向....................................................................................209

083

出来事の最中よりその前後のほうが前向き.....................................................................................................................................210084

悲しみや不安を感じているときは馴染みのものがありがたい.............................................................................. 211

9 章    間違えない人はいない
085
086

ストレスを感じているときには間違いを犯しやすい..........................................................................................................216087

エラーはすべてが悪いとはかぎらない...................................................................................................................................................221088

エラーのタイプは予測できる..............................................................................................................................................................................223

089

エラーの対処法はさまざま.....................................................................................................................................................................................226

1 0 章    人はどう決断するのか

xiv

213

人間にノーミスはあり得ないし問題ゼロの製品も存在しない..............................................................................214

229

090

無意識のレベルでの決断............................................................................................................................................................................................230

091

まず無意識が気づく..........................................................................................................................................................................................................232

092

人は自分の処理能力を超えた数の選択肢や情報を欲しがる....................................................................................234093

選択肢が多いほうが思いどおりになっていると感じる...................................................................................................236094...............................................................................................................................................................................................................238「お金」より「時間」

095

意思決定には気分も影響............................................................................................................................................................................................240096

グループによる意思決定は必ずしも的確ではない................................................................................................................242097

人は支配的な人物に影響される.......................................................................................................................................................................244

098

確信がないときは人まかせにする................................................................................................................................................................246

目次

099

他人は自分より影響を受けやすいと考える.....................................................................................................................................248

100

目の前にある品物のほうが高値に.................................................................................................................................................................250

訳者あとがき..............................................................................................................................................................................................................................255
参考資料............................................................................................................................................................................................................................................257
索引..........................................................................................................................................................................................................................................................266

目次xv

1 章   人はどう見るのか

人間のあらゆる感覚のうちでも特に重要なのが視覚でしょう。
脳の約半分は目から入ってくる情報の処理を担当しています。
私たちは目が物理的に受理する情報をそのまま見ているわけではありません。目が受理したイメージが脳に伝達されると、脳が変更や解釈を加えます。実際に「見ている」のは脳なのです。

001

目が受け取る情報と脳が私たちに伝える情報は微妙に違う
外を歩いているとき、目が感知した情報が脳に送られ、それを脳が処理して私たちが感じ取ります。このとき、「脳は目が感知した外界の様子をそのままリアルに送ってくれている」と思えるかもしれません。しかし、「脳が私たちに伝えるもの」は、目が受け取った情報とは微妙に違っています。脳は目に入るものすべてに絶えず「解釈」を加えているのです。たとえば図 1-1を見てください。
何が見えますか？ まず黒い線で描かれた三角形が見え、その上に白い逆三角形（頂点が下にある三角形）が重なっているように見えたのではありませんか？ もちろん実際は違います。何本かの線と一部分が欠けた円があるだけです。何もない所に脳が逆三角形を創り出しました。
「逆三角形が見える」と予測したからです。この図形はイタリアの心理学者ガエタノ・カニッツァが 1955 年に発表したことから、「カニッツァの三角形」と呼ばれています。次に図 1-2 を見てください。同様の錯覚によって今度は長方形が見えるはずです。

図 1-1 カニッツァの三角形

図 1-2 同様の錯覚によって長方形が見える

脳は近道を創り出す
脳がこうした「近道」を創り出すのは外界を素早く知覚するためです。脳は感覚的な情報（感覚入力）を大量に（推定では毎秒 4,000 万も）受け取り、受け取ったすべての入力から辻褄が合う世界を構築しようとします。この際、過去に獲得した「経験則」に頼るのです。たいていはそれでうまくいきますが、ときどきエラーが起こります。
ですから形や色を上手に利用すれば、見え方を操作することができます。図 1-3 は色を使って単語のつながりを表現した例です。

2

1章

人はどう見るのか図 1-3 色を使えば見え方を操作できる暗がりでは視線を少しずらしたほうがよく見える
す い じょう た い

網膜には、明るい所で働き色をよく感知できる細胞「錐 状 体」が 700 万個、暗がりでもか ん じょう た い

機能する感度のよさは備えているものの色を識別できず明暗だけを感じる細胞「杆 状 体」
かが 1 億 2,500 万個あります。しかし視覚の中心領域である「中心窩」には錐状体が集中し、暗がりでも感度のよい杆状体はその周辺に多くあるので、薄暗がりでは対象をまっすぐ見つめるのではなく、視線を少しずらしたほうがよく見えます。

目の錯覚
目が受け取った情報を脳が誤解する場合があることを示すよい例が「錯覚」です。たとえば図 1-4 の左の縦線は右の縦線より長く見えますが、実は同じ長さです。錯覚の例としてよく知られているもので、1889 年にこの錯覚に気づいたドイツの心理学者フラン
さく しツ・ミュラー・リヤーにちなんで「ミュラー・リヤー錯視」と呼ばれています。

図 1-4 2 本の縦線の長さは同じ

001 目が受け取る情報と脳が私たちに伝える情報は微妙に違う

3

3D ではなく2D
外界からの光は目に入り角膜と水晶体を通ります。このとき水晶体がレンズの役割を果
たして網膜に像を結びます。対象が三次元のものであっても、網膜に映し出される像は常に二次元です。この二次元の像が脳の視覚野に送られ、そこでパターン認識が行われ、「これはドアだ」といった具合に認識されます。視覚野が二次元の像を三次元の表現に変換しているのです。

情報のまとめ役は視覚野
ジョン・メディナによると、網膜は見ている対象の電気的なパターンを受け取り、そのパターンから、ストーリーをもった短編映画のような「トラック」を 5 〜 6 本作り出すの†「影」に関する情報が入ったトラックもあれば、「動き」の情だそうです［Medina 2009］ 。
報のトラックもある、といった具合です。そしてこうした情報のトラックが最高で 12 本、本 文 中 で、 参 考 文 献合は、［Medina 2009］のよ脳の視覚野へ送られます。視覚野では、送られてきた情報に対してそれぞれ異なる領域

うに、その参考文献の執筆が反応し処理に当たります。たとえば「40 度の斜線」
だけに反応する領域もあれば、「色」

文献が出版（発表）されただけ、「動き」だけ、「端の部分」だけに反応する領域もあります。最終的にはすべてのデータが 2 本のトラックにまとめられます。1 本は「動き」の情報（対象物が動いているか否か）で、もう1 本は「位置関係」の情報（対象物が自分から見てどこにあるか）です。

ポイント●

皆さんのウェブページを閲覧してくれる人たちは、皆さんの予想や期待とは違った見方をするかもしれません。何をどう見るかは、閲覧する側の経歴や知識、対象へのなじみの深さや期待に左右されます。

●

何かを表示するとき、表現のしかた次第では、自分が希望するとおりの捉え方をしてもらえない恐れがあるので注意しましょう。

4†（書籍、論文など）を示す場

1章

人はどう見るのか者（代表者）の姓と、参考年を記載しています。タイトルなど、各文献の詳細については巻末の「参考資料」
を参照してください。邦訳がある場合は邦題も併記してあります。

002

対象の「あらまし」をつかむのは
中心視野より周辺視野の役目
視野（目で見える範囲）には「中心視野」と「周辺視野」の 2 種類があります。中心視野
は対象を直視して詳細に見るときに使う領域のこと、そして周辺視野は視野のそれ以外の領域、つまり、見えてはいるものの直視してはいない範囲のことです。周辺視野のおかげで私たちは便利なことに目の端でも物が見えますが、それだけでなく、カンザス州
立大学で最近行われた研究によって、私たちが周囲を理解する上で周辺視野が予想以上に重要な役割を果たしていることがわかりました。今見ているのがどういう場面なのかという「あらまし」の情報を、どうやら私たちは周辺視野で得ているようなのです。

画面上に点滅するものがあると、なぜ気になるのか
周辺視野に動くものがあると気になってしかたがないものです。コンピュータの画面で文章を読んでいるときなど、脇に何か点滅するものや動画があったりすると、どうしてもそれを見てしまいますよね。目の前の文章を集中して読もうとしているときには、うるさく感じるかもしれません。これは周辺視野の仕業なのです。だからこそウェブペー
ジの端に表示される広告は点滅するのです。見せられる側にとっては迷惑ですが、人の注意を引く効果があるのです。

アダム・ラーソンとレスター・ロシュキーは台所や居間など身近な場所の写真を被験者に見せる実験を行いました［Larson 2009］。写真の中には灰色のフィルタで周辺部分や中央部を覆い隠したものがありました。写真を見せる時間はとても短く、フィルタもかけてあるため、見づらくなっています（図 2-1、図 2-2）
。見せたあとで被験者に「どこの写真でしたか」と尋ねました。
その結果わかったのは、写真の中央部が欠けていても、どこの写真であるかが識別できるということでした。これに対して周辺部分が欠けていると、居間なのか台所なのか区別がつきませんでした。さらに灰色のフィルタで隠す部分の面積をさまざまに変えてみた結果、最終的に次のような結論に達しました−「対象物の詳細な認識では主とし
3

3

3

3

て中心視野を使うが、場面全体のあらましをつかむには周辺視野を使う」

002 対象の「あらまし」
をつかむのは中心視野より周辺視野の役目

5図 2-1 中心視野の写真

図 2-2 周辺視野の写真

人間の祖先がサバンナで生き残れたのは周辺視野のおかげ
進化という観点から見ると、次のような説が成り立ちます−「火打ち石を打ち合わせたり、空を見上げたりしているとき、忍び寄ってきたライオンの姿を周辺視野で捉えられた原始人は生き残ることができ、その遺伝子が現代の私たちに受け継がれた。周辺視野が劣っていた個体は生き残れず、したがってその遺伝子も受け継がれなかった」
この説を裏づける最近の研究結果［Bayle 2009］があります。被験者の周辺視野と中心視野
へんとうたいに恐ろしい画像を置き、それぞれの場合で扁桃体（恐ろしい画像に反応する脳の領域）が反応するまでの時間を測りました。その結果、中心視野で恐ろしい物体を見たときは 140 〜 190 ミリ秒かかったのに対し、周辺視野のときは 80 ミリ秒しかかかりませんで
した。

ポイント
●

いち

人はコンピュータの画面を見るとき周辺視野を使います。周辺視野に入ったものを一べつ瞥し、それによって得た情報に基づいて、そのページの概要をつかむのです。
●

中心視野に関しては画面中央が重要ですが、皆さんのウェブページを閲覧してくれる人たちの周辺視野に入るものも軽視してはなりません。周辺に配置する情報によって、そのページとサイトの狙いを明確に伝えられるよう工夫しましょう。

●

画面の特定の部分に注目してもらいたいときには、点滅するものや動画を周辺視野に置かないようにします。

6

1章

人はどう見るのか003

人はパターン認識で物を識別する

刻々と入ってくる感覚入力を素早く理解できるのは「パターン」をうまく利用しているためです。たとえ「パターン」と呼べるほどのものがない場合でも、目と脳はパターンを見つけたがります。たとえば図 3-1は、ただの「8 つの点」ではなく「4 対の点」に見えませんか？ 点と余白の組をパターンとして解釈しているのです。

図 3-1 脳はパターンを見つけたがる

特定の図形パターンだけに反応する細胞
視覚野には「横線」「縦線」「端」「斜め 40 度」といった特定の図形パターンだけに反応する細胞があります［Hubel 1959］。

物体認識のジオン理論
人間が物を見てそれを認識するメカニズムについては、以前からいくつもの説が提起されてきました。初期の説は「脳には何百万もの物を記憶しておく『メモリーバンク』があって、ある物を見たら、それをメモリーバンクにあるものと比較し、一致するものを見つけている」というものでした。しかし最近の研究では「目の前にある物を識別する−を基準にしているらしい」ことが明らときには基本的な立体−幾何形態（ジオン）かになりました（図 3-2）
。ジオンの概念を提唱したのはアービング・ビーダーマンです［Biederman 1985］。ジオンは 24 個あり、人間はこの基本形を組み合わせて目の前にある三次元の物体を同定しているというのです。

視覚野の活性度は想像しているときのほうが高いあるものを実際に知覚しているときよりも、それを想像しているときのほうが視覚野の活性度は高くなります［Solso 2005］。活性化する領域は同じなのですが、想像しているときのほうが活性度が高いのです。ロバート・ソルソの説によると、刺激となる物体が実在しないため、その分、視覚野が奮闘しなければならないとのことです。

003 人はパターン認識で物を識別する

7

ジオン

実際の物

図 3-2 ジオンの例（右側の物についている番号は、左側のジオンの番号に対応）

ポイント●

人は本能的にパターンを探すので、できるだけパターンを使いましょう。グループ化
や空白によってパターンを作るのです。

●

アイコンなどに使う物の絵はシンプルな図形を組み合わせたものにしましょう。そうすればその絵に含まれるジオンが見分けやすくなるので、その物を素早く容易に認識してもらえるでしょう。

●

三次元より二次元のものを使いましょう。目から入ってきた情報は二次元の形で脳に伝えられます。三次元で表現すると、認識や理解に手間取るおそれがあります。

8

1章

人はどう見るのか004

顔認識専門の脳領域がある

大都会の雑踏の中で、突然、家族の顔を見かけたとしましょう。会うとは夢にも思っていなかった場合でも、また目の前に何十人、何百人という人がいたとしても、すぐに家族だと気づくはずです。同時にその人物に対して皆さんが抱いている感情もわき上
がってきます。愛であれ、憎しみであれ、恐怖であれ、何であれ。
視覚野は非常に広く、脳全体に占める割合が大きいのですが、この視覚野以外の場
ぼうすい

所に、顔の認識だけを専門に行っている領域があります。紡錘状顔領域と呼ばれ、ナン
シー・カンウィッシャーが特定しました［Kanwisher 1997］。この領域のおかげで、通常の認識経路を経ずに顔を物の場合よりも素早く識別できるようになっています。この部位
は情動の中枢である扁桃体の近くにあります。

自閉症の人は顔の識別に紡錘状顔領域を使わない
自閉症の人は顔の識別に紡錘状顔領域を使わないことがカレン・ピアースによって明らかにされました［Pierce 2001］。代わりに、顔以外の物を認識・理解するための標準的な経路と視覚野を使っています。

画像の顔が見ているところを見る
視線追跡の研究で明らかになったのですが、図 4-1のようにウェブページにある顔の画
像の目がユーザーの方向ではなく、別の物を見ている場合、ユーザーもその物を見る傾向があるそうです（もっとも、人の視線の先に何かがあっても、必ずしもその人がそれに注目しているわけではありませんが）。ウェブページの構成を考えるときには、親近感や共感を引き出したいのか（その場合は皆さんのウェブ
ページを閲覧してくれる人をまっすぐ見つめている顔を使います）、それとも
商品などに注目してもらいたいのか（その場合はその商品を見ている顔を使います）を判断する必要があります。

図 4-1 人間は、ほかの人が見ているところを見る傾向がある

004 顔認識専門の脳領域がある

9

人間は生まれつき顔が好き
キャサリン・モンドローチによると、生後 1時間未満の新生児であっても、顔の特徴を備えた物を見たがるそうです［Mondloch 1999］。

決め手は目−生きているかどうかは目で判断クリスティン・ルーザーと T・ホイートリーは、モーフィングと呼ばれる手法で人の顔写真を徐々にマネキンの顔に変え、これを被験者に見せて、生きた人間の顔だと感じられなくなるのはどの画像からかを言ってもらうという実験を行いました［Looser 2010］。
図 4-2 はそのときに使った画像の例です。結果は「最初の顔写真から 75% 程度変わったあたり」でした。また、主な判断材料は目だということも明らかになりました。

図 4-2 顔写真をマネキンの顔に変化させていった画像の例

ポイント●

私たちがウェブページを見て、まず注目し認識するのは人の顔です（ただし自閉症の人は例外です）。

●ウェブページで感情に訴える力がもっとも強いのは「こちらをまっすぐ見つめている●

ウェブページにある顔が、同じページの別の場所や商品を見ている場合、私たちはそ顔」です。顔の造作の中でいちばん重要なのが目だからでしょう。

の視線をたどって、その先にあるものを見る傾向があります。だからといって、それに注意を払うわけではなく、ただ目を向けるだけなのですが。

10

1章

人はどう見るのか005

物はやや上から斜めに見た形で思い浮かべる「コーヒーカップの絵を描いてください」と頼むと、ほとんどの人が図 5-1のような絵を描きます。

図 5-1 頭の中で思い描くコーヒーカップ

スティーブン・パーマーは実際に世界中を旅して、いろいろな人に「コーヒーカップの絵を描いてください」と頼んで歩きました［Palmer 1981］。すると図 5-2 のような絵を描
いてくれました。

図 5-2 「コーヒーカップの絵を描いてください」と頼まれた人が描いた絵

005 物はやや上から斜めに見た形で思い浮かべる11

こうした絵の何が興味深いかというと、「角度」と「視点」です。真横から見たカップのスケッチも 2、3 ありましたが、ほとんどは斜め上から見下ろし、やや右か左にずれた視点で描かれていました。これが「標準的な視点」となっているわけです。コーヒー
カップを真上から見ると図 5-3 のようになりますが、こんな風に描く人はまずいません。

図 5-3 コーヒーカップをこんな風に描く人はめったにいない「当たり前じゃないの」という声が聞こえてきそうですが、なぜでしょうか？ 「コーヒーカップを実際に見るときにもこれと同じ角度で見ているときが多いから」と言う人がいるかもしれません。しかしこの研究ではほかにいろいろな物を見せて認識してもらうということもしましたが、その中には普段こんな角度では見ていないものもあるのに、どの場合でも標準的な視点で描かれた図の認識速度が最高でした。また、さまざまな動物（小型犬や猫など）の識別も頼みましたが、その場合もこの視点の場合が最高でした。
猫や超小型犬を見るときは普通は「少し上から」ではなく、高い所から見下ろす形になるにもかかわらずです（まあ、床に這いつくばっていることが多い人なら別ですが）。ど
うやら、ある物について考えたり、思い出したり、頭の中で思い描いたり、識別したりするときには、この標準的な視点を使うのが万人に共通する傾向のようです。

ポイント●

標準的な視点から見て描かれた絵や、この視点から見た物は、素早く認識でき、記憶もされやすいようです。

●

ウェブサイトやアプリケーションでアイコンを使うなら、標準的な視点で描いたものを使いましょう。

12

1章

人はどう見るのか006

人は過去の経験と予想に基づいて画面を見る
コンピュータの画面で人がまず最初に見るのはどこでしょうか？ 2 番目に見るのは？ どこを見るかは、その人がそのときに何をしているかや、何を期待しているかに左右されます。左から右に読む言語なら、ユーザーは画面を左から右に見る傾向があります。右から左に読む言語ならその逆です。とはいえ、いちばん左上の角（あるいは右上の角）から見始める人はいません。ロゴや余白、ナビゲーションバーなど、今関心のある事柄とは関係の薄いものがあることを知っていますから、端は避けて画面の中のほうを見る傾向があるのです（図 6-1）。
画面の端は見ない意味のある情報が始まるところを「本当の左上」とみなす

図 6-1 画面の端は見ず、意味のある情報に目を向ける傾向がある

人は普通、画面を一瞥したあとは、自分の使う言語で標準的な読み方（左から右、あるいは右から左、そして上から下）で移動していくものです。しかし画面上のほかの場

006 人は過去の経験と予想に基づいて画面を見る

13

所に、大きな写真（特に顔が写っているもの）や動き（動くバナーやビデオ）など、注意を引くものがあると、標準的な読み方から逸脱することもあります。

メンタルモデル人はコンピュータの画面を見るとき、特定の情報がどこに表示されることが多いかを意識しながら見ています。ウェブサイトを見たり、アプリケーションを使ったりすると
きは、サイトやアプリケーションごとに、どのような情報がどこに表示されるはずだという、あらかじめ構築された「メンタルモデル」に基づいて行動します。たとえば、よくアマゾンで検索フィールドを使って買い物をする人は、画面がロードされるとすぐに検索フィールドを見るといった具合です。

問題があると人は視野を狭める
進めている作業に誤りや予想外の問題が起こると、人は画面のほかの部分を見るのをやめて、問題の箇所に意識を集中させます。これについては 9 章で詳しく説明します。

ポイント●

いちばん重要な情報（あるいは注目してほしい物事）は画面の上から1/3 までの場所
か、画面中央に置きましょう。

●

重要なことは何であれ端に置いてはなりません。人は端を見ない傾向がありますから。

●

画面やページは普段読むときのパターンで移動できるようにデザインします。ある作業をするのに、画面上で大幅な移動を繰り返さなければならないようなパターンは避けましょう。

14

1章

人はどう見るのか

007

人は手がかりを探す

取っ手を引けば開くと思ったドアを引いても開かず、押さなければならなかった。そんな肩すかしを食わせる取っ手に、皆さんも出くわしたことはありませんか。実世界では、多くの場合どう取り扱ったらよいか、その物自体が手がかりを示してくれるものです。ドアノブなら、その大きさと形状によって「つかんで回して」と教えてくれますし、
マグカップの取っ手は「指を 2、3 本通して巻きつけて持ち上げて」と言っています。ハサミは「輪に指を通して、親指を上下させれば開閉する」と告げています。しかし最初にあげたドアの取っ手のように機能とは裏腹の手がかりを示されると、私たちはイライラします。こうした手がかりは「アフォーダンス」という概念と深くかかわっています。
アフォーダンスはアメリカの知覚心理学者ジェームズ・ギブソンによる造語で、「環境内に存在する取り得る行動のすべて」を表します［Gibson 1979］。その後、アメリカの認
知科学者ドナルド・ノーマンがこのアイデアを発展させ、「知覚可能なアフォーダンス」という概念を提唱しました［Norman 1988］。取り得る行動のうちでも「知覚できるもの」を重視する考え方です。つまり、現実の世界であれコンピュータの画面上であれ、ある物を人に使わせて、何らかの行動をとらせたいのであれば、その物が何であるのか、それを使って何ができ何をすべきなのか、見ただけですぐわかるものにしなければならな
い、と論じたのです。
部屋のドアを開ける、あるいはウェブサイトで本を注文するといった「作業」をやろうとしているとき、私たちはほとんど無意識に周囲を見回し、役立つモノを探します。したがって、そうした作業を行う環境を設計する人は、その環境にあるモノが見やすく、見つけやすいものであるよう、明確なアフォーダンスを発するよう、配慮しなければなりません。
図 7-1のドアの取っ手を見てださい。この形を見たら、つかんで押し下げようとす

図 7-1 「つかんで押し下げて」と語っている取っ手

007 人は手がかりを探す

15

るでしょう。そのとおりに機能するなら、明確なア
フォーダンスを発する適切な設計の取っ手だということになります。
図 7-2 の取っ手は「つかんで引いて」と訴える形をしているにもかかわらず PUSH（押す）と書いてあるので、引いても開かないことがわかります。このようなケースは不適切なアフォーダンスを発していることになります。

図 7-2 PUSH（押す）と書いてあるにもかかわらず、デザイン的には「引く」と語っている取っ手

画面表示とアフォーダンス
アプリケーションやウェブサイトをデザインする際には、画面上のオブジェクトのア
フォーダンスを考慮する必要があります。たとえば、人がボタンをクリックしたくなるのはなぜでしょうか？ ボタンに影を付けて手がかり（アフォーダンス・キュー）を与えれば、実際の機器のボタンを押すのと同じように、そのボタンも押せばよいのだということを示せます。
図 7-3 はリモコンのボタンの写真です。この形と影を見れば、ボタンを押して操作したくなるでしょう。

図 7-3 物理的な機器のボタン。押せばよいことがすぐにわかる

16

1章

人はどう見るのかコンピュータの画面でもこの影を上手に利用すればよいのです。図 7-4 ではボタンの周囲の色を工夫して、ボタンが押し込まれているように見せています。では、本を逆さまにしてこのボタンを見てみてください。今度は押し込まれているようには見えず、逆に「押してください」と合図する影になっているはずです。

図 7-4 押し込まれているように見えるが、本を逆さまにすると……

こうした視覚的なアフォーダンス・キューは些細なものではありますが大切な要素です。ウェブサイトでも図 7-5 の例のようなボタンがさかんに使われていましたが、最近は少なくなってきました。たとえば図 7-6 のボタンは色付きの四角形の中に文字が書かれているだけです。

図 7-5 陰影が使われているおかげでボタンらしく見える

図 7-6 ウェブサイトでは視覚的な手がかりを備えたボタンが以前ほど使われなくなってきた

ハイパーリンクとアフォーダンス
「下線付きの青いテキストはハイパーリンクになっていて、そこをクリックすれば別のページへジャンプする」という手がかりはほとんどの人が理解できます。ところが最近は見分けにくいハイパーリンクが多くなりました。マウスなどを動かしてポインタ（矢印）を上にもっていったときに初めて「クリックできる」ことがわかるのです。図 7-7 は007 人は手がかりを探す

17

New York Times Reader のページでポインタを上にもっていく前の様子、図 7-8 はポイ
ンタを上にもっていったときの様子です。リンクだと認識するのに余分なひと手間がかかってしまいます。しかもこれを iPad などのタブレット型端末で読む場合には、こうした手がかりがありません。iPad ではマウスを動かすのと同じ効果を指では実現できません。指で画面にタッチした瞬間にリンクをクリックしたことになってしまうのですから。

図 7-7 初めからアフォーダンス・キューが明示されていない Times Reader の画面

図 7-8 ポインタを動かして矢印を上にもっていくとポインタの形と全体の色が変わる

ポイント●

デザインをするときにはアフォーダンスに配慮しましょう。あるオブジェクトでできる操作の手がかりを示してあげれば、閲覧者がその行動をとる確率が上がります。

●

オブジェクトを選択したときや、アクティブになっているときには、それを陰影によって示しましょう。

●

不適切なアフォーダンス・キューを使わないよう注意しましょう。

●

スマートフォンやタブレットなどタッチ式の機器を対象にデザインをする場合は、ポインタを対象の上にもっていったときにだけ現れる手がかりは使わないようにしま
しょう。

18

1章

人はどう見るのか008

人は視野の中の変化を見逃すことがある
ネタバレ注意「ゴリラビデオ」「ゴリラ実験」などと呼ばれるビデオをまだ見たことのない方は今すぐ 見 て くだ さ い。 筆 者 の ブ ロ グ で ど う ぞ−http://www.whatmakesthemclick.net/
2009/10/25/100-things-you-should-know-about-people-1-inattention-blindness/†（ただし、このビデオではゴリラではなく熊が登場します）。そしてテストを受けておいてください。そうしないと、以下の説明が「ネタバレ」になってしまいます。

† この本のサポートペー
ジにもリンクがあります。
http://www.marlin-arms.
com/support/100things/

このビデオの説明は英語で書かれていますが、「バスケットをしている人たちのうち、
白い服を着ている人たちが何回パスをしたか」を数えてください。

「ゴリラビデオ」は「不注意による見落とし」あるいは「変化の見落とし」と呼ばれる現象の実例です。つまり、人間は自分の視野の中で大きな変化が起きても見落とすことがしょっちゅうある、ということです。これまでにさまざまな実験で立証されてきました
が、バスケットボールとゴリラを組み合わせた実験は特によく知られています（他の実験のビデオも上記 URL の筆者のブログで紹介してあります）。
この研究の追加実験を行ったのはクリストファー・チャブリスとダニエル・シモンズ
で、視線追跡装置を使い、この実験の結果を説明しました［Chabris 2010］。視線追跡とは、か被験者がどこを見ているかを追跡できる技術、もっと詳しく言うと、中心窩が凝視しているところ（中心凝視）を追跡できる技術です（周辺視野は追跡しません）。前述のバスケットボールとゴリラのビデオを視聴している人の視線追跡を行ったところ、全員がゴリラを「見て」いました。つまり目ではゴリラをとらえていたのです。しかし自分がゴリラを見たことに気づいた人は 50%しかいませんでした。チャブリスとシモンズはこの現象についてほかにもさまざまな実験を行った結果、次のような結論に達しました−「人間はあることに集中していると、想定外の変化が起きた場合、それをあっさり見逃してしまうことがある」

008 人は視野の中の変化を見逃すことがある

19

視線追跡データは必ずしも正確ではない
視線追跡は被験者が見ているもの、見る順序、見ている時間を調べ、記録できる技術です。ウェブサイトを訪問した人が最初に見るところ、2 番目に見るところ、といった具合に、ウェブサイトの調査によく使われます。この装置を利用すると、何を見ているかを本人に教えてもらわなくても直接データが集められます。しかしこの技術は必ずしも正確とは言えません。その主な理由は次のようなものです。
1. 視線追跡によって被験者が「何を見たか」はわかりますが、前述のとおり、だからといって「その見たもの」に本当に注意を払ったとは言い切れません。
2. この章の #002 で紹介したラーソンとロシュキーの研究［Larson 2009］によると、周辺視野も中心視野と同様に重要です。視線追跡で測定できるのは中心視野だけです。
3. アルフレッド・ヤーバスが行った研究［Yarbus 1967］では、人が何を見るかは、見ている最中にされる質問に左右されるという結果が出ました。ですから視線追跡の調査
前と調査中にどんな指示を出すかによって、結果として得られるデータを無意識に歪めてしまうことは大いにあり得るのです。

ポイント●あるものが画面上にあるからといって、それを必ずしも見てもらえるとはかぎりません。このことが特に当てはまるのは、画面を更新して、一部だけを変更したときです。
画面が更新されたことにさえ気づいてもらえないかもしれないのです。

●

確実に変更箇所に気づいてもらうには、視覚に訴える合図（点滅など）や聴覚に訴える合図（ビープ音など）を追加しましょう。

●

視線追跡データは慎重に解釈しましょう。重視しすぎたり、デザイン上の決定要因にしたりしないこと。

20

1章

人はどう見るのか