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

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

Tone Map TOP の HDR → SDR トーンマッピング機能を示すサムネイル

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

概要 📖 – HDR画像を圧縮する

Tone Map TOPは、HDR レンジ (Nits 単位の高輝度値) を含むテクスチャを SDR 表示用の 0.0〜1.0 レンジに圧縮するトーンマッピング TOPです。Type パラメータから ACES Approx / Lottes / Filmic / Hable Filmic / Reinhard 系などの絵作り傾向の異なる 7 種類のトーンマップ関数を選択でき、Hable Filmic を選んだ場合は Peak Input NitsExposure Bias も併用してハイライトのロールオフを制御します。

主な用途 🎯

  • HDR (High Dynamic Range, Nits 単位) のテクスチャを SDR (0.0〜1.0 レンジ) に収めるためのトーンマッピング
  • 7 種類のアルゴリズム (ACES Approx / Lottes / Filmic / Hable Filmic / Reinhard / Extended Reinhard / Extended Reinhard Luminance) からの絵作りの選択
  • Movie File In TOP で読み込んだ HDR 動画素材を SDR ディスプレイ出力に適合させる前処理
  • Render TOP / GLSL TOP でのライティング計算結果 (>1.0 の高輝度値) を表示可能なレンジに圧縮
  • Analyze TOP と組み合わせた素材依存の動的トーンマッピング (Mid Input Nits / Peak Input Nits を実測値から駆動)

データフロー 🔄

入力: HDR テクスチャ (Nits ベース、>1.0 の高輝度値を含む)

選択した Type 関数で Mid Input Nits / Mid Output Nits / Peak Input Nits / Exposure Bias を参照し輝度圧縮

出力: SDR テクスチャ (0.0〜1.0 レンジに収まったディスプレイ表示可能な画像)

Tips

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

まる。
まる。

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


パラメータ解説 ⚙️

Tone Map Page 📋

Type .type 🎚️

適用するトーンマップ関数の種類

項目 内部名 説明
ACES Approx (SDR) .acesapprox 標準 ACES トーンマッピングの近似 (速度優先)。映像業界で広く使われる色合いに近い
Lottes (SDR) .lottes AMD GPUOpen 由来のトーンマップ関数。ゲーム系のリアルタイム描画でよく使われる
Filmic (SDR) .filmic Uncharted 2 由来のフィルミックトーンマップ。映画的なコントラストとハイライトのロールオフ
Hable Filmic (SDR) .hablefilmic John Hable のフィルミックトーンマップ。Peak Input NitsExposure Bias も併用してハイライト挙動を制御できる唯一の方式
Reinhard (SDR) .reinhard 初期のトーンマップ関数。最大値が (1,1,1) でも出力が (0.5,0.5,0.5) 付近に圧縮されるため SDR レンジを使い切れない傾向あり
Extended Reinhard (SDR) .extendedreinhard Reinhard の改良版。Peak Input Nits を使って入力レンジを SDR 出力に整合させる
Extended Reinhard Luminance (SDR) .extendedreinhardlum Extended Reinhard のチャンネル別ではなくピクセル輝度ベースの版。色相を維持しやすい

Mid Input Nits .midinputnits 💡

入力ソースの中間輝度 (Nits 単位):

  • Mid Input Nits: 入力ソースの中間輝度を Nits 単位で指定。Analyze TOP (Average) → Monochrome TOP (luminance) で実測した場合は、プロジェクトの Reference White Nit 値を掛けて Nits に変換すること

Mid Output Nits .midoutputnits 🎯

出力画像で中間点をどれくらい明るくしたいか:

  • Mid Output Nits: 出力画像で中間点 (Mid Input Nits に対応する値) をどれくらい明るくするかを Mid Input Nits 比で指定。SDR には実 Nits の概念がないため、これは入力に対する相対値であり真の出力輝度を意味しない

Peak Input Nits .peakinputnits 🔆

入力画像のピーク輝度 (Nits 単位):

  • Peak Input Nits: 入力画像のピーク輝度を Nits 単位で指定。Analyze TOP での実測値、または既知の素材スペックを入れる。Hable Filmic / Extended Reinhard / Extended Reinhard Luminance 選択時に使用される

Exposure Bias .exposurebias 📷

Hable Filmic 専用の露出補正:

  • Exposure Bias: Hable Filmic トーンマップにのみ適用される、絵作り上の露出補正値。Hable Filmic 以外を選んでいる場合は無効

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: HDR 動画素材を SDR ディスプレイに表示する 🎬

Movie File In TOP (HDR 素材, 16-bit float) → Tone Map TOP (Type = ACES Approx) → Out TOP

Nits ベースで撮影された HDR 動画素材を、通常の SDR ディスプレイで表示可能な 0.0〜1.0 レンジに収めるための基本パイプライン。ACES Approx は映画的な色合いの定番で、最初の選択肢として無難。Movie File In TOP の Pixel Format は 16-bit float 系にして HDR の階調を保持してから Tone Map TOP に渡す。

  1. Movie File In TOP に HDR 動画を読み込み、Pixel Format16-bit float (RGBA) に設定
  2. Tone Map TOP を後段に接続
  3. TypeACES Approx に設定
  4. Peak Input Nits に素材のピーク輝度 (例: 1000 Nits 素材なら 1000) を入力
  5. Out TOP に繋いで SDR ディスプレイ用の出力経路を確立

