Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

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

1,502 views

Published on

『UIデザインの心理学』5章 周辺視野 の紹介です。

Published in: Science
  • Be the first to comment

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

  1. 1. 中心窩と周辺視野の空間分解能の違い
  2. 2. 網膜 角膜 黄斑・中心窩 人間の視野の空間分解能は「中心窩」が最も高い
  3. 3. 中心窩は「画素密度」が高い 光を感じ取る錐体細胞が片目だけでも 600 万〜700 万個 中心窩 周縁部 個 /mm2 個 /mm2 9000 158000
  4. 4. 周辺視野からのデータは「圧縮・損失」される 中心窩 周辺視野 ? 0110100... ! ...
  5. 5. データ処理能力にも大差 面積 網膜 % %中心窩 99 1 網膜 % %中心窩 50 50 視覚野での処理
  6. 6. 人間の周辺視力は 0.1 程度 左右の目が絶えず素早く(約 3 回 /s)動き、 中心窩を周囲の物に選択的に向けて焦点を合わせている 視野の端より中央のほうが色の識別能力も高い
  7. 7. 脳は周囲の映像を高画質で保持する必要がない 脳が既知の情報と予測内容に基づき大雑把に補完 サッカード抑制で生じる知覚の隙間も脳が埋める 眼球が急速な運動を行う際、網膜から入力される刺激が遮断されるという、 視覚イメージのブレを防ぐための現象 ABCDEFGHIJKLMN...
  8. 8. UI の例
  9. 9. 中心窩が向けられるのは直径 1〜2cm の範囲内
  10. 10. 似た色の要素は変化があっても気づきにくい Mami TOMOE mami@ mami@ SUBMIT name email Please read user policy before you click SUBMIT button. Mami TOMOE SUBMIT name email Please read user policy before you click SUBMIT button. Email is invalid.
  11. 11. メッセージの可視性を高める手法
  12. 12. メッセージはユーザーが見ている付近に表示する Mami TOMOE mami@ SUBMIT name email Mami TOMOE mami@ SUBMIT name email Email is invalid.
  13. 13. エラーは明示する Mami TOMOE mami@ SUBMIT name email Mami TOMOE mami@ SUBMIT name email Error: Email is invalid.
  14. 14. エラーマークを使う Mami TOMOE mami@ SUBMIT name email Mami TOMOE mami@ SUBMIT name email Email is invalid.
  15. 15. 赤はエラーメッセージ専用に Mami TOMOE mami@ SUBMIT name email Mami TOMOE mami@ SUBMIT name email Email is invalid. どうしても赤をデザインに使いたいときはエラーに別の色を使い、さらにエラーマークもつける Please read user policy before you click SUBMIT button. Please read user policy before you click SUBMIT button.
  16. 16. エラーメッセージを入力ミスの直後に表示させる Mami TOMOE mami@ SUBMIT name email まだ入力フォームのその部分を直視している間にエラーメッセージを表示 Email is invalid.
  17. 17. 目を引くためのさらに強力な手法
  18. 18. ダイアログボックスを使う CANCEL Really? OK 些細な内容だとユーザーが不快に感じるおそれがある
  19. 19. ビープ音などのサウンドを使う Mami TOMOE mami@ SUBMIT name email Email is invalid. 
  20. 20. 揺れや点滅などのエフェクトを瞬間的に使う Mami TOMOE mami@ SUBMIT name Open new file Cut Copy email Email is invalid. ただし、使用時間を極短く(1/4〜1/2 s 以下に)。使い過ぎると「習慣化」し、脳が注意を払わなくなっていく Open new file Copy Cut
  21. 21. 視覚探索は直線上
  22. 22. XBOCFWZGIPQYJM LRNSDETHUAKV 特定の文字を検出するまでの反応時間は、ほぼ線形 比例的
  23. 23. XBOCFWZGIPQYJM LRNSDETHUAKV 太字になっている目標刺激の探索は非線形
  24. 24. 際立った特徴は、周辺視野で「浮き出て見える」 熱電対について 熱起電力の発生の原理 時定数は記号 τ  金属棒(または金属線)A の両端 P, Q に温度差を与えると、金属内の自由電子は熱拡散により平均的に高温側 から低温側に移動する。そのため、相対的に電子が減少する高温側が正電位、電子が増加する低温側が負電位と なる。この電位差(電圧)は熱起電力と呼ばれる。  熱電対温度計に用いられる金属としては、クロメル - アルメル、銅 - コンスタンタン、白金 - 白金ロジウムな どのほか、種々の金属の組み合わせがあり、測定温度範囲に適したものが用いられる。 ▶ タイトル ▶ 見出し ▶ 太字 ▶ 字下げ 1. まみ 2. まどか 3. なぎさ ・まほ ・みほ ・しほ ▶ 列挙 ▶ 太字

×