見出し画像

無料添削デザインスクール #170「温泉旅館バナー」

イライジャ｜WEBデザイナー　デザイン添削おじさん

添削

毎度おなじみになってきた「こばやす」さんの温泉旅館バナー課題ですね。
シックなバナーですね。

■方向性

このバナーを何回か添削していて思ったのが、方向性決めるのが少し難しいので、そこでみんな戸惑っているように感じます。
「カップル限定」のカップルっぽさを入れると、老舗旅館の落ち着いた雰囲気が壊れてしまう。
でも「老舗旅館」らしさを出しすぎると大人っぽさだけになる。

でもカップルらしさを出して老舗温泉をラブリーにする必要はないので、シックな方向性でいいかと思います。
なので、方向性や配色としてはそこまでズレていないように感じます。

上半分のおうど色がちょっと気になります。
薄い金色っぽいグレーとかの方が落ち着いて見えそうです。

こんな色なのですが、調整が難しい色ですね。

■写真の入れ方

写真の左右に余白を入れていますが、バナーの場合は余白を入れる必要はあまりないです。
写真が小さくなるだけなのでインパクトが小さくなります。
余白を入れるとしたら、背景色は単色で写真が切り抜かれたように置いてあげるといいです。
今回はツートンカラーに分かれてしまっているので、これはこれで狙ったのか、思っていなかったものなのかの判断が難しいです。

写真を切り抜いたように置こうとしてもバナー自体が切り抜かれたように置かれることが多いので、余白はあまり考えなくても大丈夫です。

写真を横いっぱいにしてみました。
最初はツートンカラーだったのが、上下の帯になりました。

■要素の見せ方

バナーは一瞬しか見られないので、短時間で内容を伝える方法として、アイコンやシンボルなどを使います。
ちょっと短くバラバラにしすぎているように見えます。

・公式サイトからご予約限定キャンペーン
・WEB予約
↑これ同じこと言っているのでまとめられます。
バナークリックしたらそのまま公式サイトに行くと思うので、そこに説明もあるのでここまで細かくなくてもいいかな。
電話して予約する人ってどのくらいなんだろう…
パソコンなりスマホなりを見ている人がクリックするはずなので、そこまで親切に説明しなくてもいいかと思います。

・カップル限定
↑一番言いたいのはこれなので「カップル限定お得キャンペーン」とか分かりやすいタイトル名を入れてもいいかも。

・3大特典
↑目玉である3大特典を大きく入れていますが、その特典が下にあるので離れているので近くに入れるといいです。
3大特典が一番大きく入れてありますが、これはタイトルで重要なのは特典の方なので、なくてもいいかも…

カップル限定
3つのお得キャンペーン！

まとめるとこんな感じですよね。
これで下に３つ特典があれば分かりやすいかと思います。

■特典の見せ方

特典の要素は文字サイズが小さいのでほぼ読めないです。
情報をまとめてサイズ調整をしたいです。

左の10％OFFのところは情報が詰まりすぎていてほとんど見えなくなっています。
表示価格から10％OFFという時は、通常価格が入れば入れますが、割り引いた金額を入れないといくらなのかが分かりにくくなります。
目差すとして通常料金をどこかに入れて置くだけでもいいかもしれないです。

見る人がどう見るのか、文字要素をまとめて、デザイン入る前にどこにどう置くかを決めてからデザインに入るといいです。

修正

修正して頂いたのでこちらも添削していきます。

■ギリギリにしない

シンボル系のデザインの時やその他色々なものでも共通で言えるのが、ギリギリに配置しない。
ギリギリに置くとギューギューしている印象を与えるのと、心理的にハラハラさせます。
テーブルの端に置かれたコップのような感じです。

写真とかの余白だけでなく、モチーフなどの間隔も余白に入ります。
文字サイズなどを調整してバランス調整してあげると、少し小さくしても違和感はないです。

■密度

メインになるシンボルがもっとバランス調整して密度を上げるといいです。
ギュッとしているところに人は目が行きます。
シンボル系の時は特にシンボルだけでロゴのようにするといいです。

元のをシンプルにしました。

文字バランスを調整しました。

周りの線を細かくして密度を上げました。

円の上下に余白があるので文字を大きくして余白を消しました。
テイストは違いますが、お得系の元気寄りのデザインなのではみ出させたりしました。
明朝系の静かな和風よりだったらもっと家紋風にするといいかも。

段階を追って色々試していると偶然にいい方法が思い浮かぶ時があります。
「あまり目立たないなぁ」「余白が大きいなぁ」そんなことを思った時は色々とレイアウトを変えるチャンスです。
偶然でもいいのでいい見せ方が見つかる時があります。

お題

こちらのバナー課題は、こばやすさん（@kobayas_s）のバナーお題です。
良質なお題がたくさんあるので、お試しください。
自分で課題を考えると大変なので、実務に近いプロが考えたお題を作ると成長も早いです。
WEBデザイナーになりたい方は、トレースよりもお題をお勧めします。

デザイン添削のご依頼はTwitterから！

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


この記事が気に入ったらサポートをしてみませんか？