バナー作成に挑戦 – フルカワ＆トモシゲの二人三脚ブログ

こんにちは、トモシゲです。(８日目)
本日はウェブパーツの作成ではありません。

ふたっぱの方よりバナー制作のお話しを頂きました。
作るのは「美容鍼(びようしん)」と呼ばれる鍼(はり)を顔にさして
小顔やリフトアップ、リラックス効果を得る施術を行う医院のバナーです。

つまり女性向けのバナーと言う訳で私が不得意とするジャンルです。
また、バナーはこれまで作成した事が無いので不安が大きいです。

ふたっぱの方からアドバイスを頂き、女性がどんな気持ちで美容鍼を利用するのか、
利用者の立場になって考えると答えが見えてくるとの事でした。

なるほど、確かに。
利用者の気持ちとバナーの内容が一致しないと興味を持ってクリックしてくれませんね。
利用者がどういった心境や状況で鍼の必要を感じるか考えます。

と同時にネットでもバナー作りのヒントを探します。

見つけたバナー作りの手順を確認します。

バナー作りの手順

1.要素を全部書き出す
2.優先順位を決める
3.メインビジュアルを決める
4.レイアウトを決める
5.手書きでラフを書く
6.モノクロで組む
7.フォントを考える
8.カラーにする
9.遊び心を足す
10.整える

順番にやっていきましょう。

バナーに入れたい要素

・マイナス10歳
・低リスク
・高効果
・医院名
・コピー

こちらの医院のウェブサイトに「マイナス10歳」を目指すとの文言がありインパクトがあるので
この言葉は使えると思いました。
「マイナス10歳を叶える」をメインコピーで進めます。
コピーが最初にあり、高い効果で低リスクであることが伝わる様につくります。

メインとなる画像を決めます。
素材サイトの「Photo AC」で画像を探します。
良い感じの画像がありましたのでこちらで作成します。

写真と文字情報のバランスを見てどの様にレイアウトするのかを決めます。
顔中に鍼がささっている写真なのでインパクトはありますが、人によっては引いてしまうかもしれません。
それでは困るので、顔半分だけ見える様にして衝撃を減らしましょう。右半分に写真を配置して、空いたスペースに文字情報を載せます。

紙にざっくりラフを描きます。こちらは割愛致します。

取り敢えず画像と要素をカンバスに乗せてみました。この時に色が無い状態で組むと良いそうです。まずは色を排除してレイアウトだけを決めてしまいます。

次に文字がこれで良いのかを考えます。メインコピーが小さいのでもっと目立つ様に大きくします。

画像や文字の色を戻します。

少し遊び心を入れてバナーに動きを出します。これが難しいですね。

高い、低いのあしらいが物足らないと感じましたので、矢印にしました。

うーん。こういう事なのでしょうか。

文字の字間、画像の位置など細かい調整を行います。実際のバナーは小さいものが多いので、大きい画面で作っていると感覚がずれます。
実際の大きさに近い大きさに表示させて見てみましょう。

とりあえずは完成しました。
物足りない感じがしますね、しかし何をすれば良いのかイマイチ良く分かりません。
明日ふたっぱの方に見て頂きアドバイスを頂きたいと思います。
自宅でもっとバナーを見ておきたいと思います。

それではまた明日！