写真の人物を見出しへ向かせると読まれる？ 視線の手がかりで組む資料デザイン

人物の写真と見出しを、左右に並べた資料を想像してください。

写真の人物がこちらを見ている場合、まず顔に目が止まりやすくなります。人物が横の見出しを見ている場合は、その視線の先も気になりやすくなります。目立つ矢印を見出しへ向ければ、方向はさらに明確になります。

この違いを生むのが、他者の視線につられて同じ方向へ注意を向ける「視線の手がかり」です。資料、Webページ、広告では、人物写真の向きを決める小さな判断が、読み手の目の動きを変えることがあります。

先に結論を言うと、人物の視線は、読み手の注意を要点へ導く手がかりになります。ただし、顔を置けば理解、記憶、好意、行動が自動的に高まるわけではありません。関係づくりを重視するなら正面を見る顔、見出しや商品へ注意を渡したいなら対象を見る顔、方向を誤解なく示したいなら矢印が候補です。どれを使う場合も、視線、矢印、配置が同じ要点を指すようにそろえます。

この記事では、視線による注意の研究と、広告や自然な場面を使った視線計測の研究を基に、写真と文字をどう組み合わせればよいかを考えます。

他者の視線は、注意を向ける場所の手がかりになる

人が一度に意識して処理できる情報には限りがあります。そのため、画面の中から何を見るかを選ぶ必要があります。他者がどこを見ているかは、その選択を助ける手がかりの一つです。

典型的な実験では、画面中央の顔が左右どちらかを見た後、その左右のどちらかに目標が現れます。顔が見ていた側に目標が現れると、反対側に現れたときより速く反応できる傾向があります。目だけを動かしていなくても、注意が先にその方向へ向いていたと考えられます。

McKayらは、こうした視線の手がかりを扱った423件の効果をメタ分析しました。その結果、課題や顔の種類が違っても、他者の視線が観察者の注意を向ける効果は一貫して確認されました。ただし、効果の大きさは、視線が変わってから目標が現れるまでの時間、参加者が何を判断する課題か、顔の表情などによって変わりました。

ここで大切なのは、研究で確かめられた中心的な結果が「目標を速く見つける」「注意がその位置へ向く」という点です。見出しの内容を正しく理解する、ブランドを覚える、商品を買う、といった反応まで同じように保証するものではありません。

正面を見る顔は、要点より人物に注意を集めることがある

人物が読み手をまっすぐ見る写真には、アイコンタクトを感じさせる働きがあります。代表者の紹介、講師のプロフィール、相談窓口の案内など、誰が話しているかを伝えたい場面では自然な選択です。

一方で、正面を見る顔が大きいと、隣の見出しや商品よりも人物そのものに注意が集まることがあります。顔を置いたから情報全体が読まれるのではなく、顔で目が止まったまま、伝えたい要点へ移らないことがあるのです。

HuttonとNolteは、画面上の雑誌に広告を置き、広告モデルが商品を見る条件と、読み手を見る条件で目の動きを比べました。モデルが商品を見ていると、参加者は商品、ロゴ、広告の他の部分をより長く見ました。正面を見るモデルより、商品へ向いた視線が広告内の別の情報へ注意を渡したと考えられます。

これは、正面を見る写真が悪いという意味ではありません。人物への信頼や親しみをつくりたいページと、特定の要点を読ませたいページでは、写真の役割が違います。役割を決めずに「人の顔は目立つから」という理由だけで置くと、伝えたい内容と注意の行き先がずれます。

対面場面でのアイコンタクトと説得の関係は、アイコンタクトは説得力を高めるのかでも扱っています。対面する話し手の視線と、画面内の写真が示す視線は、似ていても同じ状況ではありません。

人物が要点を見ると、注意を横へ渡しやすくなる

見出し、商品、グラフなど、写真とは別の対象を見てほしいなら、人物の顔や目をその対象へ向けます。人物を見るために集まった注意を、視線の先へ渡す考え方です。

Palcu、Sudkamp、Florackは、架空の買い物ページにバナー広告を置き、顔の有無、静止画か動画か、顔が商品を見るか別の方向を見るかを変えて、参加者の視線を記録しました。顔が商品を見ていると、静止画か動画かにかかわらず、参加者が商品を見る確率が上がりました。さらに、その条件では購入意向も高くなりました。

SajjacholapuntとBallも、Web広告に人の顔があると広告へ注意が向きやすく、顔が商品を見ている条件では、読み手を見ている条件より商品への注意と広告内容の記憶が高まることを報告しました。

ただし、これらは限られた広告、参加者、閲覧状況で行われた実験です。購入意向は実際の購入ではありません。顔の視線を商品へ向ければ売上が上がる、と一般化するのは早すぎます。実務で使えるのは、「写真とは別の場所を見てほしいなら、人物の視線をその場所とそろえる」という設計上の仮説です。

矢印は冷たい手段ではなく、方向を明確にする道具

視線は人らしい手がかりですが、方向を示す力が矢印より常に強いわけではありません。

