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

※当サイトにはプロモーションリンクが含まれます。

Render Simple TOP の POP 簡易レンダリング機能を示すサムネイル

記事更新の通知はXでアナウンス٩(๑❛ᴗ❛๑)
@maru6o6をフォロー

概要 📖 – POPを簡単に描画する

Render Simple TOPは、Camera / Light / Geometry COMP を別個に組まなくても、POP を指定するだけで内蔵カメラ・ライト・マテリアルでレンダ画像を生成する TOPです。Render TOP と同じ描画パイプラインを 1 OP に凝縮しており、POP パラメータに対象ジオメトリを指定するだけで Orthographic / Perspective・Camera DistanceLight Translate・Internal Phong マテリアルまでまとめて指定できます。

主な用途 🎯

  • Camera COMP / Light COMP / Geometry COMP / Render TOP を組まずに POP を 1 OP でプレビュー
  • POP 制作中の即時ビジュアル確認 (パラメータ調整のフィードバックループ短縮)
  • Internal Phong マテリアル (Constant / Diffuse / Color Map) で質感の早い試行
  • Orthographic / Perspective 切替と Normalize Geo によるスケール非依存のジオメトリ確認
  • 本格的な Render TOP パイプラインへ移行する前の構成検討用キャンバス

データフロー 🔄

入力: 単一 POP のパス (POP パラメータ)

内蔵 Camera (Orthographic / Perspective + Camera Distance) と内蔵 Light + Material Source で描画

出力: 描画済みテクスチャ

Tips

初心者の方は、以下日本語書籍も手元にあると安心です。

まる。
まる。

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


パラメータ解説 ⚙️

Setup Page 📋

カメラ・投影 🎥

Orthographic .ortho 📐
オンで平行投影 (Orthographic)、オフで透視投影 (Perspective) を使用。UI / 図形プレビュー用途は Orthographic、立体感を出したい場合は Perspective を選ぶ

FOV .fov 🔭
Perspective モード時の水平方向視野角 (度単位)。広角にすると画角内に多くが映るが歪みも増える

Ortho Width .orthowidth 📏
Orthographic モード時の表示幅 (ワールド単位)。映る範囲のスケールを直接指定する

Camera Distance .camdistance 🎯
Z 軸に沿ったカメラ配置距離。Camera COMP の Translate Z 相当で、遠近の調整に使う

POP・ジオメトリ変換 🧊

POP .pop 🎯
レンダリング対象となる単一 POP のパス。Render TOP のように Geometry COMP を経由せず直接 POP を指定する

Normalize Geo .normalizegeo 📦
POP ジオメトリを原点中心・サイズ 2 の立方体に収まるよう自動で平行移動と均一スケールを適用。POP の絶対座標を意識せずに確認したいときに便利

Geometry Translate .geotranslate ↔️
ジオメトリを元位置から相対的に平行移動 (X / Y / Z)

  • X (geotranslatex)
  • Y (geotranslatey)
  • Z (geotranslatez)

Geometry Rotate .georotate 🔄
ジオメトリを元姿勢から相対的に回転 (X / Y / Z 軸まわり)

  • X (georotatex)
  • Y (georotatey)
  • Z (georotatez)

Geometry Scale .geoscale 🔍
ジオメトリを元サイズから相対的に均一スケール

背景色 .bgcolor 🎨

ジオメトリの背後を塗りつぶす色:

  • Background Color: 背景色 (R / G / B / A)。常にアルファでプリマルチプライされるため、不透明な背景にしたい場合はアルファを 1.0 にすること

ライト .lighttranslate 💡

内蔵された 1 灯のポイントライトのワールド座標:

  • Light Translate: 内蔵された単一ポイントライトをワールド空間で平行移動。Internal Phong マテリアルでの陰影に影響する

Material Source .materialsource 🎭

POP に適用するマテリアルのソース選択

項目 内部名 説明
Internal Phong .internalphong 下記の Constant / Diffuse / Color Map / Wireframe を用いた内蔵 Phong マテリアルを適用
MAT .mat 下記 MAT パラメータに指定した外部 MAT ノードをマテリアルとして適用 (Constant MAT / Phong MAT / GLSL MAT 等)

Internal Phong マテリアル ✨

Wireframe .wireframe 🔲
Material SourceInternal Phong のときワイヤーフレーム表示に切替

Constant .constant 🎨
Internal Phong モードのコンスタント (環境光に依存しない発色) カラー

  • R (constantr)
  • G (constantg)
  • B (constantb)

