notchとdisguiseで連携する話

#はじめに
この記事は「Notch #madewithnotch Advent Calendar 2019」８日目の記事です。

notchとdisguiseを組み合わせる話です。
notchのadvent calenderなのに半分程度はdisguise側での操作だったりします。

disguiseとはメディアサーバーの１種で、海外ではnotchとの組み合わせはよく見られるようです。

今回の記事ではdisguiseの基本操作などは省いてますので、ご了承ください。


環境
notch:PRO版 0.9.23.061
disguise:r16.0.1

それぞれの公式ページを見れば、だいたい分かることですが、
自分用のメモも兼ねてまとめていきます。

####主な内容
1.notchでの書き出し方
2.disguiseでの適用の仕方
3.osc連携他、細々した注意点など

#1.notchでの書き出し方
disguiseで使えるnotchのファイルはブロックファイルと呼ばれています。
拡張子はdfxdllというものになります。
今回使うdisguise以外にもAiなどの他のメディアサーバーや、TouchDesignerも対応しています。

まずMenuBar のProject > Compile Block for Media Server... をクリック
![1_compile.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/b0f4fcb8-ba86-4256-92c9-42d45db90797.png)

下記の画面が表示されますので名前をつけて任意の場所に保存します。
![2_save.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/913af0cf-6384-8102-6d8c-a835a13c5c07.png)
これで書き出しは完了です。
※以前のバージョンにはCreate 64 Bit Target という項目があったのですが、いつの間にかなくなってますね。

これで、このファイルをdisguiseに入れればnotchのデータが再生されます。
しかし、これだけだとただ動画が再生されるのと大差ないです。

そこで、今度はnotchのプロパティを書き出して、disguise側で値を触れるようにします。
各プロパティの左側に？マークがあります。
これをクリック。
![3_expose.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/78e78a55-9ba8-d62f-2dea-c998949ccd81.png)

すると下記のウィンドウが開きます。
![4_exposecheck.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/01047748-57e1-2682-2d1d-85eb3108ffb2.png)
赤枠の部分にチェックを入れます。
書き出した値の名前の変更なども行えます。
これで、この値をdisguiseでも触ることができるようになります。
最小と最大値を決めることができますが、
disguiseでの使用であれば、disguise側で最小最大は決められるので、私はあまり使わないです。

ちなみに下記図の部分で書き出しているプロパティが見られます。
![expose.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/abcfa150-2977-55cb-392f-aed183c0e379.png)


#2.disguiseでの適用の仕方
ファイルを書き出したら今度はdisguiseに持っていって適用させます。
使いたいプロジェクトのフォルダを開きます。
「objects」フォルダ内に「NotchFile」というフォルダがありますのでその中に入れてください。
※もしなければ、「objects」フォルダ内に「NotchFile」という名前で新たにフォルダを作成してください。
![5_notchfile.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/9a375b3d-8147-7e0f-0e32-bb70664c5c78.png)
※disguiseサーバーにはnotchのplaybackライセンスが含まれているものとそうでないものがありますので、
　使用されるサーバーに含まれているか確認してください。
　もし含まれていなければ、notchのドングルを差すことで使用可能です。
　notchのライセンスによってはウォーターマークが出ます。
起動した状態でコピーしても大丈夫ですが、
その場合、読み込む際に一瞬フリーズしますのでご注意ください。

disguiseを起動して、新規レイヤーを作成します。
レイヤーのタイプはnotchを選択してください。
![5_createlayer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/5fc9cb6d-28e8-97c3-9ed1-37c7210b8dee.png)

レイヤーが作れたら、notch レイヤーのプロパティを見てください。
notch レイヤーのeffect を左クリックすると、先程コピーしたファイルが選択できます。
使いたいファイルを選択します。
![7_select.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/08b0625c-23f0-405f-e1cc-75f67a282182.png)

これでnotchのファイルが再生できるようになりました。

レイヤーを分けて作っている場合、Propatiesの中のNotch Layerから
使いたいレイヤーを選択してください。
![7_select2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/2a095aaf-de3d-e3c4-2f90-b34fd4a07796.png)


では、次にnotchで書き出した値をいじったり、カメラ画や動画などにnotchで作ったエフェクトを適用させる方法です。

