見出し画像

バナー制作マスターしよう＃１

cham_a

てことで、3月に関しての投稿からはや4月。
バナー制作と、友人のバンドのサイト制作に集中することにしました。

前置きはこのぐらいで、、、
ではさて、どうお題を見つけてバナー作ろうかと思ったら、
こんないいnoteを見つけてたので参加してみることに！
https://note.com/kobayas/m/m3e73ae9c2748
今までの自分は完璧な状態で人に見せなきゃ💦みたいなところがあったのですが、そんなんじゃいつまで経ってもなあなあで成長しないだろうし。
覚悟を決めてやろうと思った次第です。

では早速！

#バナーお題 第1弾 冬限定一口チョコ

（以下お題内容と考えたこと）

バナー設置場所：自社ECサイトのサイドメニュー

まずは自社ECサイトって具体的になんだろうというお話。
調べてみたところおそらくこんな感じ ↓

「北菓楼」さんの和洋菓子お取り寄せECサイト

どんな雰囲気のECサイトなのかとかの想定もした方が良さそう
テーマカラーとか

商品概要：冬限定一口チョコ。普段高いが今だけ割引価格で売っている

この時点でバナーに盛り込む必要のありそうな要素
- 冬感
- チョコレートの画像
- 高級感
- 「今だけ」の注記

ターゲット：20〜40代の働く男女

両性かつ20~40代とターゲット層が広い。。。
個性的になりすぎないようにしよう。
20代からだから「大人っぽく」でも大丈夫そう。
ペルソナを用意しよう。

イメージカラー：白、水色

「クライアントからカラーの指定された！」って感じ。
ECのテーマカラーを想定しよう、ってとこも絡めてみよう。

バナーサイズ：W300×H280px

さっきのECに埋め込み想定してみるとサイズ感はこんな感じ ↓
(ちょっと見づらい💦グレーっぽいボックスを上に被せてます)

フォントサイズを考えないといけない
本文のフォントサイズが16pxとあったので、16px以上は担保する必要がありそうです。

あとはテキスト情報

▶︎ キャッチコピー：ちょっと一息。贅沢をお裾分け
「一息」、「贅沢(一息の中で)」、「お裾分け」が気になるワード
▶︎ 割引期間：11月1日〜12月31日まで
▶︎ 割引価格：10～20％割引

そして完成物

サイトに表示した場合のイメージ（お邪魔します雑）

制作時間：4時間半(かかった〜。。。)

制作過程での構想↓
テーマ：
贅沢（エレガント）＋温かみ（「一息」）
ペルソナ：
30代 男性 有職者 
普段は仕事で忙しい 休日や帰宅後のコーヒーが好き
落ち着いた色合いが好きでインテリアにこだわり
（女性とスイーツの繋がりのイメージは元々強いため男性をペルソナに。)
テキスト：
「贅沢」≦ 「10~20%割引」の具合で強調を
フォントは基本、品を感じるものを。
日：遊明朝体
英：Baskerville
※キャッチコピーは温かみを出すために遊明朝体 横用を使用してみた
ビジュアル：
チョコレートは高級感を感じられるものを
（初めチョコを切り抜いてみたところチープな印象を受けたため器がある素材を探した）
雪　真っ白な雪はポップさが出る気がしたため透明感を
六角形は「一息」の「息」を意識してみた

正直全然まだまだ自信があるわけではなくてアプデ予定〜
割引の表記がもう少し改善させたい
文字量に違和感を感じないような配置など考える必要がありそう

唐突ですが、最近読んでいる本のご紹介📢

一冊目：『簡単だけど、すごく良くなる77のルール デザイン力の基本』

これはサイトデザイン、バナー、とかweb系デザインに限った話じゃなく、デザイン全般の「基本」がまとめられている本。
ノンデザイナーブックとも呼べるらしい。
テーマーカラー決めの章が本当に参考になるなと。
なんとなくで決めていた要素要素に、ちゃんとルールや意味を持たせられるようになりそう。7／10章まで読みました。集中したら１日２日で読める軽さ。

２冊目：『思わずクリックしたくなる バナーデザインのきほん』

これは４月バナー頑張ろうと思って買った本。
これから読む感じ笑
これ読みながら、バナー自己添削していく予定
また感想ご報告します〜

今日はとりあえずこのぐらいで！

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