[Houdini] カーブを延長

先日 Houdini でカーブを延長する方法が分からず調べた情報を共有します。

カーブに新たなポイントを追加する形で延長する方法になります。

Add SOP でカーブを延長

カーブを延長するには Add SOP ノードを使います。

追加したいポイント数を「Number of Points」欄に入力し、その下に座標を指定

「Polygons」タブで「By Group」タブを選択することでカーブが延長されます。

延長する向きのコントロール

ちなみにポイントIDの大きい側からカーブが延長されます。

逆の向きに延長したい場合は「Sort SOP」でID順を逆にしましょう。

ちなみに、自分的に引っ掛かりポイントだったのですが「Reverse」SOPでカーブの向きを逆にしてもポイントIDは逆にならないので注意です。
カーブの向きとIDは別物のようです＞＜

※独学で仕入れている知識のため、より良いやり方があるかもしれません。
※Houdini のバージョンは 16.5 となります。

[UE4][TIPS] UV DIstortion の仕組み

前回紹介した UV Distortion の仕組みについて解説します。

Unreal Engine 4 の UV オフセット

UV Distortion の理解のために、まず UV のオフセットという基本的なところを確認したいと思います。
UV Distortion はこれから確認する基本の仕組みを使っているだけなので、イコール UV Distortion の解説でもあったりします。

ということで UV のオフセットですが、ご存知「TextureCoordinate」に対して足し算をすることで位置のオフセットが可能です。
「TextureCoordinate」は2チャンネルのベクター情報なので、ここでは 「Constant2Vector」を使って足し算しています。

これはモデルのUVがテクスチャのどのピクセルを見に行くかという「TextureCoordinate」の情報を書き換えることで実現する現象です。
例えばもともと1であったVの値に0.4を足すことで1.4になると、当初V値が1を見に行くはずだったモデルはV値1.4（つまり0.4）に相当するテクスチャを参照することになります。

これをテクスチャ画像で考えると下図のように位置が上にずれることになります。

また掛け算をすることでタイリング数をコントロールすることができますがこれも原理は一緒です。

例えばVに2をかけた場合、もともと1だったV値は2になり、また0.5だったV値は1 になります。

その変化に従って画像を当てはめると下のようになり、画像のタイリング数が変わることになります。

この数字によるUVの計算を画像でやろうというのが UV Distortion になります。

簡単な画像を使って歪ませてみる

ではこちらの「円をぼかした画像」を使って計算するとどうなるのか？

明度の数値を見ると、中央が1（白100%）で周囲が0(黒)になっています。
これを「TextureCoordinateの」V値（Gチャンネル）に足すグラフを作成します。

するとこのようになります。

どういうことかというと、白い部分のみV値に1を足したことになり、その箇所だけ1オフセットさせたことになります。黒いエリアは数値としては0なので足し算しても変化はありません。
さらに1以下の少数値を画像に対して掛け算してオフセット量を減らしてみると

歪みを視認できる程度におさえることができます。

これが UV Distorting と呼ばれるものの仕組みです。

UV への計算に数値ではなく画像を使うことで UV を部分的にオフセットさせて結果テクスチャが歪むというわけです。

Unreal Engine 4 のマテリアルエディタはマイナス値も扱えるので、画像にさらに0.5を引くことでグレーよりも暗い部分を反対方向にオフセットさせることもできます。


また、画像の明度を数値として計算に使っている関係上、その画像の階調が細かいほうがより細かなオフセット量を与えることができます。ということはオフセットに使う画像は1チャンネル32bitのHDR画像を使うとよりなめらかな結果になります。そのへんはメモリと相談しつつの使用となるかと思います。

[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でつなげてみます。

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

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

[Houdini] 鎖の作成

どうも。こんばんは。
今回は前回作成した鎖のリングをつなげて鎖自体を作成してみたいとおもいます。

前回のリングを作成した記事は「こちら」

全体の流れ

鎖作成の手順は、カーブを作成してそのカーブにそって部品のリングを並べていくという流れ。
完成のノードグラフはこちら。

RingをSubnetに

では前回の続きから開始。
まずグラフをすっきりさせるためリングを構成するノードを1つのノードにまとめます。
ノードをすべて選択した状態でネットワークビュー上部の箱のアイコンをクリック。


単一のノードになるので名前を「Ring」に変更。


このノードは「Subnet」といって複数のノードをひとまとめにしたもの。
これにより複数のノードによる一連の処理を1つのノードとして扱うことができるようになります。
ダブルクリックすることで中に入りそのまとめたノードを確認、編集することが可能。
他にもデジタルアセットとしてどのシーンからも呼び出せるようにできたりします。
この辺の解説はまた別の機会にでも。

カーブの作成

では先程のノードグラフの番号にそってすすめていきます。

①まず部品を並べるカーブを作成します。
SOP階層に「curve」SOP を追加。


そのままビューポート左の「Show Handle」アイコン（下図オレンジ矢印）を押してからビューポートをクリックすることでカーブがビューポートに作成されます。
「Curve」ノードを選択しているのにビューにカーブを描けないということを初心者の僕はよくやるのだけれどそんなときはこの「Show Handle」がオンになっているかチェックするとよいです。
ちなみにその下の磁石アイコン（白矢印）はグリッドへの吸着設定で、オンにしておくと作成されるカーブポイントがグリット上に制限される。

カーブの種類を「NURBS」にして滑らかなカーブに変更。










②次に「Resample」SOP を作成

カーブが細分化されます。

これでリングを配置カーブの準備ができました。

リングの配置と調整

③細分化でできたこのカーブ上のポイントにリングを配置していくわけだけど、この時「Copy to Point」SOPを使ってもいいのだけど「Sweep」SOP を使うと向きの設定が簡単なのでそちらを使用します。
図のように「Ring」を左のインプットに、カーブ（「resample1」）を右のインプットに接続。
カーブの各ポイントにリングが配置されます。

「resample1」の「Length」を調整すると細分化してポイントの間隔を調整することでリングの位置を調整。

そして「sweep1」の「Twist」パラメータを調整してリング同士の角度を調整すれば完成。




最後の２つのパラメータ「Length」と「Twist」等にエクスプレッションを設定することでリングサイズや鎖の長さに合わせたより正確なコントロールもできますが今回は簡単に済ませました。

プロシージャル

これで鎖は完成ですがHoudiniのプロシージャルの凄さを見てみましょう。
カーブを再編集してみても鎖のつながりがしっかり維持されるあたり、完成までの手順の簡単さも相まってなかなかインパクトがあります。

カーブに続けて「Carve」(Curveじゃないよ) SOP をつなぐとこんなことも可能。

他のCGツールではカーブはあまり使わないのだけどHoudiniのカーブはなにかと便利で出番が多いです。

というわけで今回はここまで