threejs-procedural-vfx

プロシージャルVFX

イベントエンベロープ、モーションフィールド、ジオメトリ表現、シェーディング応答からエフェクトを構築します。同じ色を共有しているだけの独立したパーティクルエミッターは避けてください。

このスキルには、説明だけでなく、模範的な例とアセットも含まれています。関連する場合は、十分に調べ、参照し、場合によってはそのまま使用してください。安易に読み飛ばさないでください。

エフェクトグラフ

subject/event state
  → effect-specific geometry, voxel fields, or instance attributes
  → flow-facing masks or analytic age
  → material response
  → pool/lifetime ownership
  → HDR and bloom contribution

references/procedural-vfx-system.mdでは、船体に沿う再突入シェル、カプセル後流、高密度のインスタンス化された火花／破片プール、ホログラフィック投影シェル、HDR階層、実装上の制限について説明しています。

references/volumetric-fluid-fire.mdでは、3次元テクスチャの所有権、固定された流体計算のスケジューリング、メッシュ表面への注入、圧力投影、移動するSDF境界、温度マッピングされたHDRレイマーチング、正確なプリセット、失敗時の診断について説明しています。

references/volumetric-aurora-curtains.mdでは、有界な発光スラブ、歪ませたカーテン密度、均一なレイステップ、穏やかな開始時のジッター、スクリーン／プローブマテリアルの一致、正確な定数、制限、失敗時の診断について説明しています。

references/filmic-lens-flare.mdでは、HDRエミッターの抽出、光軸の不変条件、視野角に応じた瞳の変形、有限なゴースト群、スペクトルリング、局所ブルーム、フィルム応答、正確な定数、制限、失敗時の診断について説明しています。

再突入プラズマの実装では、閉じたレイヤー状の後流シェル、流れ軸の変形、移流するフィラメントフィールド、不透明度の調整、加算発光の診断について確認できます。

ホログラム投影マテリアルでは、加算リムシェルそのものについて確認できます。視線がかすめる角度で減衰する二乗Fresnel入射、フットプリントでフィルタリングされたオブジェクト空間スキャンライン、高さに応じた位相でのグリッチ変位、インデックスで制御される参加が含まれています。形状遷移ドライバーでは、形状セット全体で共有されるスイープ範囲、より長い滞留時間内の線形進行ランプ、相補的な破棄による引き継ぎについて確認できます。

ボリューム流体火炎の実装では、調整済みの火炎プリセットに加え、WebGPU/TSLによる速度、染料、圧力、渦度、エミッター、衝突、レイマーチング、診断の完全なシステムを確認できます。

レイマーチングによるオーロラの実装では、再利用可能な発光フィールド、透視投影レイマテリアル、4サンプルの正距円筒放射輝度マテリアル、共有ユニフォーム、調整済みのカーテンプリセットを確認できます。空、地形、天候、ライティング、レンダラーの設定は含まれていません。

フィルム調レンズフレアの実装では、上端原点からのHDR太陽検出、パノラマレイの再構築、安定した光源投影、有限な放射状ゴースト群、視野に応じて変形する瞳形状、スペクトルリングとスター応答、局所ブルーム、完全なフィルム調合成を確認できます。

ルール

• 各レイヤーは、シルエット、動き、照明、残留物のいずれかを担う必要があります。
• 速度、染料、圧力、渦度、衝突について、テクスチャの担当と固定の計算スケジュールを明示します。
• 低い角度から見るオーロラには、有限で浅い発光領域、均一なレイステップ、穏やかな開始時ジッター、ステップ長で重み付けした蓄積を使用します。発光領域によって長い地平線経路がすでに除かれている場合は、減衰や仰角ゲートを追加しないでください。
• オーロラの発光は、空、星、大気、地形の照明、天候、グレーディングから分離可能にします。透視投影マテリアルと正距円筒図法マテリアルの両方で、同じ放射輝度を利用できるようにします。
• 速度を体積の UVW に変換するときはワールドサイズベクトルを使用します。非立方体の体積を、各軸のスケールが等しいかのように移流させないでください。
• 圧力のピンポンバッファの終端と、射影で読み取る対象を一致させます。
• 時間定数をあちこちに散在させず、正規化されたライフタイムカーブを使用します。
• 二次的な動きは、同じ流れまたはイベントの方向から導きます。
• ブルームは HDR 発光への応答として扱い、エフェクトの形状をブルームだけに頼らないでください。
• レンズゴーストは HDR 発光体から導き、合成したすべての中心を一つの光軸上に保ちます。瞳孔の形状はスクリーン半径ではなく、オブジェクト空間の視野角に基づいて変形させます。
• レンズフレアの種類は有限に保ちます。キャリブレーション済みの終端ヘイズを任意のビーズ状の連なりに拡張したり、ゴーストの中心に回折スターを配置したりしないでください。
• インスタンスと軌跡はプールし、バーストごとに割り当てないでください。
• 周期的な帯はすべてピクセルフットプリントでフィルタリングし、ゼロではなく、その帯自体の平均値へフェードさせます。
• 逆転置法線行列から構築したフレームで、リムへの入射を測定します。
• 複数形状のトランジションには、共通の正規化範囲と相補的な破棄処理を一組だけ適用し、形状ごとに範囲を分けたり、カバレッジを重複させたりしないでください。
• スポーン、シミュレーション、オーバードロー、輝度のデバッグビューを用意します。
• ブルームなしでも判読できるベースラインを含めます。

ルーティングの境界

炎を燃焼中のシートの力学、炭化による破断、すすと連動させる必要がある場合は、$threejs-procedural-materials と simulated-paper-burning を使用します。

画面空間の霜／タッチ履歴パイプラインには $threejs-temporal-surfaces のみを使用します。降る雨や雪、水しぶきのフリップブック、地面のマテリアルを変化させる天候イベントには $threejs-precipitation-surfaces を使用します。大気の天候レイヤーや惑星規模の雲のボリュームには $threejs-volumetric-clouds を使用します。分子／エアロゾルによる空の散乱や、地表区間のエアリアルパースペクティブには $threejs-atmosphere-aerial-perspective を使用します。単独のフィルミック HDR レンズフレアコンポジター、発光するオーロラカーテンのボリューム、範囲を限定したインタラクティブな炎と煙、被写体空間のプラズマ、生成される航跡、火花、プールされた破片、加算合成の投影シェルは、このスキルに含めます。レンズフレアが、空の散乱とエアリアルパースペクティブを共有するコンポジション内の一つのステージにとどまる場合は、$threejs-atmosphere-aerial-perspective に含めます。