動きの知覚

ねらい

このクエストで握ることは一つだ。人の目は、動くものを「自分で選んで」見ているのではない。動いた瞬間、勝手にそこを見てしまう。

色やサイズで目立たせるのとはレベルが違う。動きは、注意を引く力が桁外れに強い。だからこそ、使い方を間違えると最悪の妨害になる。「動かすかどうか」は、Webやアニメで一番重い決断の一つだ。

このクエストでは、まずなぜ動きにそこまで目が行くのかを生き物の歴史から押さえる。次に、動き専用のゲシュタルト原則共通運命（同じ向きに動くものを仲間と見る）を導く。最後に、動画やアニメが成り立つ大もとの仕掛け、仮現運動（止まった絵の連続が動いて見える現象）を見る。この三つで「動きが何を語る道具なのか」という土台ができる。

なぜ動きに目が行くのか ―― 草むらの動きは危険だった

まず大もとの理由から。これはデザインのルールである前に、生き物として生き延びるための仕組みだ。

想像してみてほしい。大昔、草原で暮らしていた人間の祖先。視界のほとんどは止まっている――草、岩、空。そんな中、草むらがガサッと動いた。それは何か。風かもしれないが、ライオンかもしれない。ヘビかもしれない。

ここで「ちょっと考えてから見るか」とのんびりした祖先は、食べられて子孫を残せなかった。動いた瞬間、考える前に、反射でそっちを見た祖先だけが生き延びた。私たちはその子孫だ。だから今も、視界のはしで何かが動くと、勝手に目がそっちを向く。これを止めるのは難しい。意志より下の、自動の反応だからだ。

この「自分の意志と関係なく、勝手に注意が引っぱられる」働きを、専門的にはボトムアップな注意と呼ぶ。刺激の側から無理やり奪ってくる注意のことだ。反対に、自分から目的を持って探しに行く注意をトップダウンな注意と呼ぶ。動きが奪うのは前者、ボトムアップのほうだ。

動きは最強の引き金、だから最悪の妨害にもなる

ここが、このクエストで一番大事な所だ。動きの力が強いことには、裏表がある。

止まった画面で何か一つを動かせば、確実にそこを見てもらえる。「ここを見て」と言いたいとき、動きは最強の引き金だ。色やサイズや矢印より、ずっと強く効く。

でも、その強さがそのまま弱点になる。画面のあちこちで物が勝手に動いていたらどうなるか。読者の注意は、奪われては引き戻され、また奪われる。文章を読みたいのに、横で点滅する広告に目が飛ぶ。動きが多すぎる画面は、注意を奪う罠だらけの道になる。生存本能を逆手に取られ、読者は疲れ、内容が頭に入らない。

だから掟はこうなる。動かすのは、見てほしい一つだけ。 全部動かすのは、何も動かさないより悪い。強い引き金ほど、引きどころを一つに絞る。

共通運命 ―― 同じ向きに動くものは「仲間」

ここで準備編のゲシュタルト原則を思い出そう。ゲシュタルトとは「人の目は、バラバラの点を勝手にまとめて一つのかたまりとして見る」という、脳の整理ぐせのことだ。準備編で学んだ近接（近くにある物は仲間）・類同（似た物は仲間）と同じ家族に、動き専用の原則がある。それが共通運命だ。

共通運命とは、同じ向き・同じタイミングで動くものを、目が勝手に「同じ仲間」とまとめて見ること。色も形もバラバラでも、一緒に動けば、それだけで一つのグループに見える。

ちなみに、目がバラバラの物を「仲間」とまとめる働きは、まとめて**群化（ぐんか）**と呼ぶ。近接も類同も共通運命も、その群化のやり方の一種だ。共通運命は、動きを使う群化なのだ。

身近な例。鳥の群れを思い浮かべてほしい。一羽一羽は別の鳥なのに、いっせいに同じ方へ動くと、私たちはそれを「一つの群れ」として見る。スポーツ観戦のウェーブも同じ。隣どうしが順に立てば、一本の波が動いているように見える。「一緒に動く＝仲間」。これは近接や類同より強く効くと言われる。動きはそれくらい強いまとめ役だ。

