＄1-2「Ovrvision Pro（ステレオカメラ）とHMDを使ってMRアプリ開発する」【ヘッドマウントディスプレイとUnityでVRとかMRの開発をやってみる．】


VRの開発をしていく中で折角ならMRも並行して開発しようと思い，高画質なステレオカメラである[Ovrvision Pro](https://www.amazon.co.jp/dp/B01N7H8YUM/ref=cm_sw_em_r_mt_dp_6TGRDF5BWQPW2PJ1H4WN)を触りながらメモしていきます．2021年6月現在の最新版を手探りで開発しているので間違い等があるかもしれませんが解説というよりメモ書きを読む感じでお願いします．
Ovrvision ProのSDKとの互換性の関係でUnityのバージョンはVIVE Pro Eye解説記事の2020と違って2019.4.27f1を使っています．SteamVR Plugin（OpenVR）のセットアップ手順が少し違うだけで解説記事のスクリプトとかはそのまま使えます．この記事も2020と2019のスクリーンショットが混じっていますが2020だとクロマキー等の一部機能が使えません．


環境一覧
[SteamVR](https://store.steampowered.com/app/250820/SteamVR/?l=japanese) 1.16.10
[Unity](https://unity3d.com/jp/get-unity/download) 2019.4.27f1 or 2020.1.17f1（動作確認済み，非対応なSDKあり）

[SteamVR Plugin](https://assetstore.unity.com/packages/tools/integration/steamvr-plugin-32647) 2.7.3
[Vive SRanipalRuntime Plugin](https://hub.vive.com/en-US/download) 1.3.2.0


追加アクセサリー
[VIVEトラッカー2018](https://www.amazon.co.jp/dp/B0748ZY323/ref=cm_sw_r_tw_dp_QDZSM4A3844PSM33DB3R?_encoding=UTF8&psc=1)
[Ovrvision Pro（ステレオカメラ）](https://www.amazon.co.jp/dp/B01N7H8YUM/ref=cm_sw_em_r_mt_dp_6TGRDF5BWQPW2PJ1H4WN)
[Leap Motion](https://www.amazon.co.jp/Leap-Motion-Controller/dp/B075T4MH77/ref=asc_df_B075T4MH77/?tag=jpgo-22&linkCode=df0&hvadid=342463500927&hvpos=&hvnetw=g&hvrand=13721783060484696807&hvpone=&hvptwo=&hvqmt=&hvdev=c&hvdvcmdl=&hvlocint=&hvlocphy=1009320&hvtargid=pla-945077929421&psc=1)


使用PCスペック
インテル® Core™ i7-7700K
NVIDIA GeForce GTX 1070

- **環境作成編**

 #1 [Unityのセットアップをする](https://qiita.com/RyoyaHase/items/5a173b7acbdf9aa2cfff)　2021年 1月更新

 #2 [プロジェクトを作ってみる](https://qiita.com/RyoyaHase/items/7b2148e9034584db7420)　2021年 1月更新

 #3-α [Unity2019でVR開発のための環境を整える（SteamVR Plugin2.7.Xをインストールする）：推奨](https://qiita.com/RyoyaHase/items/36910ec8a0b3d8122f8c)　2021年 6月更新

 #3-β [Unity2020でVR開発のための環境を整える（SteamVR Plugin2.7.Xをインストールする）](https://qiita.com/RyoyaHase/items/b7b5f8a7110810c1c0f1)　2021年 5月更新

 #3-おまけ [UnityでVR開発のための環境を整える（SteamVR Pluginの最新版をインストールする）：非推奨](https://qiita.com/RyoyaHase/items/f8b4fb5b04d9f02aae49)　2021年 2月更新

 #4 [SteamVRのダウングレードと自動アップデートの停止（上級者向け）](https://qiita.com/RyoyaHase/items/0dab278b080f517032a0)　2021年 5月更新


- **コントローラの入力やトラッカー，HMDの位置座標，回転座標を得る＋α**

 #5 [VIVEコントローラのボタン入力を取得する](https://qiita.com/RyoyaHase/items/89ffc9d134b784b8ae50)　2021年 2月更新

 #6 [トリガーの押し具合やトラックパッドの位置情報の入力を取得する](https://qiita.com/RyoyaHase/items/81fa026f68aee02fa5d4)　2021年 2月更新

 #6-おまけ [VIVEコントローラを使った開発をする時のおすすめ設定（独断と偏見）](https://qiita.com/RyoyaHase/items/d622e1bb0e345cf78f4f)　2021年 5月更新

 #7 [ヘッドマウントディスプレイとコントローラの位置座標と回転を取得する](https://qiita.com/RyoyaHase/items/325e7250c01f47e7e63b)　2021年 2月更新

 #8 [VIVEトラッカー2018を有効化してUnity上で位置座標と回転を取得](https://qiita.com/RyoyaHase/items/015bbb8671833ef8e740)　2021年 5月更新

 #9 [VIVEコントローラの振動機能を開発してみる](https://qiita.com/RyoyaHase/items/0690761fed2e71f6d517)　2021年 4月更新


- **VIVE Pro Eyeのアイトラッキングを使ってみる**

 #10 [VIVE Pro Eyeの視線トラッキングを有効化（セットアップ）する](https://qiita.com/RyoyaHase/items/024f3589547d1af84a92)　2021年 4月更新

 #11 [VIVE Pro Eyeのアイトラッキングを使ってUnity上で瞬きや視線のデータを取得する](https://qiita.com/RyoyaHase/items/5af948666a039d48a68d)　2021年 4月更新

 #11-おまけ [VIVE Pro Eyeのアイトラッキングで計測できるデータについて（適宜更新）](https://qiita.com/RyoyaHase/items/044826488e763f896a0f)　2021年 4月更新


- **VIVE Pro Eyeのカメラを使ってみる**

 #12 [VIVE Pro Eyeのフロントカメラの解像度（性能）とAR機能を有効化について](https://qiita.com/RyoyaHase/items/853938ec7c8745ec811c)　2021年 5月更新


- **小技**

 [プレイエリアの境界線（シャペロン境界）が表示されないように設定を変更する](https://qiita.com/RyoyaHase/items/57296d7753877afc6f34)　2021年 6月更新

 [Unity上でカメラを複数台追加してHMDやコントローラの動きを見る](https://qiita.com/RyoyaHase/items/4b4733503d53c8387db4)　2021年 6月更新


- **Ovrvision Pro（ステレオカメラ）を使ってAR開発してみる**

 ＄1-1 [Ovrvision Pro（ステレオカメラ）のセットアップをして実際に動かしてみる](https://qiita.com/RyoyaHase/items/262ad2133ee89d00b3cb)　2021年 6月更新

 ＄1-2 [__Ovrvision Pro（ステレオカメラ）とHMDを使ってARアプリ開発する（この記事）__](https://qiita.com/RyoyaHase/items/4abcd90f0f2319c89114)　2021年 6月更新

- **Leap Motionを使ってハンドトラッキングしてみる**

 ＄2-1 [Leap Motion（ハンドトラッキング）のセットアップをして実際に動かしてみる](https://qiita.com/RyoyaHase/items/6891c21c8c21dcb08b2f)　2021年 6月更新

 ＄2-2 [Leap Motion（ハンドトラッキング）とHMDを使ったインタラクティブなアプリ開発する](https://qiita.com/RyoyaHase/items/b0f6cd1d7474286f99ed)　2021年 6月更新

- **アプリを作ってみる**

  [VR（仮想空間）上に曲面ディスプレイを作成して大画面で広角WEBカメラ映像を見る](https://qiita.com/RyoyaHase/items/cc57e67799c1b14ef15d)　2021年 5月更新

今回の記事では，

1．Ovrvision Proの開発環境を整える．
2．Ovrvision ProとSteamVR Pluginを連携させてVIVEコントローラー（VRコントローラー）を表示する．
3．クロマキー設定を有効にする．

という流れ．

#1．Ovrvision Proの動作確認をしてみる．

前回同様Unity2019.4.27f1でプロジェクトを作成し，Edit→Project Settingsを開きます．
![01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/6f935e4a-d03a-ce15-d01c-0cbf6ef174a1.png)

Project Settingsタブが開いたらXR Plugin Managementの項目を開き，"Install XR Plugin Management"を押して設定をインストールします．
![02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/9c455cc0-6760-5fdb-5e7d-973f43aa4d0f.png)

インストールが完了すると，各VR環境を有効にするか聞かれますが今回はOpenVRでの開発なのでチェックマークは入れなくていいです．
![03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/4d27b03c-46b2-fd66-9337-33f27b6353e9.png)

Project Settingsタブ内のPlayerの項目を開き，Virtual Reality Supportedの項目にチェックマークを入れます．
![04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/9ab2e364-9a9a-b6ce-cfad-0dbcead728bd.png)

色々聞かれるのでとりあえずOKしとく．
![05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/05a4faac-a1db-256b-b641-f345b83ae6ca.png)

確認ダイアログもOK．
![06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/5082a247-9e15-4c5c-16db-69cc65c0f31e.png)

一回目は色々聞かれるだけでチェックマークが有効にならないのでしっかりとチェックマークが入っていることを確認する．
![07.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/08979603-dc38-1241-03b9-8bf881925a71.png)

このままだとSDKが１つも入っていない状態なので，Virtual Reality SDKsのリスト右下のプラスボタンからSDKの追加を行う．
![08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/b4f83c54-2d2f-4f44-121a-20b4544ec873.png)

今回はVIVEを使っているのでOpenVRを追加する．
![09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/0a495243-a945-66a3-5538-9f0409a819d4.png)

リストにOpenVRが追加されている状態になっていればOk．
![10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/45ceb515-f853-8f52-d084-1d14eae0e282.png)

Assets→Import Package→Custom Packageを押します．
![18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/e80be2dd-f4af-682c-981c-df3464e0a6ff.png)

前回ダウンロードした"\ovrvision\ovrvisionprosdk_unity\ovrvisionprosdk_unity/unity2019_ovrvision.unitypackage"を開きます．
![19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/a9d8e6b7-8be8-053e-5b4a-a514ad4bf2d6.png)

何を入れるのか聞かれるのでデフォルト設定のまま"Import"を押します．
![20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/cb0dfc5e-d3c3-6403-13d9-c7da681a3de2.png)

シーンを新規作成し，OvrvisionのSDKを入れた際に追加されたOvrvisionProタブから"OvrvisionPro→Add OvrvisionProCamera"を押します．
![11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/96890cc7-72fd-4cbc-520b-f498efa106ad.png)

MainCameraをシーン残したままにしているとMainCaemra無効化するか聞かれるので無効化しちゃいます．
![12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/5a0aadaa-fdbb-44fe-f6ea-eea9b73604d9.png)

設定を最適化するか聞かれるのでとりあえずAccept Allしとく．
![13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/1ef6f070-b1d2-1750-4e39-7e1be8bb40c8.png)

とても良い選択だねと褒められる．
![14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/aa3460a2-1099-8970-5858-be2878aeb685.png)

同様にOvrvisionProタブから"OvrvisionPro→Add OvrvisionARTracker"を追加します．
![15-01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/5cd45902-8db9-db72-cdf8-a8044ec8a0f4.png)

これでサンプルと同様に動くようになります．

#2．Ovrvision ProとSteamVR Pluginを連携させてVIVEコントローラー（VRコントローラー）を表示する．

VIVEコントローラ等を表示させるためにAssets→Import Package→Custom PackageからSteamVR Pluginを追加します．この手順をさきにやるとSteamVR内のOpevVRとは相性が悪いのかうまく動かないことがあるので先に設定からOpenVRを有効にした状態で入れてください．
![18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/e80be2dd-f4af-682c-981c-df3464e0a6ff.png)

コントローラを追加するためにSteamVR/Prefabsフォルダ内にある[CameraRig]を追加します．
![13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/d895756a-c4c0-efe7-d8d3-953188fcc1ab.png)

[CameraRig]の中にあるカメラが邪魔なのでコントローラだけ抜き出したいですが，コントローラはカメラとセットになっていて移動できないので"Controller (left)"と"Controller (Right)"をそれぞれコピーして外側でペーストすることで抜き出します．
![14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/8fc4e517-602f-4321-fe8d-38fb247863cb.png)
![15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/4bbbf541-f352-4642-028d-3dab8300321f.png)

両方のコントローラを抜き出したら[CameraRig]を削除して，コントローラだけ残します．
![16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/401f32d8-750c-020e-a248-473211ad65e1.png)

この状態で実行すると，Ovrvision Proの映像内にVIVEコントローラを表示することができます．
![17.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/e2b1ccf0-afcc-a724-a356-d5d96e8b7285.gif)

#3．クロマキー設定を有効にする．

Ovrvision Proはデフォルトの設定だと3Dオブジェクトがすべて前面に出てしまいます．これだと違和感があるので，色によって範囲を指定して制御します．
![22.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/278d9d34-b4e4-8694-04a8-f23aee13e2c9.gif)

[OvrvisionProCamera]を選択し，Camera OverlaytaタブからHand Mask Shaderを選択します．
![16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/c7eb2dcc-9573-56f2-2a23-12f4203bfdd3.png)

デフォルトの設定のまま動かすとこんな感じです．あまり綺麗に手を抜けなかったのでパラメータは部屋の明るさなどの環境によって調整しないといけないですね...
![23.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758746/d6c8d6dc-b2ea-29fa-ef80-ebb734a3984f.gif)