美しいインタラクティブなグラデーションがサイトを彩るロンドンにあるエージェンシー KOTA のウェブサイト
不規則なグラデーションがきれい
今回ご紹介するのは、デザインを中心に手掛けるエージェンシー、KOTA のウェブサイトです。
WebGL の使い方としては平面的な演出として取り入れている感じで、3D のような表現が出てくるわけではありません。
ただ、このグラデーションが不思議な質感を持ったインタラクティブな演出になっていて、なかなか個性のあるビジュアルに仕上がっています。
リンク:
Web Design Agency London & NYC | Creative Digital Agency
よく観察してもいまいちロジックがわからないおもしろさ
今回のサイトでは、先にも書いたように 3D 的な表現が出てくるわけではありません。
2D の演出だけを WebGL で処理していると思うのですが、背景部分にそのグラフィックスが置かれる形で、いくつかのシーンで登場するようになっています。
もちろんサイトの冒頭、トップページ部分でもそれは見ることができ、すごくきれいな模様がなんとも目を引きます。
この模様、なんと形容したらいいかが難しいのですが……
なにかすりガラスのようなものを通して世界を見ているかのような、なんとも不思議な質感になっています。
模様は時間の経過とともに自然と変化するようになっていますが、カーソルを動かすことでインタラクティブに干渉することも可能となっています。
トップページ以外の部分でも、同様のアルゴリズムを使って描画されていると思われるビジュアルが登場する場面はいくつかあります。
それぞれに、微妙に歪み方が異なる感じがして、シンプルなルールのなかで多様な見せ方を行っている感じがなんともうまいなと個人的には思います。
ノイズをベースに模様を作っているのかなとは思うのですが、見れば見るほど不思議な質感で、ずっと見ていても飽きないおもしろさがあります。
WebGL では、特に Simplex noise などを用いることでこういった模様を描画することができますが、今回のやつは単なるノイズという感じではなく、絶妙にインタラクティブ性もありながら不思議な模様を描いていて味わい深いです。
サイト全体としての設計のうまさもあり、効果的に WebGL を演出に盛り込んでいるなという感じがします。
所属しているスタッフの方々を撮影したと思われる写真もサイト内にはいくつか掲載されており、スタジオの雰囲気も伝わってくるコーポレートサイトとなっています。
ぜひチェックしてみてください。