2016年7月15日金曜日

ピアノプロジェクション & bit

久しぶりに動画を作りました。ハウルの動く城より 人生のメリーゴーランド


Youtube: https://youtu.be/uCwP1p7oTkU
Nico: http://nico.ms/sm29246504

しばらくプロジェクションマッピングばかりだったので、何か手軽に遊びやすいものでも作ってみようと思ってタブレット連動を試したところから始まりました。
前回 Unreal Engine で高度な 3D CG 技術をかじってみたら手に負えなかったので、今回は一転して手軽な方向に傾倒して Web アプリにしました。描画には Pixi.js というライブラリを使っています。サブアプリはメインアプリに比べて開発が早くて楽でした。
システムはこんな感じに。


サブアプリも PC から配信しているので、適当な機器のブラウザからつなぐだけで使えます。演奏の通信は WebSocket を使いました。今までのシステムにサーバを追加して適当にプロトコルを決め、打鍵やシーンの情報を送っています。
一部のブラウザでは動きませんでしたが、Chrome ならばどの機器でも動いていました。試しに PC やタブレットなど複数機器をつないで動かしてみたら、若干不安定ながらも遅延は少なくて良い感じでした。

と、ここまでが半年くらい前の話で、その頃はまだ動画を作る予定もありませんでした。

その後、旅行やらかぶちゃん村やら庭動画やらで何度も中断しながら少しずつ企画を考えました。(演奏や構成が決まったあとで一度企画中止を考えました。試しに画面デバイスを並べてみたら、ただの駄目人間の部屋にしか見えず絵的に酷かったからです…)
最近になって CG を少し作りこみ部屋を暗くしてカメラを通したら、暗い空間に画面が浮かび上がるような感じで面白かったので、ようやく動画を作ってみることにしました。

利用可能な画面機器をかき集めて、最終的には以下のようになりました。


また、最近の動画でときどき使っている手法で、カメラのアングル切り替えがあります。今回は特に立体的な構造を見せたかったので手間をかけて6視点で撮影して編集しています。以前作った 3D のラピュタ動画と対照的です。
もちろん6台ものカメラは持っていないので 6回撮影しました。初回に撮った演奏を聴きながら、残り5回はタイミングを合わせて弾いて撮影しています。ですので、初回撮影の構図以外は若干タイミングがずれている個所があります。まあ動画上の問題なので妥協…


今回演奏した人生のメリーゴーランドは前から好きな曲でしたが、難しくて最後まで弾いたことがなかったので、わりと苦労しました。演出のデザインは曲のイメージに合わせて考え、自分ではわりと気に入っています。最後の風景写真の窓は例によって趣味の旅行写真を使いました。

久しぶりにがんばったので解説もダラダラ書いてしまいました。今回のシステムは手軽に遊べるものですが、動画の作成は映像の調整や機器のレイアウトや撮影編集など、やたら面倒でした。このネタは今回限りでしょう。

ご視聴・コメントありがとうございます

0 件のコメント:

コメントを投稿