VRoid Studio v0.8.2

前回やった事と今回やる事

クマ
前回は、「髪のテクスチャを変えることで、違う髪の質感に変更」したり、「髪とは異なる布の質感に変更」したりできることをやったな。
栗絵マナ
そうですね。テクスチャさえ自作できればかなり表現の幅が深いとも言えますね。VRoid。
栗絵マナ
…まあ「自作できれば」、なんですけどね。
クマ
とはいえ、テクスチャ差し替えが可能になった去年の今頃よりは、ユーザーによるテクスチャ素材の帆布が豊富になったし、そういうのを使っていくのもありだと思うぜ。
栗絵マナ
そういえば、あのあと他のテクスチャ(千鳥格子とか)を当ててみたんですが、なんか妙に模様が縮んでいるというか…。これなんとかなりませんかね。
今は目の細かい千鳥格子であまり目立たないが、よく見ると模様の縦幅が少し潰れている。模様が大きければ大きいほどこの差は顕著になる。

クマ
あー、これ髪の毛の太さを変えたりすると、それに伴ってテクスチャが一緒に伸びたり縮んだりするんだよな。今回はこれを軽減する方法を教えるぜ。

髪テクスチャを編集してみよう

今回使うアイテム

クマ
今回はテクスチャのゆがみを確認するためのテクスチャを使う。と言っても、VRoid Studioの髪テクスチャのサイズ(512*1024)に格子状のグリッドを等間隔でひたすら書いていった代物だけどな。
クマ
もちろんこれについては、お手持ちのグラフィックソフト(Adobe illustratorなど)で自作できるぞ。今回のは「CLIP STUDIO PAINT」のグリッド機能で自作している。

この記事のために、テクスチャのゆがみを確認するためのテクスチャを作りました。CC0ライセンスなので、ご自由にお使いください。

今回はこれを使って説明していきます。

【CC0】VRoid Studio向け 髪UV確認テクスチャ https://sky-blue.booth.pm/items/1753671

普通に格子のテクスチャを貼り付けても歪む？

冒頭の会話の通り、VRoid Studioで髪の毛のテクスチャを差し替えたときに「髪の太さなどによってテクスチャの比率がぜんぜん違う！」ということが起こりがちです。

一般的な3Dモデリングをするときは「この面にはテクスチャのここ割り当ててね～」という風に指示をする「UV展開」というのがあるので、こういう事があってもUVの位置を調整しなおせば済みます。 (立体は平面じゃないのでどこかが歪むことはありえますが)

VRoid Studioには特定の面に「UV展開」を設定する項目はありませんが、髪の毛に限っては似たような設定項目を使用することが可能です。

それは「テクスチャパラメータ」の「横幅」という項目です。これで幅を調整することで、ある程度はゆがみを矯正することが出来ますよ。

ゆがみ確認用のテクスチャをインポートする

まずは、カチューシャを付けたいモデルを開き、新しく「カチューシャ」という手書きガイドを作成します。

設定は画像のような感じで、少しだけ髪から浮かせたガイドを作りましょう。

カチューシャを作るモデルを開き、新しく「髪型編集」で手書きガイドを作る。このとき、他の髪からは少しだけ浮かせること。
ガイドの設定値はこんな感じです。オフセットの値を少しだけ上げましょう。

次に、カチューシャのためのマテリアルを1つ増やしましょう。どれでもいいので一つマテリアルを選択し、「複製」をクリックします。

複製したマテリアルは一番最後に来るため、そのマテリアルを以下のように設定します。

  • 基本色：白（#ffffff）※次の工程で色付きのテクスチャを使用するため。
  • かげ色：好きな色で構いません。髪の筋っぽい影をつけたくない場合は白が無難です。
  • ハイライト：黒（#000000）※髪飾りに艶が入ると不自然なため。
  • アウトライン：好きな色で構いません。※v0.8.0以降で追加された新機能です。
基本色、かげ色、ハイライトをそれぞれ設定します。
千駄ヶ谷姉妹の場合は、最初から「基本色」「かげ色」が白、「ハイライト」が黒のマテリアルがあるので、それを複製するのが簡単です。

