フランスの旅行代理店サービス OUIGO が提供する WebGL 製のピンボールが超絶クオリティすぎてやばい
まるでゲームタイトルのような完成度
今回ご紹介するのは、ブラウザ上でピンボールを使って遊ぶことができるというミニゲームで、旅行代理店サービスを展開する企業のプロモーションサイトです。
旅行に関連したサービスを提供する企業のプロモーションサイトらしく、そこかしこに旅をイメージさせるキャラクターやオブジェクトが登場するのですが、なんといってもその完成度の高さに、思わず開いた口が塞がらなくなるのではないでしょうか。
キャプチャ画像で見ても、明らかにやばいクオリティとなっており、ピンボールのゲーム部分も、ちょっとしたミニゲームというような生易しい感じではなく、かなりガッツリと作り込まれています。
追記
Twitter で @toqmitz さんに教えていただいたのですが、OUIGO は旅行代理店ではなく、一般に LCC と呼ばれているローコストキャリアの仕組みを鉄道会社が運営しているものなんだそうです。
フランスの国鉄が運営する TGV を利用した LCC で、@toqmitz さんいわく「JR東海や東日本が安い飛行機や高速バスに対抗して、廉価版新幹線をはしらせはじめた」ということみたいです。
いやー、勉強になりました。@toqmitz さんありがとうございます！
three.js を使った作品としても随一の出来栄え
今回のサイト、正直にいうと最初目にした時にあまりにも完成度が高かったので Unity の WebGL ビルドなのかなと思いました。
でもシェーダを見てみると three.js っぽかったので、その時点でもう個人的にはテンションがおかしくなってきて、しばらく夢中で遊びながらじっくりと見入ってしまいました。
制作したのは、これまでにも多数のハイクオリティな WebGL 作品を生み出してきたインタラクティブデザインスタジオ Merci-Michel です。彼らの作品にはこれまで何度も度肝を抜かれてきましたが、今回のやつは本当にやばいなと思います。
ゲームエンジン等を使うこと無く、このようなウェブアプリケーションを作ってしまうというのは本当に驚きですし、いったいどんなひとたちが集まっている企業なのか……本当にすごいです。
まるでコンシューマタイトルのゲームなのでは？ と思ってしまうような見事な 3D モデルが高い質感で描かれています。
もちろんサイト全体の構成や作りも非常に素晴らしくて、3DCG 部分だけでなく、ウェブサイトとしての振る舞いも細かいところまで見事に作り込まれています。
たとえば画面の上にあるスコアが表示される部分は、駅にある LED の電光掲示板をイメージさせるようなドットの集合になっているのですが、場面によってこの部分にインフォメーションがイラスト調で表示されていたりして、ユーザーに次にどのような操作を行なったらいいのかなどを示してくれます。
ボールの発射は電車が加速して玉をはじき出してくれます！
ボールが通るルートには、列車のレールのようなものやトンネルなど、これまた旅行をイメージさせる面白いオブジェクトが使われています。
また、オブジェクトのデザインだけでなく、CG として見た場合も、水をイメージさせる半透明の水面、周囲の景色が映り込む鏡面のような質感を持つ面など、マテリアルもそれぞれにしっかりと使い分けられていて作り込みが半端じゃないです。
若干ローポリゴンっぽい感じに見えるのはさすがにどうしようもないとしても、WebGL でこれだけ見事なゲーム作品に仕上げてある作品にはなかなか出会えません。
しかもたぶん、手書きのコードでひとつひとつ組み上げていったんだと思うので、マジで職人芸としか言いようがありません……
凄すぎる……
ゲームとして作品を眺めてみても、都合６箇所に配置されているフリッパーにより、奥行きや高さを嫌でも意識させられる立体感のあるゲームになっています。
最下部にあるフリッパーの周辺だけだとなかなかプレイフィールドの全体が見渡せないのですが、うまく特殊なレールの方へと玉を打ち込むことができれば、様々なイベントを見ることもできます。
先述した、画面上部の電光掲示板風のスコア表示部分も、イベントの発生と同時にいろいろなイラストが登場してきて、本当に面白いです。
ピンボールのゲーム単体としても楽しめる、そんな素晴らしい作品ですね。
マジで褒めるところしかない（笑）
今回の作品、凄まじい完成度になっている分だけ、描画負荷もかなり高めになっています。
一般的なゲーム用構成の PC でも、それなりにハイスペックなものでないと本当にスムーズな動作は難しいと思います。
しかし、その美しい描画結果とゲームの完成度は、多少の負荷の高さなんてのは気にしていられないほどの圧倒的な迫力があります。できるだけ、ハイエンドなマシンでご覧になっていただくことをおすすめしますね。
単純にウェブサイトとしてのシーン遷移やインタラクションも丁寧に作られています。ある意味、現時点でのウェブの表現におけるひとつの完成形を見せられたような、そんな気分になりました。
ぜひチェックしてみてください。