Diffuse .diffuse 🌈
Internal Phong モードのディフューズ (拡散反射) カラー

  • R (diffuser)
  • G (diffuseg)
  • B (diffuseb)

Color Map .colormap 🖼️
Internal Phong モードのカラーマップ (テクスチャ) として使う TOP のパス

外部 MAT .mat 🧪

Material Source = MAT 選択時のマテリアル参照先:

  • MAT: Internal Phong の代わりに使用する MAT ノードのパス。Constant MAT / Phong MAT / GLSL MAT などをここに指定するとリッチなマテリアル表現が可能

Common Page 🔧

Output Resolution .outputresolution 🖼️

出力解像度の決定方式

項目 内部名 説明
Use Input .useinput 入力 TOP の解像度をそのまま継承
Eighth .eighth 入力解像度の 1/8
Quarter .quarter 入力解像度の 1/4
Half .half 入力解像度の 1/2
2X .2x 入力解像度の 2 倍
4X .4x 入力解像度の 4 倍
8X .8x 入力解像度の 8 倍
Fit Resolution .fit 指定解像度に縦横比を保持して収める
Limit Resolution .limit 指定解像度を上限としてクランプ
Custom Resolution .custom Resolution パラメータで任意指定

Resolution .resolution 📐

カスタム解像度の幅・高さ指定 (Output Resolution = Custom 等の時のみ有効):

  • Resolution W: 出力幅 (ピクセル単位)。Output ResolutionCustom Resolution / Fit Resolution / Limit Resolution の時に有効
  • Resolution H: 出力高 (ピクセル単位)。同上

Resolution Menu .resmenu 📋

よく使う解像度プリセットのドロップダウン:

  • Resolution Menu: NTSC / PAL / HDTV 720 / HDTV 1080 / 4K UHD 等のプリセットから選択すると Resolution W / Resolution H が自動セットされる

Use Global Res Multiplier .resmult 🔢

プロジェクト全体の解像度倍率の適用:

  • Use Global Res Multiplier: Project Settings の Global Resolution Multiplier をこの TOP に適用するかどうか。プロトタイプを低解像度で動かしつつ最終出力で一括フル解像度化する運用に便利

Output Aspect .outputaspect 📏

出力アスペクト比の決定方式

項目 内部名 説明
Use Input .useinput 入力 TOP のアスペクトを継承 (伝播事故の元、非推奨)
Resolution .resolution 解像度から自動導出 (推奨デフォルト)
Custom Aspect .custom Aspect1 / Aspect2 で手動指定

Aspect .aspect 📐

カスタムアスペクト比の指定 (Output Aspect = Custom Aspect の時のみ有効):

  • Aspect1: 横方向アスペクト値 (Output Aspect = Custom Aspect の時のみ有効)
  • Aspect2: 縦方向アスペクト値 (同上)

Input Smoothness .inputfiltertype 🎚️

入力テクスチャのサンプリング方式

項目 内部名 説明
Nearest Pixel .nearest 最近傍ピクセルサンプリング (ピクセルアート向け、ジャギーが残る)
Interpolate Pixels .linear バイリニア補間 (滑らか、デフォルト)
Mipmap Pixels .mipmap ミップマップ補間 (縮小時のモアレ抑制、わずかにコスト高)

Fill Viewer .fillmode 🖥️

ビューア内でのテクスチャの収め方

項目 内部名 説明
Use Input .useinput 入力 TOP の Fill Viewer 設定を継承
Fill .fill ビューアいっぱいに引き伸ばす (アスペクト無視)
Fit Horizontal .width 横幅に合わせて収める (上下に余白)
Fit Vertical .height 縦幅に合わせて収める (左右に余白)
Fit Best .best アスペクト保持で内側に収まる最大サイズ
Fit Outside .outside アスペクト保持で外側まで覆う最小サイズ (はみ出しあり)
Native Resolution .nativeres テクスチャのネイティブ解像度のまま等倍表示

Viewer Smoothness .filtertype 🎛️

ビューア表示時のサンプリング方式

項目 内部名 説明
Nearest Pixel .nearest 最近傍ピクセルサンプリング (ピクセル単位での確認向け)
Interpolate Pixels .linear バイリニア補間 (滑らか、デフォルト)
Mipmap Pixels .mipmap ミップマップ補間 (縮小ビュー時のモアレ抑制)

