この記事はUnreal Engine 4(UE4) Advent Calendar 2020の9日目の投稿記事です。
- BlenderとUE4でVtuber 前編
- BlenderとUE4でVtuber 後編(このページ)
AdventCalendar初心者&ブログ初心者のダブル初心者です。誤字脱字などあっても許してください!
こんにちは!
みなさんは、「Vtuber」や「フェイシャルキャプチャ」といった言葉に興味を持ったことはありませんか?
個人が安価でVtuberになる方法といえば、Facerig(つい最近後継のAnimazeが出ましたね)や、スマホで気軽に始められるアプリなんかがありますが、
どのソフトもモデルの形式や機能などに制限があり、設定が難しくてなかなか思うようになりませんし、そもそも自分でキャラを自由に設定できないものも多いですよね。
やはり、人気のVtuberなんかと比較するとどうしても見劣りしてしまいます。
Vtuberになる方法を調べても、Live2Dがメインで、3Dモデルを動かす方法を詳しく解説してくれているサイトはなかなかありませんし…
(よくVroidを使った方法が出てきますが、う〜んってなる人も多いんじゃないかな?)
つまり、自分でモデルを作って本格的にやりたい!という方にはとてもハードルが高く、Vtuberデビューする前に挫折してしまうというのが現状です。(つらい)
しかし! そんな方に朗報です!
つい最近(今年7月7日)、UE4にiPhoneを使ってフェイシャルキャプチャする機能が公式で追加されました!!
これを使えば、顔部分のみではありますが、UE4を使って安価で簡単に、プログラミング無しでVtuberになることができるのです! (iPhoneを持っているという条件付きですが…)
そこで今回は、3DCGソフトBlenderとUE4のフェイシャルキャプチャを使ってVtuberになる方法を紹介していきます。
この記事は後編ということで、UE4に持ってきたモデルを動かすまでの手順を解説していきます。
さらに、他のソフトと異なるUE4でしかできないことも併せて紹介していこうと思います!
前編はBlenderのアドベントカレンダーにて、
Blenderでのフェイシャルキャプチャ用モーフの作り方と、モデルをUE4にもっていく方法
を解説していますので、よかったらそちらも併せて読んでみてください。
3DCGソフトやUE4触り始めた方でも極力分かるようにがんばりましたので、Vtuberやフェイシャルキャプチャに興味ある方は、だいたいこんな作業をすればいいんだな～という雰囲気をつかんでいただければ嬉しいです。
まあ私もBlender歴1年ちょい、UE4歴半年ぐらいの新参者です。それぐらいの人でも簡単に出来るレベルだと思ってもらって大丈夫です!
UE4でVtuberになる方法!
UE4でフェイシャルキャプチャをするための設定手順を解説していきます。
なお、以下の記事も役に立ちます。「UE4 Vtuber」「UE4 フェイシャルキャプチャ」なんかですでに検索された方はどれもみたことのある記事だと思います。
- iPhone X からフェイシャル アニメーションを記録する、公式ドキュメント
- 【UE4】Live Link Face for Unreal Engineを使って、あなたのキャラクタの表情を動かす方法、おかずさんの記事
- Unreal Engine リアルタイムフェイシャルキャプチャ、マオさんの記事
正直どの記事もわかりやすいので、併せて見てみてください。
私の記事の相違点は、自分で作ったモデルを動かすというところです。
1. 必要な物をそろえる
必要なものは以下のとおりです。
- iPhone X(10)以降
- iPhoneとPCをつなげるケーブルまたはBluetooth
- インポート済みの3Dモデル
iPhoneはカメラとして使います。
iPhoneで撮ったフェイシャルキャプチャのデータをUE4に送るためには、iPhone X以降が持っている「深度カメラ」と 「ARKit」という機能が必要になります。現状ではそれより古いiPhoneや、Androidのスマホ、その他撮影機器ではデータを送ることができないので注意してください。
ここだけは申し訳ないのですが、私の技術ではどうしようもないです。
対応したiPhoneを持っていない場合は、買ってしまうか、より多くのデバイスに対応してくれるのを期待しましょう…(Epic Gamesだったらいずれ対応してくれるはず!)
2. iPhoneとUE4をつなげる
必要な機器とインポートしたモデルデータを用意したら、今度はフェイシャルキャプチャをするための設定を行なっていきます。
まずはEpic games Launcherのラーニングから「Face AR Sample」プロジェクトをバージョン4.25でダウンロードします。(前編の記事ですでにダウンロードしている場合はしなくてもOKです)
ダウンロードが終わったらプロジェクトを開きます。Playを押すとKite Demoの少年(以下Kite君)の顔が超ドアップで表示されるはずです（笑）。設定ミス？
あまりにも近いのでちょっと離しておきましょう。
フェイシャルキャプチャをするには下のプラグインが必要なので、一応有効化されているか確認してください。おそらくされているとは思いますが念のため。
- Live Link
- ARKit
- ARKit Face Support
ここまで出来たらいったんUE4側は置いておき、iPhone側の設定をしていきます。
初めに、iPhoneとPCをライトニングケーブルやBluetoothでつなぎます。
次に、iPhoneに「Live Link Face」というアプリを入れます。App storeでダウンロードしましょう。
アプリを開くと自分の顔にメッシュが表示された画面が出ると思います。(最初は出ないかも?)
これから、iPhoneをPCにつなげるための設定をしていきます。
まず左上の歯車マークを押して、設定画面を開きます。
一番上のLive Linkを押し、Add Targetを押します。
で、IP AdressにはPCのIPアドレスを入れます。(ポートはそのままでOK)
PCのIPアドレスは、コマンドプロンプトで「ipconfig」と入力すると出てくる「192.168.○○.○○」の数値です。
これでスマホ側はOK! UE4に戻って設定を進めていきます。
Kite君のアニメーション設定であるAnimBP(KiteBoyHead_JointsAndBlends_AnimBP)を開き、さらにAnim Graphを開きます。
ノードの一番最初にLive Link Poseというノードがあります。Live Link Subject Nameのところで自分のiPhoneを選びましょう。
この状態でコンパイルすると、アプリと同期してAnimBPの設定画面のKite君の顔が動いてくれると思います!
ノード内のLive Link Subject nameで自分のiPhoneを選択しコンパイルすると、自分の顔とKite君の顔が同期されます。
試しにPlayボタンを押して、ゲームの方でも動くか確認してみましょう。
これで、iPhoneとUE4をつなげる設定が完了です!
自分のiPhoneが表示されない場合や設定したのに顔が動いてくれない場合は
- ケーブルなどがしっかり接続されているか
- IPアドレスは間違っていないか
- ファイアーウォールの許可設定
などを確認してみてください。私はここで一度詰まり、ファイアウォールでUE4 editorを許可したら無事動くようになりました。
3. 自分で作ったキャラを動かす!
ここからは、自分のモデルを動かす設定をしていきます。
この時点でFace AR Sampleを閉じ、別のプロジェクトで作業しても構いません。その場合は、上のほうで確認した3つのプラグインを有効化するのを忘れないでください。
アニメーションブループリントの設定
自分のキャラには独自のアニメーション設定をする必要があるので、まずはその設定からしていきます。
コンテンツブラウザ で右クリックし、Animationから アニメーションブループリント (Animation Blueprint, AnimBP)を追加します。
スケルトン を選択するところで、自分のキャラのスケルトンを選びましょう。
作ったらAnim BPを開き、Anim Graphを開きます。
で、Live Link Poseノードを追加してOutput Poseノードにつなぎ、Live Link Subject Nameは自分のiPhoneを選びます。顔を動かすだけならこれだけでOK。
コンパイルするとKite君と同じようにAnimBP画面でキャラクターの顔が動いてくれるはずです!
次にノードを配置する場所で右クリックし、「LiveLinkPose」と検索。
出てきたノードを選択して追加します。
最後にコンパイルと保存をします。
ここから少し補足
Kite君のAnimBPにはLive Link Poseノード以外にも何やらごちゃごちゃありますが、それらは動きをより良く見せるための応用的な要素に過ぎません。
また、前編の方で解説しているのですが、iPhoneから送られてくる動きのデータには名前がつけられています。
例)左目を閉じる動作のデータ名はeyeBlinkLeft
Live Link Poseノードでは、その名前とモデルのモーフの名前が一致していると、連動してモデルが動くという仕組みになっています。詳しい名前については前編の記事かこちらの名前まとめを参照。
今回のケースでは、前編にてモーフの名前をつける際に、前もってその名前と一致させておきました。なのでLive Link Poseノードだけでキャラクターが動いてくれるというわけです。
Live Link Poseノードは、名前が一致しているキャプチャのデータ名とモーフが連動するような機能を持っている。
逆に言えば、ダウンロードや購入したモデルですとモーフの名前が異なるためにLive Link Poseノードだけではキャラは動いてくれません。
そんなときのための割と簡単な対処法としてアニメーションブループリントで「Modify Curveノード」を使う方法があるのですが、おかずさんの記事がとてもわかりやすいのでその解説はそちらに譲ろうかと思います。
キャラクターブループリントの設定
さて、ここで完了と行きたいのですが、まだ レベル 内でモデルを動かす方法がありません。もちろん、メッシュをワールドに配置しても動いてくれません。
現時点の状況は、モデルを動かす設定(AnimBP)はしたけど、どのモデルを動かすかという設定をまだしていないという感じです。なので、これからその設定をしていきます。
どのモデルを動かすかという設定は、ブループリント (BP)で行うことができます。
コンテンツブラウザで右クリックし、BPを選択し、Pick Parent ClassではCharacterを選びます。
BPが追加されたらそれを開きます。
開いたらまずビューポートを開きます。すると真ん中にカプセルが表示された画面に切り替わると思います。
次に画面左側のComponentsからMeshを選びます。
右側にいろいろ設定項目が出てきますが、そこから「Mesh」の「Skeltal mesh」を見つけ、自分のモデルを設定しましょう。
最後に「Animation」の「Anim Class」を見つけ、さっき設定したAnim BPを設定します。
設定したらしっかりと保存して、BPをワールドに配置してPlayを押してみましょう。これでキャラクターがしっかりと動いてくれるはずです。
今回、UE4側は非常にシンプルなことしかやってないので、モデルが動かないときは接続周りかモデルの設定(Blender側の設定)に問題がある場合も多いです。
モデルのインポート、エクスポート周りに関しては前編の記事も参考にしてみてください。
UE4側に関しては最初のほうで紹介した公式ドキュメントやブログ記事も確認してみてください。
顔の動きに納得できなかった場合は、シェイプキーの設定に戻ってやり直しましょう!
顔の回転をモデルに適応する
このままですと頭が固定されてしまい、場合によっては違和感を感じることがあるかも知れません。
そこで、頭の回転をモデルにも適応する方法を紹介していきます。(ちなみに、公式ドキュメントにも載ってます)
まず、キャラクターのアニメーションの設定をするAnim BPを開きます。
先程の顔を動かす設定では「Anim Graph」というところで作業していたのですが、今度は「Event Graph」に切り替えます。
切り替えると「Event Blueprint Update Animation」という赤いノードがあると思います。このノードはアニメーションを更新するために必要なノードで、アニメーションの更新をしたいときはこのノードの後にいろいろと処理を付け加えていきます。
まずは「EvaluateLiveLinkFrame」ノードを追加し、つなげます。subjectは自分のiPhoneを選択してください。このノードでiPhoneから頭の回転の情報を得ることができます。
続いて「GetPropertyValue」ノードを3つ追加し、「EvaluateLiveLinkFace」と青ピンでつなぎます。
このノードは、EvaluateLiveLinkFrameの中から具体的に1つの情報だけ得るために使います。今回は頭の回転の情報を得たいので、Property Nameにはそれぞれ「headYaw」、「headPitch」、「headRoll」と入力します。
次に、Event Graphでは最後の作業となる、変数の設定をしていきます。まずは画面左下のVariableの欄の+ボタンを押して、変数を3つ追加します。
画面右上で変数の名前とタイプを変更していきます。名前は自由につけても大丈夫ですが、わかりやすく「HeadYaw」、「HeadPitch」、「HeadRoll」とします。タイプはすべて「Float」に設定します。
変数の設定が終わったら変数を画面の真ん中にドラッグアンドドロップし、GetかSetか聞いてくるのでSetを選びます。(Getは変数の値をどこかで使いたいとき、Setは変数に値を代入したいときに使います。)
出てきたノードを順番でつなぎ、「GetPropertValue」と緑ピンでつないで、変数に頭の回転の情報(数値)を代入します。
ちょっとややこしかったですが、Event Graphでの作業はこれで終わりです。
現時点だと頭の回転の情報は得られていますが、具体的にどんな動作をするのかを設定していないためモデルは動きません。なので、今度はAnim Graph側で、設定した変数を使ってアニメーションを制御するノードを追加していきます。
まずは「Transform(Modify)Bone」のーどを追加し、LiveLinkPoseとOutputPoseの間につなぎます。
その際、データの変換を行うノードが二つ追加されますが、これは特にいじらず、そのままでOKです。このノードで頭の回転をさせます。
ノードを選択して、右上のDetailsでどのボーンが動くかを設定します。今回は頭が動いてほしいのでBone to Modifyでは頭のボーンを選びます。
さらに動き方ですが、Rotationのところを画像のようにReplace Existing、Bone Spaceと設定してください。
最後に、このノードに変数を代入していきます。
変数のところから3つの変数をドラッグアンドドロップで持ってきて、代入したいのでGetを選びます
さらに、Float*FloatノードとMake Rotaterを追加して緑ピンを追加します。
掛け算のところには、自分の頭が90度回転したときにモデルの頭をどれぐらい回転させるかを目安に数値を入れてみてください。
最後にMakeRotatorとTransform(Modify)Boneをつなぎ、コンパイルしてプレイボタンを押せば、モデルの頭が回転してくれるはずです。
回転方向がかみ合わないときは、Make Rotatorにつなげる変数の位置を切り替えてみてください。私のモデルではRollとPitchを逆にしたら正しく動くようになりました。(BlenderとUE4の軸の向きの違いが原因?)
割と簡単に実装出来る機能を一部紹介
UE4はゲームエンジンなので、ゲームや映像に関係する機能は何でも自分で作り実装できます。
これは今のVtuberの主流(自分調べ)とも言われるUnityも同じですが、Unityと大きく違うのはプログラミング言語を使えなくても「ブループリント」という初心者に優しいプログラミング方法を使って機能を実装できるという点です。
ここからは、割と簡単に実装できそうな「Vtuberと組み合わせたら面白くなりそうな機能」を紹介していきます!
グラフィックの調整
UE4は圧倒的な画質の良さ、絵作りのしやすさを売りにしています。UE4でVtuberをやれば、その利点を存分に味わうことができてしまうのです。
また、PostProcessVolumeやCime Cameraなど、エフェクトに関する機能も満載です!
画面のコントラストを変えたり、ぼけを加えたりといったことはもちろんのこと、見た目をセルルックにしたりなんてこともできます。
歩ける!
UE4は「ゲーム」エンジンですので、もちろんゲームが作れます。そこで、アクションゲームなんかには必須な移動システム(歩く、走る、ジャンプ、乗り物に乗るなど)を作りフェイシャルキャプチャと組み合わせることで、
縦横無尽に移動するVtuber
が完成します。(実質的に部屋の壁という現実の大きな障壁を乗り越えたといっても過言ではない…異論は認める)
走る、ジャンプするだけなら最初からテンプレート(サードパーソンテンプレートなど)が入っているので、それを改造していくだけでOK。
さらに、UE4にはキャラクターを動かす方法としてアニメーション、ControlRig、モーショントラッキング(顔以外も)など様々な選択肢があります。つまり、
- 上半身はmocapで下半身はキーボード操作
- 全身mocap+不自然な動きをControlRigで補正
- ボタン一つでmocapとキーボード操作切り替え
などといった、ハイブリッド的な使い方ができちゃうんですよね〜。
場合によっては「アクションゲームにフェイシャルキャプチャ機能を付けたもの」にも捉えられますね。
ワールドや背景を自由に作れる!
ゲームと言ったらステージが必要ですが、UE4は「ゲーム」エンジンですので(しつこい)、もちろんステージも作ることができます。
基本UE4のステージづくりは、物を配置していくだけでできるのでかなり簡単にできちゃいます。
そのステージも、
自分オリジナルの町を作って、移動機能を使ってそこを歩きながら配信したり…
森を作って癒し配信をしたり…
キャラクターに家を作ってあげて、そこから配信したり…
単純にシンプルな背景を作ったり(グリーンバックももちろんできます)…
と、やりたい放題。
Vtuberといったらゲーム配信なんかがメインで背景はあまり重要視されませんが、
それ以外にも雑談配信や、ゲームを始めるまでのオープニング部分なんかに一工夫入れることができるのは大きなアドバンテージだと思います。
Black Fridayセールで衝動買いしてしまったもの。
自分専用のUI
ウィジェットブループリントを使って、画面上に自分が作ったUIを表示させることができます。
必要なものにだけ絞り込んで、さらにそれをボタン、バーの操作で、撮影、実況中でも即時に設定できるというのはかなりロマンを感じます。
その他もろもろ
- UE4作業時と同じようにカメラを自由に移動できるようにする機能
- 座る、寝る、ガッツポーズなどの特定のポーズやアニメーションをとらせる機能
- 着せ替え機能
などなど、技術力さえあれば、思いついたアイディアはたいてい実装できるはずです。
まとめ
今回はアドベントカレンダーという機会を利用し、BlenderとUE4を使ってVtuberになる方法を紹介させていただきました。
Vtuberに興味のある方や、なりたいけどお金とか技術とかの問題でできないという方に、少しでも役に立てたらうれしいです。
正直な話、自分でこの方法を試したときは、こんなにも簡単にVtuberになれるのか!?と驚愕しました。
今回のことも含めここ最近の技術進歩のおかげでVtuberになるための敷居が少しずつ下がっているな～と実感しております。これからは、問題はキャラのデザインセンスだけになっていきそうですね。(がんばらねば)
明日12月10日のUnreal Engine 4 (UE4)AdventCalenderその3は、WanchanJPさんによる「UE4でスマホ向け3D縦スクロール漫画を作ってみた」です!!
UE4は漫画も作れるのか…かなり先進的な内容で面白そうです!
それにしてもUE4の潜在能力に驚くばかり…UE4は本当に「ゲーム」エンジンなのか!?
リンク集
Advent Calender
Advent Calenderで私が書いた記事
- BlenderとUE4でVtuber 前編
- BlenderとUE4でVtuber 後編(このページ)
Blender関係
UE4関係
コメント