MMD4Mecanim Tessellation機能とマテリアル編集のコツ

この記事は[Oculus Rift Advent Calendar 2016](http://qiita.com/advent-calendar/2016/oculus-rift) の4日目の記事になります。

# Tessellation（テッセレーション）とは
MMD4Mecanim20161029版からTessellation（テッセレーション）を有効にする機能が追加されました。テッセレーション自体は最近生まれた技術ではなく、ずいぶん前からGPUの機能として実装されていたりします。しかしながら処理負荷や少ない頂点から思った曲面を生成するのが難しく、今時のGPUであればデザイナーがNormalMapの利用や頂点数を増やしたモデルを作成する方が低コストで高品質なものが作れるため、一部の変形用シェーダーから利用されるに留まり、特にキャラモデルには使用されない機能として眠っていたものでした。しかしVR制作において、数センチまでキャラモデルにカメラが寄れてしまう構造からテッセレーションと相性が良い状況が発生しているというのが現状です。そういった背景から今回のMMD4Mecanimのテッセレーションについて書いてみました。

<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr">検証中ではありますがMMD4Mecanim20161029版で追加されたテッセレーション機能がVRと激しく相性が良いやも。デカールやハードエッジなオブジェクトは個別設定する必要がありますが、カメラ距離で自動分割するのでどこまで寄ってもミクさんがポリポリしなくなる(*´Д`) <a href="https://t.co/scKMTP53VK">pic.twitter.com/scKMTP53VK</a></p>&mdash; Segawa Yoshihisa (@mkt_) <a href="https://twitter.com/mkt_/status/792798016411275265">2016年10月30日</a></blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>


# MMD4MecanimのTessellation

## VRとの相性の良さ
ゲームなどの場合、キャラモデルがカメラに近づいてきたら（ゲーム進行の）邪魔になるので非表示にしたりするため、描画コストと制作コストを掛けてまでテッセレーションで面を滑らかにする必要がなかったのですが、VRの場合、キャラモデルに数センチまでカメラが近づくことも十分想定され、キャラクターとのコミュニケーションを楽しむコンテンツであるならメリットの方が大きくなっていくと推測します。
![161031_Yomiku_Tessellation.png](https://qiita-image-store.s3.amazonaws.com/0/33572/42c61d26-a3ee-5239-476d-d9085f38e343.png)


ただ実際に適応してみると変形しすぎたり隙間が空いたりして、キャラクターのプレゼンスを削いでしまう表示になる変換をすることがありますので、使用の際はそのあたりに注意する必要があります。

## パラメータ説明
マテリアルごとにON/OFFの設定、変形パラメータを指定することができます。変換時のInspectorから設定すると、全体に適応する調整ができます。ここで大まかな密度と変形具合を設定しておくことをお勧めします。特に人体モデルの場合は、まず全てONにしてみて全体のパラメータ調整⇒個別マテリアルの調整をするのがよろしいかと思います。

### テッセレーションをONにする
変換後でないとオプションがInspectorに表示されません。変換後、Projectビューの定義ファイルを選択して、MaterialタブからテッセレーションをONにします。
![161204_TessellationON.png](https://qiita-image-store.s3.amazonaws.com/0/33572/096f9352-5ed1-f44e-99c5-9bf8de161d78.png)
調整しやすいよう Sceneビューの描画モードをShaded Wireframeにして分割が見えるようにします。


### カメラからの距離で変化する頂点密度の設定
カメラの距離から近いほど面が自動分割されます。ただし分割数が多いと処理負荷も増大しますので、分割数が少なくなるよう調整します。Edge Lengthの値は数値が大きい方が分割数が減り処理が軽くなります。デフォルトは値が小さい気もしますので、（モデルにもよりますが）12~16あたりから調整を始めるといいかもしれません。
![161204_EdgeLength.png](https://qiita-image-store.s3.amazonaws.com/0/33572/4d83db68-cb6c-c0ba-1117-9ac64ff3400b.png)


### 変形時の膨らみ具合の設定
Phong Strengthで調整します。数値が大きいほどよく膨らみ丸みを帯びる変形をします。初期値は0.5ですが、ここの値が大きすぎると元のモデルから崩れることにもなるため、出来るだけ小さな値で丸みが良い感じになるように調整するとよいでしょう。
![161204_PhongStrength_Sample.png](https://qiita-image-store.s3.amazonaws.com/0/33572/b73387f0-d0d9-9d68-4537-ed81af45fcac.png)


## 注意点

### デカールが埋まる
ポリゴン数を減らしたり、法線を綺麗に出すために、面をちょっと浮かせて模様を書き込むような手法でモデルを制作することがよくあります。その際、頂点を共有していない面をテッセレーションで補間したときに、浮かせた方の面が埋まってしまうことがあります。
テッセレーションのパラメータを調整である程度回避することができますが、噛み合わせによってはモデルの頂点を増やしたり、結合してテッセレーションで崩れないモデルに修正する必要が出てしまうかもしれません。
![161204_Tessellation埋まり.png](https://qiita-image-store.s3.amazonaws.com/0/33572/517694dc-9341-0d1d-ac18-8d204acf42f6.png)

#### デカールポリゴンのマテリアルが分かれている場合
(2016/12/04追記）
デカール用にマテリアルが分かれている場合はポリゴンを浮かせる距離を調整して回避できます。静止しているときは大丈夫でもモーションを入れると埋まってしまう場合などにも有効かと思います。
![161204_TessExtrusionAmount.png](https://qiita-image-store.s3.amazonaws.com/0/33572/d29f7d48-9e74-2597-e165-184a3d042f5f.png)


### ハードエッジに隙間ができる
箱のような形状の角をモデリングする際に頂点を分離してエッジを立てることがよくあります。頂点を共有していない面をテッセレーションで変形させたときに、そこに隙間が表れてしまします。そうなると物体としての存在感が薄れVRにおけるプレゼンスが削がれてしまいます。膨らみのパラメータを小さくするかモデリングの段階で頂点を共有する（エッジ部分の頂点を増やしてエッジを立てる）などの対策が必要になります。
![161204_Tessellation隙間.png](https://qiita-image-store.s3.amazonaws.com/0/33572/29108d42-ae2c-5b3e-dce8-32b6a148e27f.png)


#### ポリゴンが刺さっている場合に使える隙間回避方法
MMD4Mecanimの作者であるNoraさんがポリゴンのエッジを伸ばす機能を追加してくれました。使える状況が限られてはいますが、こういう機能があることを覚えておくとよろしいかと思います。

<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr"><a href="https://twitter.com/Stereoarts">@Stereoarts</a> 備考です。SameVertexLengthEdgeStretchは同一頂点と見なす距離、TargetBoneNameは対象のボーン名（ワイルドカード、セミコロン区切り可）、IgnoreBoneNameは除外するボーン名、 <a href="https://t.co/tLTHSbkcxZ">pic.twitter.com/tLTHSbkcxZ</a></p>&mdash; Nora (@Stereoarts) <a href="https://twitter.com/Stereoarts/status/794069325401518080">2016年11月3日</a></blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
<blockquote class="twitter-tweet" data-conversation="none" data-lang="ja"><p lang="ja" dir="ltr"><a href="https://twitter.com/Stereoarts">@Stereoarts</a> StretchLengthはエッジ方向の押し出し距離、ExtrudeAmountは法線方向の押し出し距離(負値指定可）です。あまり長い距離を設定すると頂点スキニングが破綻するので、ごく微小な値のみ設定するようにしてください。</p>&mdash; Nora (@Stereoarts) <a href="https://twitter.com/Stereoarts/status/794070086806016000">2016年11月3日</a></blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>




# MMD4Mecanimマテリアル編集のコツ

## マテリアルを個別に編集する
変換定義ファイルのInspectorからマテリアルを編集することができます。ハードエッジなオブジェクトで隙間が空いてしまったマテリアルなどを個別にテッセレーションOFFにしたいときや、変形を個別に調整したい時などに利用するとよいでしょう。
![161204_デカール埋まり.png](https://qiita-image-store.s3.amazonaws.com/0/33572/3b1b5bc6-e620-e321-c100-bbb3501581e7.png)
（ヘッドホンのマテリアルのテッセレーションを個別にOFFにして、埋まりと隙間を修正した例）


## 複数マテリアル同時編集
Unityの標準機能になりますが、マテリアルを複数選択（CtrlやShiftキーを押しながらファイル選択）することで共通項目を同時編集ができます。同一タイプのシェーダーでないと共通項目が少なくてなかなか同時編集はできなかったりもするのですが覚えておくと調整作業が楽になります。
![161204_複数選択編集.png](https://qiita-image-store.s3.amazonaws.com/0/33572/dc826a6f-df4a-eaf9-0296-dc2d9bce72a1.png)

テッセレーション的に同時編集したいマテリアルファイルをフォルダで分離しておくと選択～編集が楽になるかと思います。
※UnityのProjectビューからフォルダ作成⇒ファイル移動することで安全に分離ができます。OSのファイル操作でファイル移動は行わないこと！（シーンなどそのファイルを参照しているファイルが壊れます）



# 最後に

キャラモデルには使えない（その必要がない）と思われていたテッセレーションがVR用途で急にその有効性から注目される日がくるとか、何が起きるか分からないものですな…。

明日のOculus Rift Advent Calendarは[おばた](https://twitter.com/obaatsu)さんの「『ふぉとゆに』をViveからTouchに移行したハナシ」です、よろしくお願いします。

それでは皆さま、よきMMD4Mecanimライフを( ･ω･)ﾉｼ

## 参考
* [「DirectX 11」のテッセレーション－テッセレーションの意味と重要性 - NVIDIA](http://kr.nvidia.com/object/tessellation_jp.html)
* [テッセレーション - Wikipedia](https://ja.wikipedia.org/wiki/%E3%83%86%E3%83%83%E3%82%BB%E3%83%AC%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3)
* [Unity で距離に応じたテッセレーションを行ってみた - 凹みTips](http://tips.hecomi.com/entry/2016/11/28/232726)
* [DX11 / OpenGL コアテッセレーションのサーフェースシェーダー - Unityマニュアル](https://docs.unity3d.com/jp/current/Manual/SL-SurfaceShaderTessellation.html)
* [[UE4] Catmull ClarkとPN Triangles | historia Inc – 株式会社ヒストリア ](http://historia.co.jp/archives/5813)

----
※この記事はピアプロ・キャラクター・ライセンスに基づいてクリプトン・フューチャー・メディア株式会社のキャラクター「初音ミク」を使用したものです。