mcpField
3
3d-sky-background

3d-sky-background

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

3d-sky-background について

既存のレンダラーを使う開発者向けに、3D空背景の設計方法を案内するスキルです。空の表現、ライティング、色処理、時間帯の遷移、検証を扱います。

主な機能

  1. 01プロシージャル、パノラマ、混合方式の選択
  2. 02背景、環境、太陽光の分離
  3. 03パノラマのマッピングと継ぎ目の処理
  4. 04色空間とトーンマッピングの調整
  5. 05昼、夕暮れ、夜の遷移管理

活用シーン

  1. 01既存の3Dシーンへの空の追加
  2. 02反射と太陽の影の整合
  3. 03カメラ旋回時のパノラマ確認

インストール

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

$npx skills add https://github.com/mengto/skills --skill 3d-sky-background

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

同梱ファイルagents/openai.yamlREFERENCES.md

詳細

3D 空の背景

世界を包み込む空を作成し、見やすい地平線と、同じ大気の中にあるような照明を実現します。

表現方法を選ぶ

プロジェクトのレンダラー、カメラの描画範囲、カラー処理、環境光、既存のアセットを確認します。雲の構図が重要な場合はライセンスを確認した既存のパノラマを、太陽の位置を変える必要がある場合はプロシージャルな空を、あるいは控えめなハイブリッド方式を使用します。プロジェクトのレンダリングバックエンドとバージョンを維持し、空のために別のレンダラーを追加しないでください。

次の3つの役割を明確に分けてください。目に見える空の背景、反射/環境光、直接的な太陽光です。背景写真だけでは、PBR オブジェクトを照らせません。PMREM 環境だけでは、影を落とす指向性の太陽光は得られません。PMREM ドキュメントを参照してください。

安定した周囲の空を構築する

  • エンジンの背景機能、フルスクリーンの方向シェーダー、または深度書き込みとフォグを無効にした内向きのドームを使用します。ドームはカメラのクリッピング範囲内に収め、カメラの平行移動に追従させます。カメラが回転しても、ワールド座標系での向きを維持してください。
  • 正規化した視線方向から色を導きます。淡く暖かみのある地平線から、彩度を抑えた中間の帯を経て、より冷たい天頂へと色をなじませます。地面の霞と調和するように下半球を仕上げ、露わになった硬い境界を残さないでください。
  • 目に見える円盤、グロー、指向性ライト、空の光線パスには、共通の太陽方向を使用します。幅広いハローと小さな円盤は別々の要素です。大きな白い塊にならないようにしてください。
  • 構図に奥行きが必要な場合に限り、遠景のシルエットを追加します。コントラストを抑え、地平線に近い色相と明るさにしてください。

パノラマを意図的にマッピングする

正距円筒図法の空は、横方向に360°、縦方向に180°全体を覆います。一貫したワールド軸の規約を定め、撮影された太陽がシーンの太陽と一致するようにテクスチャを回転させ、継ぎ目と天頂の両方を確認してください。

横長の風景写真は部分的なパノラマです。角度の範囲と地平線の位置を記録し、球体全体に無分別に引き伸ばさないでください。Seijaku は部分的な空の画像を太陽の周囲に配置し、背面の範囲を反転して補います。これは構図に特化した近道です。カメラが一周すると、雲の形が繰り返されて見えることがあります。カメラの向きに制限がない場合は、完全なパノラマを使用してください。

カスタムシェーダーで経度をラップすると、継ぎ目の不連続によってテクスチャの微分が乱れ、ぼやけた縞が生じることがあります。テクスチャのラップ機能を使い、連続したサンプリング座標を優先してください。それが難しい場合は、シェーダーのバージョンに適した補正済みの勾配を指定します。初期表示だけでなく、カメラを周回させながら継ぎ目をテストしてください。

色と照明の整合性を保つ

ディスプレイ基準のカラー画像には sRGB として注記し、照明計算はリニア空間で行います。トーンマッピングと出力変換は、最終段階として意図した箇所で一度だけ適用してください。別のプロジェクトで調整された逆トーンマップ関数をそのまま使わないでください。Seijaku の調整は、カスタムの最終シェーダーと露出設定に結び付いています。写真をシーンとともにトーンマッピングするのか、それともディスプレイ基準の別パスで合成するのかを明確に決めてください。

まずプロシージャルなグラデーションを表示し、その後、空のアセットを非同期に読み込んでブレンドします。アセットの読み込みに失敗しても、空を使用できる状態に保ちます。テクスチャの解像度は表示される角度範囲と表示対象に合わせ、容量の大きすぎる空の画像によって最初の操作を遅らせないでください。

必要に応じてプリフィルター済みの環境を生成し、再利用します。昼夜や季節の移行時には、対応していればキャッシュ済み環境を補間するか、状態が大きく変化したときに更新します。毎フレーム PMREM を再構築すると、シーンの処理コストの大部分を占めることがあります。使用中のテクスチャは破棄せず、置き換えられた環境レンダーターゲットを破棄してください。

昼、夕暮れ、夜

地平線と天頂の色、太陽の輝き、霧の色合い、露出、月、星には連続的な重みを使用します。空が暗くなったら星をフェードアウトさせます。夜でもマテリアルを確認できるだけの環境光を保ちます。雲の動きはゆっくりアニメーションさせ、非表示のときは一時停止し、動きを抑える設定ではデザインされた静止空を表示します。

検証

  • 軌道を一周し、上下を見回しても、継ぎ目、伸びた雲、ドームの縁、カメラ移動による視差が見えません。
  • 太陽の方向、影、光線、反射が、想定するヒーロービューで一致しています。
  • 昼・夕暮れ・夜の切り替えで、フラッシュ、二重のトーンマッピング、不一致のある霧が発生しません。
  • 画像の読み込み前や読み込みに失敗した場合でも、空が適切に表示されます。
  • モバイルおよび 2× レンダリングでも地平線が保たれ、予期しない環境の再構築が発生しません。

ソースコードの調査と公式 API については、REFERENCES.md をお読みください。Seijaku の関連関数は makeSky、makeHills、makeStars と環境の更新処理です。

コメント