デザインに自信がなくても大丈夫!Canvaを使ってオシャレなアイキャッチを作る方法とコツを教えるから、今すぐ使ってみて!

まちるーむへようこそ!

都合のいい女都合よく何でもできるブロガー、ちゃんまち(@machi_1985)です!

 

ブロガー界は空前のデザインブームが到来しています。(してるよね?)

Twitterやブロギル内でもブログのデザインコンサルをされてる方をちらほら見かけますね。

▼私も過去記事で、ブログデザインの重要さについて少し書きました。必読。
www.machi1985.com

 

・デザインなんか勉強したことないしわからない。

・デザインって言われても、何が見やすくて何が見づらいのかわからない。

・美術の成績悪かった、美的センスに自信がない人。

 

今回はそんな人でも簡単にできる、ちょっとオシャレでインパクトのあるアイキャッチの作り方とコツを、みんな大好き『Canva』を使って説明していきます!

 

レツゴ!

 

まだCanva(キャンバ)使ってないの?

Canva(キャンバ)とは?

 無料で使えるオンラインツール、Canva。テンプレート集から好みのものを選んでアレンジしていくだけで、デザイン知識がない方でも簡単に美しいグラフィックを作成できます。

もう知ってる!もう使ってるし!という人もたくさんいますよね。

無料で(一部の素材は有料)アイキャッチやバナー、ポスターなど色々なものをデザインすることができます。

 

初心者でもすぐ使える最大の特徴として、オシャレなデザインテンプレートが豊富ということが人気の理由ですね!

▼メールアドレス・Facebookアカウント・Googleアカウントのどれかですぐに始められます。こちらから。

about.canva.com

 

デザインテンプレートに飽きた私。

私もよく使っていたんだけど、せこい考えで無料のデザインテンプレートばかり使っていると、よく使うものが偏ってくるし、だんだん飽きてきます

 

そこで、今回は無料で使える写真に文字を入れてアイキャッチを作ってみることに。

色々なフリー画像サイトがあるので、自分のブログに合った写真を扱っているサイトを探してみましょう!

 

▼今回の写真のダウンロードはUnsplashを使ったよ!無料で商用利用もできる写真がいっぱい。

unsplash.com

 

写真の選び方。

\今回はシンプルなこの写真を使うことに決定!/

f:id:machi1985:20180709150303j:plain

 

背景になる写真は、なるべくシンプルで白っぽい(明るい)または黒っぽい(暗い)写真を選びましょう。

 

白っぽい背景の場合は、反対に黒っぽい文字を入れることで文字が目立ちます。黒っぽい背景の場合はその逆をすれば、文字を目立たせてあげることができます。

黒っぽくも白っぽくもない原色系(赤・黄・青)は特に目立たせたいなど、特別な理由がない限り、初心者にはオススメしません。なぜなら使いづらいし見づらいから。

 

写真を決めたら、キャンバを使って文字を入れていきましょう!

 

キャンバを使って、写真に文字を入れる方法。

このやり方、実は私も最近まで知らなかったんですよね(照)

では、画像を使って簡単に説明していきます!

 

①キャンバにログインするとこのページが表示されるので、左上の「デザインを作成」か「Blogバナー」をクリック。私はいつもBlogバナーで作成しています。

f:id:machi1985:20180709152221p:plain

 

②この画面が表示されたら、左端メニュー1番下に「アップロード」アイコンがあるので、そこから①→②→③の順にクリック。これで好きな画像を右のキャンバスにアップロードできます。

f:id:machi1985:20180709153147p:plain

 

▼アップロードできたけど大きさ全然合ってない!!

大丈夫。角のカーソルを動かして大きさを合わせられます。

f:id:machi1985:20180709153626p:plain

 

③左端メニューの「テキスト」を選び、今回は1番大きな文字の「見出しを追加」をクリック。右側キャンバスに点線枠に囲まれた文字が表示されるので、枠内の文字を消して編集していきます。

f:id:machi1985:20180709154310p:plain

 

④文字を打ち込んだら、フォント・文字の大きさ・文字の色を決めましょう。

フォントでイメージがすごく変わるので、選び方は慎重に。

 

文字の配置もできれば真ん中に合わせるのがいいと思いますが、今回は左のデスクランプが被ってしまうので少しずらして、すっきり見やすいように下のラインを机と平行にします。

文字の移動は、点線枠外にカーソルを合わせると十字キーが表示されるので、それで移動できます。

 

今回は「無印良品っぽく」というテーマを自分の中で決めていたので、こころ明朝体というフォントを使ってみました。

f:id:machi1985:20180709155742p:plain

 

⑤これで完成です!!

どう?ちょっと無印良品っぽくない?

 

f:id:machi1985:20180709160313j:plain

 

文字の色は背景が白っぽいので、わかりやすく反対の黒っぽい色にしています。

実はこれ、ただの黒に見えますがただの黒ではないんです。

 

このあとに文字色を選ぶコツとを説明します!

 

フォントと文字色を変えると、こんなにイメージが変わります!

文字のいろは背景と逆の色を選ぶとわかりやすいですが、もう1つ文字色を選ぶ方法として私がいつも使っている技(というほどでもないけど)があります。

文字色は、背景写真に使われている色を使うとまとまりがあって統一感のあるデザインに見えます。

 

▼例えばさっき完成したアイキャッチ画像。文字色が黒だとこんな感じ。

f:id:machi1985:20180709161543j:plain

▼さっきのはこっち。

f:id:machi1985:20180709160313j:plain

 

わかりましたか?

下の画像の文字は濃いグレーです。黒でもはっきりしていて見やすいけど、もう少し写真と文字を馴染ませたかったので、デスクランプの濃いグレーと同じような色を使いました。

黒よりも全体的に自然なイメージになっていると思います。

 

▼応用して、テーブルの茶色を文字色に使ってもう少し温かみのあるデザインにしてみました。女性ブロガーのアイキャッチにありそうな感じ。

f:id:machi1985:20180709162013j:plain

ここで注意するのは、テーブルの茶色を使いますがあくまでも黒っぽい茶色を選んでくださいね!

本当にテーブルと同じような茶色を選ぶと、白×白で見づらくなってしまいます。

 

▼さらに応用して、文字位置も変えてみました。

これは写真に写る観葉植物の緑を使って、1番強調したい部分だけ明るく大きくして目立たせています。

f:id:machi1985:20180709162343j:plain

うーん、アイキャッチには不向きですねw

チラシ感?

下の余白部分に何か書き加えて、説明とかに使えそう。

 

まとめ。色々方法はあるけど、簡単にできるやつが最強。

今回の記事は色々やりながら記事を書いていたので楽しかったです。

色やフォントでこんなにイメージが変わるんだ!というのが少しでもわかっていただければな、と思っています。

 

本当はイラレやフォトショを使ってデザインできるのが1番オリジナルでかっこいいんだけど、難しくてよくわからない!という人は、簡単にできるのが1番です。

 

色に関することなど、すこーーーーーしだけアドバイスはできるので(本当に少し)もし何かあればTwitterからでも、ぜひご連絡ください(^▽^)/

 

キャンバは本当にオススメなので、まだ使ったことない人は使ってみてくださいね!

about.canva.com

 

ちゃんまちでしたー!

 

▼え?!まだフォローしてないの?今!さぁ!!twitter.com