まるでゲームの世界に飛び込んだかのような雰囲気満点の世界観! Mike Fernandez さんのポートフォリオ
軽快な操作性もいい感じ
今回ご紹介するのは Mike Fernandez さんのポートフォリオサイトです。
サイト全体、というよりも、描画される世界がすべて WebGL だけで描かれており、より詳細を見せたい場面は外部リンクで別のサイトに飛ばしてしまうという完全な割り切りによって制作されています。
操作性もかなり直感的で軽快な動作となっており、見て楽しい、操作して楽しいウェブサイトとなっています。
リンク:
ジャンプを駆使すると実はいろいろできる
今回のサイトはまるでゲームの世界のような 3D シーンによって構築されています。
浮島のような、空中に浮かんだロケーションにいくつかのセクションが用意されており、訪問者は自由にキャラクターを操作しながらそれらをめぐります。
カーソルキーなどで操作できるキャラクターが、なにかしらのインタラクションがあるオブジェクトに近づくと、Enter キーのアイコンが出るなどしてナビゲートされます。
サイト内の多くの要素が、まるで本当にゲームの世界のように自然とアニメーションし続けるようになっていて、明かりや炎の質感はもちろん、無心で刀を鍛え続けるハンマーなど、ファンタジーの世界観が見事に表現されています。
各セクションには、キャラクターがそこに足を踏み入れることで初めて変化が起こるようなギミックも用意されていて、それがポートフォリオサイトという建付けと上手に紐付けられています。
スキルセットがまるで魔法のように浮かび上がってくる演出など、本当に工夫が凝らされていて面白いです。
登場する 3D オブジェクトはそれほどディティールが細かいわけではなく、ポリゴンっぽい質感が目立つものではあるのですが……
それでも、シーン全体で見たら結構ポリゴン数が多いようにも感じます。
WebGL でこれだけの世界観を軽快に動作させているというのも本当に素晴らしくて、軽快な操作で世界に没入することを妨げません。
工夫が凝らされた各種ギミック、それらと組み合わせて上手に自分自身の背景や技術スタックを見せるというアイデアなど、本当に見れば見るほど驚きに溢れた事例です。
こういうのって、たぶん多くのひとが思いつく見せ方じゃないかなと思うのですが、それをこれだけ見事に体現しているというのはかなりレアケースではないかなという気がします。
簡単に真似できるようなものではないかもしれませんが、すごく刺激をもらえる事例だと思います。
ぜひチェックしてみてください。