sos の 作業メモ

プログラミングや英会話学習、マイルや旅行、日常生活など。最近はWebFormなASP.NETのお守りがお仕事です。

日々の生活にhappyをプラスする|ハピタス Gポイント

「インターフェースデザインの心理学」006-010

インタフェースデザインの心理学 ―ウェブやアプリに新たな視点をもたらす100の指針

インタフェースデザインの心理学 ―ウェブやアプリに新たな視点をもたらす100の指針

前回の続き

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

人は、画面のどこにどのような情報が表示されるはずだという、あらかじめ構築された「メンタルモデル」に基づいて行動する。

画面を見る際に、全体を一瞥した後、自分の使う言語で標準的な読み方で見る対象を移動させるが、 画面の他の場所に顔写真や動くもの等の注意をひくものがあると、標準的な読み方から逸脱する

問題が起きると、画面の他の部分を見るのをやめて、問題の箇所に意識を集中させる。

ポイント

  • いちばん重要な情報(または注目して欲しい物事)は、画面の上から1/3までか、画面中央に置く
  • 重要なことは端に置かない。人は端を見ない傾向にある
  • 画面やページは、普段読む時のパターンで移動できるようにデザインする

007: 人は手がかりを探す

環境内に存在する、知覚可能なとりえる行動の全てを「知覚可能なアフォーダンス」と呼ぶ。

見ただけですぐに使い方がわかるようにしなければならない。

ポイント

  • デザインをするときは、アフォーダンスに配慮する。オブジェクトでできる操作の手がかりを示せば、閲覧者がその行動をとる確率があがる
  • 不適切なアフォーダンス・キューは使わないようにする
  • スマホやタブレット等のタッチ式のデバイスを対象とするデザインでは、ポインタを対象の上に持って行ったときにだけあらわれるような手がかりは使わないようにする

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

まずはゴリラビデオの最初の動画で、バスケットしている人達のうち、白い服を着ているグループでのパスの回数を数える。

人間は、何かに集中していると、想定外の変化をあっさり見逃してしまうことがある。

視線追跡データは、被験者が見ているもの、見る順序、見ている時間を調べ、記録したデータ。これを使えば、何を見ているかのアンケートが不要となるが、以下の理由により正確とは言えない。

  1. 被験者が何を見たかはわかるが、その見たものに本当に注意を払ったかどうかはわからない
  2. 周辺視野も中心視野と同様に重要だが、視線追跡で測定できるのは中心視野のみ
  3. 人が何をみるかは、見ている最中にされる質問に左右されるため、実験中の質問によって結果が歪められてしまう可能性がある

 

ポイント

  • 画面上にあるからといって、必ずしも見てもらえるとはかぎらない。特に、画面を更新して一部だけを変更した時は、画面が更新されたことさえも気づいてもらえないことがある
  • 確実に変更箇所に気づいてもらうためには、点滅など視覚に訴える合図や、ビープ音など聴覚に訴える合図を追加する
  • 視覚追跡データは慎重に解釈すること

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

ふたつのものが近接していると、人はそれらが関連していると考える。左から右に読む英語圏では、特に左右に並んでいる場合にその傾向が強い。

ポイント

  • ひとつのグループとして見てもらいたい要素(写真や絵、見出し、本文など)はまとめて配置する
  • 線や囲みを使って各要素の分離やグループかをする前に、要素同士の間隔を調整する
  • 関連の無い要素は間隔を大きくとり、関連のある要素の間隔は詰める

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

色によっては絵や文字までの距離が違っているように見える(色立体視)。差が最大になる青と赤のような組み合わは、読みにくくなって目が疲れることがある。

ポイント

  • 画面で、青と赤または緑と赤を近くに配置しない
  • 背景を赤にして青や緑のテキストをいれたり、背景を亜主にして赤や緑のテキストを入れるのは避ける

ゴリラ実験はほんとうに見えなかった。いや、実際には画面のなかをゆっくり動く黒い物体があるなとは感じてたんだけど、そんなところに注意を払う余裕もありませんでした。

おもしろいけど5個ずつでもちょっとしんどいかな? いざとなったらAndroidのテストの方は後回しでこっちを読み切ります。

次回へ続く