無料添削デザインスクール #05「クーポン券」

Twitterから投稿された作品を添削しています。
添削を希望される方はTwitterにハッシュタグ「#デザイン添削希望」または動画で添削をする「#動画でデザイン添削希望」を付けて投稿してください。

添削

詳細は分かりませんが、この画像を表示するとコーヒーか何かがサイズアップできるというクーポン券ですね。

■ 情報整理と優先順位

パッと見た時に何のバナーなのか、さっぱり分かりませんでした。
スマホっぽいのもあるのでアプリなのか…コーヒーなのか…

とにかく何のバナーなのか、何を伝えたいのかが分からなかったので、まずテキストだけにして優先順位を決めてみました。
1.無料サイズアップ
2.期間や限定
3.その他
この優先順位で伝えれば分かりやすいと思います。

ただこれだけだと何の「サイズアップ」なのか、商品は何なのかが分からないので、商品情報などは追加する必要があります。
「TOREBA」というのが商品、企業のロゴかと思われますが、これが「スターバックス」などの超有名企業だったら分かりやすく入れればあえて「スターバックスはコーヒー屋さんです」と言う必要はありません。

■ 文字とイラストの関係

優先順位を現状のバナーに当てはめると、要素が上の方にまとまってはいるのですが、バラけているのが分かります。
そして、全体のイラストと文字の比率を見ると、ほとんどがイラスト要素、優先順位の低いものが占めているのが分かります。

この中で一番伝えたい「これを見せると無料でコーヒーがサイズアップできるよ」をもっと大きくすることで、パッと見ただけでとりあえず何ができるのかが分かります。

お得な情報なので、まずは興味を持ってもらい、その後に期間が限定されていて、LINEのお友達に登録している人だけですよ～と伝える。
すでにLINEの友達に登録している人に出すのか、全然違う人に出すのかでこの情報を出すかどうかは違ってきます。

■ 仮構成

情報量が多いので文字がいっぱいになってしまいますが、優先順位を決めてあげるとこんな構成ではないでしょうか？

文字要素は減らせるところは減らすこともできます。
LINEのところなどをロゴにしてみたり、期限の回支部を削って「1/31まで」にしてみたり、細かいところはデザインをしながら変えていきます。

バナーサイズが分かりませんが、もっと大きい場合は下の注意文などは小さくしてしまってもいいかと思います。

背景はコーヒーかスマホか、どちらかを入れるか、現状のように両方入れてもいいです。
文字の領域が多いので、背景をガチャガチャさせると文字が読みにくくなるのでバランス調整が難しいですね。

バナーを作る時は、文言を全部読んでバラバラにして優先順位の順番で並べて大きさを決めてあげれば大体の構成は決まってきます。
この作業にデザインセンスはいらないので、作業なのでパパっとやってしまいましょう。

たまにデザインがそれでもしっくりこない時は、また最初の作業に戻って、優先順位を決めたり、必要ないものを消したりします。
勝手に消すとたまにディレクターに怒られるので、軽くデザイン入れた構成くらいの時にディレクターなどに確認取ると間違いないです。