UE4 のマテリアル入門 (3) マテリアルにテクスチャを追加する

ビデオの内容紹介 
Unreal のスタティックメッシュに適用されているマテリアルにテクスチャを貼ります。さらに、そのテクスチャの木目の Roughness を調整します。またテクスチャのタイリングを変更します。

原題 Introduction to Materials in UE4 – 3 – Adding Textures to a Material

準備
前回マテリアルを適用した Unreal の置物を再利用します。
3001
前回作成した MyMaterial を開きます。
3002

作業手順
MyMaterial を開きながら、レベルエディタのコンテンツ ブラウザで Textures フォルダを選択して、木目調のテクスチャを選択して、MyMaterial にドラッグアンドドロップします。
3003
(チュートリアルの中にも書かれていましたが、チュートリアルで使用されているテクスチャと同じものがなくても、それに類似したものでも大丈夫です。ここでは、wood で検索して、T-Wood_Pine_D を選択しました。)

同様に、コンテンツ ブラウザから T_Wood_Pine_N もドラッグアンドドロップします。
3004

この N は、「Normal=法線」という意味です。法線とは面に垂直なベクトルのことです。つまり、面 (ポリゴン) の向きを表します。この法線を利用すると擬似的な凹凸を付けることができます (光源の位置と面の向きから陰影の計算をします)。

この法線をピクセル単位で求めると、細かいポリゴンを作らないでも、ピクセル単位で凹凸を付けることができるようになるので、計算負荷の面で大きなメリットがあります。

なお、法線は空間ベクトルなので x,y,z の 3 つの値が必要となりますが、これを R,G,B の代わりとしてテクスチャに格納するので、法線テクスチャ (法線マップ) と呼ばれます。ここで配置した 2 つ目のテクスチャが法線テクスチャであり、擬似的に凹凸を付けるためのものとなります。

次に、T_Wood_Pine_N の Texture Sample の一番上にある出力ピンを MyMaterial ノードの Base Color につなげます。
3005
テクスチャの本質とは R, G, B から構成される色なのですね。

ところで、Texture Sample の一番上にある白い出力ピンは、下の赤 (R)、緑 (G)、青 (B) を合成した結果を出力するためのものです。

ちなみに、赤の出力ピンを Base Color につなげると、左上の見本が白黒表示されます。これは、白ほど R の成分が強いということを表しています。
3006

青の出力ピンを Base Color につなげると、全体的にかなり黒っぽくなります。つまり、B の成分がこのテクスチャではあまり使われていないということが分かります。
3007

次に、2 つ目としてドラッグアンドドロップした法線テクスチャを MyMaterial ノードの Normal (法線) につなげます。これによって、擬似的な凹凸 (ここでは木目の凸凹)、リアリティが付け加えられます。
3008

これまで作成されたマテリアル (テクスチャが追加されたマテリアル) をレベルに配置されている Unreal の置物に適用してみましょう。
3009

全体的にテカリが行き過ぎなので、Roughness (チョークのようにテカらなくさせる度合い=前回のチュートリアルを参照) を 0.5 にします。
3010
レベル内の置物に適用すると次のようになりました。

3012

次に、Lerp を使って、木目 (黒っぽい縞のような部分) と木目ではない部分の Roughness を区別しながら調節してみます (今までは、一様の Roughness でした)。たとえば、木目のところをより荒く (ピカピカしないように)、木目ではないところを少しピカピカにするように調節します。

ここで、Lerp の意味と機能について考えてみたいと思います。LinearInterpolate (線形補間) の略です。「線形」とは直線のことです。「補間」とは、たとえばある点 A と別の点 B のが値的に空白であればそこをうということです。ですから「線形補間」は、点 A と別の点 B の間に何もなくて、そこに直線を引くということになります。

たとえば、(1,2) と (6,12) という点があるとします。この間の値 (4, ?) を決めるために、(1,2) と (6,12) の間に直線を引きます (その式は連立方程式などで求めると、y=2x となります)。したがって、x=4 の時は y=8 となります。また、(1,1) から (6,36) までの点を二次曲線で補間するならば、x=4 の時は y=16 となります (y=x^2 で補間しています)。

話を Lerp に戻すと、次の画像の Details パネルの Const A (定数 A) と Const B (定数 B) の間を補間して求められた値を Roughness とします。前述の例の y に相当します。ここで x に相当するのが Alpha に入っている値です。Alpha には、黒い部分 (0.0) が木目で、白い部分 (1.0) が木目以外で、灰色 (0.5 くらい?) がそれらの中間となるようにセットされています。具体的には、Alpha の黒い部分 (0.0) には、Const A=0.8 が、白い部分 (1.0) には Const B=0.3 が適用されます。先の例で書くと、(0.0, 0.8) と (1.0, 0.3) となります。
3013
まとめると、x (つまり Alpha) の値に応じて Roughness の値を算出 (補間) している、ということになります。なお、Alpha を表示すると次のようになります (マテリアルエディタの Details パネルの Texture のアイコンをダブルクリックするとテクスチャエディタが開かれます。そこで左上の View をクリックして Alpha だけにチェックが入るようにします。) 黒い部分が、0.0 で、白い部分が 1.0 です。
alpha

alphaview

この LinearInterpolate が適用されたテクスチャをレベルの Unreal の置物に適用すると次のようになります。
Lerp
木目がよりくっきりして、木目以外のところはテカリが少し加わりました。

最後に、テクスチャのタイリングを変える方法を学びます。1 つのテクスチャはタイルのようにオブジェクトに複数枚貼られます。その枚数を変更してみます。それによって、テクスチャの密度が変化して、よりリアルな表現となることがあるからです。

TexCoord (TextureCoordinate テクスチャ座標) というノードを使います。テクスチャは、UV 座標という座標で管理されるので、それを利用しながらタイリングを変更します。

TexCoord を選択状態にして、Details パネルで UTiling と VTiling の値を変更します。UTiling は U 方向のタイリング量を指定します。VTiling は V 方向のタイリング量を指定します。

凹凸についても密度をそろえるために、TexCoord をつなげます。次のようになります。
3014
UTiling と VTiling に 3.0 が入っているので、縦横それぞれ 3 倍のテクスチャが貼られることになり、密度も 3 倍高くなります。次は、結果図です。
3015
木目のすき間が明らかに狭くなり、少しリアリティが増しました。

今回は以上です。どうもお疲れさまでした!


About なつのや

アンリアル・エンジン 4 を基礎から勉強するためのサイト「UE4 の学び部屋」を開いています。どうぞよろしくお願いいたします。
マテリアル

コメントを残す

メールアドレスが公開されることはありません。

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>