
さまざまな興味深い仕掛けで訪れた人を楽しませる Emanuel Lorenzo さんのポートフォリオがおもしろい
まるでゲームのような世界観
今回ご紹介するのは Emanuel Lorenzo さんという開発者さんのポートフォリオサイトです。
文字としての情報量はそれほど多くはありませんが、ビジュアルや、サイト内に仕込まれたさまざまなギミックなどの情報量が非常に多くて見応えがあるウェブサイトです。
WebGL を駆使した 3D 表現が演出の中心的役割を担います。
リンク:
派手なようで丁寧で堅実
今回のサイトはいわゆる普通の平面的に構成されるウェブサイトとは本質的に異なっており、全体が 3D 表現中心のまるでゲーム作品のような構造をしています。
トップページの冒頭から、まず 3D のシーンで始まります。
おそらくご本人を模したものであろう人物のキャラクターと、犬のロボットのようなキャラクターなどが登場します。

ちょっとスクリーンショットではわからないかもしれないですが、画面の中心にいる人の姿をしたキャラクターと、画面の下に、犬の姿をしたキャラクターがいます。
この犬のキャラクターはカーソルの位置を追いかけるように動いたり、カーソルを重ねることで撫でることができたり、すごくインタラクティブ性高く表現されています。
全体的にそんなに情報量が多い画面構成じゃないと思うのですが、それぞれのキャラクターのディティールなどがしっかり作り込まれているために、むしろ雰囲気よくまとめられているように感じます。

事例を紹介する WORKS のページも変わっています。
これが正しい意図したとおりの表現なのかちょっとわからないのですが、地面からホログラムのような感じで事例の様子が投影されたりします。
さらに詳細ページに移動すると、スクリーンショットなどをより詳しく閲覧できるようになっていますが、それら一連の導線のなかでもキャラクターが生き生きと動きます。

自己紹介などを見ても、こういう WebGL や WebGPU を駆使した表現が得意であると記述があり、あえて今回のサイトのような 3D 中心の作りにしているのでしょうね。
いろいろな仕掛けがあって、それらが破綻なく構築されている様子には高い技術力を感じさせますし、見せ方として一定の説得力があるなと感じました。
キャラクターの動きなど、地味にしっかり作り込まないと見栄えがしない部分はすごく丁寧な実装で隙がありません。
ぜひチェックしてみてください。