企画バナーのBeforeAfter#スキルアップウィーク #2

前回に引き続き、KAORIさんが企画してくださった"SKILL UP WEEK"に今回も参加し、私が制作したバナーのBeforeAfterをまとめました！

▶︎私が参加したお題

ケーキセットの案内バナー​

▶︎お題の依頼内容

・文言は下記3点のみ入れること(どこで文言を切るかはお任せ)
ー お得に美味しく、ケーキセット 14:00~
ー 選べるドリンク +250円
ー NEW ストロベリータルト
・ナチュラルな雰囲気のおしゃれなカフェ、秋のほっこり感もあるとGOOD
・使用フォントはお任せ
・サイズは横1000×縦600(カフェサイトのカルーセル用)
・ターゲットは20~30代
・写真は指定のものを使用

Before

私が最初に提出したバナーはこちらです。

◎工夫した点
・写真とテキスト部分を縦割りではなく斜め割りにしたところ
　→斜め割りにすることで写真を大きく見せられるようにした
・「NEW ストロベリータルト」のアイキャッチ部分の
　背景色は写真のケーキから抽出した
・「Cake Set」部分を白抜き文字にした
　→視認性高いデザインに
・ナチュラルな雰囲気のおしゃれなカフェを表現するために、
　フォントをなるべく揃えてごちゃごちゃしないように
　＆白抜き文字でおしゃれ感を
・秋のほっこり感を表現するために、配色と丸みのあるフォントで表現

◎使用フォント
Cake Set部分だけ：Avenir Next Condensed
他テキスト部分：筑紫A丸ゴシック
◎使用カラー
テキスト部分の背景：#dcb090
NEW ストロベリータルトの背景#d6305e

「Cake Set」部分を白抜き文字は、KAORIさんの投稿を参考に作りました！

【Photoshopで白抜き文字を作る】
👉🏻不透明度100% × 塗り0% × 境界線
👉🏻下に色のついたテキストを下に敷けば立体感が出ます🎉この文字にドットやストライプなどフィルターかけてもかわいい◎#シーライクス pic.twitter.com/ZPUN7Q0Fdg

— KAORI🕊フリーwebデザイナー (@cam_0922) June 17, 2019

最初に提出したバナーをKAORIさんに見ていただいたところ、工夫した点を褒めていただき、前回よりクオリティーが上がっている、と言っていただけました😭めちゃくちゃ嬉しい......✨！！

▶︎今回いただいたアドバイス

・「選べるドリンク〜」の部分のドロップシャドウは左上から光が当たって右下に影ができるようにした方が良い
・ケーキの写真が少し右に寄っているのでもう少し小さくしたりしてバランスをとろう
・「お得に美味しく」は「ケーキセット」のコピーなので、間に時間は入れない方が良い、14:00の入れる位置を考えた方がいい

After

アドバイスをもとに修正をして、最終的に完成したバナーはこちらです！

◎修正箇所
・「選べるドリンク〜」の部分のドロップシャドウ
→斜め割りのラインに合わせて、左上から右下に影ができるように修正
・ケーキの写真
→ケーキが真ん中にくるように、調整
・14:00の入れる位置
→ケーキセットが始まる時間を示しているので、「選べるドリンク〜」の上に配置＆主張しすぎないようフォントサイズを少し小さく調節

企画に参加した感想と今後私が取り組むこと

バナーを作り終えての感想は「バナートレースも楽しいけど、やっぱり1からバナー作るのすごく楽しい！！」です。

前回の企画を参加し終えてから、バナートレースを始めたのですが、そこでトレースしたバナーが、今回のバナーを考えるのにかなり役立ったと感じています。斜め割りをするとどういう効果につながるか、というのも、バナートレースから学んだものです。少しずつでもバナートレースで知識を積み上げることで、今までできなかったことを習得して、実践にまで繋げられることの楽しさを学べたのが今回の企画です。

もっとデザインの引き出しを増やして、色々なものを作っていけるように、
これからも引き続き、バナートレース頑張ります！！

少しずつですが、バナートレースしたものをInstagramにまとめています。
見ていただけると嬉しいです😊

saki (@design_saki) 窶「 Instagram photos and videos