髪の「テクスチャ」タブに入り、一番最後の「ヘアー」をクリックして展開します。その中の「レイヤー」を「UV」と変更します。ついでにデフォルト画像も非表示にしておきましょう。

テクスチャ画面に入り、右クリックでレイヤー名を変更します。
今回は「UV」と変更します。

上記でダウンロードした「髪UV確認テクスチャ」をインポートします。

インポートし終わると画像のような見た目になると思います。もしなっていない場合は、先程インポートした「UV」レイヤーを一度クリックしてみてください。

UV確認用のテクスチャがインポート出来た。

カチューシャの形を作る

「デザイン」タブに戻り、「カチューシャ」のガイドを選択します。

「カチューシャ」ガイドを選択した状態にする。

次に、先程UV確認用のテクスチャを割り当てたマテリアルを選択します。(一番最後のマテリアルです)

UV確認用のテクスチャのマテリアルを選択します。

「カチューシャ」のガイドに髪を書き、制御点ツールや各種ヘアーパラメータを調整して形を作っていきましょう。今はテクスチャが歪んでも気にしないでください。(このあと調整します)

「カチューシャ」ガイドに髪を書き、形を調整する。

テクスチャのゆがみや位置を調整する

栗絵マナ
今は形を優先して作ったのですが、よく見ると文字の縦横比がおかしいですね。
クマ
今からこれを矯正する方法をやるぞ。「横幅」と「オフセット」の値を調整していく。まあこれ、本来は「髪の艶や髪筋の幅」を調整するのに使うものみたいなんだがな。
栗絵マナ
サンプルモデルでも「Vivi」とかはこの値を大きくして、イラストのような荒い感じの髪質に変えてますもんね。ちょっと裏技っぽい響きです。

カチューシャの髪を選択し、「テクスチャパラメータ」の「横幅」を大きくします。

「横幅」の値を変える
横幅を変更すると、押しつぶされていたテクスチャが伸びていきます。
栗絵マナ
これで、縦横比がおかしいのはなんとかなりましたが…。なんか端っこが「髪UV確認テクスチャ」の左端から始まっていないのが気になります。
クマ
次は「テクスチャが描かれる位置」を修正するぞ。

先程「横幅」の値を修正したものの、テクスチャの位置が中途半端なのに気がついたでしょうか。

テクスチャの範囲が希望とズレているため直します。アルファベットの番地のおかげでバッチリ場所を把握できるのも、UV確認テクスチャのいいところです。

髪のオフセットの値を動かしてみましょう。これを動かすことで、テクスチャが描かれる範囲を横方向に動かすことが出来ます。

オフセットの値で、横方向に動かしましょう。画面の様子を見つつ、少しずつ動かします。

位置を参考に描いてみよう

これで、テクスチャを書く位置を特定できました！

モデルによって微妙に位置が異なりますので、テクスチャ内の英数字とグリッドの位置を頼りにテクスチャを描いていきましょう。

 

今回のモデルのテクスチャ範囲はこんな感じです。(左の方しか使わないのでちょっと勿体ないですね…！)

範囲はこんな感じ。

あとは、使用範囲の位置にいつもどおりテクスチャを書き、テクスチャを新しいレイヤーにインポートすれば反映されます。(UVのレイヤーはもう使わないので非表示にしておきましょう。)

作例では、自作した千鳥格子のテクスチャを割り当てました。

これでひとまず完成です！

次回予告

クマ
これで、髪を使って色々作れるようになったと思う。テクスチャを差し替えれば、割と色々作れるようになるからな！
栗絵マナ
今日は年末ですから、どのみち次回は来年になりますね～。次回のお題はなににします？
クマ
ん～それなら、次回はちょっと髪の毛自体を変形させる方法として、ドリルヘアーを作って行こうと思う。
クマ
あと残りは、ちょっと飛び道具的だが「髪の毛のマテリアル1つでカラフルな髪の毛を作る」「メガネを作る」を今後やりたいと、中の人のメモに書いてあったな。
栗絵マナ
メタい。
栗絵マナ
それでは、良いお年を！