こんにちは、ツボです。
早いもので、ふたっぱさんでのインターンも半分が過ぎました。
後半もあっという間なんだろうな～と考えるとすでに寂しくなってきてます。
もう春ですね。。。（遠い目）
気をとりなおして、先日バナー制作をさせてもらったので、そのことについて書きたいと思います。
実はツボはバナー作成があまり得意ではなく、どこから手をつけていいのやらという状態だったのですが、わかりやすくコツを紹介しているページを見つけたので、その通りに作ってみました。
とりあえず何も考えずに要素を全部並べる
優先順位を決める
メインビジュアルを決める
適切なレイアウトを選ぶ
手書きでラフを描いてみる
モノクロで組む
フォントの可読性を高める
カラーにする
遊び心を足す
全体を整える新米デザイナー必見！バナーデザインを効率的に美しくする10のステップhttp://liginc.co.jp/web/design/photoshop/128520
1）必要な要素を並べる
今回は商品名、商品写真、会社のマークは必須でいれる項目になっています。
ひとまず画像は横に置いておいて、こんな感じにテキストを入れていきましょう。
このとき、ユーザーの目を引くようなキャッチコピーを考えることも忘れずに。
私は口コミを読み漁って、響くフレーズを参考にしたり、どんな人に見てもらいたいのかを意識しながらキーワードを考えました。
2）優先順位を決める
ユーザーはどんなキーワードが目に留まればクリックするだろうかとストーリーを考え、優先順位を決めます。
おのずと強調すべき部分が決まってきますので、目立たせたいところは大きくします。
3）メインビジュアルを決める
今回は商品写真がメインビジュアルになりますが、どんな風にバナーに乗せるかを考えます。
私は商品のブランド力、高級感を打ち出そうと思ったため、ここで使用する背景をいくつか候補をだしました。
4）適切なレイアウトを選ぶ
文字やテキストのバランスを見ながら、商品やバナーのイメージに一番ぴったりなものを選びます。
5）手書きでラフを描いてみる
私のような初心者さんは、まずは手書きで完成イメージのラフを描くことをおすすめします！
画面上でレイアウトをし出すと、迷宮にはまってしまうことが多いです。
これはバナー以外のデザインにも共通で言えることで、一度手描きのラフを描くことで後のデザイン作業がスムーズにいきますよ。
6）モノクロで組む
文字の色などを決めてレイアウトしてしまうと、デザインの方向性がブレたり、色に悩まされてデザインが進まない、ということになるので、一旦モノクロで作ってみるのがいいそうです。
確かに色やレイアウトなどを一気に考えるよりも、ひとつずつ考えていく方がそれぞれのベストを見つけやすそうですよね。
ナルホドです。
組んでみて、キャッチが長くて入らなかった部分などの文言の微修正も行いました。
7）フォントの可読性を高める
モノクロで組めたら、フォントを決めましょう。
その後、強調したい部分だけ大きくしたり、アクセントをつけていきます。
8）カラーにする
たくさんカラーを使うとまとまりづらくなるので、写真のカラーから抜き出すと全体の印象がまとまりやすくなりオススメです。
今回は蜂蜜という商品イメージと高級感を出したい狙いから、イエローやゴールド系を使うことにしました。
9）遊びごころを加える
バナーの中でデザインをプラスできそうな文字や、遊べそうなところで動きをつけます。
今回はマヌカハニーの効能の部分をリボンの上にあしらって、少しカーブをつけました。
ただ要素を並べるよりも 目を引くようになり動きが出たのではないでしょうか。
10）全体を整える
最後に文字のカーニングや、画像の配置を修正します。
たとえばカタカナは字間が広くてスカスカに見えたり、漢字は詰まりすぎて読みづらくなっていないか、など一文字一文字の間を細かくチェックしましょう。
いかがでしょうか。
バナー苦手な私も、流れにそってやってみると、なんとなくコツがつかめたように感じます！
あとは数を沢山つくっていけば、もっとスピードアップできる気がします。
バナーに苦手意識のある初心者さん、ぜひこの方法を試してみてくださいね。
ではまた次回のブログで。
ｂｙ ツボ