はじめに

ウェブサイトやデジタルキャンペーンで3D表現を取り入れるのは、依然としてハードルが高く、莫大な費用がかかると思っていませんか？ 現在、ウェブ技術はかなり進化しており、ウェブでの3D表現も比較的利用されるシーンが増えてきました。 今回は、この3D表現に対して事例やデモを交え、現在のキャンペーンに組み込むことのメリットを紹介したいと思います。

WebGLとは？

WebGL (Web Graphics Library) は、

ブラウザ上で3Dや2Dのグラフィックスを表示するための技術です。

プラグイン不要で、主要なブラウザ（Chrome、Firefox、Safariなど）で動作します。

WebGLは、デバイスに搭載されているグラフィックス性能を最大限に活用するため、滑らかで高品質な3D表現が可能です。
非対応だったIEがサポート外になったことで全てのブラウザが動作対象になったこと、スマートフォンの性能向上により、改めて注目されています。

WebGLの技術を使えば、Webキャンペーンやプロジェクトで目を引くビジュアルを簡単に提供することができます。

WebGLを使ってできること

• Webサイト上にゲームコンテンツを設置 

　┗ユーザーの滞在時間を伸ばせる

• データや情報のビジュアル化

   ┗年代ごとの人口推移のアニメーションなど

• 商品の3Dモデルを設置

　┗リアルなショッピングに近いユーザー体験を提供可能

• ユーザーのカーソルに応じたアニメーション（インタラクティブ要素）

　┗ユーザーを視覚的に惹きつけられる

デモ（実際に体験できます）

※背景写真をアップロードし、３Dモデルを自由に動かし（今回は回転のみにしていますが、自由に場所も変更可能です）画像が生成できるデモです。

本当に怖くないの？Q&A

