【Unity-Shader】#11 ノイズ画像を使って雷っぽい表現

ノイズ画像をつかって雷っぽい表現を作った

f:id:snoopopo:20200914133303g:plain


youtu.be

今回はこの動画を元にしています。shader Graph の解説動画なので、これをshaderのコードにしたかんじ。

使った画像

【電撃走らせたい画像】
f:id:snoopopo:20200911112928p:plain

【ノイズ画像】
f:id:snoopopo:20200914134235p:plain

こちらより素材をおかりしました:https://ai-catcher.com/

shader

今回は前回の記事*1からフラグメントシェーダしか触っていないので、 フラグメントシェーダのみ抜粋

fixed4 frag(v2f i) : SV_Target
{
    fixed2 noiseUv1 = fixed2(i.uv.x + _Time.y * 1.2, i.uv.y);
    fixed4 noise1 = tex2D(_NoiseTex, noiseUv1 * 0.005); //画像を拡大

    fixed2 noiseUv2 = fixed2(i.uv.x + _Time.y * -1.5, i.uv.y);
    fixed4 noise2 = tex2D(_NoiseTex, noiseUv2 * 0.005); //画像を拡大

    fixed4 noise = noise1 + noise2;

    //noise = noise * 10 - 5; //remap 0~1の範囲を -5~5の範囲にremap
    noise = noise * 10 - 15; //remap 0~2の範囲を -5~5の範囲にremap
    noise = abs(noise); //絶対値をとり、マイナス値だったものプラスに変化 0~5の値に変換
    noise = 1 - noise; //黒白を反転させる -4~1の値に
    noise = saturate(noise); //-4~1だとで加算したときに変な値になるので 0~1に絞る clamp01と同じ

    fixed4 color = tex2D(_MainTex, i.uv) + noise; //帯電と元の画像を加算

    if (color.a <= 0) {
        discard;
    }

    return color;
}