ポリッドスクリーンとキネクトを利用したタッチコンテンツを作ってホラーなイベントを開催した

ポリッドスクリーン(PolidScreen)とキネクト(Kinect)を使い、参加型のホラーコンテンツを作って、WebやCGの学校、デジタルハリウッド(以下、デジハリ) 内でイベントを開催した。

タイトルでほぼ完結するのだけど、久しぶりに制作したっていう感じがしたのでアウトプットしておく。

ポリッドスクリーン(PolidScreen)とは、農業用”ポリ”フィルムをプロジェクターの投影面として映像をスクリーンに映し出す技法。

以下のサイトが詳しい。 とても参考になりました。

PolidScreeen

最近だとフィルムスクリーンの前後両面に映像を投影したっていう話題が挙がっていた。

一方、キネクト(Kinect)は言わずと知れた Xboxの周辺機器。
ジェスチャーや身体の動きなどで操作することができる入力デバイスである。

そのKinectとプロジェクタを使い、ポリッドスクリーンに映像を投影、そのスクリーンを巨大なタッチスクリーンとして操作するコンテンツを制作した。

動画を見てもらった方が早いかもしれない。

さえ子のお人形 プレデモ from METEORWORKS on Vimeo.

背景

デジハリで講師をされているT氏と一緒に、今年の4月頃から普段触らない技術やデバイスを勉強するもくもく会として、ここ半年ぐらいずっとKinect やら Raspberry Pi やらを触っていた。

そのうちhalloweenの時期が近づいていた。
デジハリでは 毎年halloweenパーティが開催されるのだけど、それに合わせて何か出し物をしようという話になった。

ハロウィンってなんとなく無条件にゾンビが出てくることから、「なにもない所を触ったら怖いものがでてくるコンテンツ」が、基本的な軸となった。

内心「空間を触ったら。。か。。画像解析とかやればできるのかな」と考えていた所、いくつかのワードが出てきた。

• 「プロジェクタでコンテンツの映像を出す」
• 「タッチ判定は赤外線カメラを使うといけるらしい」

制作編

制作がスタートした。
とはいえ一週間に一度集まる程度なのでなかなか具体的な話にならず、時間だけが過ぎていく。

途中、もくもく会に参加していたWeb卒業生の1人とT氏の教え子でもあるCG卒業生3人と一緒に進めていくことになった。

入力に関しては触ったということを判定しなければならない。
一部どう動いているか分からないコンセプトムービーなどはよく目にしたけど、実際進めていくとなると難しかったが、ちょうどよい記事を見かけた。

赤外線カメラを使用した壁タッチセンサー

http://qiita.com/aq_tsurumai/items/10907f786890f46f8037

IR Wall Tracking

https://vimeo.com/135039074

撮影編

実際にCGと合わせる映像と音声を某所に撮影に行くことになった。
また、入り口のディスプレイ用にVRを作ることになり、THETA-Sを使って映像を撮った。

この時、唐突にさえ子の撮影会が始まり、何気に撮ったのがこの画像だったりする。
これは思いの外よかったのでポスターが作成された。
正確には気がついたらポスターが作成されていた (笑
// 個人的には画像を編集してからであればなお良かったのだけど。。。

一方THETA-Sで撮影した映像から作成し（てもらっ）たVRは以下となる。

タッチスクリーンについて

前述のように当初、Raspberry Pi+ 赤外線カメラ + 赤外線LED(BrightPi)で制作する予定だった

BrightPi

https://www.pi-supply.com/product/bright-pi-bright-white-ir-camera-light-raspberry-pi/

しかし、どうしてもRaspberry Piから、I2Cで赤外線LEDをコントロールするモジュールにうまくつなぐ事が出来ず、色々考えた結果、コンテンツを投影したスクリーンのタッチ判定を行うためにKinectを利用した。

スクリーンの最上部の左右中央にKinectを下に向けてセットした。

Kinectから見て 左右x軸、奥行きz軸、y軸 0付近の深度を測定。
そうすることでスクリーンから見ると左右はx軸、KinectのZ軸はスクリーンから見て上下のy軸に当てられる。

コンテンツを出力するプロジェクタ投影用に マシンを1台購入した。
当初はMac mini を買う予定だったが、気がついたらiMacを手にしていた。今回最大のホラーだったかもしれない(?)

そのマシンに Kinect を接続、USBケーブルで3m延長。

プロジェクタの出力、Kinectのデータ取得、プロジェクタ表示用サーバ、iMacで全部まかなえた。

スクリーンタッチとコンテンツの同期

スクリーン上部にセットした Kinectで左右X軸及び、深さZ軸を取る。
これをスクリーン上では横X、縦Yに割り当ててタッチエリアを判定している。

まず、iMac に繋いた Kinectから、実際の距離を SimpleOpenNIとProcessingを使って取得する。
その情報をOSC(Open Sound Control) を使い、言語間をまたいでやり取りを行った。

Node.js上で Expressを立ち上げ、ブラウザでコンテンツを表示。
コンテンツは動画と画像の組み合わせでReactを使ってそれぞれの素材をComponent化している。

それらをプロジェクターからPolidScreenに出力した。

Kinectの情報は Expressを実行したプロセスから child-processとして、node-osc を使い、Node.js側に引き込む処理を実行するように追加した。

そこから前述のサーバを経由して Socket.ioと React + Refluxで状態の切り替えを行っている。

振り返り

• エマージェンシーボタン大事、技術的には大丈夫だけどコンテンツとしてどうしても進めないところは何かしらの補助が必要だった。
• Kinectの固定が甘かったので毎日修正していた。ちゃんと固定する治具を作ればよかった。

できなかったこと一部

• 参加者の動きから連動するミラーディスプレイ制御演出
• 立体音響を使った音声再生

他にもあるのだけど、次回以降のネタにしたい所なのでこれぐらいで。

エンジニアとしての定量的な技術評価(ポエみ)

受託をメインで行っていると、なかなか実際に実装した仕事などを外に公開できなかったりする。

また、仕事を依頼され一緒に仕事をしていく上で、うまくスケジューリング出来なかったり、なかなか実力を発揮できなかったりすることも中には存在し、そうなると評価の回復が難しかったりする。

特に個人事業での技術力というのはなかなか表すことができなかったりする。
順序はどうあれ、エンジニアとして普段やっていることのアウトプットは、ブログだったり、勉強会の発表だったり、OSSへの関わりだったり様々だと思う。

評価を定量的に示すために、このような取り組みを行うことは非常に大事なのかもしれないと思いつつ、なかなか行動に移せなかった。
そういう意味では完全プライベートワークでこのように公開できるモノが出来たのは個人的にも非常にうれしい。

今回チームで取り組む事が出来て、良い意味で文化祭的な雰囲気があって楽しかった。
また、何かあれば取り組んでいきたい。