はいぬっかメモ

キャラクターモデルをVR空間で眺めたい

【BlendShapeBuilder】Unity単体でVRMモデルにほっぺモーフを追加する

iPhoneのFaceIDでフェイストラッキングしたい

・VRoidで作ったうちの子に表情を追加したい

・でもBlenderとかさわったことない…

 

⇒ ほっぺプクー 程度なら、Unityだけでもわりとかんたんに追加できたよ!

  という記事です

 

f:id:hinzka:20200210152742g:plain

 

Blend Shape Builder & Vertex Tweaker
UnityJapan提供のアセット
 
メッシュの頂点を動かしてBlendShapeを追加できるアセットです
 Blenderなどのモデリングツールを使わず、Unity単体でBlendShapeを追加できます
 
今回はこれを使って「ほっぺをふくらます」モーフを追加します
※モデルの改変を伴います ライセンスにご注意ください
 
 
また、そもそもiPhoneのFaceIDに対応させたくてBlendShapeを追加しているので
FaceIDについてもあとで追記します 
 

準備

VRMモデル
 
Unity 今回は2019.3.0f5を使用しました 
 
BlendShapeBuilder
 
UniVRM
 
 
 
Scene上にモデルを配置します

f:id:hinzka:20200210142843p:plain

必要アセットとモデルを配置した状態

Blend Shape Builder

HierarchyからモデルのFaceを選択
メニューの Window>Blend Shape Builder をクリック
BS Builderウインドウが開きます

f:id:hinzka:20200210142946p:plain

BlendShapeBuilderウインドウを開く

f:id:hinzka:20200210143114p:plain

Add BlendShapeBuilder to Face ボタンをクリック
BlendShape追加画面になります

f:id:hinzka:20200210143328p:plain

+ボタンをクリックするとFrameを追加します

これによりFaceメッシュのコピーがScene上に追加されます

f:id:hinzka:20200210143550p:plain

 
コピーされたメッシュを編集して、モーフ変化のターゲットを作っていきます
 ターゲットとなるFrameを複数作成すると(50%のときの形状、100%のときの形状など)変化量に応じた動きを設定することができます
今回は100のターゲットを1つだけ作成します

f:id:hinzka:20200210143437p:plain

該当FrameのEditボタンをクリックすると、VetrexTweakerウインドウが開きます
メッシュの頂点を直接動かし、形状を変化させていきます
 
ところで、メッシュが重なったままではScene上で非常に見づらいです
編集しないメッシュはいったん非表示にしましょう
FaceオブジェクトとHairオブジェクトについて、
InspectorでSkinned Mesh Rendererのチェックを外しておきます
(編集が終わったら戻しましょう!)

f:id:hinzka:20200210143713p:plain

髪オブジェクトはまるごと無効にしてもよいですが、
Faceオブジェクトをまるごと無効にするとコンポーネント(BlendShapeBuilder)にアクセスできなくなるので注意してください
 
 

VetrexTweaker

 
 f:id:hinzka:20200210160933p:plain
 
Move:頂点移動
メッシュの頂点を移動させます
 
Soft Moveがオフの状態では、
頂点の選択方法をSelectオプションで選ぶことができます
Shiftを押しながら連続して選択していくと複数の頂点を選択できます
 
Singleツール    クリックした頂点を選択します
Rect    矩形選択ツール    これとなげなわツールではFront Side Onlyのチェックを外しておくと隠れた頂点も選択されます
Lasso    なげなわツール
Brush    ブラシツール
 
Edge    該当メッシュ全体のメッシュのエッジがすべて選択されます
Hole    選択した頂点を含む連続した面の端部がぐるっと囲むように選択されます
Connected    選択した頂点に連続した面の頂点がすべて選択されます
All    全選択
Clear    選択の全解除
Invert    選択状態の反転
 
