[UnrealEngine]HueShift応用:RGBマップのシフト変化

■[UnrealEngine]HueShift応用:RGBマップのシフト変化

今回は、テクスチャのRGBに格納した３つの白黒テクスチャを、HueShiftを使用してブレンドシフトさせていく手法についてのメモになります。

■検証テクスチャ解説

・検証用テクスチャの内訳です。
　RGBAチャンネルそれぞれに該当する文字をテクスチャに割り当てています。

■RGBのマップをシフトさせる

Rチャンネルを抜粋した場合

■補足：HueShiftによるシフトの方向について

・[Hue Shift]でテクスチャのRGBチャンネルをシフトさせて行く時、その方向は色が変わる方向とは逆になります。
　赤(1/0/0)に対して[Hue Shift]を通した場合、[R→G→B→R]の順に回りますが、
テクスチャのRチャンネルにシフトしてくる順番は[R→B→G→R]の順番です。
「Rの値がGchにシフトする」のだから、「Rの次にRchにシフトしてくるのはBの値」となります。

■応用：[Hue Shift Percentage]に白黒マップを使った場合

　・上記の状態で、さらに[Hue Shift Percentage]への値に白黒マップを使用すると、0.0(黒)から1.0(白)に流れるように変化させることができます。

・例として[Tex Coord]や[Vector to Radial Value]を[Hue Shift Percentage]に混ぜ、[Time]で流した場合、このような動きになります。
　白(1)から黒(0)に推移が流れるような動きです。
　ノードの組み合わせは下記のとおりとなります。

■シフトマップにテクスチャを使用

・このシフトマップに他のテクスチャを割り当てることも当然可能です。
　試しに適当なノイズテクスチャを使用した場合はこのようになります。

■1つのカラーテクスチャにまとめる。

　・また、カラーテクスチャのAにシフトマップを割り当て、１つのテクスチャにまとめてしまうのも最適化に向けた一つの手法だと考えられます。

■一覧に並べてみる。

・ここまでを踏まえて、最後に一覧として並べてみました。
　左から　マップなし、ノイズマップ、TexCoordのRG、Angle、Distanceと並べ、
　シフトさせるテクスチャも変えてみると、こんな感じになります。

　今回は以上となります。
　UVスクロールや複数テクスチャの重ね合わせをせず、基本的に１枚のテクスチャで動きをつけられる為、かなり応用が利くのではないかと考えております。