まるで花畑のような美しく幻想的な WebGL 実装がじんわり心に沁みる Gladeye のウェブサイト
最初のインパクトがすごい
今回ご紹介するのは、ニュージーランドを拠点とするエージェンシー、Gladeye のウェブサイトです。
WebGL の使い方はイントロ演出に特化したような感じで大胆で、ページを開いた直後にアッと驚くような強烈なインパクトを持っています。
サイト全体の作りも非常に丁寧なもので、完成度が高いウェブサイトだと思います。
リンク:
Digital Product & Brand Experience Agency - Gladeye
細かく観察すると本当によくできている
今回のサイトのイントロでは、まるで花畑や、あるいは花の回廊とでも形容したくなるような、そんな WebGL 演出を見ることができます。
すごく丁寧に作られた実装で、細かく観察してみるといろんな発見がありますね。
Explore our work と書かれたボタンが画面の下のほうに配置されているのですが、そこにカーソルがホバーしたときのアニメーションもかなり視覚効果が大きいです。
この実装、本当に見れば見るほどおもしろくて、WebGL 実装の経験があるひとほど楽しめるんじゃないですかね……
被写界深度的なことをやっているわけではなさそうですが、画面の隅に近づくほどブラーが掛かるようになっていることや、ライティングの巧みな調整によって、すごく立体感のある画作りがなされています。
カーソルの位置に応じたインタラクティブな演出も仕込まれていて、とにかく絵としての完成度が高いです。
これ単体でインスタレーションにできてしまいそうな、そんな仕上がりです。
サイト内のその他のコンテンツでは、あまり WebGL のような変化球的な演出をしている部分は多くなく、ある種王道な、すごく丁寧に作られたウェブサイトという感じがします。
なんというか、動きがないわけじゃないんですよね。いろんなトランジションが活用されている感じはあるんですが、無駄に動きすぎないというか、シンプルにまとまっている感じがします。
最初のイントロのビジュアルとしてのインパクトといい感じにバランスを取れているように個人的には感じました。
works のページとかを見ていると、WebGL なども駆使したかなりインタラクティブ性の高い、ビジュアルにもこだわった事例が多く見られます。
ビジュアルにもしっかりとこだわりながら1つ1つ丁寧に作り込まれたウェブサイトの数々は、各事例の詳細をつぶさに見せてくれる下層ページを見ているだけでも伝わってくると思います。
とても完成度の高い WebGL 実装も含め、全体が高次元でまとめられています。
ぜひチェックしてみてください。