ブログの名前の通り、エフェクトに関係することを上げていこうかと思います
自分がわかる範囲で、エフェクトに関係することであれば何でもいいかな？とは
エフェクト自体の作り方は勿論の事
エフェクトの再生手段や、エフェクトに使うテクスチャ等
エフェクト素材の配布も始めました
(http://tktknkyo.hatenadiary.jp/entry/2017/12/31/095520)
なお、情報はTwitter(moyasi@エフェクト垢 (@torisutamoyasi) | Twitter)
でも出していたりするので、興味のある方は是非
Twitterではmoyasiという名前になっていますので、tktkでもmoyasiでもどちらでも呼びやすい方で
また、Discordにて「エフェクト交流所」というサーバーというのも作りました
ここは、エフェクトを作ろうとしているor作っている人同士で
相談したり、情報の共有したりするのを目的としております。
UE5で既に作成してあるマテリアルを使って
そのままテクスチャに描きだす手段となります
今回のサンプルは、この２枚のテクスチャをなんやかんやして
こんな感じのマテリアルを作成しました
歪みと、歪みの情報をそのまま色加算しただけのサンプルです
基本的に手元にある普段使っているマテリアルで良いです
必要なデータは３種類
ブループリント、マテリアル（もしくはインスタンス）、レンダーターゲット
日本語UIなどの場合は「描画ターゲット」という名前になっています
作成したBPを開き
BeginPlayから「Draw Material to Render Target」を作成して接続します
そして二つの入力にはレンダーターゲットとマテリアルをそれぞれ接続します
設定したら、レベルに配置してから、ゲームプレイ等でBPの処理が発生するようにします
この段階で、レンダーターゲットにマテリアルの情報が描きだされているはずですが
Unlitのライトの影響を受けない仕様である必要があったり
デプスフェードなど、入れていると上手く行かない処理もあるので注意が必要です
描きだされるテクスチャの解像度は、レンダーターゲットを開いた際の詳細から設定できます
レンダーターゲットにマテリアルの情報を移したら
レンダーターゲットの右クリックで出るメニューのスタティックテクスチャを作成
を選択するとテクスチャが出力されます
Verは5.44です
上記の記事の続きのポスプロ用マテリアルの中身になります
歪みの処理については、UVへの接続情報に歪み情報を加えるのみになります
SceneTextureの設定をPostProcessinput0にするのは忘れずに
エフェクト用のマテリアルで普段行っているように歪みの処理を入れれば基本は問題はありません
均一にスクロールするだけなら不要ですが
特定のタイミングで歪みを強くしたりスクロールさせる場合は
必要な箇所にはマテリアルパラメータコレクションを入れておく必要はあります
今回の記事は以上になります
Verは5.44です
上記の記事の続きの内容になります
マテリアルの中身は上記のようになっています
パラメータコレクションのCAScaleは色収差の強度
スカラーパラメータのCA_Countは色収差の精度になります
float4 color = float4(0.0, 0.0, 0.0, 0.0);
float Texindex = 14;
float2 UV2 = float2(0.5,0.5);
float2 UVr = float2(0.5,0.5);
float2 UVg = float2(0.5,0.5);
float2 UVb = float2(0.5,0.5);
float3 sum = float3(0.0, 0.0, 0.0);
float3 sumr = float3(0.0, 0.0, 0.0);
float3 sumg = float3(0.0, 0.0, 0.0);
float3 sumb = float3(0.0, 0.0, 0.0);
float3 CA = float3(CAScale.r,CAScale.g,CAScale.b)*CAScale.a; //色収差用のAをRGBに適応
Count = floor(lerp(1,16,clamp(Count,0,1))+0.1); //色収差の精度用
float Scale[16] = { //処理用の配列作成
0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15
};
for(int i = 0; i<Count; i ++)
{
UV2 = UV-0.5; //計算用に中心を0に調整
UVr = (UV2*1/(1+Scale[i]/Count*CA.r))+0.5; //UVを中心から拡大する
UVg = (UV2*1/(1+Scale[i]/Count*CA.g))+0.5; //UVを中心から拡大する
UVb = (UV2*1/(1+Scale[i]/Count*CA.b))+0.5; //UVを中心から拡大する
UVr = clamp(UVr, float2(0.0,0.0),float2(1.0,1.0)); //UVを0-1に抑える
UVg = clamp(UVg, float2(0.0,0.0),float2(1.0,1.0)); //UVを0-1に抑える
UVb = clamp(UVb, float2(0.0,0.0),float2(1.0,1.0)); //UVを0-1に抑える
sumr += SceneTextureLookup(ViewportUVToSceneTextureUV(UVr,Texindex),Texindex,true); //ループ毎に加算する
sumg += SceneTextureLookup(ViewportUVToSceneTextureUV(UVg,Texindex),Texindex,true); //ループ毎に加算する
sumb += SceneTextureLookup(ViewportUVToSceneTextureUV(UVb,Texindex),Texindex,true); //ループ毎に加算する
}
sum = float3(sumr.r,sumg.g,sumb.b); //Vectorに結合
sum /= Count; //加算した回数で除算
return sum = sum;
コードは上記になっています
全体の処理内容としては、UVの拡大率を変えながらループ処理で加算を行い
最後に加算した回数で除算します
色収差用なので、RGBでそれぞれ別の拡大率を使用できるように組んでいます
今回の記事は以上になります
Verは5.44です
上記の記事の続きのポスプロ用マテリアルの中身になります
左上のSceneTextureにはPostProcessinput0
を選択しましょう
float3 OUT = float3(0,0,0);
float3 Grey = float3(0,0,0);
float Greyf = 0;
Grey_Scale = saturate(Grey_Scale); //Lerp用なので0-1に変換
OUT = Base.rgb; //出力用
Reduction = floor*1; //減色処理用、0-1を2-255に変換
Greyf = (OUT.r+OUT.g+OUT.b)/3; //グレー用のFloat変換
Grey = pow(float3(Greyf,Greyf,Greyf),Grey_Pow); //グレーをベクトルに戻して累乗を行う
Grey = floor(Grey * Reduction) / (Reduction-1); //減色処理の適応
OUT = lerp(OUT,Grey,Grey_Scale); //グレスケの適応
OUT = OUT * MultColor.rgb; //色乗算
OUT = OUT + (AddColor.rgb * AddColor.a); //色加算
OUT = lerp(OUT,OUTColor.rgb,OUTColor.a); //色加算の影響度適応
return OUT;
カスタムノードのコードは上記になっています
パラメータ名は上から
Base
OUTColor
MultColor
AddColor
Grey_Scale
Grey_Pow
Reduction
となっています
マテリアルパラメータコレクションのパラメータについて
・OUTColor
RGBの色にAの数値の割合で上書きします、元の色に加算や乗算ではなく上書きになるので、真っ黒や真っ白等だけでなくグレー等の色も指定できます
・MultColor
全体の色を乗算します、Aは使用せずにRGBのみになります
・AddColor
全体の色に加算します、AチャンネルでRGBの加算具合を調整できます
・Grey_Scale
グレースケールへの変換強度、0で無効1で全体がグレーになります
・Grey_Pow
グレースケールに変換する際にべき数
・Color_Reduction
色の諧調を減らす処理、0にすると白と黒の二諧調になります
【中身の解説】
グレースケール変換
Greyf = (OUT.r+OUT.g+OUT.b)/3; //グレー用のFloat変換
Grey = pow(float3(Greyf,Greyf,Greyf),Grey_Pow); //グレーをベクトルに戻して累乗を行う
グレースケールへの変換箇所はここになります
RGBチャンネルの平均を一度Float型に変換してから
変換したFloatの数値をカラーのRGBに適応します
色の諧調数
Reduction = floor*2; //減色処理用、0-1を2-255に変換
諧調数を減らす処理はこの箇所になります
乗算してからFloorの切り捨てを行い、その後除算で0-1に戻すことで色の諧調数を減らします
色加算・乗算
OUT = OUT * MultColor.rgb; //色乗算
OUT = OUT + (AddColor.rgb * AddColor.a); //色加算
OUT = lerp(OUT,OUTColor.rgb,OUTColor.a); //色加算の影響度適応
加算や乗算等の処理はこの箇所になります
加算と乗算は基本的にそのまま計算を行い、色を上書きするOUTColorはLerpを使用しています
今回の記事は以上となります
Verは5.44です
シーケンサー上でポスプロの強度等のアニメーションを実装します
エフェクトと影響がありそうなところでいうと、エフェクトの瞬間に色収差や放射ブラーを入れて勢いを強調する等を行う事が出来ます
また、一つの記事に複数のポスプロの処理まで書くと長くなってしまうので
ポスプロのマテリアルの中身ではなく、この記事では設定側のみの内容になります
アウトライナから「post」と検索するとポスプロの設定用のものが出てくるので
選択し、詳細パネルを開きます
レンダリング機能、という項目の所にポストプロセスマテリアルという項目があります
Arrayと書いてある箇所の右のほうにある+ボタンをクリックします
マテリアルを設定できるようになるので、ここにポスプロ用のマテリアルを設定します
上記でレベルにポスプロの設定が行われます
シーケンサーで制御するために
まずはポスプロの数値をマテリアルパラメータコレクションで設定できるように組みます
上記の画像は色収差用のポスプロを作った時のもので
赤で囲っているところがマテリアルパラメータコレクションのパラメータとなります
マテリアルパラメータコレクションはシーケンサーにそのまま適応する事ができるので必要なパラメータを選択すれば、シーケンサー上で数値を変更する事が出来ます
上記の設定でシーケンサー上でポスプロの強度等をキーフレームで調整ができます。
実際の組み方は専用記事のほうで行います
今回の記事は以上になります
エフェクトの角度変更
— moyasi@マテフォの中の人 (@torisutamoyasi) 2025年9月14日
シーケンサー上でリアルタイムに変えれますねこれ
※ブログ投稿用動画 pic.twitter.com/AugmjRB1Lh
Verは5.44です
エフェクトをシーケンサーで再生する際に
角度等を調整しやすくするための手段の一つになります
エフェクトの特定のフレームに固定しつつ、角度の編集等ができます
どういう挙動なのかは、上の動画を参照にしてください
条件等はあるので、それも踏まえて解説します
最終的に動かすのは、シーケンサーに配置してあるNiagaraの角度をそのまま動かすだけになるので
そのために必要な項目になります。
Niagaraの設定は、LocalSpaceにチェックを入れてください。
これのチェックが無いと、角度の更新がNiagaraの発生時にしか行われなくなるので
角度の確認するたびに再度再生しなおす必要がでてくる為です。
もう一つのシーケンサー上の設定として
システムのライフサイクルでの再生及び、設定を【Desired Age】に変更してください
この設定の仕方としては
【NiagaraComponent0】を選択します
生成された【NiagaraComponent0】の右側の+ボタンでメニューを開き
【Niagaraシステムのライフサイクルトラック】を選択します。
初期設定は【TickDeltaTime】になっているので
【Desired Age】を選択します。
この二つの設定をしていれば、シーケンサー上でリアルタイムに角度等の変更ができるようになるはずです。
NiagaraのLocalSpaceの設定は、角度の調整をしたいもののみで良いので
角度を合わせる為のエミッターのみLocalSpaceに設定すれば問題ありません。
今回の記事はここまでになります。
新しくできる事などがある機能ではありませんが
角度を細かく調整するような場合には便利だと思うので、使ってみてください。
