はじめに
皆さんは動画投稿やブログ等の活動をされていますでしょうか？
その際に重要になってくるのがアイキャッチやサムネイルといった最初に目にとまる画像です。
これの有無によって、例えばTwitterなんかに投稿のお知らせを投稿した際の、目にとまりやすさが段違いです。
例えばAPPDATEの仲間であるざわさんの記事。彼の記事が絶大な人気を誇る要因としてシュールで面白いアイキャッチ画像が占める割合もかなり大きいです。
でもアイキャッチを作るのって難しそう？全くそんなことはありません。この記事を読めば無料ツールのみで、誰でも簡単に、慣れれば5分10分で、ある程度のレベルのオシャレな画像が作れるようになります。
準備するもの
それでは解説の方に移っていきましょう。
まずは準備です。今回はペンタブ等といった特別なデバイスは一切必要とせず、本当に誰でも出来る簡単な手法のみを紹介します。
使用するツールはこちら AzPainter2
フリーの画像編集ツールにもいろいろなものがありますが、今回は個人的に一番使うのが簡単で分かりやすいと思うものをチョイスしました。
あとはパソコンとマウスとキーボードがあれば大丈夫です。
Step1 土台作り
まずは土台、または背景となる画像（以下メイン画像）を決めましょう。今回はP-sportsのロゴがドン！と大きく描かれているこちらの画像にします。
まずはこのメイン画像をAzPainterに投下しましょう。
はい、画像を投下したら右上を見て下さい。
拡大版
1165×654という部分。これは画像のサイズです。
このままでも良いっちゃ良いんですが、Youtubeのサムネイルのサイズは【1280×720】となっています。
とりあえずこれに合わせておけば、たとえ今は記事のアイキャチに使っていたとしても、後に動画のサムネイルにもしたくなった時にストレスがありません。やっておきましょう。
編集→イメージサイズ拡大縮小
今回は高さの方を720に調整して、幅のすこし超過してしまった部分は後で少し削ることにします。
幅の方を1280に合わせると高さが720に届きません。はみ出た部分を削って調整した方が画像を引き伸ばしたりしなくて済むので、こちらの方が良いと思います。
画像の幅、高さの比率によってどちらを合わせるかを判断して下さい。
サイズが調整できたら幅をちょっと削りましょう。ツールボックスから選択範囲をクリック。
クリック＆ドラッグで右上を見ながら選択範囲が1280×720になるように調整。右クリックからトリミングをします。
これでメイン画像のサイズ調整が終わりました。次はこの画像の上に別の画像を貼り付けていきます。
Step2 素材を貼り付けていく
まずはレイヤを分けましょう。レイヤウインドウから新たなレイヤを作ります。
赤丸の部分をクリックしてレイヤを追加。
レイヤってなに？
無色透明な紙を一枚重ねるようなイメージをして下さい。上にあるレイヤに描かれた線、貼られた画像は、下のレイヤに描かれたものに干渉せず、描いたり消したりすることができます。厳密には違うのですが、とりあえずここではそのような理解で問題ありません。
新たに作ったレイヤの方に他の画像を貼り付けていきましょう。
選択範囲→他から貼り付け→ファイル
予め用意しておいた喰い断さんの画像を貼り付けました。笑顔が眩しいですね。
クリック＆ドラッグで位置を調整します。
収まりの良い位置を考えて配置していきます。こんな感じ。
新規レイヤを作り、そこに画像素材を貼り付けていくという作業を繰り返し、どんどん素材を貼り付けていきましょう。素材ごとにしっかりとレイヤを分けて貼っていって下さい。
こんな感じに。範囲選択で画像を囲ってドラッグして位置調整したり、右クリックから画像のサイズを微調整したりできるので、それらを駆使して収まりの良い配置に持っていきます。
喰い断さんと主に放送にて活躍していたポケモン達。
そして背景がP-sportsだとまあどうにか分かる程度の配置（のつもり）。
ちなみにレイヤはこんな感じになってます。レイヤに名前をつけておくと分かりやすくなって良いです。サンダーよりメタグロスを前に持ってきたい場合などは、メタグロスのレイヤをサンダーのレイヤの上に持ってくればOKです。
Step3 素材を強調させる
さて、このままだと少々色がごちゃごちゃとして見辛いですよね。なのでポケモン達と喰い断さんの周りを白で縁取って目立たせようと思います。
ポケモンと喰い断さんのレイヤを結合しちゃいます。しなくても出来るのですが、レイヤが多すぎると混乱するし、この方が手間がかからないので僕は好きです。
レイヤを結合したら、そのレイヤを複製。下にある方の複製レイヤにアルファマスクをかけます。
アルファマスクってなに？
アルファマスクをかけると何か描かれてる部分にしか色を付けることができなくなります。とりあえずこう理解しておいて下さい。
ツールボックスから鉛筆を選択し、四角塗りつぶしモードにして真っ白な喰い断と仲間たちになるように塗りつぶします。
これが出来たら白く塗りつぶしたレイヤを選択し、レイヤ全体をぼかします。
フィルタ→ぼかし→ぼかし
何度か繰り返しぼかしたり、ぼかしたレイヤを複製したりして濃さを調整します。今回は二回ぼかして、レイヤを5つ複製しました。
それっぽくなってきました。
Step4 文字を入れる
さて、最後に文字を入れましょう。記事のタイトルや、動画ならその動画のウリ文句になりますかね。
新規レイヤを作り、ツールボックスからテキストを選択。
画像の適当な部分をクリックしてみて下さい。テキストを入力するボックスが出てきます。
フォント名：パソコンに保存されているフォント（字体）から好きなものを選択
サイズ：画像に合ったサイズに調整
アンチエイリアス：チェックを入れておいて下さい
アンチエイリアスってなに？
ペイントなんかで文字を入れると、なんかジャギジャギしてるなぁと思ったことありませんか？アンチエイリアスは縁を滑らかにしてジャギジャギ感を無くしてくれます。画像編集では良く出てくるワードなので覚えておくといいでしょう。
なお、文字の色はカラーパレットで選択した色になるので、そちらで調整して下さい。
文字を入れたら画像を方にプレビューが出てきます。配置したい位置をクリックして位置を調整して描画。
こんな感じで調整しつつ文字を入れましょう。
さて、文字を入れましたがちょっと地味です。縁取りをしましょう。
縁にしたい色を選択して、縁取りをしたい文字を範囲選択。そしてフィルタ→縁取り。
プレビューを見ながら縁の太さを調整。
あとは仕上げに先程やったようにぼかしを利用した縁取りを作って・・・
完成です！
おまけ ～メンバーのおすすめフォント紹介～
当サイトのクリエイティブメンバーからおすすめのフォントを聞いてきました！
シュロのおすすめ
フォントというわけではない上に、変わり種だと思うんですけど、お絵かきアプリ「メディバンペイント」に入っているテキストが結構種類豊富でおすすめです。
おわりに
今回は本当に誰でもできる手法のみで解説をしました。これだけでも結構見栄えが良いですよね。
冒頭でも説明しましたが、アイキャッチやサムネイルはコンテンツを伸ばす上で非常に重要です。
皆さんも少し拘ったものに挑戦してみてはいかがでしょうか？
・・・そこまでおしゃれ感がないって？この程度では満足できない方のための応用編も準備中なので乞うご期待です。
