「シン・Web VRとか文化祭」登壇資料です。 https://html5j-webplat.connpass.com/event/47239/

1. ARもVRもMRも
まとめてドーン！
一般社団法人T.M.C.N
株式会社システムフレンド
前本 知志

2. ・会社ではセンサー＆デバイス部長やってます！
KINECTはHoloLens等のセンサーデバイスを使ったアプリ（イベントコンテンツ、画像処理、画像認識、医療系）
ARアプリ、VRアプリ、MixedRealityアプリなどを作っています。
http://www.systemfriend.co.jp/kinect_nui https://youtu.be/ZSXwhj8HqkE
・TMCN (Tokyo MotionControl Network) Co-founder(共同創設者)
https://www.facebook.com/TokyoMotioncontrolNetwork
・著書「Intel RealSense SDK センサープログラミング」
https://www.shoeisha.co.jp/book/detail/9784798139630
・HoloMagicians – 日本初のホロレンズ開発者チーム
http://holomagicians.azurewebsites.net/
・Microsoft MVP for Windows Development
https://mvp.microsoft.com/ja-jp/PublicProfile/5002154?fullName=Satoshi%20%20Maemoto
前本 知志
2

3. https://www.facebook.com/TokyoMotioncontrolNetwork

4. KINECT と Unityで
いろいろ作ってきました

5. PROJECT DAFTY
DAFTY Live System

6. ダンス系コンテンツ
 アキバで学べるパーティAKIPARTY vol.3 ～くりすますだお☆～

7. オタ芸とめっちゃ合う
(横浜 岩崎学園ISCプログラミングコンテスト)
https://youtu.be/ivL6ZxukTlo

8. http://www.systemfriend.co.jp/charamirror

9. ユニティちゃんと踊れる！
抱っこだってできる！
2015/08/28
CEDEC 2015
https://youtu.be/ZSXwhj8HqkE

10. 現実空間とCGのMix -> MixedReality
https://youtu.be/YxCGnmfChKk

11. KINECTを使った
MixedReality
実現に必要となった考え方

12. 座標系を合わせる
 KINECTの3D骨格情報を取得(メートル座標系)
 Unity座標系と対応させる
（1Unity＝1メートル設定で考える）
X
Y Z
1メートル
↓
1Unity

13. リアルとバーチャルのカメラを
シンクロさせる
 KINECTのリアル設置位置とUnity内のカメラ位置、角度、視点を合わせる
 KINECTのリアルカメラ映像とのシンクロを取る
＜三種の神器＞
• メジャー
• 養生テープ
• 三角関数

14. 3Dモデルを操る（オプション）
 KINECTで取得した骨格情報をリアルタイムに3Dモデルのリグに反映してみると…
このコンテンツは、『ユニティちゃんライセンス』で提供されています。

15. やばい、これはたのしいことにw
https://youtu.be/M8e9mCI-u80

16. さらに…
リアルとバーチャルの重なりを考慮する
 KINECTのDepthとCGのZバッファをGPUで高速に比較し物体の前後関係を判定
し表示する

17. GPUでの処理 – UnityでShaderを書く
 基本的にはこんなに簡単
if (KINECTのDepth<CGのZバッファ)
{
return KINECTのColor;
}
else
{
return CGのピクセル
}

18. だが言うは易し…
発生する課題
 スムーズな体験をするためには秒間30フレームを下回らない処理スピードを保
持する
 メインメモリ→GPU転送は低速だが、下記は転送しなければならない
1. RGBカラー映像（1920x1080 Full-Color Full-HD）
2. KINECTのDepthデータ（512×424）
3. RGBとDepthのマッピングデータ（1920x1080 ）
 Zバッファに書き込みをしないshaderを使っているオブジェクトやパーティク
ルは表示されなくなる

19. だが言うは易し…
「きゃらみらー」では、、
 メインメモリ→GPUへのデータ転送を数フレームに渡って分割したり、送る頻
度を展示中でもリアルタイムに調整できる
→少々送るのがずれても体験として気にならないものを見極め、この処理の対
象とする
 パーティクルについては専用の表示レイヤーを設けて表示されるようにしてい
る。
その代わりパーティクルについてはMRでなくAR表示となるがあまり気になら
ない感じ

20. AR・VR・MR

21. AR : Augumented Reality
現実世界の上に仮想世界(CG)を上書きする。
現実世界の映像上にCGを重ね合わせる。
映像の表示優先度は常に 現実世界＜CG
Screen
High layer

22. ARの例

23. まあ、2016年はこれでしたね。

