Claude × TouchDesigner MCP｜リアルタイム映像をAIで操作する

TouchDesignerとClaude連携で何ができるのか

2026年時点で公開されている連携手段は大きく3つに分かれる。

1. TouchDesigner MCPサーバー — ClaudeがTDプロジェクトのノードを作成・削除・PythonスクリプトをTD内で実行できるブリッジ
2. VIBE-CONTROLLER — HTML Canvas UIをClaude Codeへの自然言語指示だけで生成し、TDにリロードするツール
3. Claude Code スキル「TouchDesigner Guide」 — Claude CodeをTD専用アシスタントとして動かすスキルセット

いずれもTDの操作コストを大幅に下げるもので、「ノード名が思い出せない」「Pythonスクリプトをゼロから書くのが面倒」という日常の摩擦を取り除く。

方法① TouchDesigner MCPサーバー — AIがプロジェクトを直接操作

touchdesigner-mcp は、MCP（Model Context Protocol）を使ってClaudeがTDの実行中プロジェクトを読み書きできるサーバーだ。TypeScript/Python製でMITライセンス、2026年6月時点でバージョン1.4.9が公開されている。

提供される主なツール

• ノードの作成・削除・メソッド呼び出し — Claudeへの一言でオペレーターを追加できる
• Pythonスクリプト実行 — TDのPythonコンテキスト内で任意のコードを走らせる
• パラメーター・エラーの取得 — ネットワークの状態をClaudeに読み込ませ、デバッグを任せられる
• ドキュメント参照 — TDのPythonモジュールのヘルプをClaudeが自動参照する

これにより「ノイズテクスチャを作って出力に繋いで」と言うだけで、Claudeが対応するノードを生成し配線まで行う。

TouchDesigner MCPのインストール手順

公式リポジトリ（https://github.com/8beeeaaat/touchdesigner-mcp）の docs/installation.md に従って進める。

前提条件

• TouchDesigner（最新版推奨）
• Node.js 18.x 以降（NPM方式の場合）

セットアップ

1. GitHubリリースページから touchdesigner-mcp-td.zip をダウンロードして解凍する
2. mcp_webserver_base.tox をTDプロジェクトにインポートする（フォルダ構造を保持すること）
3. TDをその状態で起動する

Claudeへの接続（3方式から選択）

方式A：MCPバンドル（Claude Desktop向け・最もシンプル）

1. .mcpb ファイルをダブルクリックするだけで Claude Desktop に登録される

方式B：NPMパッケージ（Claude Code向け）

1. claude_desktop_config.json に以下を追加する

{
  "mcpServers": {
    "touchdesigner-mcp": {
      "command": "npx",
      "args": ["-y", "touchdesigner-mcp-server"]
    }
  }
}

方式C：Dockerコンテナ

1. リポジトリをクローンして docker-compose up -d を実行する
2. HTTP転送またはstdioパススルーを選択する

動作確認

Claude上で「touchdesigner-mcpサーバーが表示されているか」を確認する。表示されていればTDの実行中プロジェクトに対してClaudeから指示できる状態になっている。

方法② VIBE-CONTROLLER — スケッチ1枚でUIを自動生成

VIBE-CONTROLLER は、HTML Canvasベースのコントローラーを「自然言語の説明だけ」でTD内に配備できるツールだ。

基本的な使い方

1. VJ中に「もっとつまみを増やしたい」と思ったらClaude Codeに変更内容を文章で伝える
2. Claudeが対応するHTMLコードを自動生成する
3. TDでリロードすると新しいUIが即座に反映される

「手書きスケッチからUI生成」もできる。Claude Code内の /sketch-to-interface スキルに写真をアップロードするだけで、ナプキンの落書きレベルのスケッチが機能するコントローラーに変換される。

Basic版とPro版の違い

VIBE-CONTROLLERには専用の CLAUDE.md が付属しており、Claudeが「このプロジェクトのUI構造を理解した状態」で指示を受け取るため、コンテキスト誤りによる生成ミスが減る設計になっている。

方法③ Claude Code スキル「TouchDesigner Guide」

MCPマーケット（mcpmarket.com）には「TouchDesigner Guide」というClaude Code専用スキルが公開されている。このスキルを適用すると、ClaudeはTD特有の制約を把握した状態で動作する。

スキルが解決する問題

通常のLLMをTDに使うと、存在しないオペレーター名を生成したり、パラメーター設定が実際のTD仕様と食い違うケースが頻繁に起きる。このスキルは op.TDAPI というカスタムユーティリティの使用を強制することで、ノード作成・ネットワークレイアウト・パラメーター設定の精度を高める。

ライブパフォーマンスのセッション中にリアルタイムでTDを書き換える場面など、「迷いなくClaudeに指示できる状態」を作りたい場合に有効だ。

実際のユースケース

VJパフォーマンス中のリアルタイム改修

演奏中に「ここのエフェクトをもっと激しくしたい」と感じても、ノードを手で探してパラメーターを変更する時間はない。MCP接続したClaudeに声でなくテキストで指示するだけで、実行中のTDプロジェクトに変更が入る。

インタラクティブインスタレーションのデバッグ

センサー入力のマッピングがうまく機能しない場合、Claudeにエラーログを読ませてPythonスクリプトの修正まで任せられる。TDとClaude Codeを行き来せずに作業を完結できる。

プロトタイプの高速化

「このジェネラティブアートのパターンに新しいレイヤーを追加して」という一言から、Claudeがノード構成を提案してTD内に実装する。アイデア検証のスピードが上がる。

現状の制限と注意事項

• TD側の接続が必要 — mcp_webserver_base.tox が常にプロジェクトに含まれていないと接続が切れる
• 複雑なネットワークへの影響 — 大規模なTDプロジェクトでClaudeがノードを生成する際、既存のネットワーク構造への影響を事前に確認することが推奨される
• スクリプトの実行権限 — PythonスクリプトをTD内で直接実行できるため、意図しない操作を防ぐためにClaudeへの指示は明確に絞るほうがよい
• 英語指示が安定 — MCPサーバーへの指示は現時点では英語のほうが精度が出やすい傾向がある

まとめ

ClaudeとTouchDesignerの連携は、MCPサーバー・VIBE-CONTROLLER・Claude Codeスキルの3層で成熟しつつある。ノードを手で繋ぐ作業時間を削り、「映像をどう見せるか」のクリエイティブな判断に集中できる環境が整いつつある。

まず試すなら touchdesigner-mcp-td.zip をダウンロードして mcp_webserver_base.tox をプロジェクトに組み込む方法が最短だ。Claude Desktop用の .mcpb ファイルを使えば、設定は文字通りダブルクリック1つで終わる。

参考URL

• TouchDesigner MCPリポジトリ: https://github.com/8beeeaaat/touchdesigner-mcp
• インストール手順: https://github.com/8beeeaaat/touchdesigner-mcp/blob/main/docs/installation.md
• VIBE-CONTROLLER: https://derivative.ca/community-post/asset/vibe-controller-touchdesigner-build-any-ui-claude-code/74272