あなたのストーリーを、映像で形に。 まずはお気軽にご相談ください。 お問い合わせ

インタラクティブアートの作り方[Touchdesigner][InteractiveArt][デプスカメラ][WEBカメラ]

Touchdesignerを使ってInteractive art インタラクティブアート[体験型]の作り方をUPします。

インタラクティブの制作は一見難しそうに見えますが、Touchdesignerを使うと簡単にシンプルに出来上がります。

音に反応する映像から、WEBカメラ/赤外線カメラ/Realsense[デプスカメラ]/北陽センサー[測域センサー]を使っていきます。

このブログに書いていくインタラクティブアートの作り方は基本のみです。

これを基盤にしていろんな作品ができると思います。

子供が大喜びする体験型の作品!ぜひチャレンジしてみてください♫

Touchdesignerは公式のHPから無料ダウンロードできます。

Touchdesigner公式HP

TouchDesigner 初心者さんオススメの本↓

TouchDesigner プロが選ぶリアルタイムレンダリング

TouchDesigner 中級者さんオススメの本↓

TOUCHDESIGNER 映像と音楽を駆使したビジュアルアートの創り方


音[声]に反応する映像の作り方

PCのマイク(音・声)に反応して映像がリアルタイムに動きます。音の大きさで波紋の反応も変わります。すぐに試せるので初心者さんにオススメの作品です。

こちらも[声][音]に反応します。周波数を分けて作りました。
PCのマイクでインタラクティブに反応します。


WEBカメラ[赤外線カメラ] 動きに反応するインタラクティブアートの作り方[モーショントラッキング]

動画ではPCのカメラを使用しています(外部WEBカメラでも可能です)
プロジェクターを使って投影しながら、暗い所で行う場合は赤外線カメラを使うといいですよー

TouchDesignerでグリッドを引いて動いたら線が反応するインタラクティブアートです。
こちらもPCカメラを使用しています。動きが重いのでPCのスペックが必要です。

こちらはTouchdesignerのパーティクルは使っていません。
動作が軽くおすすめなインタラクティブアートです。
赤外線カメラでも反応します↓(チュートリアルではPCのカメラを使っています)

ELP 1080Pウェブカメラ

TouchDesigner tutorial Interactive with camera

はぐるま島ココロのひみつのキャラクターを使ったインタラクティブな作品の作り方です。
画像やハートの動画は自由に変更できるので、いろいろ応用できると思います!

リアルタイム[インタラクティブ]にロゴに衝突する映像の作り方です。
赤外線カメラと赤外線反射テープを使っています。

動きに合わせてたくさんの桜の花びらが散ります。
TouchdesignerのParticlesGPUという機能を使って高速化を実現させています。

インタラクティブにたくさんの粒子を発生させています。
TouchdesignerのParticlesGPUを使っています。


デプスカメラ[RealSenseCamera] インタラクティブアートの作り方

RealSenseD435というデプスカメラを使っています。動いたところからParticleが発生するインタラクティブアートです。
RealsenseCameraは小型で性能もよく、低価格。お勧めです。
※現在TouchDesignerで使う場合はWindowsのみ対応です!

こちらもRealsenseカメラを使っています。Touchdesignerで当たり判定をとってParticleに触れたら反応するように作ってます。

Realsensカメラでデプスに設定 カメラで撮影している動きにパーティクルが追従してきます。
モーショントラッキングです。

モーションキャプチャをとって動いたところにBoxをぐるぐるさせます。ぐるぐる回るBoxが面白いインタラクティブアートです。

静止しているパーティクルに反応させます。Realsenseカメラは手前でなく後ろに置いて撮影しています。

realsenseのスケルトントラッキングを使っています。スケルトントラッキングは有料のSDKが必要です。※使用していたSDKが廃止になってしまったようです😢

RealsenseCameraD455↓

Intel Realsense Depth Camera D455


北陽電気 測域センサーとTouchDesigner[HokuyoChop]

北陽の測域センサー UST-10LXとTouchDesignerを使ってインタラクティブの基盤となる[タッチ]の認識を行います。
買ったすぐは電源の線が繋がっていないので注意してください!!

センサーうまく位置を調整できるとこのように触って弾ける ボールを投げて弾ける映像が作れます。

子供たちに人気のインタラクティブアートです。

北陽の測域センサー UST-10LX↓

北陽電機 (HOKUYO) UST-10LX


TouchDesigner[iPhoneライトに反応インタラクティブアート]

強い光に反応するインタラクティブアートの作り方です。スマホのライトを使ってます。


おまけ:Scratch ビデオモーションセンサーでインタラクティブを作ってみる

ビジュアルプログラミングのScratch3にもビデオモーションセンサーが付いています。簡単にインタラクティブな作品がつくれちゃいますよ👍
PCのカメラを使っています。


最後までありがとうございました!
たくさんのインタラクティブアートを紹介しましたが、どれも初歩的なものです。
応用すればもっと楽しいのが作れると思います。頑張りましょ~!


--------------------------------------------------------------------------------------------------

合同会社STORY WORKS

ぎまパパチャンネル[プロジェクションマッピング/Scratch/TouchDesingnerの使い方/VJ]

FaceBook

X

Instagram

Threads

合同会社STORY WORKS代表 儀間博成

沖縄県在住 44歳

沖縄県宮古島出身。映像クリエイター/空間演出家。
合同会社STORY WORKS 代表として、プロジェクションマッピング、3DCG、インタラクティブアート、3Dビジョンなど、空間を活かした映像演出を手がけています。

33歳で個人事業「ONE ACTION」として独立。
世界遺産・中城城跡、沖縄体験王国むら咲むら、東京・築地本願寺でのイベント「TOKYO CHEMISTRY」、東京・渋谷のレストラン常設演出、マニラの飲食店壁面演出など、国内外のさまざまな空間で映像制作を担当してきました。

2025年2月14日には合同会社STORY WORKSを設立。
EXPO 2025 大阪・関西万博のプロジェクションマッピング制作にも携わるなど、技術と感性を融合した表現で、空間に“物語”を映し出す制作を追求しています。

また、絵本制作、イベント企画、子ども向けプログラミング教室、YouTubeでの発信など、映像の枠を超えたクリエイティブ活動も展開しています。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次