🐈

UE5とTouchDesignerでVJをはじめよう

2022/12/09に公開

楽しかったAudio Visual LIVE

卒業式の「楽しかった修学旅行」
「修学旅行(全員)」
みたいな文で始めてますが、

今回はUE5とTouchdesignerでVJをしたので、

そこで培ったものを今後UE5とTD(Touchdesigner)でVJまたは、イベントをやるであろう皆さん
ご共有できればと思います!!

さざれ場 #001にて、パフォーマンスしました。
その様子こちら↓

https://www.youtube.com/watch?v=v4flzTJbKBk

音はUZUさん
miwa maroon は横にいました。。

TDはUIを自由に組めて、当日のオペレーションがすごいやりやすかった
し、
UE5は見ての通りライティングがかっこよすぎって初心者でもそれなりの絵が出せる!!

最強の組み合わせ。
例えるなら、サイモンとガーファンクルのデュエット!
ウッチャンに対するナンチャン!
高森朝雄の原作に対する
ちばてつやの「あしたのジョー」!
…つうーっ感じっスよお~っ

引用https://www.zaikei.co.jp/article/20170107/346214.html

絶対必要なこと

単刀直入にいいますと、

TDとUE5をどう連携させるかです!!

それはわかってるよ!もっと具体的に!!

ですよね~

連携方法としては、主に3つで、

  1. OSC
  2. NDI
  3. DMX

です。
聞いたことなくても大丈夫。そんなに難しいことではないので!!
これはリアルタイムでの通信を前提にお話しします!

システム概要図

自分のPCのスペック的にtouchDesignerとUE5を同じPCで動かすのは、しんどすぎました。
TouchDesignerだけなら問題ないんですけど、UE5が来ると重すぎて、
ロードローラーだっ!!
を思い出しました。
ってことで、PC2台のシステム概要図こちら

理解する必要ないので、パッと見てください~

1.OSC

OSCは、int、float、stringが送受信できるので、
TDで受け取ったのデータをlow、mid、highなんかにわけて、
音量として、UE5に送ります。

エフェクトのオンオフのUIもあるので、これもOSCで送ります!!

UE5では、そのデータを受けれるように、OSC pluginを使います。
OSCを受け取るBluePrintはこんな感じ~

おのおのOSCで反応させたいActorのBaseを作ります

これでOSC受け取り専用とエフェクト等のActorで機能分けられた!
万歳!
OSC_Base継承したエフェクトのブループリントの一例

てな感じで、UE5のすべてをTouchDesignerで制御できるようになります

注意 OSCでやり取りするには、TouchDesignerの環境とUE5の環境が同じネットワーク内にある必要があります。IP Addressやportの設定もあるので、詳しく知りたい方は、
こちらの動画から

2.NDI

OSCは数値や文字を送れました
後必要なのは映像!!
なぜなら、最終OutはTouchDesignerからHDMIとかで出力するからっす

まあ要は、UE5の画面をTouchDesignerに送ろうよって話です。

そんなときに使うのがNDI
TouchDesignerは NDI in TOP

UE5はわれらの父Satoru Higaのこのplug-inが最強です
https://github.com/backspacetokyo/UE-NDIMedia
https://www.youtube.com/watch?v=RVNNSYyeOFY

動画見てもらえればわかるんですが、Capture buttonを押さないと送信が始まらないので、
これをPIE時にできるようにEditor BluePrintを作った(はじめてつかったぞ)

ちなこれを使うために、Buildはしてません!!Editor画面でいくんじゃい!!

まあこんな感じで、NDI簡単じゃん!

と思われるかと思いますが、結構あれ?映像来ないなってときあります

NDIもOSC同様どういつネットワーク上にある必要があります。
それでも送れないときは、アプリ立ち上げ直したり、必殺のおまじない再起動!

ちなみにLIVEの時は、一回もおちなかったからそこそこ安定してます!!!怖がらせてごめんなさい

3.DMX

正直これは必須ではないです

ただUE5のムービングライトとかはplug-inのDMXで制御可能なので、覚えとくと表現の幅は広がります。
たとえば、miwa maroonは8×8のムービングライトをTouchDesignerから制御しました

UE5のムービングライトのチャンネルはこんな感じになっている。
ちなみにDMX componentにこのFixtureを設定する必要がある。

なので、TouchDesignerで対応するような Constant CHOP を作ります

この値にlowの値だったり入れてくとaudio rectiveなムービングライトになるわけですね。

8×8のライトを制御するときに、1つ1つそれぞれで制御させようとすると、単純計算
8×8×8(パラメーター数)=512
512チャンネル必要になるんですよ。

嗚咽しました

さらにlowで光らせたいとかhighで光らせたいとか、回したいとか考えたら、あまりにもやることおおきすぎる

さすがにヤダってことで、
うまく最低限でかつ自由にできる方法ないかなって考えました。
その結果、64チャンネルでいろんなライトの演出方法を変えられるようにしました。

説明が文面じゃ難しいので、興味ある方はこちらの動画から
YouTubeのvideoIDが不正ですhttps://youtu.be/11LUy8Ry6FE?t=344

DMXも同様、ArtNetというネットワークを介して送っています。
ってことは、ip Addressの設定必要なやつ~~

TouchdesignerはDMX Out CHOPで設定

UE5はProject設定から

十分条件

あるといいよっていうのは、

TouchDesignerでUIを組むことです。

全く触ったことない人には、ラーニングコスト高いと思われますが、
そんなことなくてコツをつかめば、だんだん楽しくなってきます。
基礎はここら辺の動画がわかりやすいです。
https://www.youtube.com/watch?v=UWtO-dVipO8
https://www.youtube.com/watch?v=O-CyWhN4ivI

見せるのがすこしはずいですけど、My VJ Systemはこんな感じで、

操作を簡単にするためのコンセプト
動的な組み方するためのコツ

とかを下の動画で語っています
https://www.youtube.com/watch?v=11LUy8Ry6FE

これであなたもUETDVJ

この最低条件クリアするために、
UE5できるひとは、ちょっとTouchdesignerを勉強してみたり、
逆も然り。。。

個人的には、UE5のほうが断然ムズイ。。機能多すぎて。。

そこを乗り越えれば、ここからはあなたの完全フリースタイル

みなさんがやりたいようにやっちゃってください!

さらに、
miwa maroonが映像や世界観を作るうえで、行ったクリエイティブプロセスを知りたいとの声が多々あったので、
こちらから興味ある人は、ざっと見てください~
link

質問あれば、twitterinstayoutubeどれでもいいのでお気軽にしてください~

自分もまだまだ成長途中なので、これを読んでいただいたみなさんと一緒に、
成長していけたらいいなと思っているので、
ぜひいいね、フォロー等お願いします!!

まじでみんな

ぶらぼー

Discussion