24. VR : Virtual Reality
現実世界からの情報を100%カットし、仮想世界(CG)に没入
する。
現実世界の映像、自分の手などの物体をセンシングして融
合する場合もCGオブジェクトとしてそれらが登場する。
映像の表示比率は常に 現実世界:CG = 0:100
Screen
Separate
CG World
Include

25. VRの例

26. HTC VIVE やばい。。（Oculus Touchもね）
https://youtu.be/40Xogw0mg4Q?t=14m3s
VRとポジショントラッキングが合わさるとすごい

27. 複合現実
（ふくごうげんじつ、英: Mixed Reality、MR）
とは、現実空間と仮想空間を混合し、現実のモノと仮想的なモノがリアルタイムで
影響しあう新たな空間を構築する技術全般を指す。複合現実感とも。
拡張現実と拡張仮想を包含する概念である。
空間的整合性、時間的整合性、光学的整合性など実空間と合致させる要素によって、
その性質が評価される。
Wikipediaより

28. MR : Mixed Reality
現実世界と仮想世界(CG)を融合する。
融合結果の前後関係を反映した状態の映像が創り出される。
MRを実現するためには現実世界の3Dスキャンが必要となる。
Screen
+
MR World
CG World
Real World

29. MR の例

30. HoloLens事例
https://youtu.be/aThCr0PsyuA
http://www.sensors.jp/post/teomirn_2.html
デザイン分野
トレーニング・ラーニング分野

31. 知っておくと頭が良さそうに思われる？表
日本語名 見分けるポイント 必要な処理能力
AR（エイアール) 拡張現実 カメラ映像で現実世界が見え
る
CGに自分の手をかざすと絶対
手より前にCGが表示される
低
VR（ブイアール） 仮想現実 宇宙とか体内とか女の子の部
屋とか、ありえない場所に放
り込まれる
振り向くとゾンビがいる
中～高
MR（エムアール） 複合現実 カメラ映像または普通に眼鏡
越しで現実世界が見える
CGに自分の手をかざすと手よ
り前のCGは見えるし、手より
奥のCGは手に隠れる
中～高

32. まとめてドーン！

33. AR・VR・MRデバイスに関わらず、
“マルチデバイス”で
現実世界と重ねあわされた世界
を同時に体験するために必要な考え方
これは世界をつくる話です。

35. 通常のコンテンツ

36. O
O O
各デバイスで固有のVR空間
（世界）が作られる。
各世界同士の関連はない。

37. 単一の世界をシェアするには

38. O
P1
P2
P3
世界の絶対中心Oを定義し、
そこを中心とした基準座標系を定義する。
各デバイスは自分が世界のどこにいてどこを見つ
めているかがわかっている。
めざすもの

39. O
O
O
課題
デバイスはそれぞれが原点Oとなってそれぞれの座標
系で世界を見つめてしまう。
→現実空間と位置が合わせられない

40. まずは、、
基準座標系を定義する

41. O
床面に原点Oを定義する。
Oから赤マーク方向のベクトルが
世界の前方と決める。
青マーク、緑マークは後述するカメ
ラ位置逆計算のための補助マーカー
である。

42. O
KINECTのカメラ映像からKINECTが
原点Oに対し3次元的にどの位置に配
置され、どこを注視しているのかを
逆計算する。
※これはGPSの測位計算と似てる計算方法
みたいです。
算出にはカメラから最低3点への距離情報が
必要です。
O
http://www.systemfriend.co.jp/node/708
https://youtu.be/WY2PDLq2dzo

43. P1
KINECTを使って世界の中心と座標系が決定できた。
O

44. 他のデバイスを
世界に参加させる

45. P1
参加デバイスに世界の中心と世界の向きのベクトルを教えてあげる。
各デバイスは世界の中心の見え方から自分の位置を逆計算しながら
コンテンツを表示する。
O

46. 自分が中心だったデバイスが、
ひとつの世界を覗く覗き窓に
役割を変えた

47. https://youtu.be/GRq1jL5JLDs

48. Progress
1. PC(KINECT)+HoloLens 試作完了
2. +HTC VIVE
3. +Oculus Rift (Touch)
4. +スマホ (Extended Tracking)
5. +Tango
6. 速い通信とサーバーサイドレンダリングができたらWebでもできないかな。。。

49.  AR,VR,MRの違いはあれど仮想空間または現実世界に
仮想世界を重ね合わせてみることに違いはない
 現実世界はたった一つしかないのだから、そこを基
準に仮想世界を作り重ね、デバイスは世界をのぞく
のぞき窓になればよい
 基準作りが大切
 各のぞき窓が世界をどのように眺めているかが判断
できれば一つのものを様々なデバイスから同時に見
たり、操作ができる
まとめ
http://satoshi-maemoto.hatenablog.com/entry/2016/12/30/182332