『uiデザインの心理学』周辺視野 - #kosen14s 第1回読書会 day4 -

24
中心窩と周辺視野の空間分解能の違い

Upload: sanae-yamashita

Post on 15-Apr-2017

814 views

Category:

Science


0 download

TRANSCRIPT

Page 1: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

中心窩と周辺視野の空間分解能の違い

Page 2: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

網膜角膜

黄斑・中心窩

人間の視野の空間分解能は「中心窩」が最も高い

Page 3: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

中心窩は「画素密度」が高い

光を感じ取る錐体細胞が片目だけでも 600 万〜700 万個

中心窩

周縁部 個 /mm2

個 /mm2

9000158000

Page 4: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

周辺視野からのデータは「圧縮・損失」される

中心窩

周辺視野 ?

0110100...

...

Page 5: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

データ処理能力にも大差

面積

網膜 %

%中心窩

991

網膜 %

%中心窩

5050

視覚野での処理

Page 6: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

人間の周辺視力は 0.1 程度

左右の目が絶えず素早く(約 3 回 /s)動き、中心窩を周囲の物に選択的に向けて焦点を合わせている視野の端より中央のほうが色の識別能力も高い

Page 7: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

脳は周囲の映像を高画質で保持する必要がない

脳が既知の情報と予測内容に基づき大雑把に補完サッカード抑制で生じる知覚の隙間も脳が埋める眼球が急速な運動を行う際、網膜から入力される刺激が遮断されるという、視覚イメージのブレを防ぐための現象

ABCDEFGHIJKLMN...

Page 8: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

UI の例

Page 9: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

中心窩が向けられるのは直径 1〜2cm の範囲内

Page 10: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

似た色の要素は変化があっても気づきにくい

Mami TOMOE

mami@ mami@

SUBMIT

name

email

Please read user policybefore you click SUBMITbutton.

Mami TOMOE

SUBMIT

name

email

Please read user policybefore you click SUBMITbutton.Email is invalid.

Page 11: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

メッセージの可視性を高める手法

Page 12: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

メッセージはユーザーが見ている付近に表示する

Mami TOMOE

mami@

SUBMIT

name

email

Mami TOMOE

mami@

SUBMIT

name

email

Email is invalid.

Page 13: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

エラーは明示する

Mami TOMOE

mami@

SUBMIT

name

email

Mami TOMOE

mami@

SUBMIT

name

email

Error: Email is invalid.

Page 14: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

エラーマークを使う

Mami TOMOE

mami@

SUBMIT

name

email

Mami TOMOE

mami@

SUBMIT

name

email

Email is invalid.

Page 15: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

赤はエラーメッセージ専用に

Mami TOMOE

mami@

SUBMIT

name

email

Mami TOMOE

mami@

SUBMIT

name

email

Email is invalid.

どうしても赤をデザインに使いたいときはエラーに別の色を使い、さらにエラーマークもつける

Please read user policybefore you click SUBMITbutton.

Please read user policybefore you click SUBMITbutton.

Page 16: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

エラーメッセージを入力ミスの直後に表示させる

Mami TOMOE

mami@

SUBMIT

name

email

まだ入力フォームのその部分を直視している間にエラーメッセージを表示

Email is invalid.

Page 17: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

目を引くためのさらに強力な手法

Page 18: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

ダイアログボックスを使う

CANCEL

Really?

OK

些細な内容だとユーザーが不快に感じるおそれがある

Page 19: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

ビープ音などのサウンドを使う

Mami TOMOE

mami@

SUBMIT

name

email

Email is invalid.

Page 20: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

揺れや点滅などのエフェクトを瞬間的に使う

Mami TOMOE

mami@

SUBMIT

name

Open new file

Cut

Copy

email

Email is invalid.

ただし、使用時間を極短く(1/4〜1/2 s 以下に)。使い過ぎると「習慣化」し、脳が注意を払わなくなっていく

Open new file

Copy

Cut

Page 21: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

視覚探索は直線上

Page 22: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

XBOCFWZGIPQYJM

LRNSDETHUAKV

特定の文字を検出するまでの反応時間は、ほぼ線形比例的

Page 23: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

XBOCFWZGIPQYJM

LRNSDETHUAKV

太字になっている目標刺激の探索は非線形

Page 24: 『UIデザインの心理学』周辺視野 - #kosen14s 第1回読書会 Day4 -

際立った特徴は、周辺視野で「浮き出て見える」

熱電対について熱起電力の発生の原理

時定数は記号 τ

 金属棒(または金属線)A の両端 P, Q に温度差を与えると、金属内の自由電子は熱拡散により平均的に高温側から低温側に移動する。そのため、相対的に電子が減少する高温側が正電位、電子が増加する低温側が負電位となる。この電位差(電圧)は熱起電力と呼ばれる。 熱電対温度計に用いられる金属としては、クロメル - アルメル、銅 - コンスタンタン、白金 - 白金ロジウムなどのほか、種々の金属の組み合わせがあり、測定温度範囲に適したものが用いられる。

▶ タイトル

▶ 見出し

▶ 太字

▶ 字下げ

1. まみ2. まどか3. なぎさ

・ まほ・ みほ・しほ

▶ 列挙

▶ 太字