iPhoneX以降のTrueDepthカメラを使ってオンライン会議で簡単にVTuberになる方法（お金がちょっと掛かります）

# この記事について

この記事は、[弁護士ドットコム Advent Calendar 2020](https://qiita.com/advent-calendar/2020/bengo4com)の 4 日目の記事になります。
今回の私の記事はかなりネタ的な内容になっています。
真面目な素晴らしい記事は他のエンジニアが書いてくれるので楽しみにしてください。

# はじめに

さて、みなさんリモートワークとビデオ会議にだいぶ慣れてきたのではないでしょうか。
中には `Snap Camera` などで顔を加工したり背景いじったりしている人もいるかもしれません。
Snap Cameraに関しては色んな記事があるかと思いますので見た人もいると思います。

さて、昨今[VTuberがYoutubeの収益トップランキングを総なめしたりと話題になっている](https://www.nikkei.com/article/DGXMZO66281130W0A111C2TJ1000)かと思います（ちなみに記事の動画で出ている潤羽るしあですが、`潤羽るしあ　初号機` で是非検索してみてください）。
自分もビデオ会議でVTuberになってみたい・・・と思ったことがあると思います。たぶん。

これを実現にするには下記技術要素を搭載したソフトウェアと機材が必要になります。

- カメラ
- Face Trackingソフトウェア
- 仮想カメラ機能搭載の配信ソフトウェア
- Live2Dもしくは3Dモデルデータ

なんだか難しそうな上にお金もイラスト/3Dモデル作成能力も必要で無理そう・・・に思えますが、お金を少し出せば簡単にできます。

なお、どうしても無料でがんばりたい場合は[Unity](https://unity.com/ja)や[Unreal Engine](https://www.unrealengine.com/ja/)などで作る必要があります。
Unityで試しに開発してみましたが、最低限のことやるだけならなんとか開発できました。AR用のライブラリや無料アセットがあるのでそのあたりを組み合わせれば初心者でもどうにかなります（本当に最低限のことができるだけで需要はなさそうなので記事にはしませんが・・・）。

## VTuber用Face Trackingソフトウェアの最新事情（2020年11月）

さて、多少お金を出すと決めれば選択肢はいくつか出てきます。

- [FaceRig](https://store.steampowered.com/app/274920/FaceRig/?l=japanese)
    - 古参のFace Trackingアプリ
    - 恐らく一番有名で日本語解説記事も沢山ある
    - 1480円ぐらい
- [Animaze](https://store.steampowered.com/app/1364390/Animaze_by_FaceRig/)
    - FaceRig後継のアプリ
    - まだアーリーアクセス
    - とりあえず無料だが、月額課金すると色々機能が使える（年1000円ちょっとぐらい）
    - お金を払うとiPhoneのTrueDepthカメラを使用したトラッキングが可能になります
- [VTuber Studio](https://denchisoft.github.io/)
    - Live2Dに特化したアプリ
    - Pro機能を使う場合は$22.99
- [VUP](https://store.steampowered.com/app/1207050/VUPVTuber_Maker_Animation_MMDLive2D__facial_capture/)
    - Webカメラだけで精度の高いトラッキングができて高機能で無料
- [VMagicMirror](https://malaybaku.github.io/VMagicMirror/)
    - VRMに特化したアプリ
    - 無料
    - キーボードやマウスを使う動作が付いてる
    - iFaceMocap対応
- [Luppet](https://luppet.appspot.com/)
    - [LeapMotion](https://www.ultraleap.com/)を使う前提としたアプリ
    - お値段は6000円から応相談（エンタープライズ）まで
    - LeapMotion自体は1万数千円する
    - 顔だけじゃなくて上半身をトラッキングできる（手とか）
- [iFacialMocap](https://www.ifacialmocap.com/home/japanese/)
    - iPhoneX以上に搭載されているTrueDepthカメラを使ったトラッキングと、そのトラッキング情報をネットワーク経由で転送するアプリ
    - トラッキングと転送に特化してるので、モデルを読みこんで表示するとかそういう機能はない
    - お値段は$7.99

## アバターをどうするか

イラスト描くのもモデリングするのもちょっと・・・という人が大半かと思いますので、いくつか候補をあげます。

- Live2DモデルやVRMモデルを販売してるサイトがあるのでそこで買う
- アプリに搭載されているアバターを使う
- アプリのマーケットで販売されているアバターを買う
- ネットで公開されている無料のアバターを使う
- [VRoid Studio](https://vroid.com/studio)で自分で作る
    - 使ってみましたが意外と簡単にいけそう

## 配信ソフトウェア

- [OBS Studio](https://obsproject.com/ja)
- [n-AiR](https://n-air-app.nicovideo.jp/)
    - ニコニコ動画特化

# 今回のアーキテクチャ

- Windows PC
- VRM
    - [VRoid Studio](https://vroid.com/studio)サンプルモデルVivi
- VMagicMirror
- iFacialMocap
    - $7.99
- OBS

この記事のタイトルにもある通り、色々試しましたが`iPhoneのTrueDepthカメラのトラッキングが凄まじく精度が良く`、ぐりんぐりんと動かせるので今回はこれでいきます。
`iFacialMocap（$7.99）`は買う必要がありますが、このアプリはそれだけの価値はあると思います。
配信先はGoogle Meetsとしますが、Zoomでも設定は同様です。

## iFacialMocap以外の選択肢

### Animaze

Animazeも年1000円ぐらい出せばTrueDepthカメラが使えますが、こちらは現状アプリ内にあるアバターしかほぼ利用できないです（FBXなら対応してるけど利用難易度が高い）が、それでもよければこちらもお勧めです。

### VTuber Studio

Live2Dモデルを利用するのはVRMよりも難易度が高いと思います。たぶん。
VRMモデルは色々な人が無料/有料公開してるので用意するのも簡単です。
また、VRoid Studioが使いやすいので、あまり凝ったものでなれば自分でも作れます。
イラストレーターがLive2D Cubismでモデル作って自分で使うには良いと思います。たぶん。
こちらもTrueDepthカメラ対応してます。

### Luppet

ネタのためにLeapMotionとLuppetを買う余裕がある方にはお勧めだと思います。
上半身までトラッキングできるのはすごいです。
私はそこまでがんばれませんでした・・・

# 準備

## VRMモデル

今回はVRoid Studioのサンプルモデルを使用します。
無料で使えるVRMモデルには[東北ずん子](https://tohozunko.booth.pm/items/1050142)などもあるので、お好みで使用してください。

### 1. インストール

[VRoid Studio](https://vroid.com/studio)のサイトからダウンロードしてインストールしてください。
これ自体はMacに対応してます。

### 2. VRMモデル作成

VRoidStudioを起動すると画面にサンプルモデルの一覧が表示されます。

![vroidstudio1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/4cece84b-a3f3-9aef-d633-399449bd679e.png)

これの `Vivi` を選択して開いてください。

![vroidstudio2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/f9c078e6-28fa-dbbb-16ec-919116c646ed.png)

このまま何もパラメータをいじらずに保存してください。

![vroidstudio3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/e05a8d8d-598f-fff0-0c44-2aa13300f028.png)

## VMagicMirrorインストール

[BOOTHからダウンロード](https://baku-dreameater.booth.pm/items/1272298)してインストールしてください。
このソフトウェアはWindowsのみ対応です。

## iFacialMocapインストール

iPhoneのApp Storeから `iFacialMocap` で検索してインストールしてください。
通信を[PC側で取得するソフトも公式サイトにあります](https://www.ifacialmocap.com/download/)が、今回はこちらは使用しません（VMagicMirrorが直接通信を行う）。

## OBS

[OBSからダウンロード](https://obsproject.com/ja)してインストールしてください。
これ自体はMacにも対応してます。

# 組み合わせる

## 1. VMagicMirrorにVRMモデルをロードする

`PC上のファイルをロード` から先程保存したVRMファイルを選択してください。

![vmm1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/8c3a74c2-349b-fbd7-7043-1cb8aee63a12.png)

ライセンス情報などが表示されます。確認して `OK` を選択してください。

![vmm2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/fbc25c03-5bad-124a-2561-477885427af5.png)

VRMモデルがロードされます。

![vmm3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/11f4ea32-e710-8b8e-dbd9-ec2236fb923d.png)

## 2. VMagicMirrorとiFacialMocapを連携する


**`iFacialMocap` を起動する前に、PCと同じローカルネットワークに接続できるようにしてください。**
具体的には、スマホをWifi接続して、そのWifiと同じネットワークにPCが存在するようにしてください。

iFacialMocapを起動すると画面上部にIPアドレス（ローカルネットワークのIP）が表示されので確認してください。

![ファイル_000.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/61d4e918-e20b-1719-0e7b-efa16a782c93.png)

次にVMagicMirror側の設定をします。
`Ex.Tracker` タブを表示して、以下の画像のようにチェックボックスにチェックを入れていきます。

![vmm4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/428ebcce-85ac-6784-b423-fa46b52829be.png)

`アプリとの連携` 項目で `iFacialMocap` を選択して、先程のIPアドレスを入力します。
その後 `Connect` ボタンを押すとVRMモデルとTrueDepthカメラが連携します。
動いて動作を確認してみましょう。

![6pk38-r24oe.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/e43f61b6-d401-1ed2-d7e6-91ecb0e78a9f.gif)

**※もしConnectをして接続が確立したとiFacialMocapに表示されてもVRMモデルが動作しなかった場合、セキュリティソフトのファイアウォール機能を一時的にOFFにするか、通信の許可を行ってください。設定方法はセキュリティソフト毎に異なるので説明はここでは割愛します。**

## 3. OBSに画面を取り込む

OBSを起動します。
画像の赤い○印の箇所のの `+` ボタンを押して `ウィンドウキャプチャー` を選択してください。

![obs1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/13879fb0-851b-3bec-e5a8-a681378f57be.png)

どのウィンドウをキャプチャするか選択するの画面が表示されるので、 `ウィンドウ` 項目に `VMagicMirror` を選択してくだい。
そうすると下の画像のようにVMagicMirrorの画面が表示されるので `OK` を押して確定させてください。

![obs2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/892578d8-bcda-48a4-9685-cc64fc862c9b.png)

OBSに画面にVMagicMirrorの画面が表示されますが、このままでは緑色のスクリーンが表示されたままになります。
そこで、この緑色を透過させます。
下の画像の赤丸のところにある `ウィンドウキャプチャ` の項目を右クリックしてください。
メニューが表示されるので、 `フィルタ` を選択してください。

![obs3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/05747d39-8986-cc82-64a1-9c331ff0a8a2.png)

フィルタ画面が表示されるので、下の画像の赤丸の部分の `+` ボタンを押して下さい。
メニューが出てくるので、 `クロマキー` を選択してください。
そうすると下の画像のようにクロマキーが追加され、設定ができるようになります。

![obs4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/7c9ea06a-6992-d3f5-4d58-5e9b819a1a4e.png)

クロマキーはデフォルトで緑色を透過させるようになってるので背景の緑色が消えていることが分かります。
しかし、上の画像をよく見るとエプロンの緑色も消えていることが分かると思います。
そこで、下の画像の赤丸のところの`類似性`パラメータを修正してエプロンの緑色を表示させるようにします。

![obs5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/6dd29868-ea88-a6ed-433c-3bb739d52cdf.png)

こんな感じですかね。
これで `閉じる` ボタンを押すとOBSのメイン画面に戻ります。
そうすると背景の緑色が消えているのが分かります。
このままだとVRMモデルが小さいので、ウィンドウキャプチャオブジェクトを選択して画面いっぱいに広げてください。
そうすると下の画像のようにいい感じになります。

![obs6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/6aeb7585-d073-402f-b504-5dfa3542b9a9.png)

# 配信してみる

## 1. OBSの仮想カメラを起動

まずはOBSの仮想カメラを開始します。
右下の `コントロール` に `仮想カメラ開始` ボタンがあるのでそれをクリックすると仮想カメラが開始されます。
そうすると下の画像のように `仮想カメラ停止` 表示になるので、この状態になっていることを確認してください。

![obs6のコピー.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/a9160fa3-e19c-b4c4-a7d7-e0776134db8c.png)

## 2. Google Meetsで設定

次にGoogle Meetsを起動します。
Google Meetsの会議室に参加する前に、設定画面から動画設定を行います。

![obs7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/2e5da26e-9eda-aba4-a35c-237682e8a09a.png)

`カメラ` 項目で `OBS Virtual Camera` を選択してくだい。
そうするとプレビュー画面にOBS画面が表示されます。

![obs8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538525/4d1a21d5-1574-033e-bd59-3493a82ca5bd.png)

この状態になったら、`今すぐ参加`ボタンを押して会議に参加してください。

# まとめ

ちょっと長くなりましたが、これでVTuberとして会議に参加できます。
また、OBSで画像や動画を背景として設定することも可能です。
是非色々とカスタマイズして地味なオンライン会議を華やかにしてみてください。