隠された秘密や楽しい仕掛け満載のフル 3D ポートフォリオ Aurel's Grand Theater がすごい完成度!

doxas : 2025-06-11 12:48:04

気合の入りっぷりがやばい

今回ご紹介するのは Aurel's Grand Theater というポートフォリオサイトです。

なんとコンテンツ全体が 3D シーンで構成されており、WebGL をフル活用した 3D 表現中心のポートフォリオサイトとなっています。

ここまでガッツリ 3D な作例はかなり珍しいと思います。

リンク:

Aurel's Grand Theater

負荷はそれなりに高いので注意

今回のサイトはとにかくリッチな 3D シーンが舞台となっており、ローディング関連の待機時間は全体的に長めです。

また、ポストエフェクトなども駆使してシーンが構成されているので、負荷も高い方に分類されると思います。

軽くてサクサクというよりは、とにかくビジュアルにとことんこだわった WebGL 実装という感じの仕上がりですね。

3D シーンは主人公であるアライグマが劇場のなかにある舞台を自由に闊歩するという建付けになっています。

最初に操作方法を示すページが出てくるので、操作については把握は難しくないと思います。

この上のスクリーンショットを見ると、画面の中央付近こそ鮮明に描画されていますが、画面の隅に近づくほどシーンが放射線状に歪んでいますよね。

このようなズームブラーのような効果がキャラクターの操作に連動して発生するようになっており、とても臨場感のある操作感になっています。

下層ページやメニューは、基本的には舞台のなかに散りばめられたなにかしらの場面やオブジェクトに紐づけられています。

アライグマを操作して、目的の場所に移動してアクセスしてみてください。

下層ページにも固有の 3D 表現が用いられているなど、とにかく隅から隅までビッシリと作り込まれている感じがあり、個人のポートフォリオでここまでやるというのは本当にすごいなと感心してしまいます。

フォトリアル、と言ってしまえるほどリアリティがあるわけではないですが、WebGL 実装でここまで 3D シーンを作り込んでいるのは見事です。

ポストエフェクトを駆使して臨場感を演出しているなど、見せ方も工夫が凝らされています。

各種オブジェクトには物理演算が適用されており、キャラクターの動きに応じて状況が変化することもあります。

遊び心たっぷりに、しかし技術的にもチャレンジしている面が多くあり見ごたえがあります。

ぜひチェックしてみてください。

リンク:

Aurel's Grand Theater

share

follow us in feedly

search

search

monthly

sponsor

social