☆VetrexTweakerには左右対称に編集できるミラーリングオプションがあります
がVRoidモデルは厳密にシンメトリーではないためエラーになってしまいました
f:id:hinzka:20200210155421p:plain
 
☆また、投影機能を使って
既存のBlendShapeモーフからコピーできないかやってみましたが
目や口元の密集した頂点を正しい頂点に対応させるのはちょっと無理でした…
 
 
 Soft Moveで頬をふくらませます

f:id:hinzka:20200210162048g:plain


今回は、横に広げる+前に出す の2ストローク動かしています
 
さらに、なげなわ選択とScaleツールで口を小さくします
 f:id:hinzka:20200210162016g:plain
 
 
ターゲットメッシュの編集が完了したら、BS Builderウインドウに移動してBlendShapeを作成します

f:id:hinzka:20200210162352p:plain

Update Meshをクリックすると、FaceのBlendShapeに「cheekPuff」が追加されます

f:id:hinzka:20200210161014p:plain

 
確認するために、今度はターゲットメッシュを非表示にして、Faceオブジェクトのメッシュを表示させましょう

 ただし、Faceオブジェクトのインスペクタに追加されたcheekPuffモーフは

スライダーを動かしてもScene上のモデルの表情に反映されません

(他のBlendShapeのスライダは反映される…)
 
BlendShapeAvatarアセットを開きます
表示されるBlendShapeスライダを動かすと、プレビューウインドウのモデル表示に反映されます

f:id:hinzka:20200210162742p:plain

f:id:hinzka:20200210204431p:plain

このように新しいBlendShapeを作成することができました
今回作ったターゲットメッシュは、モーフが完成したら削除してかまいません(他のモーフに流用することもできます) 
 
BlendShapeの追加が完了したら、
非表示にしておいたメッシュを再度表示させてから
VRMを書き出して完成です
 
 
なお、VRMモデルでは、複数のBlendShapeを組み合わせたBlendShapeClipを作成することで
さらに複雑な表情を登録することができます
 LuppetなどのVRM対応アプリで呼び出して使ってみましょう
おつかれさまでした!
 
 
 
 

 FaceID

がんばればフェイストラッキングに必要なモーフをUnityだけでつくることもできなくはない
 
※あとで追記します~~~~
 
iPhoneX以降に搭載されている顔認識技術FaceIDでは、52個のBlendShapeを使って表情をキャプチャします
対応したBlendShapeをモデル側に追加することで、VRMモデルの表情を豊かに動かすことができます
 
FaceIDで3Dモデルの表情を動かすツール3つ
 
52個のうち、8個は視線コントロール用のキーです
VRoidなどのボーンで視線制御するモデルではこちらは使用しません
 
また、VRoidのデフォルトBlendShapeから流用できそうなキーがいくつかあります
eye blink left
eye blink right
jaw open
 
mouth funnel
漏斗状の口
 
mouth pucker
キス顔
 
特殊な表情として、舌を出すもの
tangue out
ボーン入りの舌を追加するにはBlenderなどの他ツールを使う必要があるため
Unity単体で実現する場合はテクスチャの切り替えで出現させるといいかも
 
 
 
BlendShapeの設定では、登録順序や名前が重要になる場合が多いです
Unityデフォルトの機能ではリネームやソートができません
 
 今回の記事で紹介したツール BlendShapeBuilder に含まれる BlendShapeInspectorWindow.cs の改変スクリプトが@flammpfeilさんから
公開されており
こちらに差し替えるとリネーム・順序変更ができるようになります
(やりかた
GitHubのコード表示の右上にある RAW をクリックするとテキストが表示されます
これを全選択してコピー、メモ帳に張り付けてファイル名をBlendShapeInspectorWindow.csにして保存します
Assets\UTJ\BlendShapeBuilder\Editor にあるBlendShapeInspectorWindow.csを削除し、
作成した.csファイルをここにドラッグ&ドロップします)
 
 
VRoidモデルが着てるパーカーはこちらです✨