Chacón-Candiaらは、視線と矢印による注意の効果を比較した研究をメタ分析しました。方向へ注意を向ける効果の大きさは、全体として視線と矢印で同程度でした。視線だけに特別な注意機能がある、と単純には言えません。

IoannidouとHermensは、人物の視線、指さし、矢印を自然な風景写真へ入れ、自由に見てもらう実験を行いました。人物は矢印より速く、長く見られました。一方、人物を長く見るほど、指し示された対象を見る時間が短くなる傾向があり、対象へ直接視線を移させる力は矢印の方が強く表れました。

この結果は実務上、とても示唆的です。人物は注意を集めますが、その人物が注意の終着点になることがあります。矢印はそれ自体を長く見せるのではなく、その先へ目を移させる記号として働きます。

操作手順、複雑な図、比較表の注目箇所、入力欄への案内など、方向を誤解なく示すことが優先なら、人物写真を置くより短い矢印や位置関係を使う方が適切です。人物が内容に関係しない場合は、顔を足さないことも有力な選択です。

視線、矢印、配置が別々の場所を指すと迷わせる

一つの画面に、横を向く人物、逆向きの矢印、離れた位置の強い見出しがあると、読み手は複数の方向へ引っ張られます。目立つ要素を増やすほど分かりやすくなるのではありません。

IoannidouとHermensの二つ目の実験では、二つの手がかりが同じ対象を指す場合と、別々の方向を指す場合が比べられました。視線や指さし、矢印が一致しないと、対象を見る時間が短くなりました。人物が別の方向を見ているだけでも、矢印が指す対象から注意を奪うことがありました。

つまり、画面に置く手がかりは足し算ではなく、整合性で考えます。

• 人物の視線は、見出しや商品へ向いているか
• 矢印は、人物の視線と同じ方向を指しているか
• 文字の大きさ、余白、色も、同じ要点を目立たせているか
• 重要でない写真や装飾が、別の場所へ注意を奪っていないか

スライド内の配置と目の動きの関係は、スライドのレイアウトで視線の流れを整える方法も参考になります。写真の視線だけでなく、左上から右下への読み順、近接、余白、見出しの強さを合わせて設計します。

「視覚化・構造化」で、伝えたい一点へ絞る

伸滋Designの伝わる設計マップにある「視覚化・構造化（引き算のデザイン）」は、ノイズを削り、本質を残し、一目で伝えるための型です。視線の手がかりも、この順序で使うと目的を見失いにくくなります。

1. 最初に、見てほしい対象を一つ決める

「人物も、商品も、ロゴも、説明文も見てほしい」では、どれを先に見るか決まりません。1枚のスライドや1画面ごとに、最初に見てほしい対象を一つ決めます。表紙なら結論の見出し、商品ページなら主な商品、図解なら判断に必要な箇所というように具体化します。

2. 要点から注意を奪うものを減らす

人物が内容の主体でないなら、顔を大きくする必要はありません。人物の背景にある小物、強い模様、複数の矢印、装飾的なアイコンを減らします。見てほしい一点以外を弱めることも、注意を導く設計です。

理解に関係しない魅力的な写真が学習を妨げる可能性は、研修スライドの「面白いけれど不要な情報」でも解説しています。

3. 人物、矢印、配置を同じ方向へそろえる

人物を置くなら、その顔や目を要点へ向けます。矢印を足すなら同じ対象へ向け、別の方向を指す線や図形を減らします。見出しは視線の先に近づけ、十分な余白を取ります。人物と要点が遠すぎると、どこを見ているのか分かりにくくなります。

4. 縮小して、最初の一秒を確かめる

資料を小さな一覧表示にし、最初に目に入る場所を確かめます。人物だけが目立ち、要点が読めないなら、顔を小さくする、要点を近づける、矢印へ替えるといった修正をします。可能なら数人に見せ、「最初にどこを見たか」「何のページだと思ったか」を尋ねます。

場面ごとの使い分け

講師・代表者の紹介

誰が話すか、相談相手は誰かを伝えたいなら、正面を見る写真が自然です。人物が主役なので、注意が顔に集まっても目的と合います。隣に長い説明文を置くより、氏名、役割、短い約束を絞って示します。

表紙や提案スライドの見出し

見出しを主役にするなら、人物の視線を見出しへ向けます。人物が見出しと反対側を見ている素材しかない場合は、写真を左右反転する前に、服の文字、ロゴ、利き手、光の向きが不自然にならないか確認します。不自然になるなら、別の写真か人物のない構成を選びます。

商品や申込みボタン

商品やボタンへ視線を渡す方法は試せますが、人物を無関係な誘導装置として使わないことが大切です。実際の利用者と誤認させる写真、推薦しているように見える写真、内容と関係のない人物写真は避けます。注目を集めても、信頼を損なえば目的に合いません。

手順図や複雑なグラフ

どの項目を読めばよいかを正確に示すなら、矢印、直接ラベル、色の強弱が向いています。人の視線は方向が曖昧になりやすく、人物そのものへ注意が残るためです。装飾ではなく、判断に必要な印だけを置きます。

