折り重なるようにも見える個性的なポストエフェクトが興味深い Topology のウェブサイト
なにをする会社なのかはわかりません
今回ご紹介するのは、Topology というベンチャーのウェブサイトです。
なんかよくわからないですが、元 G 社の方が立ち上げたベンチャーかなにかで、多額の投資資金を獲得したとかしないとか、そういう話が X などでは散見されます。
実際、ウェブサイトを見てもやっぱりなにをする会社なのかは今の時点ではよくわからない感じで、ベンチャーとしてスタートしたばかりというステータスなのかもしれません。
リンク：
どういうふうに描画してるのか気になる
今回のサイトの WebGL 実装は、１つのパターンをそれぞれのセクションで若干見せ方を変えつつ背景として使っているタイプです。
重ねた紙を削って、積層のように断面を見せたような、不思議な 3D 表現です。
RGB シフトのような感じで色味が折り重なっているのがなんとも言えない味わいになっています。
この上のスクリーンショットを見ると白いラインのようなものが見えると思うのですが、これはマウスカーソルが動いた軌跡です。
実際に動いている様子で見ると、かなり一瞬のことなのでここまでハッキリと軌跡が見えるということはないと思います。
おそらくいわゆる Stable fluids のような流体系の実装を、ほとんど余韻が残らないように調整し、異常に粘性が高くなったような感じで動かしているのだと思います。
ウェブサイトとしての構造は縦長で、スクロール操作をしてやると背景といっしょに表示されるテキストなども切り替わります。
ただ、テキストはまあ切り替わるのですが、なにか具体的な事業内容や実績が表示される感じではありません。
印象的なビジュアルで先進性を表現しているのかなと思いますが、たしかにほかではあまり見かけない独特な風合いの WebGL 実装で、なかなか個性があります。
おそらく、一度フレームバッファにモノクロのシーンを作ったあと、それを何度か重ねて描画するとか…… そういう感じでこの絵を作っているんでしょうね。
普通に RGB シフトさせただけの実装とはまったく違った雰囲気があり、とてもかっこよく仕上がっているなと思います。
ページ最下部までスクロールすると背景もわかりやすくアニメーションするようになり、迫力のあるビジュアルを見ることができます。
ぜｈチェックしてみてください。