デザインでは、これを「つながりを語る」道具に使う。たとえば、関係のある複数の物を同じ向きにスッと現れさせると、見た人は説明なしに「これらは一組だ」と分かる。

仮現運動 ―― 止まった絵が、動いて見える

最後に、動画とアニメすべての土台になっている不思議な現象を見る。仮現運動だ。

「仮現」とは「仮に・かりそめに現れる」という意味。本当は動いていないのに、動いて見える現象のことだ。一番分かりやすい例がパラパラ漫画。ノートのはしに少しずつ違う絵を描いて、パッと連続でめくる。すると、止まった絵の連続なのに、キャラクターが動いて見える。映画もテレビもスマホの動画も、中身は全部これだ。一枚一枚は止まった写真（コマ）。それを高速で切り替えているだけ。動きは、そこに無い。私たちの脳が、コマとコマのあいだを勝手に「つないで」動きを作っている。

これを実験で確かめたのが心理学者マックス・ヴェルトハイマーだ。1912年、彼は二つの光を、少し離して、ほんの少しの時間差で交互に光らせた。すると見ている人には、光がついたり消えたりではなく、一つの光が左右に動いているように見えた。「本当は動いていないのに、脳が動きを作り出す」ことの証明だ（英語ではこれを apparent motion、厳密には beta movement と呼ぶ）。

なぜこれが大事か。ヴェルトハイマーのこの研究こそ、さっきのゲシュタルト心理学が始まった出発点とされているからだ。「人の脳は、バラバラの刺激を勝手にまとめて、つながり・動きを作る」――この一発の実験が、近接も共通運命も、すべての出発点になった。パラパラ漫画もアニメも、もとをたどればこの仕組みの仲間だ。

動きは「つながり」と「変化」を語る

ここまでをまとめると、動きには注意を奪う力があるだけではない。意味を語る力がある。土台として、二つを押さえておこう。

一つめ、つながり。共通運命で見たとおり、一緒に動くものは仲間に見える。だから「これとこれは関係がある」と、言葉なしで示せる。新しく出てくる物がどこから来たかを動きで見せれば、「これは、さっき押したボタンの中身だ」と直感で伝わる。動きが、点と点を線でつなぐ。

二つめ、変化。仮現運動で見たとおり、脳はコマの間を「つないで」読む。だから物がA地点からB地点へ動くのを見せれば、「同じ物が移動した／姿を変えた」と分かる。パッと消えてパッと現れると、別物に見える。スッと動けば、同じ物の変化に見える。動きは、前と後ろをつなぐ接着剤だ。

なお、こうして作った動きを「生きている」と感じさせる具体的な作り方は、ディズニーがアニメの12原則にまとめた。ここでは「なぜ動きに目が行くか」までを土台として握り、12原則そのものは次章以降で扱う。

この先のクエスト（タイミング、トランジション、スクロール演出）は、すべてこの土台の上に乗る。「動かせば派手になる」ではなく、「この動きで、つながりか変化の、どちらを語るのか」――そう問えるようになれば、このクエストは達成だ。

練習・チェック

1. 自分のスマホで、よく見るアプリやWebサイトを一つ開いてみよう。勝手に動いているもの（点滅する広告、ぐるぐる回るバナーなど）はいくつあるか。それは「見てほしい一つ」だろうか、それとも妨害だろうか。
2. 共通運命を一言で説明できるか。（ヒント：色も形も違うのに、目が「仲間」とまとめてしまう条件は何か）
3. パラパラ漫画やアニメで、本当はどこにも「動き」が無いのに、なぜ動いて見えるのか。仮現運動という言葉を使って一文で言ってみよう。
4. 身近なアニメーション（メニューがスッと開く、カードがめくれる等）を一つ選び、それがつながりを語っているか、変化を語っているか、どちらか言い当ててみよう。
5. もし自分がWebページを作るとして、画面の中で動かしてよいのは原則いくつか。理由とともに一言で答えよう。（ヒント：掟1）