タップやホバーで動く広告?Google Web Designerで作るインタラクティブバナーの制作事例とメリット

Google Web Designer(GWD)とは?

Googleが提供する、広告制作を主とした制作ツールです。
単なる静止画・動画ではなく、プログラムで動くバナーが作れるので、インタラクティブでリッチな広告を作ることができます。

公式サイト:Google Web Designer

Google Web Designerでできること

GoogleWebDesignerの最大の特徴は、プログラムを組み込める点です。

  • 1つのバナーに、複数の遷移先を設定可能
    • タップ範囲に応じて、別々のURLを組み込むことができる
  • ユーザーの操作をトリガーにしたアクションを設定できる
    • スワイプで画像が切り替わる
    • マウスホバーで、クリエイティブが変化する
    • など、クリエイティブに動きをつけることが可能です。
  • iframeを配置できる
    • バナー内にフォームや地図などをを埋め込むこともできます。

Webサイトでできることは、おおむねGoogle Web Designerでも実現可能です。

小さなホームページを作成できるイメージですね。

制作事例

Google Web Designerで作成したサンプルバナーを紹介します。

タブを切り替えて情報を表示する

タブにすることで、ユーザーに適した情報のみを表示することができます。
限られた広告枠の中で、初級コース・中級コース両方の情報を提供できるバナーが実現できました。

タップ範囲ごとに、遷移先URLを変える

1つのバナーに複数の商品が並んでいる場合、それぞれをタップすると
その商品のページに直接遷移させることができるバナーなどが作成できます。

ホバーやクリックでクリエイティブが動く

PCでは、マウスを乗せると商品の色が変わる、拡大するなどの動きを実現できます。
ユーザーの目に留まりやすくなりました。

期待できる効果

情報量の最大化

先程ご紹介したように、静止画1枚以上にさまざまな情報を伝えることができます。
ユーザーの行動に合わせて変化させることで、そのユーザーに適した情報のみを伝えられることもメリット。
限られた広告枠を、最大限に有効活用できます。

LPでの獲得効率向上

バナー内で既に興味を醸成できているため、バナー遷移後のユーザーの質(購買意欲)が高くなると考えています。
また、自ら操作して得た情報は記憶に残りやすく「自分に関係のあること」として認識されやすくなる可能性があります。

GWDを活用した制作・案件のご相談

株式会社レクトでは、Google Web Designerを活用したバナー制作を承っております。

デザインから実装まで一括依頼はもちろん、「GWDの実装だけ任せたい」といったご依頼も可能です。
コードの知識が必要な複雑な処理を実装いたします。

  • 商品カタログのようにスライドするバナー
  • ユーザーの選択肢に合わせて内容が変わるシミュレーション型バナー
  • 静止画バナーへのインタラクティブ要素の追加 など

ユーザーが触れるインタラクティブなバナーで、獲得効率を上げませんか?
ご興味を持った方は、ぜひ株式会社レクトにお問い合わせください。

投稿者について

Yokoyama Nana

名古屋学芸大学 メディア造形学部 デザイン学科を卒業後、名古屋のIT企業にて6年間、Webデザイナーとして勤務。現在もWebデザイン業務に従事しています。機能的なデザインを作ること・デザインとコードをつなぐことが得意です!

この投稿者の記事を読む