ブランドの名に恥じない超高級感！ Porsche Black Edition の特設サイトが目を疑う完成度で登場！
GPU をぶん回すスーパーリッチ WebGL 実装
今回ご紹介するのは、ポルシェのキャンペーンサイトです。
ポルシェと言えば高級車の代名詞のような存在ですが、そのキャンペーンサイトらしく GPU に対する遠慮の感じられない、すさまじい完成度に仕上げられています。
三人の優れたエンジニアが作り上げた、極上の WebGL 実装。これは一見の価値ありです。
GPU で肉が焼けそうだぜ！
先に書きますが、今回のデモは本当に演出にこだわっています。
あまり GPU にやさしい作りにはなっていません。オンボードの、CPU と GPU 統合型のチップでは少々荷が重い可能性が高いです。もし、グラフィックボードを搭載したデスクトップマシンをお持ちなら、それらを使って閲覧するのが最適です。
全然動かないということはないと思いますが、すごく重いので気を付けてください。
さて、サイトを訪れると、まずのっけから美しいパーティクルが溢れてくるような演出が目に飛び込んできます。それが冒頭のキャプチャ画像ですね。この時点で、とても気合が入っているということが伝わってきます。
サイトには三種類のデモが用意されており、スクロールした先のページから、各デモへのリンクがあります。別の URL にページ遷移することはなく、同じフレームのなかでデモがスタートする仕組みですね。
一つ目のデモは、新しいポルシェの黒光りするボディに、美しいライティング効果と流体パーティクルの映り込みを適用したデモです。
まるで実写かと見まごうばかりの美しい車体に、ゆらゆらと流れるパーティクルが投影される様子はとても美しいです。
画像ではちょっとわかりにくかもしれませんが、ボンネットなどの部分に舞い上がる砂のような、パーティクルの模様が出ているのが見て取れます。
このデモはまだ、それほど重くはないですね。ライティングが非常に美しく、艶やかなポルシェの表面や美しい流線型のデザインを強調していると思います。
続いて登場するデモは、おそらく三種類あるデモのうちで最も負荷が大きいデモです。
そもそもロードにすごい時間が掛かります。
ロードが完了すると、画面中央に新しいポルシェのモデル。周囲には、なにやら砂のようなものが見える状態になります。ここでマウスボタンを押下すると、タコメータのようなものがカーソル部分に表示され、エンジン音が鳴ります。
マウスボタンを離すと、吹き上がったエンジンの音を表現するかのように、パーティクルが舞いあがります。
マウスボタンの押下時間の長さによって、吹き上げられるパーティクルの勢いが変化するようになっており、当然長押ししたほうが強く激しく巻き上がるパーティクルになります。
画面の右下のほうにある車体を上から眺めたようなシルエットのインターフェースはカメラの位置を表していて、様々な角度からパーティクルと車体を眺めることができるようになっています。
砂とも水しぶきとも言えないような、なんとも不思議な演出が加えられたデモに仕上がっていますね。
いわゆるシャドウマッピングなどを適用していることもあって、まあそりゃ重いよな……と思わず言いたくなる出来栄えです（笑）
最後、三つ目のデモは Google の API を使った非常に美しい景観が特徴のデモになっています。
こちらはストリートビューの情報をリアルタイムに拾ってきて、それを描画シーンに合成しています。もちろん、日本も含むあらゆる地域の画像を API で引っ張ってくることができるので、いろいろ試してみると面白いでしょう。
既定ではニューヨークが舞台です。
背景には、ネオンや LED ライトの光のような、粒上の光が瞬いています。
虫眼鏡のアイコンを使えば検索した結果から背景を取得できます。ほかにも、現在地の情報を使って背景に適用することもできます。
いずれのシーンに使われているモデルも、非常に精巧な 3D モデルです。
ディティールのみならず、ポルシェの持つ高級感も見事に再現できているように見えますね。
3DCG という大きな目線で見れば、それほど目新しい革新技術が使われていることではありませんが、あくまでもウェブで、しかもこれほどリッチな表現を惜しげもなく使っている、という点では非常に珍しいウェブサイトだと思います。
繰り返しますが、デモは全体的に重いので、オンボードのマシンで見るときはちょっとだけ気を付けてください。すぐに OS ごと死んだりはしないと思いますが、できる限り他のアプリケーションの負荷が少ない状態で見たほうがいいのかなと思います。
本当にすごい仕上がりなので、ちょっと無理してでも見てみる価値はあります。
ぜひ、チェックしてみてください。
リンク：
Object of desire. The new Porsche Black Edition models. ※キャンペーンサイト
Porsche Black Edition Engine Sound Particles ※二つ目のデモ実装者の解説ブログ記事
