【初心者OK】アイキャッチ画像の作り方はCanvaを覚えれば一瞬です【プレゼント在中】

アイキャッチ画像 作り方

ブログ初心者

デザインセンスがない自分ですが、それっぽいアイキャッチ画像を作れないかなあ。

できればあんまり時間を掛けたくないんです……。

やっぱ無理ぽですか?

 

こういった悩みに答えていきます。

結論、まったく無理ぽじゃないですよ!

 

というのも、ブログド素人で、おまけにデザインセンス皆無の僕でも簡単にそれっぽいアイキャッチ画像を作れているから。

 

 

よぴ

ソースは俺。

※ちなみに筆者は現在、アイキャッチ画像の作成のお仕事を頂いたり、自作のデザインデータを販売したりもしてます。

 

「Canva」というWeb上の神デザインツールがありまして、それを使えば一瞬でアイキャッチ画像は作れます。使い方も簡単すぎワロタです。

 

この記事では、

 

 

・【基礎の基礎】これだけ抑えとけばOKなアイキャッチ画像の考え方をざっくり説明

 

・【画像&動画】Canvaを使ったブログアイキャッチ画像の作り方を1から易しく解説

 

・【今日からできる】カンタンだけどおしゃれに映えるアイキャッチ画像のデザイン例を6つ紹介

 

→記事中で、上記のデザインデータをプレゼントしています!

 

 

このあたりにフォーカスしました。

 

画像付き視覚的にもわかりやすく説明しました。ぜひ少しの間お付き合いください。

動画で把握したい人向けに、 YouTubeの実演動画も用意しています(‘◇’)ゞ

 

この記事を見ながら、まずは1個アイキャッチ画像をつくってみてはどうでしょうか?

 

 

 

 

【3つだけ!】アイキャッチ画像の作り方で必須な前提知識をサクッとインストールしましょう!

アイキャッチ画像 作り方

 

はい、アイキャッチ画像を作るときに「これだけは大事!」ってポイントが3つあります。

 

ちなみに、これを外すと「ヤヴァイ」デザインになっちゃう可能性が大。

