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

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

Multiply TOP の乗算合成機能を示す図

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

概要 📖 – 2枚の映像を掛け合わせる

Multiply TOPは、2つの入力画像を画素ごとに掛け合わせ、暗く焼き込むように合成する TOPです。白(1.0)を掛けると元のまま、黒(0.0)を掛けると黒になるため、マスクや陰影付けの定番として使われます。

主な用途 🎯

  • 2枚の映像を画素ごとに乗算して暗く焼き込む合成
  • マスク画像との乗算による部分的な切り抜き・くり抜き
  • グラデーションやランプとの乗算による明るさのムラ付け
  • テクスチャ同士を重ねた質感の合成(汚し・グランジ表現)
  • ライティング用マップとカラー画像の乗算による陰影付け

データフロー 🔄

入力1: 固定レイヤー画像 + 入力2: 重ねる画像

画素ごとの乗算合成(位置・回転・拡縮の調整つき)

出力: 暗く焼き込まれた1枚の画像

Tips

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

まる。
まる。

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


パラメータ解説 ⚙️

Transform Page 📁

固定レイヤー指定 .size 📐

Fixed Layer (固定レイヤー) — どちらの入力を基準サイズの固定レイヤーとし、もう一方を調整可能な重ねレイヤーとして扱うかを決めます。固定レイヤーの解像度と縦横比が合成結果の最終サイズになります。

項目 内部名 説明
Input 1 .input1 入力1を固定レイヤーにする(既定)
Input 2 .input2 入力2を固定レイヤーにする

重ねレイヤーの収め方 .prefit 🖼️

Pre-Fit Overlay (重ねレイヤーの収め方) — 固定レイヤーではない側(重ねる画像)を、合成枠にどう収めるかを指定します。

項目 内部名 説明
Fill .fill 固定レイヤーの解像度と縦横比に合わせて引き伸ばし・押し潰す
Fit Horizontal .fithorz 横幅を固定レイヤーに合わせて伸縮
Fit Vertical .fitvert 縦幅を固定レイヤーに合わせて伸縮
Fit Best .fitbest 重ねレイヤーが切れない最良の比率で収める(縦横比を維持)
Fit Outside .fitoutside 枠を埋める最悪の比率で収める(縦横比を維持、Fit Best の逆)

横方向の揃え位置 .justifyh ↔️

Justify Horizontal (横方向の揃え位置) — 重ねレイヤーを横方向のどこに揃えるかを指定します。

項目 内部名 説明
Left .left 固定レイヤーの左端に揃える
Center .center 固定レイヤーの中央に揃える
Right .right 固定レイヤーの右端に揃える

縦方向の揃え位置 .justifyv ↕️

Justify Vertical (縦方向の揃え位置) — 重ねレイヤーを縦方向のどこに揃えるかを指定します。

項目 内部名 説明
Bottom .bottom 固定レイヤーの下端に揃える
Center .center 固定レイヤーの中央に揃える
Top .top 固定レイヤーの上端に揃える

端の繰り返し方 .extend 🔁

Extend Overlay (端の繰り返し方) — 重ねレイヤーの端の外側で、画像をどう扱うかを設定します。

項目 内部名 説明
Hold .hold 端の画素値をそのまま外側へ引き伸ばす
Zero .zero 端より外側には画像を出さない
Repeat .repeat 端で画像を繰り返してタイル状に並べる
Mirror .mirror 端で画像を鏡像反転して繰り返す

変形パラメータ 🎚️

Rotate .r 🔄
Rotate (回転) — 重ねレイヤーを回転させます
– 値を増やすと時計回り、減らすと反時計回りに回転します

Translate .t
Translate (移動) — 重ねレイヤーを X (tx) と Y (ty) 方向に移動します

Translate Units .tunit 📏
Translate Units (移動の単位) — 移動パラメータで使う単位を設定します

Scale .s 🔍
Scale (拡大縮小) — 重ねレイヤーを X (sx) と Y (sy) 方向に拡大・縮小します

Pivot .p 🎯
Pivot (中心点) — 重ねレイヤーが拡縮・回転するときの基準点を X (px) と Y (py) で定義します
– 中心点を変えると、変形順序によって結果が変わります

