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

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

Photoshop In TOP の Photoshop 連携・画像取り込み機能を示すサムネイル

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

概要 📖 – 編集中の画像を取り込む

Photoshop In TOPは、Adobe Photoshop で編集中の画像をネットワーク経由でリアルタイムに受信し GPU テクスチャとして出力する TOPです。Photoshop の Remote Connection 機能と連携し、JPEG / 非圧縮 RGB の画像形式や自動 / 手動の更新方式を選んで、編集中のドキュメントをライブで取り込みます。

主な用途 🎯

  • Adobe Photoshop で編集中の画像をリアルタイムにテクスチャとして取り込み
  • Photoshop でのレタッチ結果を即座に映像シーンへ反映するライブ連携
  • 別 PC で動く Photoshop の編集画面をネットワーク越しに受信
  • ロゴ・グラフィック素材を Photoshop で調整しながら配置確認
  • VJ・インスタレーション制作での素材プレビューと差し替え

データフロー 🔄

入力: Photoshop で編集中のドキュメント
 ↓
リモート接続 (IP アドレス / パスワード)
 ↓
画像形式 (JPEG / 非圧縮 RGB) で転送
 ↓
更新方式 (自動 / 手動) に応じて受信
 ↓
出力: GPU テクスチャ

Tips

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

まる。
まる。

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

パラメータ解説 ⚙️

Photoshop In Page 📋

接続設定 🔌

Active .active 🔘
Active (有効化) — オンにすると Photoshop からのデータ受信を開始します。オフで受信停止。

Address .address 🌐
Address (接続先 IP アドレス) — Photoshop が動いている PC の IP アドレスを指定します。同一 PC で TouchDesigner と Photoshop を動かす場合は localhost を指定可能。別 PC の場合は Photoshop の Remote Connection ダイアログに表示される IP アドレスを使用します。

Password .password 🔑
Password (パスワード) — Photoshop の Remote Connection ダイアログで設定したパスワードを入力します。

Image Format .imageformat 🎨

Photoshop ストリームを転送する際の画像形式

項目 内部名 説明
JPEG .jpeg JPEG 形式。更新レートが速い (転送量が小さい)
Uncompressed RGB .uncompressed 非圧縮 RGB 形式。画質が良い反面、更新レートは遅くなる

ドキュメントロック 🔒

Locked Document Name .lockeddocument 📄
Locked Document Name (ロック対象ドキュメント名) — Photoshop In TOP の入力を、Photoshop で開いている特定のファイルに固定するために使用します。

Lock to Current Document .locktocurrent 📌
Lock to Current Document (現在のドキュメントにロック) — クリックすると Photoshop で現在アクティブなファイルに入力を固定します。クリックすると上の Locked Document Name が自動入力されます。

Unlock .unlock 🔓
Unlock (ロック解除) — Locked Document Name をクリアします。ロック解除中は Photoshop で現在アクティブなドキュメントを取り込みます。

Update Mode .updatemode 🔄

画像を更新するタイミングの決定方式

項目 内部名 説明
Automatic .automatic Max Update Rate で指定したレートを上限に、可能な限り速く自動更新
Manual .manual 下の Update ボタンをクリックした時だけ更新

更新レート ⏱️

Max Update Rate .maxupdaterate 🎯
Max Update Rate (最大更新レート) — Update Mode が Automatic のときの画像の最大更新レートです。

Update .update ⚡
Update (更新) — クリックすると画像を手動で 1 回更新します。

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 Resolution が Custom 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: ロゴをライブ反映 🎨

(Photoshop で編集) → Photoshop In TOP (localhost / Update Mode=Automatic) → Level TOP → Composite TOP

同一 PC で動かしている Photoshop の編集ドキュメントを Photoshop In TOP で取り込み、Level TOP で明るさを整えてから合成シーンへ流す基本フロー。Photoshop 側でレタッチするたびに映像へ即座に反映されるため、素材の最終調整を実映像上で確認できる。

  1. Photoshop で「環境設定 > プラグイン > リモート接続を有効にする」をオンにしパスワードを設定
  2. Photoshop In TOP の Address を localhost、Password を Photoshop 側と同じ値に設定
  3. Update Mode を Automatic にし、Active をオンにして受信開始
  4. 後段の Level TOP で露出を整えてから合成へ

