Houdiniで作成したFlowMapの書き出しとUnityでの使用 その2
前提
前回の記事でHoudiniで作成したFlowmapを、Unityで表示するためのシェーダーを作成する。
ビルトインのシェーダーもあるようなのだが、大まかな構造だけでも把握するために、処理の流れを追ってみることとする。
作業内容の概要
Flowmap上の色情報を元に、メインのテクスチャ画像のUV画像を移動させることによって画像内に動きをもたらす。
そのままやるとループしないので、同一周期で開始値が違う2つの画像を用意して、その画像の色情報をLerpで混ぜることでループを実現する。
参考資料
Flow Map Shader for Unity3D. Used with Sprites. · GitHub
コードで記述されたシェーダー。これを元に以下の動画内でShaderGraphでの制作を行っている。
コードで記述されたシェーダーの、ShaderGraphへの移植。
Flowmapを表示するシェーダーの仕組みが分かりやすく解説されている。英語のみだが平易なので、画面を見ていれば内容は理解できると思う。
上記のリンクに非常に助けられた。この場を借りて感謝申し上げる。
注意事項
UV移動を、同一周期で開始値だけをずらした2つの値を用意して、その2種類のUVを適用した同一テクスチャ2枚をLerpで合成する、という流れ。その際にLerpの第2引数の値をループさせる必要があるが、それを以下のコードで実装している。
float phase0 = frac(_Time[1] * 0.5f + 0.5f);
<中略>
float flowLerp = abs((0.5f - phase0) / 0.5f);
これが全く思いつかなかった。参考にさせていただく。