3Dキャラクターの可愛い表情について考えてみた VRM編

# はじめに
VRMモデルをセットアップしている中でいくつか大切にしている事項があるのですが、
今回はblendshapeに焦点を当てて、お話できればと考えています。

# blendshapeとは？
VRMに格納されている表情キーのパラメーター数を指定し、記録したものです。
利点としてはモデル自体に記録できるので、表情のプレハブ（喜怒哀楽）を呼び出すだけで表情変化が可能。
喜怒哀楽のパラメーター調整がUnityのみで行えて、無駄なシェイプキーを増やす必要もない。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/469dca74-4686-353a-396c-01bece190dc6.png)

# 用意したモデルについて

テストモデルには千駄ヶ谷渋ちゃんを用意しました
https://hub.vroid.com/characters/675572020956181239/models/4479743608263344465

このモデルはVroidで作られていて、VRMの普及率でもVroid製のものが多いので参考にしやすいかなと考えました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/cd12cd88-b07b-b02b-3a88-21bd58fed6e2.png)

デフォルトで記録できる表情は１９種類です。
add blendshapeClipを追加することで、さらに記録できる表情を増やすことが可能です。

# Kawaii表情について

### まずは、あいうえお　の口の形を作りこみます。

・デフォルトの、あ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/8d48b679-5c9f-e0e8-9101-010f96c56a20.png)

・パラメーターを混ぜ合わせた、あ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/adc07d8d-ff24-05fa-3252-64076515f6ad.png)

大前提として顎がぬけない。だけど、大口を開けている。
口角が上がることで、あの発音をしていることが分かりやすくなる。
歯が見えすぎないようにしている。

・デフォルトの、い

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/c89bf378-24fc-5e99-1ad0-81cb8f74e03b.png)

・パラメーターを混ぜ合わせた、い

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/289c4c52-8bbf-712a-5682-c96a47dda32e.png)

食いしばっているように見えたので口角を上げていの口にした。

・デフォルトの、う

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/673a58a1-3906-5f73-1433-21bd9bd01c7b.png)

・パラメーターを混ぜ合わせた、う

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/ef412516-8c0d-c289-006b-787d6bc7140c.png)

おちょぼ口になっていたのを少し開き口にした。
実際に３D空間でモデルを運用するときに多少なり、口が空いていないと開いているかの判断が視覚的にむずかしい。


・デフォルトの、え

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/84ce2f78-b045-6f33-b50f-1ce1d90c9c6e.png)


・パラメーターを混ぜ合わせた、え

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/242d4fdc-6982-aaae-d510-a34e8e8afa16.png)

えは口だけで少し笑っているように感じるくらいに設定する。
歯は開きめにし、口角を上げてあげると良い。

・デフォルトの、お

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/12d7844d-ee0f-61ea-c33d-b8942cda775e.png)

・パラメーターを混ぜ合わせた、お

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/f11bc597-1c28-52b5-e47b-40d5b406c0fb.png)

お、はあとうのすみ分けで一番悩む方がいるかと思います。
ポイントとしてはあの口の開き具合より少し小さく、形はうの口を意識するといった感じです。







### 表情を修正する



Vroid特有なのですが、まず表情に含まれるmouthのキーを全てオフにします

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/14bbb5e6-939b-a9c0-1aba-4df2c0bdf4e1.png)

Q.どうしてオフにするのか？

リップシンクと合わさって顎が抜けてしまうからです。
めちゃくちゃホラー

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/af5734d3-7a54-4a5b-8064-c69d39b1b2b4.png)


### 新しく表情を作る

・判目

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/bd96ae71-39bd-3d2d-716e-292197bd2631.png)

・＞＜

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/b3a82e08-3ed6-5456-cfc2-f800dc169faf.png)


etc...（そのうち追加します）

# blenderで表情を増やす
今回は星のお目めの追加と光彩を消すを追加しましょう
Faceメッシュをmaterialごとで分解します。（分解しなくてもできます）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/6cb965a2-dcb9-f779-f9bd-8def4a151227.png)

F00_000_00_EyeHighlight_00_EYEのメッシュを選択
シェイプキーにnonを追加。値を１にする。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/32147cbb-8252-3f38-26bc-16b12598f8e1.png)

偏執モードにして、拡大拡小ツールで小さくする

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/dd4419b0-b5b9-0070-2d86-ee481bb6c989.png)

オブジェクトモードに戻せば、光彩を消すが作れました


つぎに星のお目目を作ります。
F00_000_00_EyeExtra_01_EYEを複製します
複製したら一度、右クリックしてください。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/0d882b33-7da8-9019-0a0b-651ac9f4f35f.png)

シェイプキーの名前をEyeExtra.M_F00_000_00_EyeExtra_Onから変更してください。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/d86d20d1-76d7-fab9-faba-739eaeea39f0.png)

新規materialの追加を一度押してください

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/146bf733-ed85-47c6-2b2c-34d206f04180.png)

コピーを作って、textureを書き換える

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/797646ea-d364-8b68-85cf-aa19b2938594.png)

maintexture、shadertextureをさっき書き換えたtextureに差し替える

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/2e6cf46f-0709-9e4c-be15-836b0141d360.png)

Faceのメッシュを選択して統合

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/d31c45b0-8f93-ef7f-26d3-1f292d43a3d5.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/609493/dcc9fbe5-e233-d2c1-d45a-6e325f884219.png)

この方法だとマテリアルを増やしてしまうので減らしたい人は雑でもいいからUV展開しなおすかcatアドオン使ってさくっと直すといいかもです


# まとめ