研究開発的側面を持ちながらも圧倒的にアツいビジュアルを併せ持つ ASTRODITHER がおもしろい

doxas : 2026-04-15 12:15:37

ノリノリだぜ～

今回ご紹介するのは、Robert Borghesi さんがご自身の研究開発の作例として公開している ASTRODITHER というプロジェクトです。

アストロディザ、というタイトルからもわかるとおり、一種のディザ処理を行いつつさまざまなエフェクトやインタラクションで刺激的な体験を作り出しています。

こういうのは好きな人にはとにかく刺さりそうですね。

今回のサイトには、いわゆる下層ページのようなものはありません。

またスクロールしてコンテンツが次々現れるという感じでもなく、シングルページの極めてシンプルな構造です。

サイト内にはクリックすることで説明文が出てくる箇所などはありますが、それ以外は余計なものは一切ない感じで無駄が削ぎ落とされています。

このスクリーンショットを見て、どうでしょう……　あ、これ好きなやつだ、と感じた人ならまず間違いなく楽しめるコンテンツだと思います。

特に深い意味や文脈があるわけではなく、ビジュアルとサウンドを使ってとにかく楽しもうという空気感がありますね。逆に言うと、ノリノリの BGM と派手なビジュアルを見てもそれほど高揚がないという人はあんまり楽しめないかもしれないです。

説明文を読んだかんじ、three.js 独自の仕組みである TSL を用い、WebGPU で動作するデモを作ってみた、という感じみたいです。

今回のデモではサウンド周辺の処理も大きな役割を持っています。

実際にサイトに行っていろいろ試してみてもらうのが一番だとは思いますが、説明を表示したり、あるいはマウスボタンをホールドしたりすることで、BGM の再生速度やビジュアルに変化が起こります。

こういったインタラクティブな変化のひとつひとつにも、作者さんのセンスが光っています。

さまざまなポストエフェクトを駆使したビジュアルは、3DCG プログラミングの経験がある人もそうでない人も楽しめる王道的な表現です。

またカーソルを動かすことで発生するエフェクトもすごく凝った内容になっており、ディザ的な感じで表現される手の部分のビジュアルもとてもかっこいいです。

WebGPU と WebGL は、中身はだいぶ違いますがレンダリングされた絵だけを見てもなかなか見分けることは難しいです。今回の事例は WebGL でも実装すること自体は普通に可能だと思いますが、WebGPU を用いることでより効率的に処理できている側面もあるのかもしれませんね。