使用例
■前提
UEFNの2024年4月のアップデートv29.20にて
UEFN に Curve Linear Color Atlases (カーブ線形カラーのアトラス) および Curve Linear Color Curves (カーブ線形カラーのカーブ) を追加し、ユーザーがマテリアル内にグラデーションを組み込めるようにしました。
■何ができるようになったのか
簡潔に言うと
マテリアル内の数値やカラーをあらかじめ設定したカーブを使って、
直感的かつ自由に変更することができるようになりました。
これによりマテリアルでの表現の幅が大きく広がります。
今までUEFNにおいてマテリアルの数値を変更する際は
●timeノードなどで扱う等速直線的な数値の変更
●数学的関数に従った数値の変更（sineなど）
●MateriaParameterCollectionを使用したシーケンサーを経由しての数値の変更
などの方法がありましたが、それぞれに使いづらさがありました。
■実装方法
①カーブの追加
コンテンツブラウザ上で右クリック
その他 ＞ カーブ ＞ Liner Curve Color > 選択
②カーブの編集
作成したカーブを開きます。
この状態ではRGBAの線がすべて重なっているので見づらくなっています。
画面左側のRGBAの横のピンのマークをクリックするとそれぞれの表示を非表示にすることができます。
画面左上から「絶対表示モード」から「スタックされた表示モード」に切り替えます。
今回は画面左側のRGBAからRGBのみを選択してみます。
するとRGBそれぞれのカーブを独立して編集することができます。
グラフの説明
このグラフは
縦軸がRGBの0.0～1.0値
横軸が時間軸(厳密には違うかもしれませんが今回はこの理解で問題ありません）
となっており
下記の画面では
RGB各色0.0～1.0
時間0.0～1.0秒まで表示しています。
カーブ上の任意の点をマウスの中クリックで選択するとキーフレームを追加することができます。
追加したキーフレームをドラッグで任意の位置に移動することができます。
線形の調整は細かくできますがこの記事では操作せずに進めます。（基本的にシーケンサーのカーブテーブルの操作と同じです。）
今回は時間0.5の位置のRとGの値を操作して
最初と最後は緑に、中間地点で赤くなるカーブをつくりました。
③カーブアトラスの作成
コンテンツブラウザ上で右クリック
その他 ＞ カーブアトラス
カーブアトラスを開いて
詳細パネルの
「Gtadient Curves」の「＋」から要素を追加して
先ほど作成したカーブを追加します。
④-1 マテリアルの作成
マテリアルエディターで右クリック
「CurveAtlasRowParameter」を追加します。
追加したノードの左側詳細パネルから
先ほど作成したカーブアトラスとカーブを追加します。
*先にカーブアトラスを追加しないとカーブを追加することができません
カーブアトラス➡カーブの順で追加してください。
④-2 マテリアルにおけるカーブの考え方
CurveAtlasRowParameterがScalarの値を受け取ったとき
アトラス上の左端を０
アトラス上の中央を0.5
アトラス上の右端を１
としてカラーを出力します。
試しにそれぞれCurveTimeに入力すると下記のように出力されます。
画像の上部の座標の色と対応がとれていることがわかります。
0入力
0.5入力
1入力
④-4 実装例
CurveAtlasRowParameterが座標の値を受け取ったとき
動画のような表示をします。
簡単なノードの解説
「TexCoord」
座標情報を出力します。
「Time」
増加していく時間の値を出力します。
「Panner」
座標と時間を受け取りSpeedで受け取った値に応じて座標を動かします。
「Frac」
受けっとった値から小数点以下の値のみを抽出します。
「Mask」
受け取ったUV座標からU（G）の値のみを取り出します。
ゲームプレイでの映像確認
■まとめ
この記事ではUEFNに新しく追加されたカーブ機能の基本的な概念と実装について解説しました。
使いこなせるようになるとマテリアルの表現力が広がるので、積極的に活用していきましょう。
■執筆（Xアカウント）
https://twitter.com/perrymotovlog
参考記事
