mcpField
T
threejs-precipitation-surfaces

threejs-precipitation-surfaces

github.com/scottsttsクリエイティブ・メディア94694 回インストール6 日前に更新
リポジトリ

threejs-precipitation-surfaces について

Three.jsの降水と表面効果を扱うスキルです。天候の進行、粒子、表面変化、衝突を連動するシステムとして捉え、積雪や雨で濡れた水たまりの実装資料を提供します。

主な機能

  1. 01降水と表面応答の構築手順
  2. 02積雪とモデルへの雪付着の資料
  3. 03濡れた地面と水たまりの雨表現
  4. 04風、被覆率、表面パラメーター制御
  5. 05マスク、法線、イベントのデバッグ

活用シーン

  1. 01風に応じた降雪と積雪の作成
  2. 02向きを考慮したモデルへの雪付着
  3. 03水たまりや波紋のある雨濡れ路面
  4. 04降水、表面変化、衝突効果の確認

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/scottstts/threejs-awesome-graphics-agent-skills --skill threejs-precipitation-surfaces

インストール後、Claude Code で/threejs-precipitation-surfacesを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

agents/
openai.yaml
assets/wet-puddle-rain/
GPL-3.0.txt
examples/snow-accumulation/
snow-system.js
examples/wet-puddle-rain/
rain-puddle-system.js
references/
precipitation-surface-systems.md

詳細

降水による表面変化

天候を、イベント、パーティクル、表面の反応が連動するシステムとして扱います。地面から視覚的に切り離された雨や雪のパーティクルを追加しないでください。

このスキルには、説明的なガイダンスに加えて、参考になる優れた実例やアセットが含まれています。関連する場合は、十分に調べて参照し、場合によってはそのまま使ってください。むやみに読み飛ばさないでください。

構築順序

weather envelope
  -> falling precipitation volume
  -> world/object surface mask
  -> displaced or optical surface response
  -> impact residue and splashes
  -> shared lighting/post presentation

雪の積もり方、オブジェクトへの雪の付着、ラップする降水ボリューム、濡れた水たまりのマスク、プロシージャルな波紋法線、スプラッシュの配置、デバッグ出力、ライセンスの境界については、references/precipitation-surface-systems.mdを読んでください。

カメラに追従してラップする降雪、風と時間を共有するユニフォーム、ワールド空間の雪マスク、単一の情報源による積雪量と法線、モデルへの雪の付着、オプションの氷面合成については、雪の積雪処理の実装を読んでください。

雨の進行に応じた濡れ具合、アスファルトの水たまりマスク、プロシージャルな波紋法線、インスタンス化された雨筋、上向きの面を対象としたスプラッシュのサンプリング、フリップブック形式のスプラッシュについては、濡れた水たまりと雨の実装を読んでください。この例にはGPLライセンスのソース素材が含まれています。コピーまたは公開する際は、ライセンスの境界を維持してください。

必須の制御項目

  • 降水の密度と速度;
  • 風向と風の強さ;
  • 天候の進行度または覆域の共有;
  • 濡れ、水、または水たまりのマスクのしきい値と滑らかさ;
  • 波紋または吹き流しの法線の強さ;
  • 表面の粗さへの反映;
  • パーティクル/スプラッシュの不透明度;
  • マスク、法線、パーティクル、イベントの進行状況を確認するデバッグモード。

問題となる状態

  • 落下する降水が、表面の反応に使われる風やタイミングを無視している;
  • 雪の高さと雪の法線が異なるフィールドから生成されている;
  • 上向きの面を判定するフィルターがなく、垂直面に雪が付着する;
  • マスク、法線への反映、波紋を使わず、粗さを下げるだけで水たまりを表現している;
  • 下向きの面や見えない面にスプラッシュが現れる;
  • 雨筋を一滴ごとに割り当てている、またはカメラの周囲でラップできない;
  • 無関係な時間ノイズで時間経過による濡れを見せかけている;
  • GPL由来の雨のコードに関するライセンス境界が削除または不明瞭化されている。

適用範囲

範囲を限定した水たまりのシミュレーション、コースティクス、フレネル、屈折、ベール・ランベルトの水ボリュームには、$threejs-water-opticsを使用してください。一般的な火花、プラズマ、軌跡、天候に関係しないパーティクルには、$threejs-procedural-vfxを使用してください。スクリーンスペースでの接触履歴や霜を取り除く処理には、$threejs-temporal-surfacesを使用してください。このスキルの対象は、降水イベントと、それによって視覚的に変化する表面です。

コメント