Pivot Units .punit 📏
Pivot Units (中心点の単位) — 中心点パラメータで使う単位を設定します

Legacy Transform .legacyxform 🕰️
Legacy Transform (旧式の変形) — 有効にすると、回転と変形順序が反転した旧来の変形行列の計算方法を使います


実践アイデア 💡

Example 1: マスクで切り抜く ✂️

Movie File In TOP → Multiply TOP ← Ramp TOP (円形マスク)

カラー映像に対し、白黒のマスク画像を Multiply TOP で乗算することで、白い部分だけを残し黒い部分を黒く落とす切り抜き合成の基本フロー。マスクの形を変えるだけで自由なくり抜きが作れます。

  1. Movie File In TOP で切り抜きたいカラー映像を読み込む
  2. Ramp TOP や Circle TOP で白黒のマスク画像を用意する
  3. 両方を Multiply TOP の入力1・入力2につなぐ
  4. マスクの白い部分だけ映像が残り、黒い部分は黒く焼き込まれる

Example 2: 陰影マップを焼き込む 🌑

Constant TOP (ベースカラー) → Multiply TOP ← Noise TOP (陰影マップ)

ベースとなるカラー画像に、Noise TOP などで作った明暗マップを Multiply TOP で掛け合わせ、立体感や汚れのある質感を後付けする用途。ライティング前計算したマップを乗算するライト合成の入り口として使えます。

  • Constant TOP または Movie File In TOP でベースカラーを用意する
  • Noise TOP で明暗(陰影)のマップを生成する
  • Multiply TOP で両者を乗算し、暗い部分が焼き込まれた陰影付き画像を得る

Example 3: 明るさのムラ付け 🌗

Movie File In TOP → Multiply TOP ← Ramp TOP (グラデーション)

映像に Ramp TOP のグラデーションを乗算して、画面の片側を徐々に暗く落とす周辺減光(ビネット)風の演出を作る例。掛ける側のグラデーションを調整するだけで明るさのムラを自在に付けられます。

  • Movie File In TOP で素材映像を読み込む
  • Ramp TOP で明るさを落としたい方向にグラデーションを作る
  • Multiply TOP で乗算し、暗くしたい方向だけ自然に減光させる

関連オペレータ 🔗

類似機能OP 🔍

  • Composite TOP — 多数の合成モードを1つのノードで切り替えられる総合合成
  • Add TOP — 画素ごとの加算合成(明るく重ねる)
  • Screen TOP — 乗算の逆方向、明るく焼き込むスクリーン合成

組み合わせ推奨OP 🔄

  • Level TOP — 乗算前後で明るさ・コントラストを整える
  • Reorder TOP — マスクに使うチャンネルを入れ替えてから乗算
  • Add TOP — 乗算結果にさらに加算合成を重ねる
  • Difference TOP — 乗算と差分を組み合わせた質感づくり

前処理・後処理TOP 🎯


Info情報 📊

Multiply TOP はすべての 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: 画像のレイヤー枚数(2D 画像では 1)
  • gpu_memory_used: この TOP が使用している GPU メモリ量

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

よくある問題と解決策 🔧

❌ Problem: 全体が真っ黒になる
✅ Solution:

  • 片方の入力に黒(0.0)が多いと乗算で全体が黒く沈むため、Level TOPで掛ける側を明るく持ち上げる
  • マスク画像が意図通り白くなっているか、ビューアで値を確認する
  • アルファチャンネルだけ 0 になっていないか Channel Mask の対象を見直す

❌ Problem: 2枚の画像の位置やサイズがずれる
✅ Solution:

  • Fixed Layer でどちらを基準サイズにするか指定し直す
  • Pre-Fit OverlayFillFit Best に変えて重ねレイヤーの収め方を調整
  • 前段にLevel TOP等を入れ、解像度・縦横比を事前に揃える

❌ Problem: 色がにじむ・ジャギーが出る
✅ Solution:

  • Input SmoothnessInterpolate Pixels にして補間を有効にする
  • 重ねレイヤーを回転・拡縮している場合は Pivot(中心点)の位置を見直す
  • 強い拡大が必要なら掛ける側の素材自体を高解像度で用意する

参考資料 📚

その他 🔗

公式リソース 📖

関連オペレータ 🔗

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