ARKitで自作3Dモデルの表情トラッキングしたい!

この記事は Akatsuki Advent Calendar 2019 8日目の記事です。

 

はじめに

VTuberが大流行していますね! …何を今更、という感じでしょう。もはやVTuberタレントは雨後の筍のごとく増えに増え、VTuberになるための周辺ツールも同様に、様々なものが群雄割拠。参入障壁は以前と比べてガクッと下がっています。もうこんな話は耳タコでしょうか。

でも、そういう簡単便利なVTuberツールって、「アバターは既製品から選んでね」というものがほとんどですよね。カスタムできるとしても、用意されたパーツから選ぶ、みたいな。せっかくなら自作のかわいいモデルを元気に動かしたいです。豊かな表情をつけたい。笑ったり泣いたりさせたい! でもお金はかけたくない!

そんなわがままに、AppleのARKit3が使えそうです。iOS端末でフェイストラッキングに姿勢推定まで可能だとか。

developer.apple.com

うまいことすれば、全身フルトラッキングに表情まで、iPhoneとかiPadだけでできちゃうかもしれません。夢が膨らむ!

とういうわけで、ARKitで表情トラッキングして自作モデルを動かす方法を駆け足で行きます!! 申し訳ないんですがあまり時間なくて説明雑です!

質問あったらTwitterとかで@MaxBaconPowerに聞いてね!

 

何を用意すればいい?

ラッキングした表情を3Dモデルに適用するなら、3Dモデルの変形を制御するための何らかの手段が必要です。そして、iOSの上での3Dプレビューに必要なSceneKitでサポートされる変形手段は、単純なモデル自体の回転・移動・拡大縮小、もしくは3Dデータで用意するSkeltonAnimationかBlendShapeのどちらか。

ドキュメントを読んでいると、フェイストラッキングはどうやらBlendShapeのパラメーターで制御しているようです。サポートするいくつかの変形があらかじめ決まっているみたい。eyeBlinkLeftとかjawForwardとか、名前でなんとなくどういう表情か予想つきますね。

developer.apple.com

BlendShapeは3Dモデルデータ側で用意しなければなりません。各BlendShapeの詳細ページに行くと、画像付きでそれぞれがどういう表情を表現するのか解説してくれています。なるほど、つまりここに載ってるBlendShapeを全部作っちゃえばいいんだ!

…めんどくさ!

 

3Dデータ作ろう

3DデータはBlenderで作ります。無料だしね。めんどくさいけどこればかりは頑張るしかない!

f:id:shintarooo0079:20191208202628p:plain

3Dモデル!

はいできた! BlendShapeもだいたい実装済みの、優しげな微笑みがキュートな自作3Dモデルです。この辺の解説はしません。モデリングの話だから!

 

そして、次はできたモデルをXcodeで扱えるよう出力します。まず、Xcodeで3Dモデルを使うなら、フォーマットの選択肢はOBJとColladaとUSDZです。これらのうち、BlendShapeを保持できるフォーマットはColladaとUSDZですが、BlenderからだとUSDZは直接出力できません。やるならAlembicかFBXを経由してusdz_converterで変換する、というフローなのですが、このコンバーターはアニメーションに対応していないらしい。ダメじゃん。今回は消去法でColladaです。

ですが、BlenderCollada出力とXcodeは相性が悪いらしく、普通に出力してもXcodeでmorphを認識することができません。

stackoverflow.com

このエントリで先人のすったもんだログが見えます。要約すると、Blenderから出力したColladaを以下のリンクの素敵ツールで修正して使えばイケるよ、という話です。

github.com

で、このツールSwift 3で書かれてるらしく今となっては動かないので、これまた素敵な先人がSwift 5で書き直してくれたフォークがあります。こっちを使いましょう。

github.com

さあこれでBlendShape入りColladaXcodeで読めるぞ!

f:id:shintarooo0079:20191208203825p:plain

XcodeでBlendShape入り3Dモデル!

やった!

 

MAYAとか使えればちゃんとしたColladaの出力ができるんでしょうか? 高いから使えないけど…。

 

動かしてみよう

さあ後はSwiftでゴニョゴニョっと書くだけ!

正直ここからは他のチュートリアル記事いっぱいあるので解説いらないと思うんですけど、ちょっとだけ。

developer.apple.com

とりあえず表情だけ動かせればいいので、上記のサンプルをちょっとだけ改造することにします。先ほど作ったColladaXCodeプロジェクトに突っ込んで、Face Overlay Contentフォルダの中にあるBlendShapeCharacter.swiftを修正しましょう。こんな感じに!

BlendShapeCharacter.swift

 するとどうでしょう!

完成!

f:id:shintarooo0079:20191209005446g:plain

できた!

表情トラッキングできました!! ついにあの白いおっさんが動いた!! なんだかカクカクした黒ずみがすごい(Collada修正ツールにかけたら各morphでノーマル情報が吹き飛んだっぽい。ノーマルマップ当てとけば治るんじゃないかなー)けど気にしないでください!!

 

以上、だいぶ駆け足でしたが、なんとか自作3Dモデルが表情を得ました。やったね!!

 Swiftでの実装自体はすんごい簡単なんで誰でもできると思うんですけど、これ3Dデータを作るのが一番めんどくさいですね。BlendShapeたくさん作らないといけないし、Collada出力でコケまくるので時間かかるし。

なにはともあれ、嗚呼、これであなたも憧れのVTuber

 

追伸:

僕のiPhoneは7なのでこれ作っても動かないんですよね。

iPadで動かしてます。