Vuforia Studio HoloLens2備忘録：HoloLensで動画再生AR、を簡単作成

#はじめに

Vuforia Studioでは、HoloLens用のARコンテンツを簡単に作成できる。
動画再生ARを簡単に作成する例を、備忘録としておく。
Vuforia Studioでは、HoloLensでの動画再生用のウィジェットが、バージョン 8.5.14 から登場している。そして、2021年2月リリースの 9.0.1 では、追従プロパティが使えるようになった。
・[HoloLens2 での動画再生の追従例 @ Vuforia Studio Help](http://support.ptc.com/help/vuforia/studio/en/Studio_Help_Center/images/tagalong_prop.gif)

#前提

この備忘録は、Vuforia Studioで、ARコンテンツを独力で作成できる人が対象。
また、Vuforia Studioで作成したARの実行確認には、Microsoft Storeから最新Vuforia Viewアプリをインストール済のHoloLens2が必要。
HoloLens2は、WiFi経由で、Vuforia Studioで作成したARコンテンツの公開サーバー（Vuforia Experience Server）に接続ができることが必要。
HoloLnes用の動画再生(3Dビデオ)ウィジェットは、バージョン 8.5.14 以降。追従プロパティは 9.0.1 以降。
また、以下の**HoloLensで写真表示ARを簡単作成**を試し済みであることが望ましい。
・[Vuforia Studio HoloLens2備忘録：HoloLensで写真表示ARを簡単作成](https://qiita.com/tm181001/items/2f892ffb258b8837baa5)

#動画再生ARを作成

###動画ファイルを準備する

サポートしている .mp4、.webm、の動画ファイルを準備する。

###HoloLens用のARプロジェクトを作成する

新規ARプロジェクトを「3D Eyewear」で作成を開始する。

###3Dビデオウィジェットを配置して、大きさ、位置、向き、を指定する

作成したARプロジェクトの3Dキャンパス表示にて、ウィジェットの中から、「3Dビデオ」をドラッグ＆ドロップで配置する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/297270/3bf29d69-650f-c5a7-2c5b-944bbe0126d5.png)
3Dビデオにはデフォルトサイズがある。幅が 0.22m = 22cm（Vuforia Studio の長さの単位はメートル）。これは、10.5インチの iPad Proを横向きにしたときのサイズに近い。モニタの20インチ程度に少し大きくしてみる。幅に、0.45 を入力する。高さは自動で変更される。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/297270/d90285ee-9cb3-e5a6-57e7-0d4ba24c6073.png)
表示位置は、立ちながらビデオを見るとして、床面を基準にして3Dビデオの中心の高さを 1.5m とする。そこで、3Dビデオウィジェットの高さを指定する Y座標に、1.5 を入力する。水平方向は原点（X座標を0、Z座標を0）にしておく。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/297270/0f37b456-2b9e-41c4-1ea7-96d4787e80c1.png)
向きは、円弧の線をドラッグして動かしたり、水平回転角度を指定する Y回転に角度を入力することで設定できるが、まずはデフォルトのままとしておく。

###動画ファイルを指定する

動画を再生表示するサイズ、位置、向きを決めたので、準備した動画ファイルを指定する。3Dビデオウィジェットの「リソース＋」をクリックして、動画ファイルを登録する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/297270/cff1af94-5c90-d99c-c916-8ba998964b81.png)

###表示位置の基準（ARのターゲット）を指定する

動画表示の指定ができた。あとは、ARとして何を基準に表示するかのターゲットの指定をする必要がある。今回は、マーカーや写真などの準備が不要で簡単な、「空間ターゲット」を使用する。ターゲットから「空間ターゲット」をドラッグ＆ドロップで3Dキャンパス上に配置する。「空間ターゲット」の位置を原点（X座標を0、Z座標を0）にしておく。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/297270/1a278f46-138a-24db-93dc-c5414a96b7ec.png)
「空間ターゲット」を使う場合には、ARプロジェクトの「エクスペリエンス」にて、「ThingMark 関連付け」を「なし」に変更しておく。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/297270/befce98e-e99c-a4ac-17d1-d867dbb4186f.png)

###プレビューで表示位置を確認する

残念なことに、プレビューでは動画再生を確認できないとヘルプに記載がある。なので、プレビューしたときは、表示位置を確認するだけ。

###公開(パブリッシュ)して、HoloLensからARコンテンツをダウンロードできるようにする

タブレット/スマホ用のARコンテンツのパブリッシュの場合と同様に、ARプロジェクトに公開用のサーバーURLを指定して認証済としておき、パブリッシュを実行する。