Example 2: 遠隔から画像受信 🌐

(別 PC の Photoshop) → Photoshop In TOP (Address=送信側IP / Image Format=JPEG) → Null TOP → 合成

デザイナーが別 PC で作業している Photoshop ドキュメントを、LAN 経由で TouchDesigner 側に取り込む構成。Image Format を JPEG にして転送量を抑え、更新レートを確保しながらリモートの編集内容をライブ受信する。役割分担した制作現場で素材確認を分業できる。

  1. 送信側 PC の Photoshop でリモート接続を有効化し、表示された IP アドレスとパスワードを控える
  2. 受信側 Photoshop In TOP の Address に送信側 IP、Password に同じパスワードを入力
  3. Image Format を JPEG に設定し転送量を抑えて更新レートを確保
  4. Active をオンにし、後段の Null TOP で参照点を作ってから合成へ

Example 3: 固定して手動更新 🔒

(Photoshop で複数ファイル) → Photoshop In TOP (Lock to Current Document / Update Mode=Manual) → Cache TOP

Photoshop で複数ファイルを開いている状況で、Photoshop In TOP の入力を特定ドキュメントに固定し、Update Mode を Manual にして任意のタイミングだけ取り込む構成。アクティブファイルが切り替わっても取り込み対象がぶれず、確定した版だけを Cache TOP に保持できる。

  1. Photoshop で取り込みたいドキュメントをアクティブにする
  2. Photoshop In TOP の Lock to Current Document をクリックし Locked Document Name を固定
  3. Update Mode を Manual に切替え、確定タイミングで Update ボタンをクリック
  4. 後段の Cache TOP で取り込んだ版を保持

関連オペレータ 🔗

類似機能OP 🔍

  • Movie File In TOP — 画像 / 動画ファイルや URL からの入力 (Photoshop ライブ連携ではなくファイル読込)
  • Syphon Spout In TOP — Syphon (macOS) / Spout (Windows) 経由で他アプリの映像を共有受信
  • Shared Mem In TOP — 共有メモリ経由で外部アプリの画像を取り込む
  • Video Device In TOP — カメラ / キャプチャデバイスからのライブ映像入力

組み合わせ推奨OP 🔄

  • Level TOP — 取り込んだ画像の露出 / コントラスト / ガンマ補正
  • Composite TOP — 他映像との合成 (Over / Multiply / Add 等)
  • Over TOP — アルファを使った前面合成 (ロゴ・グラフィックの重ね)
  • Cache TOP — 取り込んだ画像をフレームバッファとして保持
  • Null TOP — 後段の参照点を固定する中継ノード

前処理・後処理TOP 🎯

Info CHOP情報 📊

Photoshop In 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: Photoshop に接続できない / 画像が来ない
✅ Solution:

  • Photoshop 側で「環境設定 > プラグイン > リモート接続を有効にする」がオンになっているか確認
  • Address が Photoshop の Remote Connection ダイアログに表示される IP と一致しているか確認 (同一 PC なら localhost)
  • Password が Photoshop 側で設定した値と完全一致しているか確認

❌ Problem: 更新が遅い / 反映されない
✅ Solution:

  • Image Format を Uncompressed RGB から JPEG に切替えて転送量を抑える
  • Update Mode が Manual の場合は Update ボタンを押すか Automatic に変更
  • Max Update Rate を上げて自動更新の上限レートを引き上げる

❌ Problem: 想定と違うドキュメントが取り込まれる
✅ Solution:

  • Lock to Current Document で取り込み対象を特定ドキュメントに固定する
  • Locked Document Name に固定したいファイル名が入っているか確認
  • アクティブファイルを切り替えて取り込みたい場合は Unlock でロックを解除する

参考資料 📚

その他 🔗

公式リソース 📖

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