僕も昔は、ここを抑えておかなかったばかりにダサいアイキャッチ画像を量産して失敗しまくっていました(^-^;

 

なので、以下の3つは【大前提】として知っておいてください。

 

 

大前提

①写真選び

②文字組み

③色づかい

 

 

ざっくり分かりやすく説明しますので、ここだけ先にインストしておきましょう!

 

 

①写真選び

 

写真の選び方にはコツがあります!

 

背景ごちゃごちゃしている写真は避けましょう。

なんでかって、入れたい文字が映えにくいから。

 

以下のような画像はNGです。

※「カフェ」で画像検索しています。

 

アイキャッチ画像 作り方

料理とかの記事に使っちゃいそう。

アイキャッチ画像 作り方

店構え的にはイイ感じですが、文字入れが絶対に映えない。

 

 

初心者であればあるほど、画像デザインに自信がない人ほど、以下の点を意識してみてください。

 

  鉄則:背景がすっきりしていてシンプルなものを選ぶ

 

例えば、「山」「川」「海」「空」「草原」などの自然系だとごちゃごちゃしていないのでオススメです。

 

以下のような画像です。

アイキャッチ画像 作り方

海の画像

アイキャッチ画像 作り方

空の画像

 

 

また、「人物」「動物」「物体」が入るような写真を使いたいときは、左右や上下に < スペースがある > ものを選んでください。

 

以下のような写真です。

アイキャッチ画像 作り方

人物系の画像

アイキャッチ画像 作り方

動物系の画像

アイキャッチ画像 作り方

物体系の画像

 

 

「背景に使う写真はすっきりシンプル」

これは覚えておいてください!!

 

②文字組み

 

次は「文字組み」です。

これは、文字の配置のことですね。

 

きちんと整った「文字組み」にしましょう。

テキトーすぎるとダサくなりますので。

 

以下、僕が画像デザイン初期に作ったクソださアイキャッチ画像。

アイキャッチ画像 添削

 

ヤバすぎますよねwww

 

これは、文字組みをミスっていて大きく外しているパターン。

上の例だと、素直に「図形の丸」の中に文字を収めて整えたほうがマシです。

 

で、正しい文字配置でこれだけは覚えてもらいたいのが、

「サンドイッチ型」です。

 

以下のような感じ。

アイキャッチ画像 作り方

基本の「サンドイッチ型」

 

このようにして、メインタイトルの上下を挟んであげましょう。

※もちろん、上下や左右の文字間隔と余白スペースは整然とそろえてください。

 

「飾り文字」というのは、読まれなくてもいいんだけどデザイン的にオシャレさ重視で配置する文字のこと。

あえてちっちゃくしたり、英語にしたりして使いますね。

 

とにかく、

 

 

基本の文字配置「サンドイッチ型」

サブタイトル(中)

メインタイトル(大)

飾り文字(小)

 

 

こんな感じをひとつ覚えておけばOK.

あとは、 この形から少し応用させるだけで、文字組みはとりま一安心になります。

 

以下、派生した例。

アイキャッチ画像 作り方

サブと飾り文字を逆転

アイキャッチ画像 作り方

メインタイトルを起点に左右に ≪ やや ≫ ずらす。

アイキャッチ画像 作り方

飾り文字はナシで「サブタイを下」に配置。

アイキャッチ画像 作り方

飾り文字はナシで「サブタイを上」に配置。

 

 

まとめると、

 

・「サンドイッチ型」

→逆転アリ、ややズラシ、飾り文字ナシもOK

 

このようなイメージです。

上記を参考に、「文字組み」の基本形を覚えましょう(‘◇’)ゞ

 

 

③色づかい

 

色づかいは、画像デザインの中でも飛びぬけて難易度が高い領域になります。

配色はプロでも悩むと言われているくらいですから。

 

したがって、とくに初心者のうちは、

 

鉄則:色づかいは迷ったら「白黒」

 

にしておいてください!

 

もしワンポイントで「1文字だけ」「単語だけ」色を変えたいときは、

 

鉄則:色の変化はワンポイントだけ。背景色に寄せる

 

これを意識しましょう。

 

こんな感じに↓↓

アイキャッチ画像 作り方

「アイキャッチ」の「ア」だけ背景色のターコイズブルーに変化。

 

 

以上、

色づかい(配色)は、

 

「基本は白黒を使う」

「ワンポイント変化で背景色に寄せる」

 

これを意識しましょう!

 

「前提知識」は分かったけど……。

 

このように、

アイキャッチ画像の作り方で「抑えておきたい前提知識」は3つだけです。

 

 

3つの前提知識

・「シンプルな」背景写真を選ぶ

・文字組みは「サンドイッチ型」覚える

・色づかいは「基本は白黒」「背景色に寄せる」

 

とりま、これだけでおk。

だから、なんとなく大丈夫だと思います。

 

とはいえ、

 

不安すぎな人

アイキャッチ画像とか作る際のツールって、やっぱ『Photoshop』とか『Illustrator』とかになるんですか?

お金もかかるし操作も難しそうだし……。

不安しかない……。

 

と、思うと思います。

結論ですが、作成ツールに『Photoshop』とか『Illustrator』とか要りませんからね笑

僕も触ったことすらありませんwww

 

では、何のツールを使えばいいのか?

 

それが、、、、、、、、、、、、

 

【カンタン】ブログのアイキャッチ画像は作成ツール『Canva』だけで完結しますよ。

アイキャッチ画像 作り方

 

無料ツール『Canva』

別名:デザイン作成の神ツール

 

アイキャッチ画像やブログ周りのデザインであれば この無料ツールで十分!

ていうかめちゃくちゃ使いやすいので、もう他のツールには戻れません笑

 

どのくらい使いやすいかというと……、

ブログ初心者だろうが、非デザイナーだろうが、センス皆無だろうが、オールオッケー。

 

当然、アイキャッチ画像も『Canva』さえあればすぐに作れちゃいますので、ぜひ取り入れてみてください(^o^)

 

それで、この章では、

 

 

・Canvaへの登録方法

・Canvaの基本的な使い方

 

 

について解説します!

 

↓↓YouTube実演動画で見たい人はコチラ↓↓

 

 

まずはサクッと登録

 

はい、まずは「Canva」にサクッと登録します。

 

以下のURLから登録に進んでください。

 

https://www.canva.com/

 

「Googleで登録」か「メールアドレスで登録」で簡単に登録できます。

 

 

※「Googleで登録」だと一瞬で登録できるのでオススメです。

 

Canvaの基本的な使い方

 

基本的な使い方(必須)は以下の6つ。

 

・カスタムサイズ

・写真

・素材

・テキスト

・透明度

・ダウンロード

 

一つずつ、画像付きで見ていきましょう!

 

 

・カスタムサイズ

アイキャッチ画像 作り方

 

↑↑上記の通り、Canvaに入ったら「カスタムサイズ」→「画像サイズ入力」してください。

「新しいデザインを作成」を押しましょう!

 

※自分のブログにて、アイキャッチ画像の画像サイズが分からない方は < 16:9 > の比率で ≪ 800px × 450px ≫ にしてみてください。たいていのテーマで使えて汎用性が高いサイズです。僕もコレです。

 

・写真

アイキャッチ画像 作り方

 

↑↑のように、「写真」→「検索窓入力」でイイ感じの画像を探します。

 

今回は「山」で探してみました。以下。

アイキャッチ画像 作り方

 

超シンプルですが、このくらいの方が文字を入れやすいです。

 

 

・素材

アイキャッチ画像 作り方

 

↑↑のように、「素材」→「検索窓入力」でイイ感じの素材を探します。

よく使うのは「四角」「線」「丸」「枠」「なんらかのアイコン名」ですね。

 

 

・テキスト

アイキャッチ画像 作り方

 

↑↑のように、「テキスト」→「見出しを追加」をクリック。

 

アイキャッチ画像 作り方

↑↑フォントや色見を変えられます。

 

 

・透明度

アイキャッチ画像 作り方

 

↑↑のように、「モザイクマーク」→「透明度調節」をできます。

 

アイキャッチ画像 作り方

 

↑↑のように、「50%」だとかなり明るくなって(ぼかしが入って)、文字が入れやすくなります。

 

 

・ダウンロード

アイキャッチ画像 作り方

 

↑↑のように、出来上がったらPNG」か「JPG」でダウンロードしましょう。

PNG」と「JPG」の違いはざっくり以下のイメージ。

 

 

「PNG」:画像サイズは重くなるがキレイに文字映え。

「JPG」:画像サイズは軽くて済むが文字映えが微妙。

 

 

僕はガチ勢なんでほぼ「PNG」ですね。

※画像が重くなったとしても、のちのちプラグインとかで対応できますし。

 

 

超カンタンかつおしゃれなアイキャッチ画像のデザイン例6選【Canva完結】

アイキャッチ画像 作り方

 

はい、せっかくなんで「初心者がマネしやすいデザイン例」を6つほど紹介しちゃいます!

 

どれもカンタンでややこしいことはいっさい省いているので、ぜひぜひマネしてくださいな☆

 

今日から作れちゃいますよ、アイキャッチ画像。

 

以下の6パターンを紹介。

 

 

 

①裸文字

②枠つかう

③帯つかう

④線つかう

⑤丸つかう

⑥四角つかう

 

 

 

※あえて、ほとんどのテクニックを封印。どれも「超絶シンプル」にしてます。なので、ガンガン真似しよう。

 

このブログ記事ではポイントだけ紹介。

くわしいやり方は、以下のYouTube動画を参考にしてください!

↓ ↓ ↓

 

 

①裸文字

アイキャッチ画像 作り方

 

まずは、裸文字

文字だけで表現するパターンです。

 

文字配置はカンタンに、

 

サブタイトル(中)

メインタイトルを2行で(大)

 

のカタチに。

※以降、ほぼ全部コレでやってます。

 

 

Point

※背景透明度を60くらいにして文字を見やすく調整

※フォントはシンプルに「M+ Heavy」のみ使用。

※「ア」だけ背景色の「緑」や「青」に寄せてます。

 

 

 

②枠つかう

アイキャッチ画像 作り方

 

次は、「枠」を使ってフレームっぽく囲ったパターン。

シャープな印象になりますね。

 

図形の「枠」は、Canva上の「素材」→「枠」で出てきます。

 

色は全部を黒で。

 

 

Point

※背景透明度は「75」くらいでやや下げてます。

※フォントはシンプルに「Noto Sans Black」のみ使用。

※「ア」だけ背景色の「青」かつ暗め濃いめで映える色にしました。

 

③帯つかう

アイキャッチ画像 作り方

 

打って変わって「夜空」を写真を起用。

正方形の図形を持ってきて、「帯状」に伸ばしています。

 

よく見るポピュラーなアイキャッチ画像デザインですね。

でも使いやすいし、カンタンおしゃれにできるので僕も重宝しています。

 

文字色は白で統一。

※暗めの画像には「白」を使ってください。

 

「今日からデキる!」の両脇をスラッシュで挟んでいます。

→普通にテキストの入力で「スラッシュ」と打つと出てきます。半角じゃなく全角を使おう。

 

Point

※背景透明度は「95」にして少しだけ微調整。

※「帯」の色は「黒」にして透明度「65」に。

※フォントはシンプルに「源暎ラテミン」のみ使用。

※「ア」だけ背景色のに寄せ目で「薄い紫」にしました。

 

④線つかう

アイキャッチ画像 作り方

 

「線」も効果的に使うことで、いろいろな表現ができます。

写真と相まってシンプルかつクールかつクラシックな感じになりましたね。

 

上の線を分割して中央にスペース開けてます。

そうじゃなくて、上下を同じ線で挟んであげてもOK

 

文字色は白で統一。

やはり黒よりも白がいいですね。

→コーヒーカップやお皿や中身の色に寄せるという考え方。

 

 

Point

※背景透明度は「95」にして少しだけ微調整。

※サブタイは廃止で「Canva」を飾り文字的に。

※フォントはシンプルに「Sawarabi Mincho」のみ使用。

 

 

⑤丸つかう

アイキャッチ画像 作り方

 

「丸」を使うとポップで可愛い感じにできます。

背景写真が「女の子」「風船」なので、合いますね。

 

丸を白色で少し透過(95%)。

文字色は黒で統一。

※マルの色は「黒」よりも「白」が合います。そして文字色は逆転で「黒」に。

 

Point

※背景透明度は「95」にして少しだけ微調整。

※アクセントのカラーを風船に寄せて濃いオレンジに。

※ふと目で短めの「下線」をしいて、少し目立たせてます。

 

 

⑥四角つかう

アイキャッチ画像 作り方

 

ラスト。

丸とおんなじ要領で「四角」も使えます。

 

四角を白色で少し透過(95%)。

文字色は黒で統一。

※シカクの色も「黒」よりかは「白」が合います。そして文字色は逆転で「黒」に。

 

一番下の「― To Use Canva ―」は飾り文字。

ついに出ましたね、完全体の「サンドイッチ型」

 

Point

※背景透明度は「95」にして少しだけ微調整。

※アクセントのカラーをネコに寄せてブラウンに。

※「今日からデキる!」の下に下線をしいて目立たせてます。

※フォントは「ラノベPOP」メイン。飾り文字は「Rounded M+ Regular」。

 

おまけ:今回作ったアイキャッチ画像のデザインデータをプレゼントします!!!

アイキャッチ画像 作り方

 

「見て盗め」と「マネしろ!」とか言ってますが、初心者すぎると難しいかもしれないので、そういった人向けにこのデザインデータプレゼントしちゃいますか。

6コ上げますので、これでいろいろいじったり確認したりして勉強してみてくださいな☆

 

注意説明

Canvaのデータを共有してお渡しします。

共有したデータは、<必ず>左上の「ファイル」→「コピー」してご使用ください。

そうしないと、デザインデータが崩れる&あなたの編集が全員にバレます

ヤバいことになるので必ずお願いします。

 

↓↓以下参考↓↓

アイキャッチ画像 作り方

 

 

欲しい人は以下のお問い合わせページからどうぞ!

 

お問い合わせページ

 

「その他」のところから「無料デザインデータ6パターン」欲しい旨ご連絡ください。

 

 

最後まで読んでくださり、マジでありがとうございます<(_ _)>



以上、『無職イズム』管理人のよぴがお送りしました。

それでは、また別の記事で!

 

P.S.他にも『アイキャッチ画像のデザインデータ』を作っていて、テンプレートとしても販売してます(大ボリュームのノウハウ動画付き)。

アイキャッチ画像 デザイン例 Canva

 

ちなみにですが、もっと凝った『アイキャッチ画像デザイン』テンプレ化してデータ販売もしております。

 

ポイント

◎Canva上であなた好みのカスタマイズが可能になります

→文章(キャッチコピー)、背景、色、文字フォントなどすべて変更できます。

☆Canvaの基本操作や便利なテクニック集などを易しく解説した動画マニュアル付き(特典ページへご案内します)

→むしろこっちのボリュームの方が多いです笑。このノウハウ目当てで購入するのもアリよ。Canvaの使いこなし方って情報として少ないし、あってもブログとかのテキストメインなのでわかりづらいんですね。

 

 

オススメな人

 

初心者すぎるので、お手本をイッコ買って、そこからいろいろ勉強してみたい(自分でもいじってみたい)。


アイキャッチなどの画像デザインはそんな好きじゃない(むしろ嫌い)ので、できれば使いまわしなど効率化したい。


兼業、副業、主婦ブロガーにつき、ブログにおける作業時間が極端に限られている(効率化が強く求められている)

 

こんな人にオススメの商品になります。

 

 

ちなみに特典ページ【らくらくデザイン講座 ー Master Canva ー】は、実に40動画オーバーのウルトラ大容量!!!

Canvaやアイキャッチ画像の基礎から応用的な部分までオールインワンパッケージで学習することができますよ♪

 

よぴ

正直これは教えたくなかったな……。

 

っていうようなテクニックやノウハウも惜しげなく開放しちゃってます笑

 

目次をチラ見せするとこんな感じ。↓↓

アイキャッチ画像 デザイン例 Canva

 

全部YouTube動画で説明しているので視覚的にも分かりやすいです。

1回見ればなんとなくは理解できるはずですので、「2倍速」とかも活用しながら、学習ハードル下げつつ自分のものにしましょう!

 

 

注意!

 

※Canvaの共有リンクを発行する形にしています。元データをいじると購入した人全員に反映されますので、≪必ず≫元データを「コピー」してからご利用ください。

→ご購入後にお渡しする動画マニュアルでも詳しい方法を解説しています。ごくカンタンなので必ずお願いします。

 

 

 

価格ですが、先行販売としてなんと1テーマ10枚を ワンコインの500円にて販売中!

のちのち、2倍の1000円にて販売するつもりですので、迷ってる方はお得な今のうちに購入することをおすすめします。

※お得な【72枚セット(セール価格:990円)】もありますよ(^o^)

 

 

こちらのブログ記事の最下部に詳細を載せています!

【ブロガー向け】パクれ!アイキャッチ画像のデザイン例66枚!【Canva】

 

 

あるいは、以下BASEの販売ページからご購入下さい。クレカが使えます!

 

↓ ↓ ↓

 

【よぴ@無職イズム】BASE店

 

※銀行振込がいい人は、ブログのお問い合わせページなどからその旨をお伝えください。個別に対応致します。

 

 

 

P.P.S.あなたオリジナルのアイキャッチ画像の作成も請け負っています。

 

アイキャッチ画像の作成サービスも行っています。

こんな方やシーンにオススメです。

 

 

・資金はあるが時間がない方

・よりオリジナリティを追求したい方

・自己紹介ページやお問い合わせページに

・収益記事(アフィ記事)やSNSでバズらせたい記事に

 

 

以下のページよりお問い合わせ下さいませ。

 

画像デザインのポートフォリオ(作品集)ページ

 

 

よぴ

P.S.当ブログ『無職イズム』が厳選したイチオシの記事はコチラ!

 

このブログ『無職イズム』では、無職をアップデートしてわりかし豊かにいきていくための、

 

「スキルやノウハウ」

「ライフハック術」

「お役立ち情報」

 

などを共有しています。

以下、よく読まれているイチオシ記事を厳選してご紹介します(‘◇’)ゞ

 

画像をクリックすると記事に飛べますので、気になったものがあったらぜひちょこっと読んでみてください<(_ _)>

 

 

 

 

 

 

 

 

 

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください