LESSON08 バナーってどうやって作る？売れるバナーの設計図

LESSON07では、14日で案件受注できた話をしましたね。

「でも実際、バナーってどうやって作るの？」
今回はその具体的な中身をお見せします。

初めてバナーを作る方でも
「あ、これならできそう」と感じてもらえたら嬉しいです。

この20レッスンは、

✅テキスト
✅音声

で学べるようになっています！

そしてぜひ見ていただいて、
アウトプットもしていただけたら、
より身につくと思います！

━━━━━━━━━━━━━━━━
音声はこちらから🔻(家事しながらでもOK)
https://gift.japan-design.jp/audio/fzGi3C4JsEXV
━━━━━━━━━━━━━━━━

バナーは「何枚かの素材を重ねたもの」

まず、バナーの正体をお伝えしますね。

バナーは、一見すると1枚の画像に見えます。

でも実際は、複数の素材を重ねて作られたものなんです。

ハロウィンのバナーを例に挙げると、わかりやすいと思います。

① 背景：紫一色の画像
② 文字：「10月27日　ハロウィンパーティを開催♪」
③ 装飾文字：Happy Halloween
④ 写真素材：かぼちゃの画像
⑤ 図形：紫の丸ふたつ

この5枚を重ね合わせると、1枚のバナーが完成します。

「えっ、これだけ？」と思いましたよね？

はい、そうなんです、これだけです！

Photoshopでは、この重なった1枚1枚のことをレイヤー（layer）と呼びます。
「層」という意味で、何枚も重ねて1つの作品ができているイメージです。

最初は少し戸惑うかもしれませんが、
「背景・素材・文字・図形を別々に管理できる」と思えば、むしろ使いやすい仕組みです。

1つずつ丁寧に見ていけば、必ず使いこなせるようになります。

Photoshopを挫折してしまう方に共通することがあります。
本屋さんで分厚い参考書を買って、1ページ目から全部読もうとすること。

これ、必要ありません。

WEBデザイナーとして仕事をするために使う機能は、Photoshop全機能のうちごく一部です。
必要な機能だけ使えれば、プロの仕事ができます。
参考書の残りは、しばらく無視していいんですよね。

バナーを作る前に、「設計図」を先に決めておくことが大事です。
プロのデザイナーも必ず、手を動かす前に方向性を決めています。

① ゴールを決める
このバナーを見た人に何をしてほしいか。クリックしてほしい？
商品を買ってほしい？ゴールが決まると、何を一番目立たせるかが自然と見えてきます。

② メインメッセージを1つ決める
バナーの中心に置く「一番伝えたいこと」は1つだけ。
あれもこれも入れようとすると、何も伝わらないバナーになってしまいます。

③ 素材を集める
写真・イラスト・アイコンはすべて素材サイトから探せます。
自分で描く必要はまったくありません。
「○○ 素材無料商用利用可」で検索すれば、使えるものがたくさん見つかります。

④ レイアウトを決める
素材をどこに配置し、文字をどこに置くかを決めます。
左寄せ・中央・右寄せ、どのパターンが一番見やすいか試してみましょう。

⑤ 配色を決める
全体の色を2〜3色に絞ります。
色が多すぎると印象が散漫になりますよ。
「メインカラー・サブカラー・アクセントカラー」の3色が基本です。

「何となく作り始めて、途中でどうしたらいいかわからなくなった」という方は、
設計図なしで作り始めているケースがほとんどです。

設計図を先に決めておくと、Photoshopを開いてから迷う時間がぐっと減ります。
デザインツールの使い方よりも、この「設計の考え方」の方がずっと大切なんですよね。

次のLESSON09では、「20連敗から逆転内定　ポートフォリオ戦略」をお伝えしますね。

就職・転職活動でどんなポートフォリオを作ればいいのか、具体的に踏み込んでいきます。

続きのLESSON09は、下の画像をタップして進んでください。