Unity × Graphics × Effects"世界はこんなにもやさしく、うつくしい"のウラガワ
自己紹介
杉野裕則/チームラボhttps://twitter.com/sugi_cho
美大卒 × 社会人2年目 × Unityエンジニア
入社して、3ヶ月くらいはFlashで、映像とか、コントの背景とか作ってた。
Unityを知って、PVがかっこ良くて、使いたいです!って言ったらOKが出て、Unityを使った案件を担当するようになった。
チームラボについて
テクノロジーとクリエイティブを使って、いろんなものを作ってる会社。ウルトラテクノロジスト集団
Webサイト、デジタルショーウィンドウ、アート作品、映像、など。
http://www.team-lab.com/http://www.team-lab.net/
Unityは、ゲームエンジン
Unityは、ゲームエンジンで、3Dのオブジェクトを置いて、3Dゲームとか、2Dゲームまで結構簡単に作れる!
すごい!
でも、チームラボではゲーム開発の案件はほとんど無い。チームラボではUnityをどう使ってるのか...?
チームラボでは..
Unityを、
3次元教科書アート作品ファッションショーの演出デジタルショーウィンドウTVCMの制作
などに、使ってます。いまのとこ
チームラボでのUnityを使った案件
● teamLabBodyhttp://www.team-lab.net/portfolio/teamlab-body_jp.html
● 世界はこんなにもやさしく、うつくしいhttp://www.team-lab.net/portfolio/loving/whatloving.html
● SHANGHAI RUNWAY 2012 SPRING / SUMMERhttp://www.team-lab.net/menu/other/earthfashionshow12ss.html
● Play with Onitsuka Tiger by teamLabhttp://www.team-lab.net/menu/other/playwithonitsuka.htmlhttp://www.team-lab.net/menu/other/playwithonitsukany.html
世界はこんなにもやさしく、うつくしい
書家の紫舟さんとチームラボがコラボレーションして、つくった、アート作品。
紫舟+チームラボ, 2011, インタラクティブアニメーションインスタレーション, 書: 紫舟, 音楽: 高橋英明
世界はこんなにもやさしく、うつくしい
どうやって作ってるのか?
センサリングPC(oF)と映像用PC(Unity)、Webカメラ、プロジェクターを使用。
プロジェクターの光でできた人の影を検出して、映像を影に反応させる。
Unity × OSC (Open Sound Control)
センサリングPCで画像処理により検出した影の位置情報を、OSCで映像PCに送り、その情報をUnityで使用し、インタラクティブに映像を生成、制御している。
renderer.bounds から、スクリーン空間上での書オブジェクトのRectを計算しRectと影が接触しているか判定。
UnityでOSCを使う方法-強火で進め
http://d.hatena.ne.jp/nakamura001/20110807/1312739099
UnityをAfterEffectsのように使う
レイヤーを重ねて合成したり、オブジェクトを意図した位置にカメラのレンダーイメージ配置して画面を作る。
エフェクトによって、重なり順を設定。あるエフェクトは書の下に表示されないといけない、とか、あるエフェクトは必ず一番上のレイヤーに表示されないといけないとか。
camera.depthを設定し、複数カメラを使用。
複数カメラでパノラマイメージ
CameraComponent数、約30個。パノラマに撮影できるように並べて、横長のイメージを作成※赤い四角1つづつが、各カメラのレンダーイメージ
Unityで、Processingのように使う
C#とJavaは、ほとんどいっしょ!
→Javaのコードをそのまま使える
ProcessingのライブラリはJavaで書かれてる
→使える!
Processingの流体シミュレーションライブラリを使用した。
MSAFluid(流体シミュレーション)
Processingライブラリ版をUnityで使用http://www.memo.tv/msafluid/
GameObjectを溶かす
Cameraでオブジェクトを撮る ↓RenderTextureをTexture2Dに書き込む ↓Texture2Dに対して流体シミュレーション ↓オブジェクトが溶けている用に見える
参考:Convert a RenderTexture to a Texture2Dhttp://answers.unity3d.com/questions/9969/convert-a-rendertexture-to-a-texture2d.html
プロジェクターエッジブレンディング
紫舟+チームラボ世界はこんなにもやさしく、うつくしい@ミヅマアートギャラリーhttp://www.team-lab.net/portfolio-exhibition/loving-exhibition/mizuma_what.html
壁2面、プロジェクター4台出力
→プロジェクター間のエッジブレンディングが必要になってくる
プロジェクターエッジブレンディング
プロジェクタ間のブレンディングが必要
プロジェクターエッジブレンディング
プロジェクターが重なる部分のイメージをダブらせ、良い感じにアルファをかける必要がある。(Linerでかけるだけではダメ)
プロジェクターエッジブレンディング
Shader+ImageEffectで実装。
参考:Edge blending using commodity projectorshttp://paulbourke.net/texture_colour/edgeblend/
参考のサイトに書いてある式通りにShaderを作ったら、なんとなく、上手くいった。
→エッジブレンディング専用ソフトを使うとソフト代だけで10万以上費用がかかる!
使用ハードウェア(展示用)
ASUSの6出力できるグラフィックカードを使用http://www.asus.com/Graphics_Cards/AMD_Series/HD7970DC2T3GD5/
PCは6つのディスプレイを1つのディスプレイとして認識する(Eyefinity6)ので、Unityで作ったアプリを全画面実行し、複数プロジェクターで作品投影をしている。
CPUもi7の、できるだけ速いマシンを使用。
→結構無茶な処理もできる。
Unityを使って良かったとこ
● 3Dオブジェクトを簡単に使える● 物理演算が簡単に使える● 動画も使える● 結構、拡張性があってなんでも出来る● 大きい解像度(6400*900とか)でも動く
Unityのイマイチなところ
動画のシークができない動画に合わせてアニメーションを付けたい時に、動画のシークができないので、うまくSyncさせるのがタイヘン。動画のフレーム数を見て、何フレーム目にどうなる。みたいな感じでアニメーションを付ける必要があるから。GPU上に動画を載せてから再生するから?仕方ないのかな??MovieTextureの逆再生とか、再生スピード変えたりもできない。
Unityでゲーム以外のプロダクトを作って
良かったこと。(ゲーム作ったこと無いけど
展示とかで、いろんなところいけたコト
シンガポール、フランス、上海、ニューヨーク、オーサカ
以上です
ありがとうございました!