A/B TEST #020 住宅・不動産 #レイアウト#色

住宅会社のバナー事例|3日で判定。斜め文字よりすっきりタイトルが優勢

A/Bテストは、数週間かけて結果を見るものだけではありません。広告の運用では、配信を始めて数日で反応の悪いバナーを止め、予算をよい方に集めることもよくあります。

今回は、地方の住宅会社が開いた夏のキャンペーンイベントの広告で、すっきりしたタイトルのバナーと、花火の飾りと斜めの帯文字でお祭り風にしたバナーを比べました。配信3日目の時点で、すっきりしたバナーの表示回数がお祭り風の約1.5倍になり、お祭り風のバナーはその日に配信を止めています。3日間という短い期間での判断であることを前提に、お読みください。

テストの概要

業種住宅会社(展示場での夏のキャンペーンイベント)
目的来場予約を増やす(予約の数を最大化する設定)
配信媒体Meta広告(Instagram・Facebook)
期間約1か月の予定。Bは配信開始から3日目で停止(短期の判断)
ターゲット20代半ば〜40代で、住宅の購入に関心がある人
比べたものタイトルまわりの見せ方(すっきり/お祭り風)と、背景・写真の見せ方

決まった地域に住む人だけを対象にした、期間限定のキャンペーンです。展示場に来場予約をして来てくれた人に、来場特典を用意していました。バナーはどちらも縦長のサイズです。

AとBで変えたところ

AパターンとBパターンのレイアウト比較。どちらも縦長。Aは薄いグレーの背景に、濃いグレーのイベント名をまっすぐ置き、外観写真を切り抜いて下に置いている。Bは空と花火のイラストを背景に、グラデーションの帯に白文字のイベント名を斜めに置き、外観写真を周りの景色ごと使っている
実際のバナーをもとに、レイアウトと要素の大きさだけを再現した図です

Aパターン(すっきり)は、植物の影が落ちた薄いグレーの背景に、濃いグレーのイベント名をまっすぐ置いたバナーです。対象地域を示す吹き出しを上に添え、飾りは手書き風の英字を小さく重ねる程度にしました。外観写真は切り抜いて、周りの景色を消しています。

Bパターン(お祭り風)は、空と花火のイラストを背景にして、夏祭りのようなにぎやかさを出したバナーです。イベント名は青のグラデーションの帯に白文字で入れ、全体を斜めに傾けました。外観写真は、周りの景色ごと使っています。

入っている文字の内容(イベント名・開催期間・特典など)はほぼ同じです。タイトルまわりのほか、背景や写真の見せ方、下の帯の色も同時に変わっています。

結果:3日目の時点で、表示回数は約1.5倍

結果のグラフ。配信3日目の時点の表示回数は、Bを1としたときAが約1.5。クリック率はAが0.57%、Bが0.54%
バナー3日目時点の表示回数(Bを1とした比)クリック率(CTR)来場予約
A すっきり約1.50.57%なし
B お祭り風10.54%なし

配信3日目の時点で、AはBの約1.5倍表示されていました。大差とまでは言えませんが、広告の運用担当は「初速の悪い方を止める」という判断で、Bをその日に止めました。理由を確認すると、「成果のよいバナーに予算を集めるため。ほかのバナーと比べて、クリック率やクリック1回あたりの費用が少し劣っていた」とのことでした。

クリック率(CTR)は、広告が表示された人のうち、クリックした人の割合です。Aは0.57%、Bは0.54%で、ほとんど差はありません。なお、Aは集計時点まで配信を続けた数字、Bは3日間だけの数字です。来場予約は、集計時点ではどちらにもついていませんでした。

すっきりしたタイトルが優勢だった理由

斜めの帯文字は、一瞬では読みにくい

Bは、グラデーションの帯に白い文字を入れ、さらに斜めに傾けていました。にぎやかさは出ますが、スマホのタイムラインで流し見されると、傾いた文字は読み取りにくくなります。Aは濃い文字をまっすぐ置いただけなので、イベント名がすっと目に入ります。見やすさの差が、最初の反応の差になったと考えられます。

青が多すぎて、冷たい印象になった

Bは、空・花火・帯・文字と、ほとんどが青系でした。夏らしさを狙った配色ですが、青を重ねすぎると、明るさよりも冷たさが勝ってしまいます。白とグレーを基調にしたAの方が、かえって爽やかに見えたと考えられます。

3日で止める判断をどう見るか

今回の勝ち負けは、3日間の表示回数の差で決まりました。Meta広告は、配信を始めてすぐの反応がよい広告に表示を多く割り当てるので、最初の数日で差がつくことは珍しくありません。予算に限りがある中で、早めに負けた方を止めるのは合理的な判断です。

一方で、3日間は短く、クリック率の差もわずかでした。「お祭り風のデザインはだめ」とまでは言い切れません。BのにぎやかさはAにない魅力でもあるため、見やすさを保ちながらにぎやかさを足す方向で、作り直す余地があると考えています。

参考:同じデザインでも、縦長とスクエアで差がつくことも

今回のテストとは別に、同じ広告の中で、同じデザインの縦長とスクエア(正方形)のバナーを並べて配信したところ、縦長の方がスクエアの10倍以上表示された例がありました。ほかのデザインでも、形によって表示回数に大きな差が出ることがありました。

縦長はスマホの画面で大きく表示されるため有利、という見方がある一方で、縦長は使う広告が多い分、あえてスクエアにした方が効率よく表示されることもある、という見方もあります。どちらが有利かは場合によって変わると考えられるため、余裕があれば両方の形を用意して比べるのがおすすめです。

次に試したい改善案

  • 動きをつけるのは一部だけにする:にぎやかさは残しつつ、斜めにするのはサブコピーなど一部にとどめ、イベント名はまっすぐ読みやすく置きます
  • 色の数を整理する:タイトルまわりがすべて青系にならないよう、飾りを減らした分、イベント名の色を変えて目立たせます

他の業種でも使えるポイント

  • いちばん大事な文字は、まっすぐ置く:お店の名前やキャンペーン名など、必ず読んでほしい文字は、傾けたり帯の上で白抜きにしたりせず、まっすぐ濃い色で置きます
  • 季節感を出すときも、色を重ねすぎない:夏なら青、冬なら白など、季節の色を使うときは、背景・飾り・文字のすべてを同じ色にしないようにします
  • 短期で止めたテストは、もう一度試す価値がある:数日で止めたバナーは、デザインそのものの評価ではなく「初速の差」で負けたことがあります。改善してから、もう一度比べてみます

まとめ

夏のキャンペーンイベントの広告では、すっきりしたタイトルのバナーが、花火と斜めの帯文字でお祭り風にしたバナーより、配信3日目の時点で約1.5倍表示され、お祭り風のバナーはその日に止めました。3日間という短い期間での判断ですが、「ひと目で読めるかどうか」が、配信の初速を左右したと考えられます。

アドデザインラボでは、こうしたA/Bテストを毎週続けています。「にぎやかさと読みやすさのバランスに迷っている」「キャンペーンの来場予約を増やしたい」という方は、お気軽にご相談ください。

CONSULTATION

今の素材で、どこまで
改善できるか知りたい方へ

配信中のバナーをもとに、変えると良さそうなところを無料でお伝えします。

WRITER アドデザインラボ編集部 アドデザインラボ編集部 毎月200件以上のバナー広告を制作する、ワンクルーズのデザインチームが運営しています。 住宅・フィットネス・クリニックなど、さまざまな業種で毎週A/Bテストを行い、「何を変えたら、どれだけ変わったか」を現場のデータとともにお届けします。