Passes .npasses 🔁

オペレータの反復実行回数:

  • Passes: TOP の処理を何パス繰り返すかの整数値。前回パスの結果が次回パスの入力になる。ブラー反復やフィードバック処理に利用

Channel Mask .chanmask 🎨

処理対象のチャンネルマスク (R/G/B/A 個別トグル):

  • Channel Mask: R / G / B / A 各チャンネルのオン/オフトグル。オフのチャンネルは TOP の処理を受けず入力値がそのまま通過

Pixel Format .format 🎨

出力テクスチャのピクセルフォーマット (ビット深度・チャンネル構成)

項目 内部名 説明
Use Input .useinput 入力 TOP のフォーマットを継承
8-bit fixed (RGBA) .rgba8fixed 標準 8 ビット固定小数 RGBA (デフォルト、軽量)
sRGB 8-bit fixed (RGBA) .srgba8fixed sRGB ガンマ補正済 8 ビット RGBA
16-bit float (RGBA) .rgba16float 16 ビット浮動小数 RGBA (HDR・中間処理向け)
32-bit float (RGBA) .rgba32float 32 ビット浮動小数 RGBA (最高精度、メモリ大)
10-bit RGB with 2-bit Alpha .rgb10a2fixed 10-10-10-2 ビット固定小数 (バンディング抑制)
16-bit fixed (RGBA) .rgba16fixed 16 ビット固定小数 RGBA
11-bit float (RGB) .rgb11float 11-11-10 ビット浮動小数 RGB (アルファなし、HDR 軽量)
16-bit float (RGB) .rgb16float 16 ビット浮動小数 RGB (アルファなし)
32-bit float (RGB) .rgb32float 32 ビット浮動小数 RGB (アルファなし)
8-bit fixed (Mono) .mono8fixed 8 ビット固定小数モノクロ
16-bit fixed (Mono) .mono16fixed 16 ビット固定小数モノクロ
16-bit float (Mono) .mono16float 16 ビット浮動小数モノクロ
32-bit float (Mono) .mono32float 32 ビット浮動小数モノクロ
8-bit fixed (RG) .rg8fixed 8 ビット固定小数 R+G 2 チャンネル
16-bit fixed (RG) .rg16fixed 16 ビット固定小数 R+G
16-bit float (RG) .rg16float 16 ビット浮動小数 R+G
32-bit float (RG) .rg32float 32 ビット浮動小数 R+G
8-bit fixed (A) .a8fixed 8 ビット固定小数アルファ単体
16-bit fixed (A) .a16fixed 16 ビット固定小数アルファ単体
16-bit float (A) .a16float 16 ビット浮動小数アルファ単体
32-bit float (A) .a32float 32 ビット浮動小数アルファ単体
8-bit fixed (Mono+Alpha) .monoalpha8fixed 8 ビット固定小数モノクロ+アルファ
16-bit fixed (Mono+Alpha) .monoalpha16fixed 16 ビット固定小数モノクロ+アルファ
16-bit float (Mono+Alpha) .monoalpha16float 16 ビット浮動小数モノクロ+アルファ
32-bit float (Mono+Alpha) .monoalpha32float 32 ビット浮動小数モノクロ+アルファ

実践アイデア 💡

Example 1: POP プレビュー (1 OP で即座にビジュアル確認) 👀

POP family (例: Sphere POP) → Render Simple TOP (POP = /project1/sphere1) → 出力

POP を作って即座に絵で確認したいとき、Camera COMP / Light COMP / Geometry COMP / Render TOP を組み立てずに Render Simple TOP を 1 個置き、POP パラメータに対象 POP のパスを入れるだけで結果が画面に出る。POP 制作中のパラメータ調整フィードバックループを最短化できる。

  1. Render Simple TOP を作成
  2. POP パラメータに対象 POP (例: /project1/sphere1) のパスをドラッグ&ドロップで指定
  3. Normalize Geo をオンにすると POP の絶対座標に関わらず常に画面内に収まる
  4. ビューアで描画結果を確認しながら POP 側のパラメータを調整

Example 2: Internal Phong での手早いマテリアル試し 🎨

POP → Render Simple TOP (Material Source = Internal Phong + Diffuse / Color Map) → 出力

