品質もボリュームも桁外れなスケールで描かれるハリー・ポッター関連サイトがすごい！
これ完全にやりすぎだろ……
今回ご紹介するのは、久々の完全にやり過ぎ事案です。
ハリー・ポッターと言えば、大人から子供まで誰もが知っている有名作品ですが、今回のサイトはそんなハリー・ポッターの権利などを管理している Pottermore という出版社のウェブサイトです。
残念ながら（？）私はハリー・ポッターについてほとんど何もしらないのですが、まあいろんなところで見かけますから、なんとなく世界観くらいは想像できます。
今回のサイトは、そんなハリー・ポッターの世界をとことん満喫できる凄まじい出来となっていて、ファンならずとも、単純に WebGL 作品として眺めるだけでも溜め息の止まらない……そんなウェブサイトとなっています。
霧に包まれた幻想的な世界
最初に断っておくと、今回のサイトはユーザー登録が必要なので、かなり敷居が高いと言えます。メールアドレスひとつで登録自体は無料なんですが、わざわざ登録をしないと見られないというのは……ちょっと残念。
しかしまあ、登録してでもわざわざ見るだけの価値がある、と言い切れる、素晴らしいコンテンツに仕上がっていることは間違いないです。
あまりユーザー登録とかしたくない、という方は、せめて当記事のキャプチャ画像を見ながら雰囲気を想像してみてください。
とは言え、イントロの部分は登録なしでも最初から見られます。
まあイントロでこれですからね……どう考えても頭おかしいですね……
このイントロ画面では、最初にユーザー登録の有無について尋ねられます。
もともと Pottermore のアカウントを持っている人……なんてまあ日本人ではそうそういないと思いますが、当然のごとく全文英語のユーザー登録とメールアドレスの認証作業を行ってやれば、次のシーンに進むことができるようになります。
次のシーン、というように書きましたが、イントロ部分を越えたその先は自由に世界を探索できるようなコンテンツになっていて、特定の、例えばゲームのようなものが用意されているわけではありません。
しかし作品の世界（主に映画版かな？）を忠実に再現したと思われるグラフィックスは実に素晴らしくて、つい見入ってしまいますね。
この探索モード主体のコンテンツでは、建物の至る所に光るボールのようなものが置かれていて、これらにカーソルで触れてやると効果音が鳴ったりしてなにかアクションを起こせることがわかります。
実際にクリックしてやると、その場面が作中で舞台となった際の逸話が表示されます。
これはファンならばたまらないでしょうね……思い出深いシーンがある方であれば、実際にそのシーンが展開されたであろう場所を探してみるというのも、いいかもしれません。
ちなみに、画面の右上に表記が出るようになっているのでわかりやすいのですが、こういった光るボールは全部で 100 個用意されているようです。
半端じゃないボリュームですよね。
上の画像にあるように、霧の中に突然別の地域に移動するための入り口が出てくる場面もあります。
このような場面転換を行うと、舞台がそっくりそのまま切り替わって、まったく別の 3D モデルによるシーンがレンダリングされるようになります。
舞台が変わっても、もちろんそこには光るボール状のホットスポットが用意されているので、全部コンプリートするまでにはハリー・ポッターの世界の様々な出来事が網羅されることでしょう。
まあ私はストーリー知らないのでわからないんですけど（笑）
WebGL の技術的な話を少しだけすると……
どの世界にいる場面でも、今回のサイトでは「霧」すなわちフォグが多用されています。これを普通にまっすぐに受け止めるなら、魔法と冒険の世界観を見事に体現していて素晴らしい！ ということになるのですが……
CG をかじっている人間的目線では、「霧を使ってうまく隠したな……」というふうに穿った見方をすることもできます。
フォグを用いると徐々に背景に 3D モデルが溶け込んでいくような効果が得られますが、今回のサイトの場合は世界全体が霧によって満たされていることによって、遠方に描画されるものについてはある程度無視することができています。
その分、カメラに近いところにある部分だけにうまく注力することができるわけですね。
こういった品質をユーザーに注目させたい部分に集中させる実装の仕方は非常にうまいと思いました。
このシーンなんかもし霧がなかったらまったく別物になってしまうことがわかるんじゃないでしょうか。
3D の実装に慣れた職人の仕事だなということが見ていて感じられる、そんな高品質な WebGL コンテンツとなっている今作。
どうしてもユーザー登録という最初の関門があるので、なかなか気軽に見ることができるものではないのかな、と感じてしまうのですが……実際にブラウザ上でこれらのコンテンツがリアルタイムに描かれていく様子は圧巻の一言。
途中、フォグの使い方について若干ネガティブとも取れるようなことを書いてしまいましたが、これは単に技術や工夫の話であって、それがいけないということではありません。むしろ、こういった工夫の凝らされた実装は、同じ制作に携わる人間として大いに参考にするべきだなと思います。
とにかくボリュームから品質から、全てがものすごいスケールに仕上げられていて、ちょっと簡単には真似のできない素晴らしいコンテンツだと思います。
ぜひチェックしてみてください。