まずは、書きだした値の変え方です。
notchレイヤーのプロパティをみてください。
![7_select3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/7a6adedd-c37e-a058-d9e4-9688a244d3a6.png)
notchで書き出した値が左側の赤枠に反映されています。
ここの数値を変えることで、位置や色など各種プロパティを変更できます。
値部分を右クリックすると右側の赤枠のプロパティが現れます。
ここで、最小最大値などを変えることができます。

では次にカメラエフェクトの適用方法です。
今回はカメラ画の代わりに適当な動画を使います。

notch側でVideo LoaderのVideoのプロパティを書き出しておきます。
※書き出さなければ、そのままその動画が適用されたままになります。
![8_videoloader.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/efb4c735-2f75-2d8f-f9ce-2db9ac7b6e0a.png)

エフェクトを掛けたいコンテンツを用意してください。
コンテンツはdisguiseの「objects」フォルダ内の「VideoFile」に入れておいてください。
disguise側に戻って、新しくvideo layer を作成します。


作成できたら今度は画面下部のタイムラインを見てください。
エフェクトを適用したいレイヤーから、
alt を押しながら、左クリックをドラッグ＆ドロップで
notch のレイヤーへ矢印を伸ばしてください。
図のように△が確認できればOK です。
![9_tekiyo.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/86b0d54d-c734-6168-3a01-8a261b126745.png)

再び、notch レイヤーのプロパティを見てください。
Video プロパティの中のVideo Source Source のimage を
先程矢印を引っ張ったレイヤーに切り替えてください。
![10_video.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/7fd5163f-0b16-8b8c-8d87-01a3af1b36cb.png)
これでエフェクトの適用は終わりです。

オリジナル
![11_before.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/31a45827-0035-9fa4-4e7d-e65e9ffbba28.png)
notchレイヤー適用
![12_after.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/a15121d7-cb99-1fa7-71f2-ac49a4e0a00d.png)

ちなみに、notch公式ページでカメラエフェクトのサンプルを配布しています。
1つのファイルにつき複数のエフェクトが収録されています。
dfxとブロックファイルそれぞれDLできます。
https://www.notch.one/products/notch-blocks/
結構種類もあるのでおすすめです。



#3.osc連携他、細々した注意点など
別記事を立ててもいいのだけど、覚え書き的に書いておきます。

###osc連携に関するメモ
disguiseを使ってOSCで連携するときに、notch側では特に設定はなくていいようです。
よくよく考えたら当たり前ですが、
notchでも設定しないとだめだと思ってました。
ブロックファイルに書き出して使用するなら、notch側ではOSCノードはいりません。
適用したい値をエクスポーズするだけです。

disguiseもnotchも文字列は多分受け取れない？
そのへん知ってるかたいたらぜひ教えていただきたいです。
notchはjavascript書けば行けるのかもしれない…。

disguiseでOSCを通して受け取った値の適用の仕方。
altドラッグではだめ。
d3/xxx(任意のアドレス名)で送信側は設定
適用するときには、適用したい値のexpressionに
osc:d3.xxxと記述が必要です。
ちなみに、ここでminやmaxを指定してもOSCの値は制限されないようです。
制限が必要なときは、別途notch側で制限しておく必要がありました。


###細かい注意点など。
・他の動画の上に単純に重ねたい場合などは、notchのRoot nodeの設定で、
Composite Blend ModeがBlend With Alpha Channelなどになっていないと抜けません。
設定を変えるのを忘れて抜けない！なぜ！ということがちょこちょこあります。
![blend_alpha.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/528711/a58d8fdb-4dc9-4c27-0137-fd3702834d55.png)

・ブロックファイルを入れると結構重くなり、disguiseの起動に時間がかかったります。
　基本的にはnotchのデータは１つにまとめる方がいいらいしいですが、
　場合によっては分けたほうがいいとか。

・書き出した値が多過ぎても重くなるとか。

・notch側でfpsを固定していないとbuilder上とdisguise上での挙動が結構変わります。
　パーティクルなどは特に見え方が変わるのでご注意ください。

・keyboad Modifierを使えません。押しても変化ないです。。。


#終わりに
ここまでお読みいただきありがとうございます。

何か質問やアドバイス、補足などありましたらご連絡ください。
https://www.facebook.com/sry.tani

次回は20日にNotchの~~OSCで周りの話を書く予定です。~~

※20191209追記・修正
　OSCの話書いてる方いたので、別の話書きます。