バナークリエイティブの構成が上手いと人ヘタな人の違い。レクタングル編




バナーデザインにも構成案があり、パワポでしっかり書き込んだものや落書き程度のもの、どこかのバナーをパクッたものまで依頼者によって内容は様々です。
共通している事は、ランディングページ(LP)デザインと同じように商品やイメージ画像、訴求内容、キャチコピー、価格といった情報を大きさが違うレクタングルやワイドバナーなどリサイズを考えながら構成するという事でしょうか。

なぜリサイズを考えていくかというと、以前はYDNやGDNのリサイズ構成を覚えてバナーデザインをしていけばよかったのですが、統一感の無いメディア向けバナーサイズの登場やインフィード広告の登場により、もう記憶できないくらいのバナーサイズが存在しているからです。

先の先を考えた構成でクリエイティブを作っていかないと、勝ちクリエイティブの横展開が遅れる事に繋がってしまいます。

【関連記事】
デザイナーとしてひと味違うランディングページ(LP)構成案の制作方法

なので、定番バナーサイズの構成をひとつずつ身につけていくことでリサイズにも強いバナー構成が見つかるかと思います。

バナー構成の調査方法について

今回参考にするアーカイブサイトはここです。
バナーアーカイブ
アーカイブサイトから以下の工程を進めて構成を分析します。

  • 同じサイズで同じ構成のバナーデザインの分類をする
  • 分類したバナーを全て重ねて要素の固まりを見つける
  • 要素の固まりからどのような構成かを分析する

300×250で同じ構成のバナーデザインを分類する

アーカイブサイトで同じサイズ、同じ構成のバナーデザインを集めます。
分類する事で複数の構成が存在している事を確認していきます。

同じ構成をまとめる

実際に集めたバナーを重ねて、透過処理から構成を見える化してみました。

右側にメイン画像を配置するデザイン構成

サンプル数が一番多いオーソドックスな構成です。縦半分で画像とキャッチを配置して上下に細かい情報をバランスよく配置していきます。
下段帯状は白文字に強い背景色を付けているパターンが多いからかと推測できます。

左側にメイン画像を配置するデザイン構成

画像とキャッチを反対に配置した構成ですが縦分割の位置が若干右寄りなのが分かります。
キャッチコピーや詰め込みたい情報が多い構成ということが考えられます。

中央にメイン画像を配置するデザイン構成

画像素材を中央に配置することで縦文字を活用するパターンがあります。
縦読みかっこいいですね。

さいごに

300 x 250サイズをまとめてみました。このサイズはPCだけでなくスマホでも配信するサイズなので依頼が多いと思います。
基本的にはスマホ対応の600 x 500で作っておき50%にしてPC版を作ればよいと思います。

【関連記事】
デザイナーとしてひと味違うランディングページ(LP)構成案の制作方法

この記事はここまで!
ここからはよく読まれる記事をまとめてご紹介します。ひとあじ違うデザインに出会えるかもしれません。

【化粧品・コスメ】乾燥肌訴求のランディングページ(LP)デザイン5選

2018.09.23

【年齢訴求別・5選】健康食品(ダイエット)のランディングページ(LP)ファーストビューとCVエリアデザイン

2018.06.17

前編【Webデザイナーを目指す人へ!】何故バナートレースがデザインスキル上達に最適なのか?

2018.10.21

【第3回】未経験でも大丈夫!Webデザイナー志望の方へデザインノウハウをアウトプットします!

2018.10.30

動画ランディングページ(LP)効果改善への道は映像業界を理解する事からはじまる

2018.01.14

ランディングページ(LP)にエディトリアルデザインを取り入れる。マーカー編

2018.05.04

【年齢層別・乾燥肌】化粧品・コスメのランディングページ(LP)デザイン5選

2018.09.29

【5選】ダイエット訴求のランディングページ(LP)を調査してデザインを研究してみた

2018.10.07

【第2回】未経験でも大丈夫!Webデザイナー志望の方へデザインノウハウをアウトプットします!

2018.10.23

前編【グラデーション効果】photoshopのツボとコツ!未経験でもワンランク上のWebデザイナーになろう!

2018.11.03


お気に入りの情報
が無かったでしょうか?
この記事の最後にデザイン情報やノウハウをレコメンド形式でご紹介しています。

お求めの記事に出会えますように。



スポンサード広告 by google