移行中の知識
視線の流れ
Visual Movement
定義
視線の流れ（visual movement）とは、要素の配置、方向、反復、間隔、強弱などによって、構成の中で注意がどの方向へ移りやすいように組まれているかを見る概念です。実際の眼球運動を測定した結果そのものではなく、構成上のdirectionやflowを設計・診断するための語彙です。animationとして物体が動くmotionとも区別します。
実例
実際の場面で考える
同じ概念を異なる制作文脈へ持ち込み、何を観察して判断するかを見る。
長いランディングページ
LPの縦方向の流れ
見るポイント
heroの見出しから補足、主要画像、CTAへ注意が移るよう、位置・余白・scale・方向性を揃える。すべてを強調して視線の起点と次の行き先が競合していないかを見る。
イベント告知グラフィック
ポスターの斜め方向の構成
見るポイント
写真内の線、見出しの傾き、要素の位置を使って左上から右下など一定方向のflowを作る。斜めに置くだけでなく、主要情報を通る流れになっているか確認する。
注意
誤解しやすい点
- designerが想定した順番を、すべてのviewerが同じ順序で必ず見ると断定する。
- visual movementとanimation / transitionを同じ「動き」として扱う。
- arrowや斜線を追加するだけで、情報の優先順位やspacingが作るflowを見ない。
関連
関連する概念
出典