CV VTuber Exampleセッティング~VRMをwebカメラで動かせるまで~

#CV VTuber Exampleとは
2018年5月ごろにアセットストアで無料リリースされた、簡単にVtuberになれるアセットです。
ただし、無料といっても本体のみでOpenCV for Unity(\$95)とDlib FaceLandmark Detector(\$40)が動作に必要なため、動かすためにはそれなりの費用がかかります。
キャリブレーションに必要な機材はWebカメラのみで、Webカメラから取得した映像をDlibにかけて特徴点を割り出し、位置推定と表情への反映を行ってくれます。
また、様々なモデルにも対応しており、ユニティちゃんのような汎用モデルからVRMモデル、Live2Dモデルにまで対応しています。

#動作環境
 - Windows10
 - Unity2017.4.12f1
 - [UniVR-0.49](https://github.com/dwango/UniVRM)

#利用アセット
 - [OpenCV for Unity ver.2.3.5](https://assetstore.unity.com/packages/tools/integration/opencv-for-unity-21088)
 - [Dlib FaceLandmark Detector ver.1.2.7](https://assetstore.unity.com/packages/tools/integration/dlib-facelandmark-detector-64314)
 - [CV VTuber Example ver.1.0.4](https://assetstore.unity.com/packages/templates/tutorials/cv-vtuber-example-118186?aid=1011lGbg&utm_source=aff)

#CV VTuber Exampleセッティング
##1.OpenCV for Unityの導入
[OpenCV for Unity](https://assetstore.unity.com/packages/tools/integration/opencv-for-unity-21088)をアセットストアからインポートしてきます。
`OpenCVForUnity/Examples/Advanced/AlphaBlendingExample`のサンプルシーンを開き、以下のようになっていたら成功です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/140271/e6011e9e-5bc7-b03e-69d7-fe3132afa9d6.png)

##2.Dlib FaceLandmark Detectorの導入
[Dlib FaceLandmark Detector](https://assetstore.unity.com/packages/tools/integration/dlib-facelandmark-detector-64314)をインポートしてきます。

インポートができたら、**`DlibFaceLandmarkDetector/StreamingAssets/`ディレクトリ以下の`haarcascade_frontalface_alt`ファイル以外のファイルを全て`OpenCVForUnity/StreamingAssets/`ディレクトリに移動**させましょう。

移動させた`DlibFaceLandmarkDetector/StreamingAssets/`の状態
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/140271/a25c46e3-b79d-4c6d-fbe4-c51d4c434dc1.png)
移動させた`OpenCVForUnity/StreamingAssets/`の状態
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/140271/93bb4e61-d663-af5b-f384-24c62971813e.png)

ファイルの移動ができたら、**`OpenCVForUnity/StreamingAssets/`ディレクトリを`DlibFaceLandmarkDetector/`と`OpenCVForUnity/`があるディレクトリの場所に移動**させましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/140271/04cc05c4-044f-5184-7a8c-3cc0058d1279.png)

`DlibFaceLandmarkDetector/Examples/Texture2DExample`のサンプルシーンを実行し、以下の図のようになっていたら成功です。ちゃんと**赤の枠線と緑の顔枠ができているか**確認しておきましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/140271/a6ad346c-6f37-78e7-5e96-b6269fb17f94.png)

##3.CV VTuber Exampleの導入
[CV VTuber Example](https://assetstore.unity.com/packages/templates/tutorials/cv-vtuber-example-118186?aid=1011lGbg&utm_source=aff)をインポートします。

`CVVTuber/Examples/VideoCaptureCVVTuberExample`のサンプルシーンが以下のように動いたら成功です。
![ezgif-3-c318ec513d6e.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/140271/374a9a8a-cdc8-f25e-fadd-eb71ae4bd185.gif)


# 4.VRMモデルを使う
`Assets/CVVTuberExample`直下にReadMeが添付されており、そこに導入手順が全文英語で書かれています。そちらも参考にしつつセットアップしてください。ただし、2019/5/18現在の最新バージョンであるCV VTuber Example ver.1.0.4でのReadMeは古いバージョンから文章のみ更新されており、説明画像が更新されておらず、説明と説明画像が合っていないので注意してください。基本的に文章の方を信用すれば大丈夫です。

##4-1.UniVRMの導入
UniVRMを[リリースノート](https://github.com/dwango/UniVRM/releases)から入手し、Unityにインポートします。(ReadMeでの文章はver0.49を入れろと書いているが、説明画像はver0.38となっている。画像が更新されていない。私はver0.49で動いた。)

##4-2.VRMCVVtuberの導入
`Assets/CVVTuberExample/CVVTuber/Addons/VRMCVVTuber.unitypackage`を開き、VRMCVVtuberをインポートします。
`VVTuberExample\CVVTuber\Addons\VRMCVVTuber\Examples`のサンプルシーンを開いておきましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/140271/1316a377-0dc0-9748-325c-a2e2ff38dba1.png)

#4-3.vrmモデル用意
Vtuberとして自分の器となるVRMのモデルデータをインポートします。
例として、[アリシア・ソリッドちゃん](https://3d.nicovideo.jp/alicia/)を使うとします。

[配布ページ](https://3d.nicovideo.jp/works/td14712)からAlicia.zipをダウンロードし、解凍します。

`Alicia.zip`を解凍して出てきた`Alicia\VRM\AliciaSolid.vrm`をUnityにドラッグ＆ドロップします。
![図3.png](https://qiita-image-store.s3.amazonaws.com/0/140271/e9b41f84-a596-dcd2-4f7e-f0713fe2c26d.png)

vrmが展開され、`AliciaSolid.prefab`が生成されれば成功です。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/140271/f056baf0-cc1b-3cd1-1f27-c27d0aef54da.png)

AliciaSolid.prefabをシーン上に配置しましょう。
![図5.png](https://qiita-image-store.s3.amazonaws.com/0/140271/e10d09ee-5930-792e-2d2e-120d7f5c8f73.png)

##4.VRMLoaderにMetaデータ登録
`VRMControllManager`の`VRMLoader`のMetaにAliciaSolidをドラッグ＆ドロップします。
![図6.png](https://qiita-image-store.s3.amazonaws.com/0/140271/d2392ed0-24d5-1c27-2251-d1d9d081bf99.png)

##5.確認
以上でセッティング完了です。再生ボタンを押して正常に動くか確かめましょう。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/140271/55bee0b1-ee81-fb04-225c-5835e7e2cbbd.png)

#Q&A
**Q. GitHubで管理しようとしたらエラーが出る...**
A. 以下の非常に大きなファイル(100MBを超える)が、OpenCV for Unityに含まれています。大容量ファイルとして怒られてしまうので気を付けましょう。
 - `Assets/Externals/OpenCVForUnity/Plugins/iOS/opencv2.framework/opencv2`
 - `Assets/Externals/OpenCVForUnity/Extra/exclude_contrib/iOS/opencv2.framework/opencv2`
 解決策は[【Git LFS】OpenCV for Unityをpushしようとして怒られた人が見るページ](https://qiita.com/nkjzm/items/89ede8aa10fad30937b4#%E3%83%91%E3%82%BF%E3%83%BC%E3%83%B32-%E5%A4%A7%E5%AE%B9%E9%87%8F%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E3%82%92%E5%8F%96%E3%82%8A%E9%99%A4%E3%81%8F)が参考になります。

**Q.目とか口の動きを取ってくれない・・・**
A.Dlib FaceLandmark Detectorが正常動作しているか怪しい..`2.Dlib FaceLandmark Detectorの導入`でやったファイルの移動とディレクトのパスを確認しよう。

**Q.カメラが写らない・・・**
A.
・consoleに`"Cannot find camera device "`とか出てない？
→カメラがそもそも認識されていない。Unity以前の問題なので、windowsの設定など見直そう。

・カメラは見つかってるっぽいけど画面が真っ暗
→consoleに`WebCamTextureToMatHelper:: devicename:[カメラ名]: width:640 height:360 fps:15 videoRotationAngle:0 videoVerticallyMirrored:False isFrongFacing:True`という使われているカメラの詳細が出ているはず。そのカメラ名は自分の想定していたカメラだろうか？違った場合は、WebcamtexturematSourcegetterプレファブのWebCamTextureToMatHelperコンポーネントのRequestedDeviceNameのデバイス名にカメラの名前を入力しましょう。(FaceRig使ったことある人は`FaceRig Virtual Camera`っていうのが大体邪魔してる。)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/140271/ca3af9ee-db15-4aeb-3e15-8509db05ab13.png)

**Q.あんまり可愛くないし、精度も・・・**
A.頑張る
[[CV VTuber Exampleで遊ぶ&プレゼンスを高める]](https://qiita.com/kaikiofkaiki/items/8007c82b40895e7cc241)