自分が素人の頃のデザインを添削してレベルアップさせる【サムネイル その1】

デザイン添削_サムネイルその1
当サイトはアフェリエイト広告を利用しています
ユウ
ユウ

魅力的なサムネイルを作る参考にしてみてね!

今回は、僕がデザイナー初心者の頃に作成したポートフォリオ(サムネイル)を添削してレベルアップさせていきます。

デザイン上のポイントなども解説しているので、デザインを勉強中の方などぜひ参考にしてください。

【この記事を書いた人】

ド素人の状態から独学でデザインを学び、フリーランスとして独立。
現在はWeb・グラフィックデザイナーとして主にクラウドソーシング上で活動しています。

書籍紹介の動画用サムネイルの旧デザイン

書籍を紹介する動画用のサムネイルです。
写真に文字・画像とやりたいことは分かるけれど、スキルが伴ってない感じですね。

  • 文字が細くて見えづらい
  • 文字の大きさが均一でつまらない
  • 細かい部分のあしらいがない

タイトルに力強さがなく、いかにも素人という印象を受けてしまいます。

また、デザインを置いただけ感が強くあしらいがないので物足りないのでそちらも追加していきましょう。

文字が細くて見えづらい

日本語フォントはざっくりと分けると

  • ゴシック体
  • 明朝体
  • 装飾文字

の3つがありますが、明朝体は細身のものが多くタイトルに向かないためフォントは基本的にゴシックでしっかりと見やすいものを選びましょう。

手書き文字のようなフォントも同様の理由でおすすめしません。

絶対に使っていけないというわけではなく、視認性を上げるために工夫をしなくてはいけなくなるため難易度が上がるというイメージです。
ビジネス系の動画などであれば雰囲気に合うのでどんどん使っていきましょう。

フォントを変更

タイトルのフォントを明朝体からゴシック体へ変えて見やすく、
一方で動画カテゴリーの「書籍紹介」は明朝体に変えました。

また、「全てが変わる」の文字色が赤100%で目が痛かったので彩度を下げて目に優しい赤に調整。

これだけでもカテゴリーとタイトルでデザインにメリハリがつき、見やすいサムネイルになったと思います。

文字の大きさが均一でつまらない

文字は見やすくなりましたが、なんだか読みにくくありませんか?
その原因は文字の大きさにあります。

僕自身、素人からプロになる段階で一番変化を感じるのは文字の大きさを変えるようになったことです。

文字は主語を大きく、それ以外を小さくするだけでも見栄えがよくプロっぽく見えるのでやって見てください。

文字の大きさを変える

コツは大きさを変えてるのが見て分かるくらいハッキリと変えるということです。

今回はそれ以外にも大きい文字に小さい文字を重ねて奥行き感も出しました。

また、「書籍紹介」を明朝体にしたことで余白が広く感じてきたのでそちらも調整。

だいぶ良くなってきましたね。

細かい部分のあしらいがない

現状でも一応合格という感じですが、どうせなら満点を目指すべくもう少し考えてみましょう。

なんだか物足りないという時はあしらいが足りないということ!

少し頭を芸術的にして無くても問題ないけどあると楽しい工夫を加えてみます。

あしらいを追加

どこが変わったか分かりますか?

  • 書籍紹介を傾ける
  • 画像に影を追加
  • 画像横にキャッチコピーを追加

たったこれだけのあしらいでデザインにまとまりが出ましたね。

他にも背景をモノクロにして一部分(今回だと目覚まし時計とか)だけカラーにするとか本を立体的にして配置する、朝がテーマなのでスポットライトのような光を上から入れるなどのあしらいも良いでしょう。

あしらいは色々なデザインを見ると自然と思いつくようになっていくので「Pinterest」などで参考デザインを色々と見てみるのがオススメです。

サムネイルビフォーアフター比較
まとめ

自分がデザイン初心者の頃に作った素人デザインをレベルアップさせてみました。

添削する相手が自分自身ということでダメ出しも遠慮なくしましたので、参考になれば幸いです。

サムネイルはプロに依頼せずに自分で作っている方も多いと思うので、どんどん添削していきたいと思います。

  • 書籍紹介のサムネイルのデザイン添削
  • タイトルのフォントはゴシック体が一番見やすくてオススメ
  • 文字の大きさを変えるとプロっぽく見える
  • ちょっとしたあしらいでデザインにまとまりが出る