![スクリーンショット_2018-06-27_22](https://assets.st-note.com/production/uploads/images/6971919/rectangle_large_type_2_b7659df7c40063bfabc31507441413b1.jpg?width=1200)
「untitled」「Inner Universe」システム完成!
前々回のnote 「untitled」制作中 ~インタラクティブ!の進捗報告と種明かしをしようと思う。もともと、このプロジェクトはの最終目標は3Dオーディオ作品と組み合わせて使うことであるが、システムがほぼ完成したのでシステム面について書こうと思う。とりあえず、現在のデモ動画!曲の方向性が固まってきたので、「Inner Universe」という仮タイトルをつけた。
Twitterのより長め
目次
・デモ動画
・前回からの進捗
・システム
OSC通信
REAPER
Max/MSP
サーバー [Node.js - socket.io]
クライアント [processing.js]
・今後
・まとめ
前回からの進捗
前回からの進捗を書き出すと以下のようになる。多少の改善点はあるが、システムとしてはこれで完成と言える。
・サーバーサイド
シーケンサーからの入力ができるようになった
Max/MSPからプロジェクト全体のコントロールができるようになった
スマホの個別制御ができるようになった
・クライアントサイド
UIの改善
画面遷移
システム
このプロジェクトのシステムは以下の図のようになっている。
今回はスマホのコントロールサイドのみを説明する。
ここから、細部について何が起こっているかの説明をしていくが、その前にOSC通信について説明しておく。
OSC通信
OSC通信とはOpenSound Controlの略で、もともとはMIDI規格の代替となることを目指して作られた。結局、MIDI規格はすでにたくさんのところで用いられていたため、代替とはならなかったが、MIDIよりも自由に様々な情報を送受信できる。その特性を活かして、リアルタイムでの情報のやりとりに使われている。
OSCは様々なリアルタイム表現ソフト、DAWやVJなどのソフトで使用可能である。
使い方もすごく簡単で、これを使えばリアルタイムで色々なソフトに情報を送れるし、他のパソコンにも情報を送れる。
このプロジェクトでもシステム図を見て分かる通り、osc通信が複数のアプリケーション間を繋いでいる。
それでは、各々のソフトでの処理の詳細を見ていく。
REAPER
REAPERはDAWソフトで先日ircamに見学しに行った時も多くの人が使っていた。このプロジェクトは3D音響を中心としたプロジェクトのため、曲のタイミングに合わせて色々なイベントが起こる必要がある。それを実現するため、REAPERに全てのイベント情報が書かれている。
REAPERにはircamが開発した、ToscAというプラグインを入れている。
フリーソフト!!
これを使うと、オートメーションの値をoscメッセージとして送信できる。
ToscAはプラグインなので、どのDAW使ってても入れられる。
今回は、スマホの背景色、点滅スピードを送信している。
また、Max側から再生・停止のoscメッセージを受信して再生・停止を行うことができる。
Max
Maxでは、受信したoscメッセージを処理してサーバーに送信している。REAPERからはスマホのコントロール情報だけでなく、3D音響用の情報もoscメッセージで全て送られて来るため、これらのメッセージを分けて、それぞれのソフトに向けて送信している。
また、このプロジェクトのオペレーションを行う際にMaxのみで全てが完結するようにcueをoscで送信するようにしている。cueが送信されるとスマホの画面切り替えやREAPERのスタートといったイベントが起こる。
oscメッセージのやりとりが多すぎて、CPU使用率が500%くらいになり、メッセージの遅延が発生したため、3D音響の処理を他のパソコンで行うことにした。また、モニター画面も元々はMax内に作っていたが、Processingで行うことにした。
この結果、CPU使用率が150%ほどまで下がり、遅延が発生しなくなった。
サーバー [Node.js - socket.io]
ここの実装が一番大変で、丸3日くらいかけた。
といのも、JavaScriptに全然慣れてないのと、サーバ・クライアントの扱いが難しかったこと、そしてosc通信をNode.jsと組み合わせる参考サイトが全然なく、あったとしても全然うまくいかなかったからだ。
Node.jsとsocket.ioの説明は難しいので、割愛。。
簡単にいうと、webブラウザでできるアプリなどリアルタイム性が必要なwebページでよく使われていて、ユーザーの動作なしにサーバー側からイベントを起こせる。Web Socketという技術。
これを使うことで、サーバー側、すなわち自分のパソコンから、特定のURLに繋がったスマホの画面の色などをコントロールすることができるようになる。
前回の記事でも書いたが、このNode.jsを使えばアプリをダウンロードしてもらうことなく、簡単な制御をそれぞれのスマホに対して個別に行うことができる。
サーバー側ではMaxとの通信をnode-oscというモジュールを使って行なっている。
ということで、めちゃくちゃ時間かかったけど、その中で本当に役に立ったサイトを紹介する。
クライアント [processing.js]
クライアントとサーバ間は前述のsocket.ioを用いて作っている。
UIに関しては、processing.jsを用いた。これを用いることで、processingで書いた内容をそのまま、webサイト上に再現できる。
processingのグローで影を表現したらめちゃくちゃ重くなったので、不透明度のみで表現した。
今後
とりあえずは、システムが完成したので、3D音響のために曲を作るだけ!
このシステムは応用性が相当あるので、他の作品にも応用しようと思っている。現在、観客参加型共同作曲のためのプラットフォームを製作している。
まとめ
長い時間がかかったが、なんとかシステムは完成できた。あとは、曲を完成してプロジェクト全体を完成させたい。
これだけ、多くのアプリケーションを1台のパソコンのみで行おうとするとOSCの遅延など、やはりPCの限界を迎える。そのため、いかに情報量を減らして通信をさせるかなどを考えないといけないと思った。
次回は曲のコンセプトについて書こうと思う