ダサいバナーが変身するまで
pupuです。
前回書いたnoteにも書かせていただいたのですが、
WebデザインとWeb制作を両方できるデザイナーを目指すため、
１月末からメンターさんにお願いして課題を出していただいています。
今回は、バナー課題について書かせていただきます。
お題
バナーの目的・依頼背景
地方の住宅工務店からの依頼。モデルハウスをオープンしたので、ターゲット層の認知向上のため広告を発信したい。その際のバナー制作をお願いしたい。
ターゲット
20代後半〜30代後半の夫婦
注文住宅の購入を検討している人
自然素材の家をつくりたい、木の家に憧れがある、自然と共存して暮らしたい人
希望デザインイメージ
・ナチュラルで落ち着いた感じ
・「和モダン」ハウスなので、和っぽい雰囲気も感じさせたい
・先進的なクールな家というよりは、少し女性的で自然な感じをイメージさせたい
・ポップや可愛いテイストはNG
必須キャッチコピー（提案可）
・モデルハウスオープン
・自然と暮らす木の家
・見学お申し込み受付中！
・9/29（土）、30（日）、10/6（土）、7（日）
・ 茨城県つくば市
1回目提出
振り返ってみると、何でこんなバナーになったのだ？
と思ってしまうので、自分が思ったことを書いておこうと思います。
和っぽい雰囲気というところから、和風のデザインが良いと思い、和風イラストのあしらいを使いました。
文字のメリハリと配置は参考にしたバナーを元に配置。
ボタンの色や背景色は、写真となじむように同じテイストの色を選びました。
住所と電話番号も追加しました。
メンターさんからのレビュー
①右上のタイトル
あしらいがいまいちで今回とバナーイメージと合わない
あしらいとテキストのバランスが合っていない
ユーザーの目にとめてもらえるように引き付けられるようにする
②日付
背景色に対して白字が弱い→黒字へ
可読性をあげる
③住所のところ
バナーはできるだけシンプルで必要最低限の情報でOK
基本バナー文字はユーザーは見ないと思ってOK
瞬間に目が入ったテキストだけを読んで、クリックか瞬間的に考えていると言われている
小さい文字を入れても情報を無駄に与えてしまい、逆にストレスを与える
住所はなしで「茨城県つくば市」のみでOK
なるほど～と思うばかりで、理解してないところが多々ありすぎて、、、
作っていて、何が良いのか訳が分からなくたっていたのは事実！
デザイン難しい。。。と1回目に心折れる。
2回目修正
メンターさんからのレビュー
旗などのあしらいが可愛い雰囲気を作ってしまっている
全体的にデザイントーンがバラバラになってしまっている印象
・旗などのあしらいで可愛らしいもありつつ、
・写真の上の黒がカッコ良さをだしていて
・明朝体が上品さを
・写真や全体の色の雰囲気がナチュラル感というテイストがバラバラになってしまっている
１）まずは、デザイントーンを決める
デザイン希望があるので、そこからもずれないテイストですね！
２）デザイントーンを決めたら、そのトーンに合う参考バナーを3〜5つほど探してみてください！
その3〜5つで、
・レイアウト（写真の位置とテキスト配置位置）
・色
・フォントの使い方（サイズやフォントの種類）をみて、真似できる要素がないか調べてとりいれる
例えば、
1つ目の参考バナーからレイアウト（写真の位置とテキストの配置位置）を盗む
２つ目の参考バナーからフォントのサイズや種類を盗む
３つ目の参考バナーから色を盗むというイメージですね！大切なのは、デザイントーンが同じ参考バナーにすること！
カジュアルならカジュアルなデザインを、高級な感じなら高級なイメージを
とレビューいただいたので、バナーをたくさん見て探しました。
同じようなイメージを探すのが大切だと感じました。
かなり悩むということは下調べが足りないことだと理解しました。
バナーのサイトをたくさん探して、以下のテイストに似たものを探しました。
なかなか思ったものを見つけられなくて、いろいろなサイトを探し出して、自分が思ったものと近いものに出会えたので、見ながら配置して作成しました。
3回目修正
住宅関係の参考になるバナーを探し、シンプルなもので和っぽいもの選びをしました。
日付のところも色を使ったりガチャガチャした雰囲気になったので、英字に変更しました。
スッキリ見えて、シンプルを意識して作成しました。
メンターさんからのレビュー
①自然と暮らす木の家
囲みを入れることで、その文章が目立つが、目立つが、その割に中途半端な一で、目立たせたいのか控えめで良いのか家が分かりにくい
②「モデルハウス」という言葉をもっと目立たせる
優しめのトーンを崩さないように、テキストサイズの調整、プラスちょっと太文字にしてしまう程度がいい。
テキストの上下の余白を均等に入れる→整列感も生まれて綺麗な仕上がりになる
③色を椅子あたりの青グレーからもってくるなど、もっとデザインの全体の雰囲気が統一されてくる
ボタンの色で悩んでいたので、ランプの色の紺色をチョイスしましたが、椅子の色の方が良いとのことでしたので変更しました。
4回目修正
メンターさんからのレビュー
①見学申し込み受付中が遠い位置にあるのでもう少し近づける
②「自然と暮らす木の家」の可読性をあげる
5回目修正で合格
やっとOKもらえました～途中心折れかけていましたが、何とか最後まで完成。
レビューしてもらうのは、パワーがいりますね！
今回、バナー課題をやってみて、誰かに見てもらうことはほんとに大切だと感じました。
修正を繰り返すのはとても大変でしたが、完成したときに達成感がありました。
次回も頑張っていきます。
読んでくださりありがとうございました。
この記事が気に入ったらサポートをしてみませんか？