
NEOKET向けの理想のノーマルマップ・エミッションを考える
1日だけ開催のNEOKETですが、この機会にVRoid製VRMの秘めたポテンシャルを最大限に発揮してみるのも良いのではないかと思ったので、書き綴ります。
NEOKETのモデル制限はclusterの実質上位互換
NEOKETで使えるアバターですが、テクスチャの解像度が4096x4096でマテリアル8・テクスチャ数16だと、アトラス化してもVRoidのテクスチャが縮小なしでほぼそのまま入る上にノーマルマップやエミッションを入れる余力まであります。
この辺り見ると本当にclusterの上位互換ですね。テクスチャの解像度は本当に感動的で、実質64倍です。
cluster向けには前にも書いてるのですが、具体的な生成方法について内容を掘り下げて説明します。
ベースヘアを削除するだけでマテリアルは1つ減らせる
これはNEOKETでもclusterでもそうなのですが、VRoid Studioはマテリアル数12と8の設定時、髪の毛とベースヘアをそれぞれ別のマテリアルに割り当てており、HairSample_Female/HairSample_Maleのように髪でベースヘアを代替してやることで、マテリアルを1つ減らすことが可能です。
ポリゴン数が増えますが、削減オプションがあるのでそれほど大きな問題にはなりません。
後付けで自由に使えるマテリアルの空きが1つできると追加の衣装・アイテムを入れる余地も生じるので入れたい人はここに。大抵VRoidのボディ+衣装+髪のアトラスは右上が空いてますし、テクスチャの制限の余りを使っても良いです。
ノーマルマップを入れる
VRMテクスチャ差し替え&最適化ツールでいうところの「Body_BumpMap」が、胴体+衣装+髪のアトラスです。
2048x2048に縮小されていますが、別にこれは4096x4096に置き換えても構いません。ファイル容量と相談です。ちなみにVRMのサイズを縮小するのは、ノーマルマップみたいな色数の少ないPNGファイルの場合、経験上はビットマップを縮小するよりもむしろパレットモードなどを使った方が減ることが多いのですが、VRoidはあんまりいい画像ライブラリを使ってないような気がします。
着重ねをどう表現するか?
VRoidは複数の衣装をテクスチャを重ねることで着重ねを表現しますが、3D表示するとのっぺりしていて残念さを感じてしまうことがよくあるとおもいます。そこでバンプマッピング(ノーマルマップ)の出番なのです。
衣装のアルファ値を白黒ビットマップに変換します。アルファ値(不透明度)0の部分が黒、MAXの部分が白になれば良いわけです。
というのも、GIMPのノーマルマップフィルターは明暗の相対差から機械的にノーマルマップを生成してくれるだけで模様なのか衣装のシワなどの凹凸情報なのかを区別してくれないからです。
アルファ値を白黒に変換するだけならソフトによっては専用機能があるのですが、今回はあえて回りくどい方法を使います。
クリッピングの概念自体は合成に使うので一応周りくどい説明します。
PhotoshopやCLIPSTUDIO PAINTではクリッピングとレイヤーフォルダを使うことでこれを表現できます。
GIMPにはクリッピングレイヤーの機能がないので、レイヤーグループ(Photoshopでいうレイヤーフォルダ)と「消しゴム」モードのレイヤーを組み合わせることでこれを表現します。レイヤーの順序や合成方法が他と変わります。試しにVRoid Projectの「びっくりハロウィンコーデ」のドレスを例に出してみましょう。
レイヤーグループ(Photoshop/CLIPSTUDIOでいうところのレイヤーフォルダ)を使うことで、「消しゴムによって衣装部分が削除された黒ベタ」を通常モードで白ベタに貼りあわせることができます。
「レイヤー」メニューから「可視部分をレイヤーに」を選択し、レイヤーの結合結果を新しいレイヤーにコピー。
そして「フィルター」から「Normal Map」を選びます。
結構細かい部分まで出ましたね。凹凸を残す必要のない部分は塗りつぶしてしまって構いません。
ノーマルマップの合成
これをさらにクリッピングしてノーマルマップに重ねていくわけですが、ノーマルマップもまたレイヤーによる調整が有効です。元の凹凸面を上書きする場合は合成モードは通常、重ねて適用する場合は「オーバーレイ」を使います。
凹凸を強調したい場合はオーバーレイ用のレイヤーの濃度を濃くすると良いでしょう。欲張って1回のノーマルマップ変換で済ませようとすると調整がうまくいきませんので、根気よくやりましょう。
(BOOTHで衣装を購入すると元のPSDファイルを提供している衣装がたまにありますので、そういった衣装はこの作業が非常に楽になります)
とはいえ、衣装についてるフリルとかリボンみたいな細部までまでノーマルマップ化しようとすると沼に陥る(ショップ衣装の購入者レベルでやるには負担が大きすぎる)ので、その辺りは各ショップに期待しましょう。ユーザーレベルでは必要なポイントを絞って凹凸情報を抜き出すだけでも十分でしょう。
エミッションの設定
黒(RGB={0,0,0})を起点として、色(明るさ)をいくら加算するかを定義するのがエミッションマップです。
「VRM〜」のプレビューでは白くなっている部分は本来透明のはずです。本当に真っ白に塗るとその部分は「白飛び」してしまいます。透明部分は全部黒塗りにしてしまって構いません。アルファ値なしの方が容量も節約できるはずだし。と言っても全体として大して容量食ってないんですけど。
そこから光を加算したい場合、白は明るさMaxの状態として、ほんのり明るくする程度で調整しながら入れていきます。
これを使いこなすと、暗転するところで発光するアイテムみたいなのが作れます(想定はブルーウォーターでも飛行石でも高濃縮ウランでもなんでもいいです)。衣装の光らせたい部分に十字型発光のエフェクトをほんのり入れて様子見すると良いでしょう。本当に「ほんのり」でいいですよ。白飛びするから。
擬似的な発光効果を付けてるテクスチャをPSDファイルつきで販売してるクリエイターさんがいる場合、エミッションに転用できるレイヤーなども割と付属してる可能性があると思います。
ShadeTextureのカスタマイズ
ノーマルマップやエミッションのテクスチャと同様に、影色も衣装パーツごとではなくピクセル単位で設定できるようになっています。テクスチャ差し替え前提で考えるならアトラス化バージョンを積極的に利用すべき理由づけになります。
最後に
NEOKET用のテクスチャカスタマイズの作例ですが、Sewell(もるっ)さんのトレンチコートは、陰影だけでコートの立体感を表現した直球なデザイン(=模様で誤魔化しが効かない分、画力が要求される)である分、布地が厚みを持って3D空間で動き回ると感動すら覚えます。
同衣装は自由に着重ね可能なパーツが付属しており、比較的ノーマルマップを自作しやすくなっています(ただしベルトのバックルやボタン部分に関しては凸部分なのに暗色になってるので、うまく切り抜いて明るい色に変えてからフィルターに通す必要があります)。
衣装自作勢も購入勢も、一工夫で衣装の魅力を向上させることができます。ぜひお試し下さい。