WORKS
MOTION

PARTICLE SPHERE パーティクル球体

  • Three.js
  • WebGL
  • Shader
  • 150k Particles

制作時間:約5日

LIVE OPEN ↗

OVERVIEW

プロジェクト概要

狙い

球面に撒いた150,000個のパーティクルを、ノイズで内側へ深く折り込む。 外向きの変位だけを潰してあるので、シルエットは球のまま内部だけが抉れ、 布をたぐったような大きな面と、その折れ目に沿った明るい稜線が生まれる。

技術ポイント

頂点シェーダーだけで完結。基準位置とシードを最初に一度GPUへ渡したら、 あとはフレーム毎の更新が要らない。色はシアン〜青の狭い帯だけを使い、 紫は折れ目の裏側にわずかに差すに留めた。

CRAFT

こだわった点

EXACT LOOP

ノイズを時間方向へ流すと、二度と同じ形には戻らない。 代わりにサンプリング座標そのものを回した。 1周で整数回だけ回転させれば場は完全に元へ戻るので、13秒でぴたりと閉じる。

LIGHT FROM DENSITY

明るい稜線はシェーダーで描いていない。折れた面が視線と平行になると、 その面の粒が一直線に重なる。加算合成がそれを勝手に光らせる—— 光っているのは粒が密なところであって、光源はどこにも無い。

コピーしました