■[UnrealEngine]HueShiftのメモ
・今回はUnrealEngine、マテリアルノード[HueShift]に関するメモになります。
ざっくり言うと、色相変化で色を変える事ができます。

■ノード説明
・Hue Shift Percentage (Scalar) : 0.0 ~ 1.0 の範囲で色を変化させます。
・Texture (Vector3): 色相を変更したい元となる色、またはテクスチャを入力します。
ちなみに、無入力だと 0/1/0 の緑色が基準となります。

■色相を変える
・まずは基準となる機能・色相変化について。
入力した[Texture]のRGBに対し、[Hue Shift Percentage]の値によって色を変化させます。
下の例の場合、[Texture]には(1/0/0)の赤から始まり、0.0~1.0の間で色相変化が行われます。
この際、白黒に対しては干渉はありません。



■虹を作る
・[Hue Shift Percentage]に0-1のグラデーションを入れると、色相変化のグラデーションを取得できます。
後述の通り厳密な色相変化ではありませんが、比較的簡単に虹色を作ることができます。
▼グラデーションで虹色を作成するサンプルマテリアル。

▼動かしてみたサンプル (撮影のため上記のノードを[Collapsed Nodes]にまとめています)


■補足:マテリアルノードの中身と色の補正について
・UnrealEngineの[Hue Shift]ノードはエンジンコンテンツの青マテリアルなので、中身を確認することができます。
確認すると、以下のようになっています。
ご覧の通り、[Rotate About Axis]というノードを用いて、RGBの値を角度回転に見立て変化させるという面白い処理をしております。
処理速度を重視してこのような処理になっているようですが、そのために厳密なHSV変換とは異なる部分があるようです。

■カラーピッカーとの色比較
Photoshopでのカラーピッカーの色・数値と、[HueShift]での色変化を比較すると、このように表の形になります。
実際の色相変化と比較した場合 シアン・イエロー・マゼンタあたりの領域で、すこし色が異なる点に注意が必要です。

▼Photoshop・カラーピッカーの色相の動き

▼[HueShift]での色とDebugによる数値化の様子

ひとまず今回は以上となります。
[Hue Shift]は色を変化させる時はもちろん、「RGBの値を推移させる」という特性を持つため、テクニカルな応用に使うことができるマテリアルノードだと考えております。

コメント