🚀

UnrealEngine ArchViz マテリアル編(1) UVトランスフォーム

2021/07/11に公開

マテリアル編(1) UVトランスフォーム 概要

UnrealEngineで建築コンテンツ製作時に、マテリアルのサイズ変更や割付合わせを行うためのマテリアルノードカスタマイズ方法を紹介します。


※利用しているUnrealEngineバージョンは、4.26.2です。

前提となる知識

マテリアルインスタンスの作成と使用方法、マテリアルパラメータについての知識が必要です。

https://docs.unrealengine.com/4.26/ja/RenderingAndGraphics/Materials/HowTo/Instancing/

紹介するマテリアルノードカスタマイズの結果

マテリアルタイリング数をパラメータで制御します





マテリアル回転角をパラメータで制御します





マテリアルUV座標をパラメータでオフセット制御し、微調整できます。




マテリアルタイリング数のパラメータ制御

テクスチャを利用するため、Texture Sampleノードを用意しテクスチャをアサインし、Basecolorに接続します。
ですが、このままではマテリアルのタイリングを変更する事ができません。


Section 01

マテリアルタイリング数を変更をするためには、Texture Coordinateノードを用意します。
Texture CoordinateノードのDetailsメニュータブに「UTiling」「VTiling」の入力値があります、この値を変更すればタイリングを調整することが可能です。


しかし作業能率を上げるために、タイリング値はマテリアルインスタンスのパラメータから制御したいですよね。では実際に作っていきます。非常にシンプルです




Texture Coordinateノードの「UTiling」「VTiling」の入力値が『1』に設定されていることを確認し、Multiplyノードの【A】ソケットに、【B】ソケットにScalarParameterを入力し、マテリアルインスタンスを作成すれば、タイリングをパラメータ制御可能なマテリアルの完成です。


Texture Coordinateノードから出力されるUV値に任意の値を乗算するというとてもシンプルな方
法です。
ただしこのままでは用意したテクスチャの縦横比が固定された状態でタイリング値が変更されます。
例えば、手持ちのフローリングテクスチャの長手側のタイリングは固定したまま、短手側のタイリング値だけ変更したい、微調整したい、なんてことはありませんか?



Section 02

ではマテリアルの『U』と『V』値をそれぞれ独立して制御できるようにノードを作っていきましょう。
Texture Coordinateノードからは『UV』という値が出力されているわけですから、『U』と『V』に分割して、それぞれに任意の値を乗算すればいいわけです。




Component Maskノードを使って、片側の値をマスクします。
Component Maskノードは初期状態では【R】【G】チャンネルがマスクされる状態になっていますので、Detailsタブで設定します。
それぞれにMultiplyとScalarParameterを接続して、最後にAppendVectorで分割した値を合成します。

これで、『U』と『V』が独立したマテリアルタイリングのパラメータ制御ができました。



マテリアル回転角のパラメータ制御

用意したテクスチャが90度傾いていたり、建築の仕上げ変更に伴って回転が必要になる場合などありますよね。

テクスチャ自体を画像編集ツール等で回転させる、メッシュモデルのUV割付を回転させる、などの方法でマテリアル向きの対処も可能ですが、マテリアルインスタンスのパラメータから制御できると非常に効果的です。

テクスチャの制御を行うため、タイリング同様Texture Coordinateノードを、
回転を制御するCustomRotaterノードをそれぞれ用意し、画像のようにつなぎます

Rotation Centerは初期値ではUV値の(0.5,0.5)になっています、つまりこの場合メッシュのUV座標の中央で回転します。マテリアルのUV回転軸を指定する場合は任意の値やパラメータを入力します。

Rotation Angleソケットで回転を制御します。ここにScalarPalameterノードを入力すれば、マテリアル回転角のパラメータ制御が可能となります。
マウスカーソルオーバーで表示される注釈通り、0-1の値で回転角を制御します。
0-1の入力値が0度―360度に変換されます、つまり90度回転させたい場合は0.25、180度回転させたい場合は0.5です。



マテリアルUVオフセットをパラメータ制御

建築コンテンツ製作でも、「建築の納まり」を設計図通り製作することが重要なことがあります。
例えば床材の場合、『追い出し』や『割付』が重要になります。

浴槽センターにタイル目地を通す納まり

浴槽センターとタイル中央を揃える納まり




前述のマテリアルタイリング数や回転角制御だけでは対応が難しく、メッシュオブジェクトのUV展開の工夫でも非常に工数がかかる場合があります。
マテリアルUVをスクロール制御させることで省力化することが可能です。




マテリアルタイリング数のパラメータ制御 Section 2

Component Maskノードの出力値を、新たにAddノードに入力します。
Addノードの【A】にComponent Maskの出力ノードを、任意のScalarPalamaterノードをBに接続します。




MultiplyとAddでなぜ結果が違うのか(タイリングとオフセット)

これは、UV座標系に対してMultiplyとAddの計算結果を見比べるとよくわかります。


UVは3Dモデル(メッシュ)の各頂点を2Dの座標空間に投影したもので、画像のような(0,0)(0,1)の面で表されます。
Texture Coordinateノードは、UVを改造するためのノードです。


Multiplyの計算結果をみてみましょう、上記のUVに対して3を乗算した場合はこうなります。



U、Vともに(0)を含む座標点はどんな任意の数字を乗算しても最小値の(0)は変わらず、つまりUVはオフセットせずに、タイリング数のみ増加します。



続いてAddの計算結果を確認しましょう、上記のUVに対して0.25を加算します。


U、Vともに最大値、最小値が変化しますね、つまりタイリング数は増加せずにオフセットします。



上記すべてをあわせたマテリアルノード

こんな感じです

例ではわかりやすくComponent MaskでTexture CoordinateのUV値を分割しましたが、任意入力パラメータ側を先にAppendノードで合成してAddノード,Multiplyノードを組み合わせても結果は同じなので、mozはこのようなマテリアルの組み方をしています。




よかったらお役立て下さい。

Discussion