kawasaki.rb #060 の LT の資料です。

1. iPhone XでFace Trackingして
VRMのモデルを動かす
kawasaki.rb #060 LT
Ryosuke Akiyama (@kechako)

2. 自己紹介
• 名前：秋山 亮介
• 最近使ってる言語：Go言語、C#（最近Ruby使ってない……）
• GitHub、Twitter：@kechako

3. iPhone XでFace Trackingして
VRMのモデルを動かしたかった
kawasaki.rb #060 LT
Ryosuke Akiyama (@kechako)

4. 安心してください
デモはあります！

5. ARKitとは
• iOS11以降に標準搭載されたARアプリフレームワーク
• iPhone XのTrueDepthカメラに対応している
• TrueDepthカメラを使うと、ユーザーの顔の位置や表情を正確にリアルタ
イムで取得できる

6. UnityでARKitを使う
• Unity ARKit Pluginをインポートする
• Unity ARKit PluginはAssetStoreにて公開されている
• https://assetstore.unity.com/packages/essentials/tutorial-projects/unity-
arkit-plugin-92515

7. ARKitによる表情の取得
using UnityEngine.XR.iOS;
var session = UnityARSessionNativeInterface.GetARSessionNativeInterface();
var config = new ARKitFaceTrackingConfiguration();
session.RunWithConfig(config);
UnityARSessionNativeInterface.ARFaceAnchorAddedEvent += FaceAdded;
UnityARSessionNativeInterface.ARFaceAnchorUpdatedEvent += FaceUpdated;
UnityARSessionNativeInterface.ARFaceAnchorRemovedEvent += FaceRemoved;

8. ARKitによる表情の取得
void FaceUpdated(ARFaceAnchor anchorData)
{
var faceRotation = UnityARMatrixOps.GetRotation(anchorData.transform);
var cameraPose = UnityARSessionNativeInterface.GetARSessionNativeInterface().GetCameraPose();
var cameraRotation = UnityARMatrixOps.GetRotation(cameraPose);
var faceAngle = (faceRotation.eulerAngles - cameraRotation.eulerAngles);
var blendShapes = anchorData.blendShapes;
var eyeBlinkLeft = blendShapes[ARBlendShapeLocation.EyeBlinkLeft];
var eyeBlinkRight = blendShapes[ARBlendShapeLocation.EyeBlinkRight];
// ....
}

9. ARKitによる表情の取得
https://developer.apple.com/documentation/arkit/arfaceanchor.blendshapelocation/2928261-eyeblinkleft

10. VRMとは
• VRアプリケーション向けの人型3Dアバターデータを扱うためのフォーマ
ット
• glTF2.0をベースにしている
• ドワンゴ社が開発
• モデリングツールによる作法の違いや複雑な仕様、アバターとして使用す
る観点で不足しているパラメーター等を補う目的で開発された
• https://dwango.github.io/vrm/

11. VRMをUnityで表示する
• UniVRMはVRMをUnityでインポート・エクスポートするためのUnity
package
• https://github.com/dwango/UniVRM
• UniVRMをUnityプロジェクトにインポートし、VRMファイルをUnityにド
ラッグ＆ドロップすることで、ModelのPrefabが生成される
• あとはPrefabをシーンに配置するだけ

12. モデルの表情を動かす
var proxy = this.GetComponent<VRMBlendShapeProxy>();
proxy.SetValue(BlendShapePreset.Blink_L, eyeBlinkLeft);
proxy.SetValue(BlendShapePreset.Blink_R, eyeBlinkRight);

13. デモ

14. Links
• Unity ARKit Plugin
• https://assetstore.unity.com/packages/essentials/tutorial-projects/unity-arkit-
plugin-92515
• UniVRM
• https://github.com/dwango/UniVRM/releases
• ニコニ立体ちゃん
• http://3d.nicovideo.jp/works/td32797