パブリッシュに成功したら、Vuforia Studioの　共有 > エクスペリエンスの共有　にて、パブリッシュしたARコンテンツを呼び出すためのQRコードを表示して確認しておく。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/297270/06f88783-16fd-c4fc-2477-2713837480d1.png)

###作成したARを HoloLens2で呼び出して実行する

WiFi経由でサーバーに接続が可能になっている HoloLens2にて、インストール済みの Vuforia Viewアプリを起動する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/297270/5b8e019b-c044-a76f-5b78-95e1b3be382a.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/297270/b5810c69-cff2-d7ac-040c-5bbaa16123c0.png)
Vuforia Viewアプリが起動すると、スキャンモードになる。そこで、上記の QRコードを見てスキャンする。実行に認証が必要なコンテンツの場合は認証を求められるので、HoloLensの文字入力方法で認証をする。
ARを開始すると、平面を指定するように求められるので、見ている場所を動画を表示したい場所に向けて、HoloLensが検出した平面を示す緑色の枠を確認して、エアタップで確定する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/297270/a30a480b-d170-7715-c60b-9e5ba0186b7d.png)
3Dビデオウィジェットについているボタンは、HoloLens2の指認識により、指で仮想ボタンを押せるようになっている。接近して、指で再生ボタンを押してみる。おぉ！指で仮想ボタンを押して操作できた！
![3DVideo3.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/297270/f97c271a-8b6e-d299-702c-a2010edff1cc.gif)
左から２番目に再生/一時停止の仮想ボタンがあり、それを人差し指で押すのを HoloLens2 は認識している。指で押してこれらの仮想ボタンを操作できる距離（至近距離）だと、HoloLens2の視野角にて動画全体を見ながら操作するには、この20インチモニタ相当（幅 0.45m)くらいの大きさが限界のようだ。

###追従を有効にしてみる

バージョン 9.0.1 からは、追従（tagalong）プロパティが追加された。この追従プロパティをチェックして、パブリッシュして HoloLens2でARを確認してみる。
おぉ！ HoloLens2で見ている向きに追従している！
![3DVideoMove1.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/297270/6ec95417-5df3-167b-f223-66eec875c334.gif)
ただ、追従させると、動画再生パネルは数メートル先に表示され、近づこうとすると一定距離を保ち離れてしまうので、ボタンを指で操作できない。この場合は、中央の白点を再生ボタンに合わせて、エアタップする遠隔操作で動画再生してみる。おぉ！ 再生できた！
![3DVideoPlay.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/297270/5088e993-ab0a-ed2d-6a59-249844c1006e.gif)
数メートル先だと、20インチ相当では動画が少し小さく感じるかもしれない。その場合は、動画の利用用途に合わせて、幅の値を調整すればよさそうだ。

###動画再生を大画面にすると。。。

3Dビデオウィジェットの幅を大きくすれば、大画面での再生になる。だが、注意が必要そうだ。幅を 4メートルにしたところ、ARのロードや、ビデオのロードが 2分たっても完了しなかった。3Dビデオウィジェットの大きさに応じてロード時間が長くなってしまうようだ。幅 2メートルでもかなり待たされた。
幅 1.5 メートルだと、少し待つ程度で表示された。このあたりが一つの目安かと思う。尚、今回は、7.2MBの mp4ファイルを使ったが、ファイルサイズが大きいと、さらに待たされる可能性がある。動画再生画面はなるべく大画面にしないようにするのが無難そうだ。

###動画をクリアに見るために

HoloLens2 は、安全上、仮想表示の裏に実在するものが見えるように、仮想表示を透けて見せているようだ。そのため、動画表示の裏側が明るいと動画はクリアに見えない。明るい部屋だとプロジェクタ投影が見にくくなるのに似ている。ARを使う場所での光や明るさの影響は考慮が必要なようだ。


#おわりに

Vuforia Studioで HoloLensにて空間上で動画再生を仮想表示させるARコンテンツを簡単に作成できる例を、備忘録とした。HoloLens用の簡単なARコンテンツであれば、Unityで開発する場合と比べて、環境準備や設定をほとんどせずに、簡単なメニュー構成のエディタで素早く作成でき、素早く実行できるのはすごい。

#参考

・[3D ビデオ @ Vuforia Studioヘルプ](
http://support.ptc.com/help/vuforia/studio/ja/#page/Studio_Help_Center%2FWidget3DVideo.html)

・[Vuforia Studio HoloLens2備忘録：HoloLensで写真表示ARを簡単作成](https://qiita.com/tm181001/items/2f892ffb258b8837baa5)

・[Vuforia Studio HoloLens2備忘録：HoloLensの日本語ボイスコマンドを簡単作成](https://qiita.com/tm181001/items/fe19350ba696df29c97e)