おしゃれなサムネの作り方|Webデザイン初心者がおしゃれなタイトルデザインに挑戦してみた

Webデザインのことはよくわからないけどカッコいいアイキャッチ(サムネ)を作りたい

画像やイラストは素材サイトから適当に持ってこれるけどタイトルデザインが難しい

そんな、サムネのデザインにも気を配りたい方向け、タイトルデザイン提案の記事です。

目次

いかにも初心者っぽいサムネタイトルデザイン

まずいかにも初心者っぽいデザイン例をご覧ください。

私が数日前に書いたブログ記事のアイキャッチです。

別に悪くはないと思うんですが、いろいろと妥協した結果、THE初心者なデザインになってしまったと思っています。

妥協点と失敗点

  • Youtubeサムネ用に作った画像をそのまま流用(めんどくさかった)した結果サイズ感が微妙
  • リースの真ん中に文字を入れようとしたが、スペースが小さすぎてあきらめた
  • 背景黒なので白文字タイトルにしようとしたが、リースと重なって読みづらいのであきらめた
これだと文字ちっさい
これだとちょっと文字読みづらい?

そんな経緯から前述の白四角に黒文字という無難なデザインにしたのですが、「なんか野暮だな」と不満だったため、これを機にタイトルデザインについて少し調べて実践してみました。結果をご覧あれ。

タイトルデザインの種類とサムネから受ける印象の違い

黒背景真ん中にフラワーリース配置という画像条件は変えずに、タイトルデザインだけでどう変わるかやってみました。

9デザインに挑戦

  1. 縦文字横文字ミックス
  2. 装飾アルファベット
  3. フレーム素材に文字入れ
  4. 縦書きに罫線
  5. 外枠作って一部はみ出し
  6. 文字組み
  7. 文字in文字
  8. コロコロ正方形
  9. 文字の一部にパターン

ではひとつずつ結果を見ていきましょう。

1. 縦文字横文字ミックス

文字通り、縦書きと横書きをミックスさせる方法なんですが、え、エヴァじゃんこれ。え、好き。

もうブログのアイキャッチもYoutubeのサムネも全部これでいいんじゃ?

2. 装飾アルファベット

キーワードとなる語をアルファベットで装飾的に配置する方法。

ファッション系でよく見るデザインな気がします。

でも自分で作るってなったら素人じゃとても思いつかないデザインですよね。

3. フレーム素材に文字入れ

リボンなどのよくあるフレーム素材に文字を載せるデザイン。

リースに合わせたヴィンテージっぽいリボンとフォントならもっと可愛く出来そう。(探すのめんどいから今はやらない)

4. 縦書きに罫線

東アジア圏ならではのデザインですね。

文学っぽいからか縦書きにするだけで何だか賢そう。

5. 外枠作って一部はみ出し

外枠を作って、タイトルの一部を枠からはみ出させ、アクセントにする方法。

なんだかポパイとかのおしゃれ雑誌っぽくなりました。

どこをどう一部はみ出させるか、文字のバランスを見ながら考えましょう。

6. 文字組み

行の長さ(左右の端)を揃え、まるでそこに透明の四角フレームがあるかのように思わせるデザイン。

今回は全部4文字ずつで既に揃ってるのであれですが、文字数が異なる場合は文字間を調整して端っこを合わせます。

デザインに限らず、そこに無いものを想像させるアートって個人的にすごく好きです。

7. 文字in文字

文字を背面と前面の二重にしてからめる方法。

主張が強いので文字が主役のデザインには良さそうですね。リースが邪魔です。

8. コロコロ正方形

これもよく見かけるデザインですね。

四角多用で図形感が増すからか、理数学習系のデザインに良さそうです。

リースとは全然合わないですね。

9. 文字の一部にパターン

文字の一部に柄を入れるデザイン。

色をつけてポップな印象にするのが可愛いと思います。漫画のタイトルに良さそう。


以上、9デザインに挑戦してみた結果でした。

皆さんはどれがお好みでしょうか。私は断然エヴァです。

てか回転対称って何だよ、と思った方はこちら

デザインの参考にしたサイト

今回のデザインはすべてデザイン研究所さんこちらの記事を参考にしました。

ということで作り方はそちらをご参考ください(ぶん投げ)。

デザインのノウハウがたくさん詰まったサイトで、特にWebデザイナーを目指す方なら必見のサイトかと思うのでのぞいてみることをおすすめします。

他にもまだまだたくさんのタイトルデザインが紹介されています。

独学&初学者ひとりじゃ絶対に思いつかないようなデザインばかりでとても勉強になりました。

おまけ

早速この記事のアイキャッチも学んだことを取り入れたらエヴァ風になりました。(故意)

タイトルデザインというスキルを得てまたひとつデザインが楽しくなりました。

と言いつつも、こういったノウハウを収集して自分のデザインに取り入れることも大事ですが、あまり「世の中の正解」に捉われすぎず、自分が持っているセンスもちゃんと大事にしていきたいな。

答えのない世界を生きる (日本語) 単行本(ソフトカバー) – 2017/8/2
小坂井敏晶 (著)

と、この本を同時並行で読んでいて思いました。

社会心理学の本なんですが、デザインや芸術に通ずる考え方の記述もあり、異端者でありたい!と思わせてくれる本です。

哲学はすべての道に通ずる!!( ˘ω˘)

タイトルデザイン

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!
目次