[UE4][Tips] UV Distortion

今回は UnrealEngine4 のマテリアルのTipsを共有します。

UV Distortion について。
UV Distortion とは簡単にいうとUVの値を変化させてテクスチャを歪める手法のこと。
炎などエフェクト表現で使われる機会が多い技術ですね。

早速つくってみる

どういう仕組でこうなるのかの解説の前にまず作ってみましょう。
上のサンプル動画よりもう少し簡単なものを例に作成手順を解説します。

まず以下のような「歪ませたい画像」と「適当なノイズの画像」を準備します。
※下の画像はそれぞれ画像上で右メニューからダウンロードできます。

・歪ませたい画像


・ノイズ画像



これらをUnrealに読み込みます。
ノイズの画像、アセットをダブルクリックして開いたウィンドウでsRGBのチェックをオフにしてください。


このsRGBのチェックボックスは「色」として扱う用途ではないテクスチャ、例えばマスク用画像などの場合にオフにします。
こうすると例えばレッド0.5の色はそのままの0.5の数値としても扱うことができるようになります。

マテリアルの設定

次にマテリアルを作っていきます。

コンテンツブラウザの [Add New] から新規マテリアルを作成。



歪ませたい画像とTextureCoodinate を下図の用に接続。つまりモデルのUVに素直にテクスチャを貼ります。




この TextureCoodinate からTexture画像につながっている UV情報に手を加えることで UV Distortiom 実現します。
どのように手を加えるのかというと TextureCoordinate の出力にノイズ画像を加算します。
[Add]を作成して下図のように接続。


するとテクスチャが図のように変化します。
元画像と全然違う絵になってしまいますが、これは歪みが大きくて元の形状の跡形がない状態。


歪みを小さくするにはノイズ画像を暗くすると小さくなります。

ノイズ画像を暗くするためには、ノイズテクスチャに1以下の数値を乗算すれば良いので、とりあえず0.2のスカラーパラメータをMultiplyをつかって図のように接続します。

テクスチャが確認できる程度の歪みになります。

この数値を変化させると歪み具合の変化が確認できます。

このマテリアルをマテリアルインスタンスにしちゃえば、数値調整しながらリアルタイムにテクスチャの変化を見られるようになります。

マテリアルインスタンス化の手順は基本操作なので今回は説明しませんが、参考までに手順を動画にしました↓

ちなみに、このノイズをUVスクロールさせるとこの記事はじめのアニメーションが実現できます。

簡単な仕組みの解説

ではどうしてこんな事が起こるのか・・？
細かい説明は次回にしますが、簡単にいうとUV位置を移動（オフセット）させてるだけです。
よくテクスチャをタイリングするときにTexture Coordinate に数値を掛け算しますがあれと原理は一緒です。

次回、もう少し詳しく仕組みを解説してみようとおもいます！

[Houdini]ポリゴンカーブよ、お前は何者？

今回は、最近Houdiniのカーブをさわってて、ん？？と思って調べたことを共有したいと思います。
「Polygon Curve」についてです。

Houdiniのカーブの種類

「Curve」SOPで作成するカーブには種類があり「NURBS Curve」「Bezier Curve」「Polygon Curve」の中から1つを選択してカーブを作成していくことになります。

それらの違いとしては「Polygon Curve」がポリポリしたカーブでそれ以外が滑らかなカーブといった認識だったのだけど、それ自体は間違いではないのだけどどうもそれだけじゃないことを最近知ったわけです。

どうも「Polygon Curve」はカーブでもありポリゴンでもあるのです。

ポリゴンと言ったらいわゆる「面」のこと。

つまりポリゴンカーブは線でもあり面でもあるんです。

「な、何を言っているのかわからねーと思うが　おれも何をされたのかわからなかった。」
というのは言いすぎですがまぁそんな感じ（？）です。

この辺Houdiniをずっと触きた方々には当たり前の概念なのかもなんだけれど、新入りの自分にはなかなか驚きの発見だったのです。

ポリゴンカーブのコンポーネント構成は？

では実際に確かめてみます。

まずシンプルな四角形のポリゴンを「Grid」SOPで作成。

次にその隣に「Curve」SOPで「Polygon Curve」を、図のように4つのポイントを打って作成します。

この状態で「Close Curve」をオンにして閉じたカーブにします。
今までこの閉じたカーブのことを、単にカーブの始点と終点が繋がったカーブであり「カーブが閉じると中が塗りつぶされるんだな」程度に考えてたわけです。

見た目が同じこの２つのデータの情報を見てみます。


それぞれのノードにカーソルあわせてマウス中押しで開いたウィンドウの内容を見てみます。

２つともコンポーネントの構成は同じです。
（それにしても、Primitve はポリゴンのことなはずなのだけど、「Primitives」と「Polygons」がわざわざそれぞれ記載されている意味は何なのだろう…？）

ポリゴンカーブの挙動を見てみる

ではこれらの挙動を調べてみます。

カーブの始点と終点を切り離す「Ends」SOPを繋ぎ「Close U」を「Open」にして開いたカーブに変更します。
（「merge1」は2つの結果を同時に見るためのもの）

するとグリッドから作成したポリゴンがカーブと同じ挙動を始めます。

ではポリゴンを押し出す「Poly Extrude」SOPを繋いで適当に押し出してみます。
（先ほどの「Ends」SOPは削除しときます）

今度はカーブがポリゴンと同じように押し出されるのがわかります。

この２つは確認したデータも同じなら挙動も同じ。

つまりカーブはそのままシームレスにポリゴンになっているといえます。

この辺の概念を覚えておくと、ポリゴンカーブに対してポリゴン用SOPを使えたり、ポリゴン（primitive）に対してカーブ用SOPを使ったりと、よりコンポーネントをコントロールできるようになるんじゃないでしょうか。
他のツールからHoudiniに移行してかつモデリングもしようと考えてる人には覚えておくと良さそうなHoudiniならではの部分かとおもいます。

最後にこの２つをくっつけて「Fuse」SOPでつなげてみます。

これをいじってみるともうすかっりポリゴンです。

間違いなどありましたらご指摘ください。