FC2ブログ

PlayHomeスタジオアイテム作成講座(応用編 5)


今回は抽象的な話を概略的にざっくりさらっと流します。

14. 3Dモデルをざっくり理解する

3Dモデルはねぷた祭りの「ねぷた」に似ています。
ねぷたは竹か何かで作った骨組みに、紙を貼り、その上に絵が描いてあります。

3Dモデルとねぷたを対応させると
メッシュ = 骨組み
マテリアル = 紙に描く絵の指示書
シェーダー = 紙に絵を描く絵師

という感じらしいです(ざっくり

14-1 メッシュ
メッシュは、3次元空間に置いた頂点と、各頂点を結んだ三角形(または多角形)で構成された平面の集合体です(お、おう
辺にはあんまり意味がありません。
メタセコとかBlenderで作った3Dモデルですね、要するに。

14-2 UVマップ
メッシュのどの部分にテクスチャのどの部分を割り当てるかを決めるのがUVマップです。
14-1-1.jpg

サイコロの展開図みたいなものだと思って頂ければ結構です。

UVとは何かの略ではなくて、横がU軸、縦がV軸(普通は横がX軸、縦がY軸ですね)というだけの話です。
W, X, Y, Zは既に使われているので、その前がUとVだったという……。(wは4元角で使います)

この後に出てくるテククチャは全てこのUVマップを基にメッシュに適用されます。
UVマップはメッシュデータ(mqoとかfbxとか)に含まれています。

UVマップ上で頂点が重なっていると、その頂点で構成されていた面の面積が0になります。
そうすると、テクスチャが全く割り当てられなくなるので(?)ハニセレでは黒化、プレホではおもフラが発生します。
この辺はシェーダーによりけりなので、必ずしも黒くなるわけではありません。
※プレクラでは黒くなりません。


14-3 マテリアル
マテリアルはシェーダーがメッシュの表面に絵を描くための指示書です。
メッシュに貼るテクスチャもマテリアルの一部です。

同じ一枚板のメッシュでも、設定するマテリアル次第で、コンクリ床になったり、フローリングになったり、石床になったり、土の地面になったりします。


マテリアルに設定するテクスチャには幾つか種類があります。
で、使用するシェーダーによって指示書に書く内容が違います。
透過絵が描けない絵師に透過の指示をしても仕方ないので()
ここではプレホで使用されていた、ShaderForge/ PBRspを例にしてざっくり説明します。


14-3-1 テクスチャ
14-2-1.jpg

SB3Uで言う所の、この部分の話です。
細かい説明は省略します。気になった方はGoogle先生に聞いてみましょう。
スタジオアイテムは結構メインテクスチャしか入っていない物が多いので、ここでは律子ブレザーを例にして主な物だけ解説します。
シェーダーによって入れるテクスチャが違ったりしますが、この辺だけ分かってれば良いかなと。

MainTex
 そのまんま、メインのテクスチャです。
 メッシュの表面に描写する絵そのものです。
 コンクリならコンクリの絵、フローリングならフローリングの絵ですね。
 メインテクスチャには影を描いてはいけません。
14-3-1-1.jpg

 色変え可能なのでテクスチャは白いです。

BumpMap
 表面の凹凸を描写するためのテクスチャです。
 服のシワや、モールドの凹みなんかは、これを基に描写されています。
 イリュゲーはここに独特のNormalMapが入っています。
14-3-1-2.jpg

 明るい部分が盛り上がり、暗い部分がへこみます。

OcclusionMap
 本来は服の内側などの環境光があたらない場所を暗くするためのテクスチャです。
 このテクスチャで黒い所は環境光の影響を受けなくなります。
 公式のはメインテクスチャを流用してたりします。
 律子ブレザーもそうなってました。

DetailNormalMap
14-3-1-3.jpg

 服の生地などの、細かい凹凸を描写するためのテクスチャです。
 服の繊維表現などに使われたりします。


SpecGlossMap
14-3-1-4.jpg

 いわゆるスペキュラマップです。
 テカリ具合を設定するためのテクスチャです。
 明るい所はテカりますが、暗い所はテカりません。
 スタジオアイテムで色変え可能にする場合は、このテクスチャは入れない方が良いです。
 下手に入れるとツヤスライダの効きが悪くなります。

14-3-2 テクスチャのパラメータ
14-3-2-1.jpg

この辺の数値はとりあえず公式のに合わせておきましょう()
余裕が出てきたらUnityのマニュアルでも……w
https://docs.unity3d.com/ja/550/Manual/TextureTypes.html
※何故か日本語化されていません

14-4 シェーダー
シェーダーはメッシュの表面に絵を描く絵師です。
絵師によって書けない絵があります(透過とか)
同じマテリアルでも、シェーダーによって描写が微妙に変わったりします。

14-4-1 シェーダーのパラメータ
14-4-1-1.jpg

Metallic
金属は1、非金属は0が原則だそうです。
https://docs.unity3d.com/ja/550/Manual/StandardShaderMaterialParameterMetallic.html

Smoothness
表面の滑らかさです。
0から1に近づくにしたがってツルツルになり、光を反射するようになります。
https://docs.unity3d.com/ja/550/Manual/StandardShaderMaterialParameterSmoothness.html


まぁ、こんな感じであとはUnityのマニュアル見ようぜ()


15. 最後に
私も詳しい訳ではないので、説明できるのはここまでです。
普通はMODを作る時は公式の物と同じような作り方をすれば問題ないと思うのですが、公式は昔から結構やらかしてくれるので、正しいと思って真似してると間違ってたりします()

取り敢えずは公式と同じように作って、なんかおかしいと思ったらUnityのマニュアルを読むと良いかもしれません。
というか、ある程度慣れたらUnityのマニュアルを頭から舐めた方が良さそうです。
ShorocutsPHSの意味不明なパラメータとか、影が汚い理由とか、なんとなく分かってきます(分かった気になります

作ったMODを配布するときは、雨宮さんが書かれた注意書きに一度目を通しましょう。

おわり


PlayHomeスタジオアイテム作成講座(応用編 4)

13. RenderQueueを理解する

俗に「透過病」とか「アルファ病」とか言われている(言われていた?)透過シェーダー特有の現象があります。
百聞は一見に如かずなので、早速進めて行きましょう。

13-1 フレームを無効にする
いつものように"mod_deskclock"をSB3Uで開きます。
ファイラーで"clock"をダブルクリックし、エディターの左ペイン"Object Tree"で"Expand All"を押してすべて展開表示します。
"body"フレームを選択して、エディターの右ペイン"Frame"のタブにある"is Active"のチェックを外します。
同様に、"hand","plate"もチェックを外して、"cover"だけチェックが入った状態にします。
これで、時計のカバー以外は無効になって表示されないので、時計のカバーだけが表示されます。

13-1-1.jpg

次にエディターの左ペインで"Material"を開き"m_cover"を選択します。
"Color"欄の"A"の値を"0"にします。

13-1-2.jpg

セーブしてゲームフォルダに上書きコピーします。
ではスタジオを起動して、時計(だった物)をロードしてみましょう。

13-1-3_.jpg

下着が透けてます!
前髪も透けてますがw

※服は透過シェーダーを使用していないので透けません
多分水着は透けます。

これがいわゆる「アルファ病です」
透過シェーダーを使ったマテリアルが重なると、度々こういう事があります。
当時原因が分からなかったから「病」ってつけたんでしょうね。

13-2 アルファ病の原因
Unityではカメラから遠い物から順番に描写されていて、透過する物も例外ではないそうです。
なので、本来正常に描写されていればこのような現象は出ないはず。

13-3 RenderQueueとは何か
要は描写する順番ですかね。
Unity上では以下のようになってます(Unity5.5のマニュアル抜粋)

Background = 1000:背景
Geometry = 2000: ほとんどのオブジェクト(不透明な物)
AlphaTest = 2450 アルファテストする形状(?
※2500までは不透明とみなされる。

Transparent = 3000 ガラス、パーティクルエフェクトなど
Overlay = 4000 オーバーレイ専用(レンズフレアなど)

遠くの物からカメラに近づくにしたがって数字が大きくなっていきます。
気にしなければならないのは透過する物だけですが、不透過の物でもRenderQueueを大きく設定すると手前に描写されます。

で、透過するオブジェクトが重なった場合に、後から描写しなければならない物(物理的に手前にある物)を先に描写してしまうとアルファ病が出るようです。
RenderQueueはシェーダー自体にあらかじめ設定されていて、SB3U上で"CustomRenderQ"を"-1"に設定すると、その値が使用されます。
逆に、"CustomRenderQ"に数字を入れると、その値が使用されます。
公式で設定されている数値をぱっと見た限りでは↓こんな感じでした。

眼鏡 3000
ブラ 3040
後ろ髪 3400(幅があるかも)
前髪 3500-3536あたり

※MODはどう設定されているか分からんので注意
※前髪は何層も透過オブジェクトが重なっているので結構な数が使われます。

ここで、先ほどの時計のカバーですが、"CustomRenderQ"を3050くらいにすれば「ブラは透けないけど前髪は透ける」という状態になるのですが、分かりますか?
CustomRenderQが「ブラ < 時計カバー < 前髪」となりますのでこの順に描写されますが、物理的には「ブラ < 前髪 < 時計カバー」の順です。
では実際にやってみます。
13-2-1.jpg

13-2-2.jpg

ちょっと分かりにくいですが、下着は透けてませんが、髪の毛は一部透けています。

キャラに重なった場合に正常に表示される(アルファ病を起こさない)ためには"CustomRenderQ"が3600くらいないとダメですね。

13-4 公式アイテムのCustomRenderQ(ueue)
正しいんだか正しくないんだか良く分かりませんが、ちょっとだけ公式アイテムを調べたらこんな数値でした。

草、レース 2450
ガラス類 3000
スフィア 7000
液だまり 9960

RenderQueueが同じオブジェクトが重なった場合はカメラからの距離に応じて描写順序が変わります。
なのでこの場合はアルファ病は起きません。
が、公式がこんな数値なので、アルファ病は起きなくても表示がおかしくなるのは避けられません(奥にあるのに手前に表示されるとか)
3600くらいにしておけばキャラ関係の物は大丈夫ですが、ガラス類と重なるとおかしくなりそうです。


ちなみに、公式アイテム(髪も)のCustomRenderQはマテリアルに設定してある場合と、フレーム内のMonoBehaviorに設定してある場合があるので気を付けましょう。
13-3-1_.jpg

フレームにぶら下がっているMonoBehaviorに[SetRenderQueue]という記述がある場合には、そっちにCustomRenderQueueが掛かれています。
13-3-2_.jpg


今回はこれで終了です。
次回はマップ類(ノーマルマップとか)とシェーダーのパラメータ辺りをさらっと説明します←詳しくないので

一応次で終わりの予定です。

PlayHomeスタジオアイテム作成講座(応用編 3)

PlayHomeスタジオアイテム作成講座応用編の3回目です。
またもや教材を修正しましたので、お手数では再ダウンロードをお願いします()

今回は透過シェーダーを使って時計にカバーを付けてみます。
※今のところ透過するだけでテカリません。

12. 透過シェーダーを使う
12-1 透過シェーダーをコピーする
アイテムを透過させる場合は、透過シェーダーを使います。
"mod_deskclock"のファイルには透過シェーダーが入っていませんので、前回同様"Shaders.unity3d"ファイルからコピーします。
手順は前回"3mask"シェーダーをコピーした時と同じです。
手順が分からない場合は以前の記事を見返してください。

"mod_deskclock"をSB3Uで開きます。
さらに、教材に入っている"Shaders.unity3d"をSB3Uで開きます。
ファイラーの"Material"タブの中から"Shader Forge/PBRsp_alpha"を選択します。

ファイラーの"Assets"から"Mark for copying"を選択後、ファイラーの"mod_deskclock"のタブを開き、"Assets"から"Paste All Marked"でコピーします。
"Shaders.unity3d"はもう使わないので閉じます。
"mod_deskclock"を一度セーブしておきます。

12-2 透過させるフレームを用意する
今回は時計にカバーを付けて透過させます。
カバーのメッシュは教材に入っていますが、これを追加するためのフレームを準備します。

ファイラーの"Animator"タブで"clock"をダブルクリックして開きます。
"O_clock"の下にフレームをひとつ追加します。
"O_clock"を選択して、エディターの右ペインで"Create"を押します。
"Transform Name"は"cover"とします。


教材に入っている、"clock03.mqo"をSB3Uで開きます。
ファイラーの"clock_02.mqo"タブから"cover"メッシュを先ほど作ったフレーム"cover"にドラッグ&ドロップして投入します。
"MeshRender"を選択して、エディターの右ペインで"Normals..."を忘れずに押しておいてください。

12-3. 透過用のテクスチャについて
テクスチャに使用されているファイル、DDS形式で圧縮されているものが多いのですが、その中でも良く使用されているのはDXT1とDXT5です。
ざっくり「DXT1は透過しない」「DXT5は透過する」程度の認識で結構です。
DDS形式で出力できるソフトは色々ありますが、私はPaint.netを使っています。
フォトショは持っていませんし、GIMPのddsプラグインは圧縮が汚いです。

12-4. マテリアルを準備する
教材に入っている"runa.dds"をSB3Uにドラッグ&ドロップします。
エディターの右ペインは"Texture"タブが開くと思います。
ファイラーでruna.ddsを選択し、エディターの右ペインにある"Add Image"を押します。

12-4-1.jpg

エディターの左ペインで"runa"を選択し、図のようにテクスチャのパラメータを変更します。

12-4-2.jpg

12-5 マテリアルを設定する
エディターの左ペインで"Material"タブを開きます。

"m_clock"を選択して、右ペインの"Copy->New"を押してマテリアルをコピーします。
左ペインで新しくコピーされたマテリアル"m_clock_Copy"を選択して、右ペインの"Name"欄の名前を変更します。
名前は"m_cover"にします。

右ペインの"Shader Used"欄で、先ほどコピーした"Shader Forge/PBRsp_alpha"を選択します。
右ペインのMainTexを"runa"に変更します。

12-4-3.jpg


エディターの左ペインで"Object Tree"タブを開き、"cover"フレームの下の"MeshRender"を選択します。
右ペインの"Submeshes"欄で"m_cover"を選択します。

12-4-4.jpg

ここでセーブして、スタジオで表示してみます。

12-4-5.jpg

こんな感じになったでしょうか。
うちの子の周りだけが透過して、時計の文字盤が見えています。
元画像は↓こんな感じです。

12-4-6.jpg

市松模様みたいな部分は元々透過していますので、スタジオでも同じように透過しています。
今回はうちの子の画像を使ったので、必要以上にでかい(1024x1024)ですが、実際にはもっと小さくて良いです。

12-6 全体を透過させる
今度はうちの子込みで透過させてみます。
"mod_deskclock"をSB3Uで開きます。

ファイラーから"clock"を開き、エディターの左ペインで"Material"タブを開きます。
"m_cover"を選択し、右ペインの"Color"欄の"A"を0.2くらいにします。

12-4-7.jpg


"A"はアルファチャンネルです。
R, G, Bそれぞれの数値を変えると(0~1の範囲)それに応じてテクスチャの色が変わります。

セーブしてスタジオで表示してみます。

12-4-8.jpg

画像も透過して、後ろにある時計の針も見えるようになりました。

今回はここまでです。
次回アルファ病(RenderQueue)について解説します←これから調べます()

PlayHomeスタジオアイテム作成講座(応用編 2)

10. 色変え可能にする(カラー1のみ)

色変え豆知識
 色変えに最適なテクスチャの色は、白です。
 プレホスタジオは色変えがHSVしかできませんので(RGBを選択してもスライダが変わらないバグ)黒いテクスチャは色変えが出来ません。
 また、テクスチャ自体に色が付いていると、スライダの色と実際に表示される色が変わってしまいますし、色変えで白に出来なくなります。
 テクスチャに色が付いている場合は、グレースケールに変換するなどして脱色する必要があります。

カラー1の色変えは、リストを弄るだけでできます。

"mod_deskclock.txt"をテキストエディターで開きます。
カラー1色変えフラグをtrueに変更。
カラー1オブジェクト名を"body"に変更。
10-1.jpg
修正したファイルをゲームフォルダに上書きコピーします。

時計の本体部分が色変え可能になります(早っ!

11. 色変え可能にする(カラー2も使う)

※カラー2を使う為に、時計のメッシュをメタセコで分解しました。
教材1.2を使用していますので、旧版をダウンロードされた方はお手数では再ダウンロードをお願いします()

また、既に一度やった手順は割愛しますので、分からなくなったら基礎編に戻ってやり方を確認してください。

カラー2を使う場合は特定のシェーダーを使う事になります。
ハニセレの服の記事2ヶ所色変え衣装に書いてあるので、気になった方は参照くださいませ。

しかし、これを説明するとなると、UVマップから説明しなければならいのでちょっと面倒です(私がw。
フレームを分けてしまう手順で説明します。

11-1. フレームの追加
カラー2の為に、フレームを追加します。

"mod_deskclock"をSB3Uで開き、ファイラーのAnimator欄にある"clock"を開きます。
エディターの左ペインで"O_clock"を選択し、フレームを追加します。
"Transform Name"は"plate"にします。
この"plate"オブジェクトがカラー2で色が変わるようにします。

11-1-1.jpg


教材のclock_02.mqoをSB3Uで開きます。
色変え用にメッシュを分解してありますので、再度入れなおします。

ファイラーの"clock_02.mqo"から、"body","plate","hand"のメッシュをそれどれ同名のフレームに投入します(ドラッグ&ドロップ)
"Normals..."を押し、"body","hand"の"Submeshes"欄でマテリアル"m_clock"を選択します。
※"body"には2つサブメッシュがありますが、両方とも"m_clock"を選択します。
body内のサブメッシュは、上が時計の本体部分、下が土台です。
色変えが適用されるのは一番上のサブメッシュだけなので、時計の本体部分のみ色が変わります。

11-1-2.jpg


11-2. シェーダーをコピーする
「特定のシェーダーを使う」と書きましたが、時計のファイルには入っていませんのでコピーします。

教材付属の"Shaders.unity3d"を開きます。
こちらはプレイホームに使われているシェーダーを抜き出してまとめたものです。
いらん物まで入ってますが、"Shader Forge/PBRsp_3mask"を探してください。
※アルファベット順に並んでいます。

"Shader Forge/PBRsp_3mask"を選択して、ファイラーのメニューから"Assets"→"MarkforCopying"を選択します。

11-2-1.jpg


"mod_deskclock"のタブを開きます。

ファイラーのメニューから"Assets"→"Paste All Marked"を選択します。
11-2-2.jpg


一度保存し、ファイラーのメニューから"Reopen .unity3d"を選択して開き直します。

"Shaders.unity3d"は閉じます。


11-3. カラー2のマテリアルを用意する。
今使っているマテリアルをコピーして、カラー2用のマテリアルを作ります。

ファイラーから"clock"を開き、エディターの左ペインで"Material"のタブを開きます。
"m_clock"を選択すると、右ペインも"Material"のタブが開きます。
右ペインの下の方にある"Copy->New"をクリックします。
マテリアルがコピーされて、"m_clock_Copy"というマテリアルが増えます。
11-3-1.jpg

左ペインで"m_clock_Copy"を選択して、右ペインの"Name"でマテリアルの名前を変えます。
(変えなくても良いけど)
ここでは、m_plateとします。
11-3-2.jpg


教材1.2に入っている"Green.dds"をSB3Uで開きます。
右ペインの"Texture"タブを開き、ファイラーで"Green.dds"を選択した後、右ペインの"Add Image"を押します。
11-3-3.jpg

左ペインで"Material"タブを選択し、先ほど名前を変更した"m_plate"を選択します。
右ペインが"Material"タブに変わっていますので、"Shader Used"をクリックして、"Shader Forege/PBRsp 3mask"を選択します。
その下のテクスチャ設定画面でColormaskの右の欄をクリックして、先ほど追加した"Green"を選択します。
11-3-4

11-4. カラー2で色変えしたいメッシュのマテリアルを設定する。

左ペインで"Object Tree"を選択します。
"Plate"フレームの下にある"MeshRenderer"を選択します。
"Submeshed"欄でマテリアル"m_plate"を選択します。

11-4-1.jpg

ファイル本体はこれで完成です。セーブして、ゲームフォルダに上書きコピーします。


11-5. リストを編集する
"mod_deskclock.txt"をテキストエディターで開きます。
カラー2色変えフラグをtrueに変更します。
カラー2オブジェクト名は"plate"に変更します。
11-5-1.jpg

上書き保存して、ゲームフォルダに上書きコピーします。

以上で完成です。


スタジオで表示してみます。
11-5-2.jpg
この画像はcubemap[N]Flatを使っています。


11-5-3.jpg

cubemapを使わないと、デフォで入っているらしいスカイボックスか何かが映りこみますが、cubemapを一度でも使うと出ませんw

色変えでハマった話

2色目の色変えが反応せず、ハマるハマる。
試しては失敗、試しては失敗の繰り返し。

公式の2色変えアイテムを見て見たら……。
3maskですか、そうですか。
そりゃ、いくらやっても変わらんはずだわ。


プロフィール

Nocky

Author:Nocky
ILLUSIONのゲーム"プレイクラブ"、"ハニーセレクト"、"プレイホーム"のSSと、キャラに着せる洋服をメインに扱っていました。
登場するモデルは全て成人です。

Counter
PV(2016.11.24-)
カレンダー
11 | 2018/12 | 01
- - - - - - 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 - - - - -
カテゴリ
リンク
DAZ Studio
プレイホーム2
プレイホーム
ブロとも申請フォーム

この人とブロともになる