【アイキャッチ添削022】のじ日記|キャラを活かしたテンプレート作成

アイキャッチって難しいな…。

なんかしっくりこないな。

そういうあなたに少しばかりのアドバイスをするこの企画!

最近はたくさんのお声を頂き恐縮しきりです…!

さて、そんな中応募してくださったのは…ワーキングマザーののじさんです!

とうとう私の番ですね。ドキドキです。

のじさん
のじさん
どんぐり
どんぐり

おお…!ドーナツかわいいですね!

のじさんのお悩み
  • 少しバランスが悪い気がしている
  • もう少し垢抜けた感じにしたい

どんな、アイキャッチが完成するのか、最後まで見て行ってくださいね!

目次

今回の作品

のじさんの作品

作者   …のじさん
掲載記事 …携帯の着信を見逃さない!スマートウォッチFitbit Versa 2

掲載サイト…のじ日記|ワーキングマザーのじの雑記ブログ
働きながら二人の男児を育てるのじさんが、育児やブログなどの情報を発信する雑記ブログです!

掲載サイト・記事・アイキャッチは掲載した時点でのものです。現在は変更されている可能性があります。

サイトメインカラーを茶色、ベージュ、ピンクに絞っています。

のじさん
のじさん
どんぐり
どんぐり

サイトで使う色を決めているのはとても良い事ですね!

サイト全体として見てみる

のじ日記のトップページ
のじ日記のトップページ

アイキャッチも色を統一し、カテゴリーごとにアイキャッチのテーマをわけています

のじさん
のじさん
どんぐり
どんぐり

カテゴリー別にテンプレートを変えるのは、マンネリ化を防ぐうえで非常に有効です!

よかったです。

のじさん
のじさん
どんぐり
どんぐり

今回の「おすすめサービス」カテゴリーだけがブラウンが濃くて浮いている感じはありますね!

そうなんですね!

のじさん
のじさん
どんぐり
どんぐり

クラシックな感じで統一されていて良い色なので、少しだけブラウンを減らしましょう。

ちょっとブラウンが強すぎましたか…!

のじさん
のじさん
どんぐり
どんぐり

それにしてもお洒落なサイトですね…!

  • アイキャッチ1枚だけで見るのではなく、実際に記事一覧などで全体の雰囲気とあっているか確認しましょう。

バランスが悪い原因

テキストの範囲がまばら
どんぐり
どんぐり

バランスが悪いと感じる原因は、文字幅があってない事です!

幅ですか!

のじさん
のじさん
どんぐり
どんぐり

テキストの幅が合うように配置するだけでも、かなりバランスが取れて見えるようになります。

テキストの幅を合わせるイメージ
テキストの幅を合わせるイメージ(参考:ロックさんの添削アイキャッチ)

なるほど!合わせるとすっきりしますね。

のじさん
のじさん
どんぐり
どんぐり

あとはアイキャッチによってテキストを入れる位置がバラバラなので、全体として見た時のバランスの悪さもでています。

テキストエリアを決めておけばバラバラになりにくいですね。

のじさん
のじさん
どんぐり
どんぐり

今回はテキストを上下に並べないテンプレートを作っていきますね!

お願いします!

のじさん
のじさん

アイキャッチ添削完了!

どんぐり
どんぐり

上下配置しないテキストエリアを決めて作ってみました!

期待です!

のじさん
のじさん
野路さん作成のアイキャッチ

もしかして、私のアイコンのチョコレート掛けドーナツをイメージしたデザインですか?

のじさん
のじさん
どんぐり
どんぐり

そうです!

アイコンとリンクした提案をして頂けて感激です!

のじさん
のじさん
今回のアイキャッチの概要

使用フォント
 ほのかアンティーク丸

使用カラー

  • メインカラー(ベージュ)|#FFF4ED
  • サブカラー(ブラウン)|#59473E
  • アクセントカラー(レッドブラウン)|#9D6F6A

上段ブラウン右側にメインキーワードを配置
ドーナツさんにしゃべってもらう吹き出しをアクセントで用意

どんぐり
どんぐり

のじさんのサイトはクラシックな感じなので、似合うアンティークなフォントを選択しました!

イラストについて

どんぐり
どんぐり

スマートウォッチを一つだけ置くとバランスが悪く感じたので、並べて横長に配置してみました!

スマートウォッチのイラストがカワイイですね!

のじさん
のじさん
どんぐり
どんぐり

Canvaの無料版でもこういう素材が見つかるのでおすすめです!

ドーナツのイラストもカワイイ。

のじさん
のじさん
どんぐり
どんぐり

Canvaの素材でみつけてどうしても使いたくて…!「ドーナツ」で検索してみてください!

色が変えられる素材がおすすめ
どんぐり
どんぐり

イラストを選ぶ際に色が変えられるものがおすすめです!

どうしてですか?

のじさん
のじさん
どんぐり
どんぐり

サイトの使用カラーに合わせたり、彩度を合わせて違和感を少なくしたりできるのでイラストが浮きにくくなります!

なるほど~。

のじさん
のじさん
どんぐり
どんぐり

今回はあえて写真を外して、イラストを使用する事で雰囲気をあわせてみました。

イイ感じですね!

のじさん
のじさん
  • イラストの色が変更できるものを選ぶと、違和感なく配置しやすい

テンプレート

どんぐり
どんぐり

イラスト用とテキストのみ用と写真用の3種類ご用意しました!

イラスト用テンプレート

イラストを入れるテンプレート
どんぐり
どんぐり

ワイドなデザインなので、イラストを入れる時は複数置くとバランスが良いです!

わかりました。

のじさん
のじさん

テキスト用テンプレート

のじ日記|テキスト用テンプレート
どんぐり
どんぐり

こちらがテキスト用のテンプレートです!

シンプルになりましたね!

のじさん
のじさん
テキスト用テンプレートのテキスト配置方法
どんぐり
どんぐり

テキストを入れるルールを決めておくことで、統一感がでてきます!

センターで揃えると綺麗ですね!

のじさん
のじさん
テキスト用テンプレートに文字入れしたイメージ
  • シンブルイズベスト。

写真用テンプレート

のじ日記写真用テンプレート
のじ日記|写真用テンプレート
どんぐり
どんぐり

勝手にお花を配置してみました(汗)

こちらもオシャレですね~。お花に動きがあって。

のじさん
のじさん
どんぐり
どんぐり

写真用のテンプレートはシンプルに6:4パターンにしました!

こちらの方が写真がいれやすそうですね!

のじさん
のじさん
どんぐり
どんぐり

6:4パターンだと、スッキリ写真がいれられますね!

6:4パターンの例
6:4パターンの例
どんぐり
どんぐり

例としてテキストと写真を入れるとこんな感じです。

写真とテキストを入れたイメージ

枠で入っているより洗練されますね。

のじさん
のじさん
どんぐり
どんぐり

こちらのテンプレ―トでは、テキスト「中央揃え」の方が綺麗に見えます!

添削を終えて

どんぐり
どんぐり

今回ものじさんがお洒落なので難しかったです!

タイトルの入れ方の記事も参考にさせていただいてます。

のじさん
のじさん
どんぐり
どんぐり

わ。他の記事も読んでくださってるんですね!ありがとうございます。

その記事を読んでからアイキャッチのテキストを最小限にするように意識しています。

のじさん
のじさん
どんぐり
どんぐり

アイキャッチをテキストでごちゃごちゃさせないのは大事ですね!

今回はありがとうございました!

のじさん
のじさん
どんぐり
どんぐり

ブログデザインラボではアイキャッチ添削を募集しています!

のじさんの運営するサイト「のじ日記

目次
閉じる