VFXアーティストブログ

VFXアーティストが気になったことを好きに書いていくブログ

SubstanceDesignerのHistogramSelectをUE4でやってみる

お久しぶりです
最近はいそがしくなかなか更新できませんでした
SubstanceDesignerをVFXでも使えないかと模索しております
そこでSDにある「HistogramSelect」が結構便利で
シェーダー作成にも使えないかなと考えました

そもそも「HistogramSelect」とはどういうものかといいますと

グラデーションのあるポイントを選択してコントラストなどを調整できます

f:id:kapunn:20180823233151g:plain

 グラデーションさえあれば幅やテクスチャーをスクロールしなくても
このような表現ができます
まぁどんなところに役立つかというのは後述します

まずグラデーションについて考えます
普通の上から下にかけてのグラデーションを数値で考えると
白は「1」黒は「0」なので「1-0」のグラデーションになります

f:id:kapunn:20180823233345p:plain


それをどうやってあるポイントを取得し動かせばよいか
動かすには基本数値を足したり引いたりすると下のような動きになります

f:id:kapunn:20180823233541g:plain


次はあるポイントを取得する方法です
真ん中を取得できればコントラストもいじりやすくていいかもしれません

f:id:kapunn:20180823234818g:plain

 

ではさきほどお見せした「1-0」のグラデーションからどうやってこれをつくればいいでしょうか?
中央部分が明るく上下の端が暗いグラデーションをつくるには
向きが逆のグラデーションを組み合わせるとできそうです

f:id:kapunn:20180823235033p:plain

1つのグラデーションを反転させて向きが逆なのものを作成します

その2つを「Min」で合成します
MINとは2つの色を比較して暗いところを取得します

上下の端の部分はそれぞれ「1」と「0」なので暗いほうの「0」が取得されます
中央部分はどちらも「0.5」なので「0.5」になり
結果敵には「0 - 0.5 - 0」の範囲のグラデーションが出来上がります

よく使うMultiplyで2つを組み合わせてしまうと
「0 - 0.25 - 0」ののっぺりしたグラデーションになり使いにくいです

f:id:kapunn:20180823235511p:plain

先ほど作った「0 - 0.5 - 0」のグラデーションを動かしましょう

こういうノードを組みました
MINより左の部分は先ほど作ったグラデーションの作り方をノード化したものです
それに動かす仕組みを組んでいます

f:id:kapunn:20180824000020p:plain

赤枠の部分が動かす仕組みです
なぜAddとSubtractかというとグラデーションの向きがそれぞれ逆向きなので
同じ向きに動かすために足すと引くを行っています
実際に組んでみるとわかると思います
1つのパラメーターで同時に2つのグラデーションの動きを同じ方向に制御できます

f:id:kapunn:20180824000446p:plain

赤枠の部分がなにをしているかというと
できたグラデーションは「0 - 0.5 - 0」の数値で少々扱いにくいです
そこで「0 - 1 - 0」の範囲に正規化して扱いやすくするためです
「0 - 0.5 - 0」に2をかけると「0 - 1 - 0」になります

f:id:kapunn:20180824000928p:plain

うしろのPowerでコントラストを制御して線の太さを変える仕組みになっています

 

最終的にこのように位置とグラデーションの太さを調整できるマテリアルができました

f:id:kapunn:20180824001757g:plain

じゃぁこれがどういうところに使えるかというと

グラデーションを動かしたいけど絵が複雑だからスクロールでは無理な場合とかですね
具体的にはしたの動画をご覧下さい

youtu.be


スクロールではないのでUVに依存することなく
いろんな方向にグラデーションを動かすことができるので
結構面白いマテリアルなんじゃないでしょうか?

ではまた