Mind Hacks に見るWebインタフェース

第四十二回

オライリー・ジャパンから刊行されている「Mind Hacks ―実験で知る脳と心のシステム」という本を読み終えました．いつから読み始めたのか今では覚えてませんが，移動中や食事後など時間を見つけては少しずつ読み進めていました．
この本は「実験で知る脳と心のシステム」という副題がついているように，身近で簡単な実験や先人の実験を紹介しながら，私たちの視覚や聴覚といった感覚，運動や推論，記憶に人間の脳がどのように関わっているのか，また脳が物事の処理を早くするために，いかに「ごまかし」や「手抜き」を行っているのか，さらに言うと狭義の「ハッキング」を行っているのかについて述べています．
この本には，おもしろいもの，驚かされるものなどたくさんのことが書いてありましたが，普段私たちが何気なく行っている色々なことを脳がどのように知覚し，反応しているのかを知ることができました．そこで，それらをWebのインタフェースに活かすことができるのではないかと考え，いくつか考えたことをここにまとめてみようと思います．
なお，脳のことや認知科学のこと，Webデザインやインタフェースのことなど，どれも私は現在勉強中なので，間違ってることやこんな風にも考えられるんじゃないというご意見は大歓迎です．

Hack #15 - 能動的な視覚

誰かに何かを知覚させたいと思えば，そのものに対してはたらきかけがしやすいように，そしてその物と他の物との関係がわかりやすいようにすべき

私たちは，私たちの目に飛び込んできた映像を受動的に認知しているのではなく，はっきり物を見るという能動的な動作によって認知していると著者は述べています．
さらに目に飛び込んでくる映像のうち，私たちが意識的に認知しているのは視野の中心部分だけなので，ユーザが注目している物から少しでも離れた場所にある物は「見えてはいるが認知していない」物になります．Web広告などは，まさにこれに当たると思います．

Hack #19 - 視点の固定

しばらく何かを見ていると，目は見ていた物に「ロック」されたような状態になり，他の物に視点を移そうとしてもすぐに動こうとはしないのである．しかし，何らかの理由でそれまでに見ていたものが目の前からなくなった場合には，そうでない場合よりも早く目が動く．

すぐに動かないといっても1秒の何十分の一というレベルの話なので，人の行動が妨げられるというほどのことではありません．
しかし，何かから何かに注意を移してもらう必要があるというインタフェース上の場面では，最初に見せていた物を，次に見せる物が表示される直前に，画面から消すということによって，ユーザの目を次に見るべき物に向かってスムーズに移動できる状態にすることができます．

Hack #20 - 平面に奥行きを見る

影を付けたことによって飛び出て見える現象を「ポップアウト」と呼ぶ．ポップアウトによって円が背景から飛び出て見えれば，平面の円よりも認識しやすくなり，注意が向きやすくなる．

これは最近はやりのグラデーションを用いたWebデザインに利用されていますね．グラデーションの方向にも実は意味があって，人間は上から光が当たっていると見なしているため，上側の色を薄く，下に行くほど色を濃くするとその物は飛び出て（浮き上がって）見えます．
Webインタフェースで目立たせたい「見出し」や「ボタン」がグラデーションになっていたり，影がついていることは人間が認知しやすいという意味で良いことなのでしょう．

グラデーションを簡単に作るWebツール

• • 使い方 - d:id:secondlife:20051217:1134749620

Hack #38 - 後ろは振り返らない

自由意志によって何かに注意を向ける場合でも，「注意を向けにくいもの」が存在する．（...中略...）特に注意を向けにくいのが，「直前まで注意を向けていた物体や場所」である．いったん別の物体や場所に注意が移ると，元にはなかなか戻りにくい．

脳には，直前まで注意を向けていたものに再度注意を向けることを抑制する機能があるため，いったん必要ないと見なされた部分に時間をおいて新しい情報を示しても，ユーザは注意を向けてくれません．
そのため，同じ場所に続けて違う内容を表示するならば，間隔をあけずに表示した方が良いと書かれていました．むしろ，そんなコンテンツは設置しない方がいいのではないかと私は思いましたが．

Hack #50 - 「音」の持つ意味

単語の持つ音（単語を構成する音素）と，その単語が与える印象（多くの人が共通して持つ主観的印象）の間に関係があることから，それが商品や企業のブランドイメージを作るのに利用されることがある．

人は，単語の意味を理解する際に，文字の組合せを逐一考えているのではなく，数多くの手がかりを基に理解しようとしています．例えば，発音の抑揚や，単語の持つ音そのものからも意味を理解しようとしているそうです．
WebサイトやWebサービスなどを新しく作り名前をつけるときに，単語の持つ意味だけではなく，単語の音の持つ意味も考慮すると，サービスに対するイメージをあるていどユーザに与えることができる，ということがいえるのだと思います．
本の中でも，海外の無線メール用端末「BlackBerry」を例にとり，「b」の音は信頼をイメージさせると言っています．他の文字のイメージも知りたいですね．

ようやく半分．次回に続きます

100個あるHacksのうち，ようやく半分です．残り50個の中で気が付いたものは次回にご紹介させていただくことにしましょう．やたらと長くなってしまいましたし．
今回のポイントは，人間は知覚のほとんどを能動的に行っています．意識せずに行っていると思っていても，脳の認知レベルでは情報の取捨選択が行われ，自分に必要なものだけを処理することによって，処理効率を上げています．そのために，曖昧な情報や見えたり聞こえたりしている情報のうちかなりの部分が脳によって適当に補完されていることになります．そのため，このような脳の働きをしっかり把握した上で人とコンピュータとのインタラクションを考えると，直感的で使いやすいものができるのではないでしょうか．
○○Hacksという名前の本としては，かなり異色でページ数も多いですが，読めば日頃の何気ない行動に対する意識が変わるかもしれません．

Mind Hacks ―実験で知る脳と心のシステム