![見出し画像](https://assets.st-note.com/production/uploads/images/98009254/rectangle_large_type_2_0596da3bee94fa9a72585e73d46fe951.png?width=1200)
#バナーお題4に挑戦
だいぶ時間が空いてしまいましたが、
バナーお題に挑戦したので載せていきます!
今回も、こばやす(@kobayas_s)さんのお題です。
今回のお題は
「クリスマス商戦を狙いkoba payアプリ利用促進する」です。
バナー設置場所:コンビニ公式サイトのサイドメニュー
商品概要:今話題の決済アプリkoba payを売り出すバナー作成
バナーサイズ:H200×W350px
---------------------------------
キャッチコピー:下記の内容に合わせて考えてみて下さい。
アプリをダウンロードすると、kobaポイントを200Pプレゼント!
更に加盟店利用額に応じて最大10%還元
誘導:QRコードを付けてアプリストアへ移動
今回も手順と工夫点を載せていきます。
01 バナー+サイト検索
今回も過去にこのお題で作成した方のバナーや
こういうお得を売り出すバナーを検索していきました!
文字量が多い分、装飾は少ない(色、あしらい等)ものもあれば
逆にカラフルで文字も変形がかかっているものが多くあったり
それぞれでした。
よく見かけたのは、飛び出し文字やグラデーション文字、放射線状に広がる背景です。
今回はクリスマスというちょっとリッチな雰囲気も生かしていきたいと思ったので、飛び出し文字だけを参考にしようと思います。
また、与えられた情報の書かれた順で配置するのではなく
1番目立たせたいものをしっかり考え、
それを1番に目立たせるようにしていました。
少し前にも同じようなこと(与えられた情報をそのまま使うのではなく、より伝わりやすい形に変えてみる)を思ったのですが
思っていても実行するのは難しいですね。
あとは、コンビニサイト内のバナーということなので
どんなバナーがあるのか確認するために、某コンビニサイトも閲覧。
ページ数も多い分、全体的にシンプルでバナー部分だけ賑わっているものが多かった印象です。
02 手書きでラフ画作成
こちらもいつも通りに何となくこの辺りに文字を入れて
画像入れて…と書いていきます。
いつもラフ画通りにいかず、変更してしまうのですが
それだとラフ画の意味がないですよね。
いや、ラフ画だからきっちり決めなくてもいいのかな、何となくでいいんじゃないかな、とか色々思いながら作成。
プロの方々はどうなのか気になります。
03 文字、画像配置調整
文字をそれぞれ置いていき、変形をかけて飛び出し文字に変更していきます。
いつもイラレで作成していたのですが、
忘れないように飛び出し文字の作成方法残しておきます。
(これはネットで検索して、参考にしました。ほんとにこういうものの作り方を見出せる人尊敬です)
テキストツールで文字入力
コピーアンドペーストしたらサイズを小さくし、最初のテキストを全面に配置
オブジェクト→ブレンド→ブレンドオプションで「ステップ数を500」「パスに沿う」に設定
2つのテキストを選択して、ブレンド
これで飛び出し文字ができます。
他のやり方もあったのですが、これが1番やりやすかったです。
初めてできた時、感動しました。
新しい手法を覚えるとそれだけ乱用してしまいたくなるのですが、ここは抑えて必要な部分だけに使用しました。
そして作成できたものがこちらです。
![](https://assets.st-note.com/img/1676356530100-0aqLarfxYt.jpg)
工夫点は
・クリスマスに合わせてサンタクロースの赤白、雪のモチーフを使用
・お得な数字は飛び出し文字で目立つように
・装飾を少なくして、文字に集中してもらうように。
左上から見始めて、徐々に下に目線をずらしてもらえるように文字配置
下の「お得にクリスマス〜」が結構強い…
正直下の余白が広めに余ってしまって
持て余してしまったので「お得さ」を
キャッチコピーで全面に出した結果がこれです。
「お得」の文字が二箇所に出てて、うっとおしいですね。
しかも文字のカーニング下手です。
これを作成するのに結構時間かかりました。
ちょこちょこ作業してたので
全体でざっくり5時間はかかったのではないのでしょうか。
かかりすぎだわ!と自分でも思います。
ただ、今までとテイストも違うのでどうしたら良いのか…と悩み悩んでこんな感じになってしまいました。
しかもこのバナー、QRコード飛べない!!!!!
作成してる時は気づきませんでしたけど(イラレ拡大で作成していた)
いざ、ここに載せたら!スマホで全然読み込めません!涙
これは作り直し確定ですね。涙
一応記録で残しておきます。
以上です!
最後までご覧いただきありがとうございました。
この記事が気に入ったらサポートをしてみませんか?