
立体的な鉱物にレーザーの照準を当てているような不思議な表現がおもしろい Auremin のウェブサイト
演出は控えめです
今回ご紹介するのは Auremin という企業のウェブサイトです。
アフリカや中東地域で、インフラや鉱物の提供などを行っているかなり大きな企業のようです。
今回のサイトではそれほど演出が多く盛り込まれているわけではないのですが、WebGL を用いたおもしろい表現が実装されています。
リンク:
Auremin | Commodities Trading & Infrastructure Platform
レーザー風の表現が立体感を際立たせる
今回のサイトでは、大きく2つの WebGL 実装が用意されています。
1つは、サイトを開いた直後に表示されるグローブです。
こちらは点をたくさん散りばめて地形と海の違いを表現していて、どこか幻想的な印象とクリーンな雰囲気が演出されています。

このグローブ実装自体は、そんなに複雑な仕込みがある感じでもなく、たぶん世界のいろんなところに拠点があるんですよ、ということを表現したかったのかな……
カーソルを動かすとパーティクルが反応したりもしますが、そんなに派手という感じでもありません。
そのままスクロールしていくと、WebGL を使っていないセクションもそれなりに多く、どちらかというとカッチリした企業のウェブサイト、という印象が強いです。

さらにスクロールしてサイトを進めていくと、唐突に WebGL 実装が出てきます。
この銅などの鉱物を主題とした実装が非常におもしろい WebGL 実装になっていて、ゴツゴツとした鉱物の立体的な質感が、レーザーの光を当てたような演出によってより顕著に感じられるようになっています。
これはあんまり見たことがない新しい表現だなと思いました。
すごく不思議な質感をしています。

この鉱物にレーザーを当てたような表現、静止画を組み合わせて表現しているような感じもするし、一方でしっかりと立体的な質感もあって、本当に不思議です。
冒頭にも書いたように、あまり演出が多くある感じのウェブサイトではないんですよね。
それだけに、ピンポイントに盛り込まれている WebGL 表現のインパクトが強く感じられ、演出にメリハリが生まれているように感じました。
WebGL にも本当にいろんな使い方や可能性があるなと、あらためて感じました。
ぜひチェックしてみてください。