MAT ノードを別途用意せず、Render Simple TOP 内蔵の Internal Phong マテリアルだけでジオメトリの色味やテクスチャ感を試したいときの流れ。Diffuse で基本色、Color Map にテクスチャ TOP を流し込むだけで質感確認ができる。

  1. Material SourceInternal Phong に設定
  2. Diffuse でディフューズカラーを指定
  3. テクスチャを当てたい場合は Color Map に TOP (例: Movie File In TOP) を指定
  4. Light Translate を動かしてライティングを調整しながら見え方を確認

Example 3: Orthographicで形状確認用ビュー 📐

POP → Render Simple TOP (Orthographic オン + Normalize Geo) → 出力

POP のシルエットや拡縮の整合性をフラットに確認したいときに、Perspective による奥行き歪みを排除して Orthographic + Normalize Geo でジオメトリを画面内中央に均一スケール表示する用途。後段の Render TOP パイプラインに移す前のシルエットチェックに使う。

  • Orthographic をオンに切り替え
  • Normalize Geo をオンにして POP を原点中心 サイズ 2 の立方体に収める
  • Ortho Width で表示幅を微調整
  • Geometry Rotate Y を回しながら正面・側面・背面のシルエットを確認

関連オペレータ 🔗

類似機能OP 🔍

  • Render TOP — Camera COMP / Light COMP / Geometry COMP を組み合わせる本格版レンダラ
  • Render Pass TOP — 既存 Render TOP の追加パスを同一フレームバッファに重ねる
  • Render Select TOP — Render TOP の中間バッファ (Depth / Normal 等) を選択取得

組み合わせ推奨OP 🔄

  • Camera COMP — 本格的なカメラ制御に移行する際の Render TOP 側参照先
  • Light COMP — 複数灯・方向・スポット等の自由なライティングへ移行
  • Geometry COMP — POP 直指定ではなく Geometry COMP 経由のシーン構築へ移行
  • Phong MATMaterial SourceMAT に切替えてリッチな Phong シェーディングを適用
  • Constant MAT — 陰影なしのフラット表示用 MAT
  • GLSL MAT — 自作シェーダで描画したい場合の MAT

前処理・後処理TOP 🎯


Info CHOP情報 📊

Render Simple TOPは Info CHOP による詳細情報取得に対応しており、解像度・アスペクト比・ピクセルフォーマット・クック時間などをチャンネル出力として取り出せます。

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: エラー数

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

よくある問題と解決策 🔧

❌ Problem: POP が画面に表示されない / 黒い出力になる
✅ Solution:

  • POP パラメータに有効な POP のパスが指定されているか確認 (パス間違い・対象 POP がクックされていない 等)
  • Normalize Geo をオンにしてカメラの画角外に POP が出ていないかを切り分け
  • Camera Distance を 5〜10 程度に振って POP がクリップされていないか確認

❌ Problem: ジオメトリが極端に大きい・小さい / 歪んで見える
✅ Solution:

  • Normalize Geo をオンにして自動で正規化
  • Perspective 時は FOV を 40〜60 度に下げて歪みを抑制
  • Orthographic 時は Ortho Width を POP のおおよそのサイズに揃える

❌ Problem: Internal Phong のマテリアル / 色が反映されない
✅ Solution:

  • Material SourceInternal Phong になっているか確認 (MAT 選択時は外部 MAT が優先)
  • Light Translate がジオメトリ位置に対して逆方向 (内側) になっていないか調整
  • Diffuse がすべて 0 の場合は陰影で完全に黒くなるため最低でも 0.5 程度に上げる

❌ Problem: 本格的な多灯・多カメラのシーンが組めない
✅ Solution:

  • Render Simple TOP は内蔵 1 灯のポイントライト + 単一 POP までが想定範囲。複数ライト・複数オブジェクトには Render TOP + Camera COMP + Light COMP + Geometry COMP の組み合わせに移行する
  • プロトタイピングが固まったら同じ POP を Geometry COMP に流し、Render TOP のシーン構築に切替
  • Depth や Normal などの中間バッファが必要なら Render Select TOP と組み合わせる

参考資料 📚

その他 🔗

公式リソース 📖

この記事はLLMと共に内容を執筆、更新しています。
最新バージョンとの項目差異など、情報の不一致を見つけた心優しい方はXもしくはInsta、メールなどよりサイト管理者までご連絡ください😎


まる。

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

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

↓日常垢
Instagram:@malmal0v0

まる。をフォローする
その他の記事はこちら
Math Combine POP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】
ZED Select TOP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】
ZED POP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】
Window COMP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】
Widget COMP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】

タイトルとURLをコピーしました