Example 2: RenderのHDR結果をSDRに収める 💡

Render TOP (16-bit float, HDR ライティング) → Tone Map TOP (Type = Hable Filmic + Exposure Bias 調整) → 後段 Composite

Phong / PBR シェーディングで光源強度を高く設定すると Render TOP の出力に >1.0 の高輝度値が含まれる。これを単純にクランプすると白飛びするため、Tone Map TOP で滑らかに圧縮する。Hable FilmicExposure Bias を動かしてハイライトの粘りを絵作りで調整できる唯一の方式。

  1. Render TOP の Pixel Format16-bit float (RGBA) 以上に設定して HDR を保持
  2. Tone Map TOP を後段に接続
  3. TypeHable Filmic に設定
  4. Peak Input Nits をシーンの最大輝度に合わせて調整 (おおよその目安で OK)
  5. Exposure Bias を −2.0〜+2.0 の範囲で振りながらハイライトの好みに合わせる

Example 3: Analyze TOP と組み合わせた動的トーンマッピング 📊

HDR 入力 → Analyze TOP (Average → Monochrome TOP で luminance) → CHOP 経由で Mid Input Nits / Peak Input Nits を駆動 → Tone Map TOP

シーンの明るさが時間や入力で変動するケース (ライブ映像入力やインタラクティブ照明) で、Mid Input NitsPeak Input Nits を素材の実測値から自動駆動するパイプライン。公式 docs が推奨する Analyze TOP (Average) → Monochrome TOP (luminance) の流れを参照値として使う。Reference White Nit 値を掛けて Nits に変換するのを忘れない。

  1. HDR 入力 TOP を Analyze TOP (Function = Average) に通す
  2. Monochrome TOP で輝度 (luminance) チャンネルに集約
  3. TOP to CHOP で Nits 値を CHOP に取り出す
  4. プロジェクトの Reference White Nit 値を掛けて Nits 単位に正規化
  5. CHOP リファレンス式で Tone Map TOP の Mid Input Nits / Peak Input Nits を駆動

関連オペレータ 🔗

類似機能OP 🔍

  • Level TOP — 明るさ / コントラスト / ガンマを線形に調整する基本的な階調補正 TOP (トーンマップ関数は持たない)
  • Lookup TOP — LUT (Look-Up Table) を介した任意の色変換 (自作 LUT でカスタムトーンマップに近い処理を実現)

組み合わせ推奨OP 🔄

  • Analyze TOPMid Input Nits / Peak Input Nits の実測値計算 (公式 docs 推奨の組み合わせ)
  • Monochrome TOP — Analyze TOP の Average 出力から luminance を取り出して Nits 値に変換する経路
  • Movie File In TOP — HDR 動画素材の読込元として上流に配置
  • Render TOP — HDR ライティング結果の生成元として上流に配置

前処理・後処理TOP 🎯


Info CHOP情報 📊

Tone Map 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: 出力が真っ白に飛ぶ / 真っ黒に潰れる
✅ Solution:

  • Type を変えて試す。Reinhard は SDR レンジを使い切れず暗くなりがち、ACES ApproxHable Filmic の方がコントラストを保ちやすい
  • Peak Input Nits が素材の実ピーク輝度と大きくズレていないか確認 (小さすぎると白飛び、大きすぎると暗くなる)
  • Mid Input NitsMid Output Nits の比率を調整して中間トーンを明るく / 暗くする

❌ Problem: 色相がシフトする / 彩度が変わる
✅ Solution:

  • Extended Reinhard Luminance に切替える。チャンネル別ではなく輝度ベースで圧縮するため色相を維持しやすい
  • ACES Approx は意図的にやや暖色寄りの絵作りになるため、ニュートラルに近づけたいなら FilmicLottes も検討
  • 強いトーンマップの後段で Lookup TOP や Level TOP で色相補正を行う

❌ Problem: Exposure Bias を動かしても結果が変わらない
✅ Solution:

  • TypeHable Filmic になっているか確認。Exposure Bias は Hable Filmic 専用パラメータで他の Type では無効
  • 他の Type で同等の明暗調整がしたい場合は、前段に Level TOP を入れて Brightness / Gamma を調整する
  • シーンの露出を抜本的に変えたい場合は Render TOP 側の光源強度や Constant TOP での乗算で対応

❌ Problem: 入力に 16-bit float / 32-bit float 以外を渡したのに見た目があまり変わらない
✅ Solution:

  • 8-bit fixed 系の入力は 0.0〜1.0 にクランプ済みのため HDR レンジを持たず、トーンマップする意味がほとんどない。HDR 効果を得るには 16-bit / 32-bit float の入力が必要
  • 上流 TOP の Pixel Format16-bit float (RGBA) または 32-bit float (RGBA) に変更
  • Movie File In TOP の場合は素材自体が HDR コーデック (例: ProRes / OpenEXR) で出力されている必要がある

参考資料 📚

その他 🔗

公式リソース 📖

外部リソース 🔗

この記事は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をコピーしました