Q: 動作環境とか限定されないですか？

 A: WebGLは主要なブラウザ（PC/スマホ共に）に対応しています。最新(2015年以降くらい）のブラウザであれば、問題なく動作するため、幅広いユーザー層の端末でも問題なく表示することができます。

• Microsoft Internet Explorer 11.
• Firefox 4以上
• Google chrome 8以上
• Safari5.1以上
• iOS8以降のSafari.

Q: ３Dだから動作が重かったりサーバー負荷がすごいのでは？ 

A: WebGLはユーザーのブラウザ内で直接GPUやメモリを使用するため、高速でスムーズなグラフィックス体験を提供します。重いコンテンツでも動作が滑らかで、サーバー負荷も少ないのが魅力です。

Q: セキュリティ面でのリスクはないの？ 

A: 安全に利用できます。ユーザー側のブラウザで処理を行うため、サーバー側にリスクなく、通常のウェブサイト同様に使用することが可能です。

Q: 導入コストはどのくらいですか？ 

A: 導入コストは仕様に依存しますが、サーバー負荷が少ないため、クリエイティブが（３Dデータなど）揃っていれば、比較的安価に制作が可能です。

Q: 従来のキャンペーンと組み合わせできる？ 

A: 画像合成や診断コンテンツなど従来の様々なキャンペーンに3Dモデルを組み合わせて、導入いただけます。また、２D（グラフィック）に特別な加工を加えることも可能です。

Q: キャンペーンなどで中断するリスクはありますか？

 A: サーバーの負荷なども少なく、DB読み込み数やプラットフォーム側に依存する事も少ないため比較的安定したシステムの提供が可能です。（サーバーごとシステムダウンするような仕様を避けられます）

キャンペーンでの使用例

デジタルアクリルスタンドで擬似写真撮影キャンペーン

WEB上に自分の好きな写真をアップロード。

その写真の上に3Dモデリングされたアクリルスタンドを自分の好きな場所において写真撮影ができます。

アクスタの角度や大きさ、またライティングなどもユーザーが自由に変更できるため、

現実に近いような体験が可能です。撮影した写真をSNSでシェアする事で応募が完了。

3Dオリジナルパッケージ作成キャンペーン

自分の名前や、好きな画像などをアップロードし、自分のオリジナル商品パッケージをブラウザ上で作成することができるキャンペーン。

ユーザーは自分のオリジナルパッケージを作成し、SNS上でシェアすることで、商品を起点としたユーザー同士のコミュニケーションを産むことが可能です。

3D商品に隠された謎解きキャンペーン

例えば車のプロモーションの場合、新しく出る車の3Dモデルを用意し、各ギミックに謎解きをしかけて攻略ができたらSNSシェアボタンを出現といったキャンペーンが可能です。

３Dのモデルで実際に見ていただくことで商品認知を高めることが可能になります。

例：車のドアをフロント右/リア右/フロント左/バックドア/リア左で開くと謎解き完了など。

ゲーム化したキャンペーン

ミニゲームやインタラクティブなストーリーテリングを通じて、ブランドメッセージを楽しく伝えます。これにより、ユーザーエンゲージメントが向上します。

WebGlの活用事例　

Nikeのシューズカスタマイズキャンペーン

Nike By You シューズ

NikeはWebGLを使用して、ユーザーがオンラインでシューズをカスタマイズできるインタラクティブな体験を提供しました。側面はもちろん、靴紐や靴底、中敷など10箇所以上のパーツの色や質感を自由に選択してデザインすることができます。３Dモデルを自分で回転させ（動画）、画像を保存してSNSに投稿したり、他の人のデザインアイデアを参考にすることも可能です。

「シークレットライブ会場を探せ」キャンペーン

Red Bull Secret Gig

前代未聞のシークレットライブ開催に伴い、ライブ会場を探し当てることをテーマにした、全国を巻き込む参加型エンターテイメントを実施。街中に出現する巨大メガホンをヒントにクイズを解き、オンライン上で3Dメガホン（解説動画）を使って回答してキャンペーンに参加できます。

ステッカーが貼れるFunTech inc. のウェブサイト

Creativity Creativity is “ROMAN”

WebGLを活用して、ボールのようなオブジェクトにランダムに変わるステッカーを無限に貼り続けられるコンテンツです。サイトをスクロールすると画面上にフィルターがかかりステッカーを貼る感触が変わり、随所に個性的なクリエイティブが用意されています。

ボールを転がして遊べるGoogleMapCube

Play your World with CUBE

Google MapsをベースにしたWebGLを活用したインタラクティブゲームです。ユーザーは3Dキューブの上でボールを転がし、目的地まで運ぶタイムトライアル形式のゲームに挑戦できます。

まとめ

WebGLを利用した3D技術は、広告代理店の皆様が抱える多くの不安を解消しながら、革新的でインパクトのあるキャンペーンを実現する強力なツールです。専門的な知識がなくても簡単に導入でき、主要なブラウザで幅広くサポートされるため、多くのユーザーにリーチ可能です。パフォーマンスの高さやセキュリティ対策、費用対効果の面でも安心してご利用いただけます。

実際にNikeやVolvoなどの大手企業もWebGLを活用したキャンペーンで成功を収めており、その効果は証明済みです。インタラクティブな製品デモやバーチャルイベント、ゲーム化した広告など、多彩な活用方法があり、ユーザーエンゲージメントを飛躍的に向上させます。

弊社では、導入からメンテナンスまでトータルサポートを提供し、貴社のキャンペーンを成功へと導きます。3D技術を使った新しいキャンペーンの可能性を、ぜひ一緒に探求してみましょう。

今こそ、3D表現をつかったキャンペーンを始めてみませんか？

キャンペーン設計にお悩みでしたら弊社にご相談ください！

弊社でご用意している「Aha!（アハ）」では、ユーザーをファンにするWebキャンペーンを企画/制作をご支援させていただいております。キャンペーンコンテンツ企画の段階からのご支援が可能で、課題や目的に沿った最適な仕組みとコンテンツをご提案いたします。

今回ご紹介したARキャンペーンはもちろん、画像生成パッケージ、SNSで拡散もできるマストバイキャンペーン、ユーザー参加型投票キャンペーン、自然と拡散につながる診断/検定キャンペーン、ゲーム感覚で参加できるクイズ・謎解きキャンペーンなどご提案はさまざまです。またSNSとの連携をすることで、キャンペーンに付きものである「拡散性」の課題を解決いたします。

弊社は2006年の創業当初からデジタルキャンペーンに携わっており、日々研究を重ねた知見からもご支援することができます。

資料請求、問い合わせ先はこちらまで。