PreFilter Map TOP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】

概要 📖 – 環境マップを事前に畳込む

PreFilter Map TOPは、環境ライトの拡散マップまたは鏡面マップを事前計算（畳み込み）して出力する TOPです。出力する成分は Output パラメータで拡散反射用と鏡面反射用を切り替えます。

主な用途 🎯

• PBR マテリアルの環境光（イメージベースライティング）用テクスチャ生成
• キューブマップから拡散反射（ディフューズ）成分の事前畳み込み
• キューブマップから鏡面反射（スペキュラ）成分の事前畳み込み
• HDRI 背景を 3D シーンの照明として取り込む下準備
• 金属・光沢表面のリアルな映り込み表現のための反射マップ作成

データフロー 🔄

入力: 環境マップ（キューブマップ）
 ↓
畳み込み処理（Output 設定に応じた拡散/鏡面の事前計算）
 ↓
出力: PBR 照明用にフィルタ済みの環境テクスチャ

まる。

実際の案件事例まで踏み込んで紹介されていて、効率よくスキルアップするなら必携の二冊です！

パラメータ解説 ⚙️

PreFilterMap Page 📁

Output .output 📤

Output (出力する成分) — 環境ライト用に事前計算する反射成分を、拡散反射マップと鏡面反射マップのどちらにするか選択するメニューパラメータです。

実践アイデア 💡

Example 1: HDRI 環境光の準備 🌅

Movie File In TOP (HDRI) → Cube Map TOP → PreFilter Map TOP (Diffuse) → Environment Light COMP

HDRI 画像を Cube Map TOP でキューブマップ化し、PreFilter Map TOP の拡散反射モードで畳み込んでから環境ライトに接続する、PBR 照明の基本フローです。

1. Movie File In TOP で HDRI 画像を読み込む
2. Cube Map TOP でキューブマップ形式に変換する
3. PreFilter Map TOP の Output を「Environment Light Diffuse Map」に設定する
4. 出力を環境ライトの拡散成分テクスチャに割り当てる

Example 2: 金属表面の映り込み生成 ✨

Cube Map TOP → PreFilter Map TOP (Specular) → PBR MAT → Render TOP

キューブマップを PreFilter Map TOP の鏡面反射モードで畳み込み、PBR MAT の環境反射に渡すことで、金属や光沢素材へリアルな周囲の映り込みを与えます。

1. Cube Map TOP で環境マップを用意する
2. PreFilter Map TOP の Output を「Environment Light Specular Map」に設定する
3. 出力を PBR マテリアルの鏡面反射用環境テクスチャに接続する

Example 3: 拡散と鏡面の両マップ準備 🔄

Cube Map TOP → PreFilter Map TOP (Diffuse) / PreFilter Map TOP (Specular) → Environment Light COMP

同じキューブマップから拡散用と鏡面用の 2 つの PreFilter Map TOP を分岐させ、片方を拡散反射、もう片方を鏡面反射に設定して、環境ライトに両方のテクスチャをそろえる構成です。

• 1 つの Cube Map TOP の出力を 2 つの PreFilter Map TOP に分岐する
• 片方を拡散反射マップ、もう片方を鏡面反射マップに設定する
• 2 つの出力をそれぞれ環境ライトの拡散・鏡面スロットに割り当てる

関連オペレータ 🔗

類似機能OP 🔍

• Cube Map TOP — 環境マップをキューブマップ形式に整える前段オペレータ

組み合わせ推奨OP 🔄

• Cube Map TOP — 畳み込みの入力となるキューブマップを生成
• PBR MAT — 事前計算した環境マップを物理ベース描画の照明に利用
• Render TOP — 環境ライトを反映した 3D シーンを最終的に描画

前処理・後処理TOP 🎯

• 前処理: Cube Map TOP
• 後処理: Render TOP

Info情報 📊

PreFilter Map TOP は Info CHOP / Info DAT による解像度やピクセル形式などのメタ情報取得に対応しています。

TOP固有情報 🖼️

• resx: TOP の出力解像度 X (ピクセル単位)
• resy: TOP の出力解像度 Y (ピクセル単位)
• aspectx: アスペクト比 X
• aspecty: アスペクト比 Y
• depth: 3D テクスチャ / テクスチャ配列の深度 (2D テクスチャでは 1)
• gpu_memory_used: TOP が消費している GPU メモリ量 (MB 単位)

汎用オペレータ情報 🔄

• total_cooks: プロセス開始からのクック回数
• cook_time: 最後のクック時間 (ミリ秒)
• cook_frame: 最後にクックされたフレーム番号
• warnings: 警告数
• errors: エラー数

解像度情報 📐

• resx / resy: 出力テクスチャの横・縦のピクセル解像度
• aspectx / aspecty: 出力画像のアスペクト比（横・縦）

ピクセル形式情報 🎨

• depth: 1 チャンネルあたりのビット深度（8 / 16 / 32 ビット）
• gpu_memory: このテクスチャが消費する GPU メモリ量の目安

トラブルシューティング ⚠️

よくある問題と解決策 🔧

❌ Problem: 出力が真っ黒になる
✅ Solution:

• 入力にキューブマップが接続されているか確認（前段に Cube Map TOP が必要）
• 入力 HDRI の輝度が極端に低くないか確認し、必要なら露出を調整
• Output の設定が用途（拡散/鏡面）と合っているか確認

❌ Problem: 映り込みがぼやけすぎる / シャープすぎる
✅ Solution:

• 拡散反射と鏡面反射でオペレータを分け、用途に合う Output を選ぶ
• 鏡面の鋭さは受け側の PBR MAT の粗さ（ラフネス）設定で調整する
• 入力キューブマップの解像度を上げてディテールを確保する

❌ Problem: GPU メモリの消費が大きい
✅ Solution:

• 出力解像度を必要最小限に抑える
• ピクセル形式を 32 ビットから 16 ビット float に下げてメモリを節約
• 畳み込み結果は毎フレーム再計算せず、環境が固定なら 1 度だけ計算する構成にする

参考資料 📚

その他 🔗

• TouchDesigner Wiki — Category:TOPs
• TouchDesigner Wiki — Pixel Formats 解説
• TouchDesigner Wiki ホーム
• TouchDesigner 公式 Forum
• Facebook — TouchDesigner Help Group

公式リソース 📖

• TouchDesigner公式ドキュメント – PreFilter Map TOP
• TouchDesigner公式ドキュメント – Cube Map TOP
• TouchDesigner公式ドキュメント – PBR MAT
• TouchDesigner公式ドキュメント – Environment Light COMP

まる。

お仕事のご依頼はDM又はメールにて。
━━━━━━━━━━━━━━━━━
Python/Touchdesigner/M5Stackをこよなく愛すフルスタックエンジニア。
専門は生理心理学、趣味はヨガやサウナ、EMS電気風呂などヘルスケア全般。
脳波や筋電、心拍を中心とした生体情報のセンシング＆インタラクティブアートづくりがライフワーク。

普段はワントゥーテンという会社で空間演出エンジニアをしています。
リファラル採用お繋ぎできますので、我こそはという尖った方は経歴と希望職種添えてDMください(エンジニア以外、営業職等もOK)。
ご飯行きましょう。

↓日常垢
Instagram：＠malmal0v0

まる。をフォローする

その他の記事はこちら

Math Combine POP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】

2026/6/19

ZED Select TOP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】

2026/6/19

ZED POP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】

2026/6/19

Window COMP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】

2026/6/19

Widget COMP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】

2026/6/19