研究を実務へ移すときの限界

第一に、典型的な視線の手がかりの実験は、中央の顔と左右の目標を短時間提示し、反応時間を測ります。資料やWebページのように、文章、写真、色、操作目的が同時にある場面とは違います。メタ分析で効果が安定していても、実務画面で同じ大きさの効果が出るとは限りません。

第二に、注意と理解は別です。見出しを早く見つけても、意味を正しく理解するとは限りません。広告を長く見ても、内容を覚える、信じる、購入するとは限りません。視線の手がかりは、伝達の入口を整える方法であって、主張の分かりやすさや根拠を代わりに作るものではありません。

第三に、広告研究には、架空の買い物ページ、限られた商品やモデル、大学生を中心とした標本が含まれます。購入意向の差を、実際の売上へそのまま置き換えられません。人物の年齢、表情、文化的背景、写真の自然さ、読み手の目的によって結果は変わります。

第四に、視線と矢印の優劣は状況で変わります。メタ分析では同程度の注意効果が示され、自然な場面では人物が注目を集める一方、矢印が対象をより強く示す結果もあります。「視線は矢印より人間らしいから強い」という決め方は避け、何を目立たせたいかで選びます。

第五に、視線、矢印、配置をそろえても、内容が誤解を招くなら良い設計ではありません。人物の視線を使って根拠の弱い主張や不利益な条件から注意をそらすことは、分かりやすさではなく操作です。重要な条件や限界は、目立つ情報と同じように読める形で示します。

公開前チェックリスト

• この画面で最初に見てほしい対象を一つ決めたか
• 人物写真は内容と関係があり、置く理由を説明できるか
• 人物を主役にしたいのか、要点へ注意を渡したいのか決めたか
• 要点へ導くなら、人物の目と顔がその方向へ向いているか
• 視線、矢印、配置、色が別々の場所を強調していないか
• 方向を正確に示す必要がある場面で、矢印や直接ラベルも検討したか
• 顔が大きすぎて、見出しや商品より目立っていないか
• 関係のない装飾や写真を減らしたか
• 縮小表示でも、最初に見る場所が分かるか
• 数人に「最初にどこを見たか」を確認したか
• 注意が向くことを、理解、記憶、好意、行動と同一視していないか
• 写真が実際の利用者や推薦者だと誤認させないか
• 重要な条件や限界から注意をそらしていないか

まとめ：顔を置くのではなく、注意の行き先を設計する

人物の顔は、読み手の注意を引きつけます。人物が別の対象を見ると、その視線は見出し、商品、図表へ注意を渡す手がかりになります。ただし、人物が目立ちすぎると、要点より顔を見せる結果にもなります。矢印は、人らしさでは劣っても、方向を明確に示す有力な道具です。

実務では、正面を見る顔、要点を見る顔、矢印のどれが優れているかを先に決めません。まず、最初に見てほしい対象を一つ決めます。次に、不要な要素を減らし、人物の視線、矢印、配置を同じ方向へそろえます。最後に、縮小表示や少人数の確認で、実際の注意の流れを確かめます。

資料やWebページで、写真は印象に残るのに要点が読まれない、人物と文字の配置が決まらないと感じる場合は、素材の問題ではなく、注意の行き先が設計されていないのかもしれません。伸滋Designのお問い合わせフォームからご相談ください。人物写真、見出し、図表の役割を整理し、読み手が迷わず要点へ進める構成を一緒に検討します。

参考文献

1. McKay KT, Grainger SA, Coundouris SP, Skorich DP, Phillips LH, Henry JD. Visual attentional orienting by eye gaze: A meta-analytic review of the gaze-cueing effect. Psychological Bulletin. 2021;147(12):1269–1289.
2. Chacón-Candia JA, Román-Caballero R, Aranda-Martín B, Casagrande M, Lupiáñez J, Marotta A. Are there quantitative differences between eye-gaze and arrow cues? A meta-analytic answer to the debate and a call for qualitative differences. Neuroscience & Biobehavioral Reviews. 2023;144:104993.
3. Ioannidou F, Hermens F. The Influence of Competing Social and Symbolic Cues on Observers’ Gaze Behaviour. Vision. 2024;8(2):23.
4. Hutton SB, Nolte S. The effect of gaze cues on attention to print advertisements. Applied Cognitive Psychology. 2011;25(6):887–892.
5. Palcu J, Sudkamp J, Florack A. Judgments at Gaze Value: Gaze Cuing in Banner Advertisements, Its Effect on Attention Allocation and Product Judgments. Frontiers in Psychology. 2017;8:881.
6. Sajjacholapunt P, Ball LJ. The influence of banner advertisements on attention and memory: human faces with averted gaze can enhance advertising effectiveness. Frontiers in Psychology. 2014;5:210.
7. Hayward DA, Ristic J. Exposing the cuing task: the case of gaze and arrow cues. Attention, Perception, & Psychophysics. 2015;77(4):1088–1104.