サムネイルの基礎
こんにちは、フリーランスデザイナーのちふねこです。
今日は、目にとまるサムネイルを作る3つのヒントというテーマでお話ししていきます。
今日はサムネイルがテーマなんですけど、皆さんは自分で作ったりする機会があるでしょうか。
ブログだったり記事、最近で言うとノートとか書かれる方も多いと思うんですけど、
そういった記事のアイキャッチ画像とかも読んだりしますけど、
なんか表紙となるような画像を1枚つけることが多いですよね。
そういったサムネイルを作るときに、いろんな役割あるとは思うんですよ、サムネイルって。
例えばノートの記事だったら、ノートっていうプラットフォームのトップページとかでいろんな記事が一覧になってるじゃないですか。
その中でいかに目を引くかみたいな、そういった役割もあったり、
あるいはシンプルにこの記事が何についての記事なのかってパッと見てわかるというか、
そういう最低限の情報が書かれてればokみたいな役割もあると思いますし、
あるいはその文字じゃなくて画像だから、そういう記事の内容に関連する写真を1枚載せるとか、
日々の日記的な記事だったら、その時に散歩した時に撮った桜の写真とか、
そういう感じで使う場合もあると思います。
ただ今回のお話で言うと、1点目で挙げたような目に留まる、いかに埋もれないかみたいな、
そういったサムネを作りたい時にヒントとなるような考え方を3つご紹介したいと思います。
先に3つ言ってしまうと、1つ目、タイトルとサムネイルの役割を分担する。
2つ目、興味を引くキーワードやビジュアルを入れる。
3つ目、小さく表示されても伝わる視認性を確保する。
この3つです。
効果的なサムネイル作成
まず1つ目のタイトルとサムネイルの役割を分担するっていうのは、
これはですね、最近私が今講師としてやらせてもらっているプロフリ春講座の中でも、
最近お話ししたことの1つなんですけど、
サムネイルでよく見る、ちょっと気になるいまいち例の1つとして、
タイトルの内容をそのまんまサムネイルに打ち込んでいるっていうパターンが結構よくあると思うんですよ。
それの何がいまいちポイントかっていうと、情報が重複してるっていうのと、
せっかくの画像の良さを活かせてないっていうのがあると思うんですね。
どういうことかというと、記事が表示される時ってサムネイルのすぐ下にタイトルがあったり、
ノートのトップページとかだとタイトル記事の横にサムネイルが小さく表示されたり、
あるいはSNSでシェアした時に、
例えばツイッターXとかでタイムラインでリンク貼ると、サムネイル画像と記事のタイトルもすぐ下に表示されるようになってるんですよ。
なのでそこに、そこで表示されるサムネイル画像にタイトルのテキストがまた出てくると結構くどいんですよね。
くどいしもったいないですよね。文字情報ですでに見えている内容をさらにサムネイルでも載せちゃうっていう。
なんかせめて文字の強弱つけたり、表現変えたり、表現というか加工、文字の加工でより雰囲気とか伝わるような工夫があればいいんですけど、
そういうわけでもなく、ただ内文字でさらさらさらっとタイトルをそのまま書いちゃうっていうのがもったいないなぁと感じます。
なのでそういった場合にタイトルとサムネイルの役割を別で考えてる、考えちゃうっていうのが結構必要とか大事かなと思います。
タイトルでは文字情報が伝えられるので、サムネはもうなるべく文字じゃないビジュアルで見せようとか、
あるいはまたちょっと別のベネフィットというかメリット、なんだろう、興味のフックとなるようなキーワードだけ大きめに入れるとか。
この大きめに文字が入れられるっていうのも画像の特徴の一つだと思うんですよ。
やっぱり文字、画像サイズにもよりますけど、Xでシェアされた時とかは文字サイズよりも画像の方が圧倒的に大きくなるので、
そこで一番目立たせたいキーワードドドンって入れちゃうとか。
あとは画像のメリットとしては、そういう色とか形、イラストだったり写真とかでそういう印象作りができる。
なんか楽しそう、美味しそうとか、すごい真面目な情報が多そうとか、
そういう雰囲気みたいな印象作りをするのに、色とか形っていうのがすごく使えるので、
そういったものをサムネイルで作るみたいな、そういう考え方もすごくいいと思います。
というのが1点目。続いて2つ目は、興味を引くキーワードやビジュアルを仕込む。
やっぱり目に止まるっていうからには、相手の興味を引かないと、なかなかスルーされちゃうんですよね。
なので、さっき言った1点目とも通ずる部分がありますけど、
例えばタイトルの文字を入れるんだとしたら、長文で全部ガーって入れちゃうんじゃなくて、
興味を引くキーワードだけ抜粋して、それだけちゃんとしっかり目立つように大きめに入れるとか、
あるいはその、その記事を読みたいであろう人の悩みとか、そういう興味を持ちやすいキーワード。
初心者でも簡単とか、1日5分あれば大丈夫とか、いろいろあると思うんですけど、
そういったフックとなるようなキーワードをサムネイルに入れるみたいな見せ方とか考え方が大事になるかなと思います。
あるいはそれを文字じゃなくてビジュアルで見せる。イラストだったり写真で興味を引くようなもの。
美味しそうな料理で目を引くとかでもいいですし、なんだろう、そういうAI系の記事ならちゃんとAIらしさがわかるビジュアルにするとか、
そういう感じでそのターゲット、読ませたい相手の興味を引くものっていう興味引くポイントを作るっていうのが大事かなと思います。
最後の3点目は小さく表示されても伝わる視認性を確保する。
これはもう視認性って言うとちょっと難しく聞こえるかもしれないんですけど、要はちゃんと目に止まるか見えるかみたいなことですね。
サムネイルってそのXとかで表示される時は割と大きめですけど、それこそノートのトップページとかだったら結構ちっちゃくなるんですよね。
なのでそういった時にもしっかり内容がまあわかる、最低限わかるというか、全部文字が潰れちゃうようなことは避けて、
ちゃんとなるべく大きいキーワードも入れとくみたいなイメージがいいかなと思います。
そうして言えることはやっぱり、こまごました文章を入れないっていう感じになりそうですね。
こまごました文章だと小さくしたら見えなくなっちゃうし、興味を引くポイントもわかりづらいし、
タイトルとあんまり差別化できてないっていうので、なかなか目に止まりにくいサムネイルになっちゃうと思うので。
以上の3つ、役割分担をしっかり意識するのと、興味を引く要素を作るっていうのと、
あとは小さく表示されてもしっかり見える、視認性を確保するっていうのが、目に止まるサムネイルを作るための3つのポイントでした。
以上です。聞くだけフリーランス講座の毎週火曜日はこんな感じでサクッと学べるデザインのお話をお届けしています。
デザインをやっている方もそうじゃない方も、何かスキルアップのヒントとして参考になれば幸いです。
今日も最後まで聞いてくださりありがとうございます。
