おすすめ欄で指が止まる瞬間、何が起きている？

スマホでYouTubeを開いて、おすすめ欄を指でスクロールしているとき。ほとんどのサムネイルは一瞬で通り過ぎていくのに、いくつかだけ、なぜか指が止まります。 その瞬間、あなたは「面白そう」「気になる」と感じたはずです。でも、なぜそう感じたのかを説明できる人は少ないかもしれません。「なんとなく目立っていた」で終わってしまうことも多いのではないでしょうか。 この記事では、その「なんとなく」を分解してみます。サムネイルを配色・文字・視線誘導という視点から見ていくと、そこには偶然ではなく、見られる環境に合わせた工夫があることが見えてきます。

サムネイルは「本屋の背表紙」と少し似ている

本屋の棚を思い浮かべてみてください。何冊もの本が並ぶ中で、一冊ずつじっくり読む前に、まず背表紙を見て「ちょっと気になる」と感じた本に手を伸ばします。 YouTubeのサムネイルも、それと少し似ています。他の動画と並んだ状態で、しかもスマホの小さな画面の中で、一瞬で見られます。 つまりサムネイルのデザインは、「かっこよく作る技術」である前に、「小さく・並んで・一瞬で見られる環境の中で、内容を伝えるための工夫」だと考えることができます。 この視点を持つと、なぜ色を絞るのか、なぜ文字を大きくするのか、なぜ目立つ部分をつくるのかが見えてきます。

配色の秘密：色を絞ると、伝えたいものが見えやすくなる

サムネイルの中で色をたくさん使いすぎると、小さい画面では情報がまとまりにくくなり、どこを見ればいいのか分かりにくくなることがあります。 反対に、使う色をある程度絞り、その中に目立つ色をひとつ入れると、見る人の目を誘導しやすくなります。 たとえば、背景を青系でまとめて、伝えたい文字だけを黄色にする。全体を白と黒でまとめて、一部分だけ赤を使う。そうすると、「まずここを見てほしい」という場所が分かりやすくなります。 サムネイル分析サービスなどでも、色数を絞ったシンプルな構成や、被写体をはっきり見せる工夫が紹介されています。 大切なのは、「目立つ色をたくさん使うこと」ではありません。 一番伝えたいものを決めて、そのために色の強弱をつけることです。 色を減らすことは、情報を減らすことではなく、伝えたいことの輪郭をはっきりさせる方法のひとつなのです。

文字の秘密：全部を書くより、一番伝えたい言葉を大きくする

パソコンの大きな画面では読める文字でも、スマホのサムネイルまで小さくなると、潰れて読めなくなることがあります。 だからサムネイルでは、文章をそのまま載せるのではなく、伝えたい言葉を短く絞り、大きく見せる工夫がよく使われます。 たとえば、 「文化祭で絶対に失敗しないために準備した10個のこと」 という内容を、そのまますべてサムネイルに入れたら、文字はかなり小さくなります。 でも、 「文化祭 失敗した」 のように、一番気になる部分だけを大きくすれば、一瞬でも内容を想像しやすくなります。 大切なのは、文字をたくさん入れることではなく、「この動画で一番気になってほしい言葉は何だろう」と考えることです。 何を大きくするかを決めることも、デザインの一部です。

視線誘導の秘密：最初にどこを見てほしいかを決める

サムネイルの中に、文字も写真も飾りも全部同じ強さで置かれていたら、見る人はどこから見ればいいのか迷ってしまいます。 そこで使われるのが、視線誘導という考え方です。 たとえば、人の顔を大きく置く。背景を暗くして文字だけを明るくする。一番大事な言葉だけ違う色にする。大きさや明るさ、色の差を使うことで、「まずここを見てほしい」という順番をつくることができます。 見る人の目を完全に思い通りに動かせるわけではありません。でも、何を目立たせるかを考えることで、情報の優先順位を伝えることはできます。 配色も文字も視線誘導も、根っこにある考え方は同じです。 「小さく・並んで・一瞬で見られる」という条件の中で、一番伝えたいものをどう届けるか。そのためにデザインを組み立てています。

ミラジェネでは、デザインを「伝えるための道具」として考えます

ミラジェネでは、デザインを「自分の考えを、相手に届く形に変える技術」だと考えています。 サムネイルも同じです。動画の中身そのものを変えるのではなく、その内容のどこを見せれば「見てみたい」と思ってもらえるのかを考え、届け方を選びます。 ミラジェネの授業でも、配色や文字、レイアウト、余白などを「正解として覚える」のではなく、「自分が伝えたいことを届けるための道具」として扱っています。 同じ知識でも、何を誰に届けたいかによって使い方は変わります。 だから大切なのは、「この色を使えば正解」「この文字なら目立つ」と覚えることではなく、「なぜこの色にするのか」「なぜこの文字を大きくするのか」を自分で考えられることです。

サムネイルづくりから見える、考える力

サムネイルを「なんとなく目立つ」「なんとなく可愛い」で終わらせず、配色・文字・視線誘導という視点で分解すると、そこにはたくさんの選択があることが分かります。 次にYouTubeを開いたとき、少しだけおすすめ欄を観察してみてください。 どんな色が使われているか。一番大きな文字は何か。最初にどこへ目が行ったか。 そして、「自分はなぜこのサムネイルで指を止めたんだろう」と考えてみてください。 その「なんとなく」を言葉にできるようになることが、デザインを感覚だけではなく、自分で考えて使えるものに変えていく第一歩になります。