【Unity-Shader】#12 Unity道場「Shader Graph はじめてみよう」の表現目指してshader書いた。

今までやってきたいくつかのエフェクト組み合わせた :)

f:id:snoopopo:20200915151210g:plain


youtu.be

最近の記事は↑のShader Graphの動画の内容をコードで書いてみよう!ってことでやってました。

shader

Shader "Custom/Warp"
{
    Properties
    {
        _MainTex("MainTexture", 2D) = "white" {}
        _NoiseTex("NoiseTexture", 2D) = "white" {}
        _PerlinNoiseTex("PerlinNoiseTexture", 2D) = "white" {}
        [HDR] _Color("Color", Color) = (1, 1, 1)
        _ColorVolume("ColorVolume", Range(0,1)) = 0
        _Border("Border", Range(0,1)) = 0
    }

    SubShader
    {
        Cull Off
        AlphaToMask On

        Tags
        {
            "Queue" = "AlphaTest"
            "RenderType" = "AlphaTest"
        }

        Pass
        {
            CGPROGRAM

            #pragma vertex vert
            #pragma fragment frag

            #include "UnityCG.cginc"

            struct appdata
            {
                float4 vertex : POSITION;
                float2 uv : TEXCOORD;
            };

            struct v2f
            {
                float4 vertex : SV_POSITION;
                float2 uv : TEXCOORD;
            };

            sampler2D _MainTex;
            sampler2D _PerlinNoiseTex;
            sampler2D _NoiseTex;
            float4 _Color;
            float _ColorVolume;
            float _Border;

            v2f vert(appdata v)
            {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = v.uv;
                return o;
            }

            fixed4 frag(v2f i) : SV_Target
            {

                {//ブレるような動き
                    fixed2 noiseUv = fixed2(i.uv.x + cos(_Time.y * 0.5), i.uv.y);
                    fixed4 noiseColor = tex2D(_PerlinNoiseTex, noiseUv) * 0.05;

                    i.uv.x += noiseColor.r;
                }

                fixed4 color = tex2D(_MainTex, i.uv); //最終的に出力する色

                {//カラーの変更
                    fixed gray = dot(color.rgb, fixed3(0.299, 0.587, 0.114));
                    fixed4 targetColor = _Color * gray;

                    fixed4 lerpColor = lerp(color, targetColor, _ColorVolume);
                    color = fixed4(lerpColor.r, lerpColor.g, lerpColor.b, tex2D(_MainTex, i.uv).a);
                }


                {//帯電

                    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 - 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と同じ

                    color += noise; //帯電と元の画像を加算
                }

                {//scanline
                    color *= (1 - step(0.8, sin((i.uv.y - _Time.y * 0.2) * 50)));
                }

                {//border
                    color *= 1 - (step(_Border, i.uv.y));
                    fixed borderSize = 0.05;
                    fixed4 borderLine = (step(_Border, i.uv.y + borderSize) * step(i.uv.y + borderSize, _Border + borderSize)) *_Color;
                    borderLine.a = color.a;
                    color += borderLine;
                }

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

                return color;
            }

            ENDCG
        }
    }
}

これまでの記事

それぞれの動作は以下の記事に個別で作ったものがあります!

・色を変える www.snoopopo.com


・直線(スキャンラインwww.snoopopo.com


・上下で消えたり表示したりするやつ(ボーダーライン) www.snoopopo.com


・ぶらぶら歪み www.snoopopo.com


・雷 www.snoopopo.com

なんか今思ってること

今みると見本と違うところあるけど、それがなんなのかわからんw
なんかもっと光がぼわ~としているような? 
あともっとスキャンラインの間隔短いか? ボーダーラインが頭のちょっと上に残ってしまってるな? 

とかとかあるけど

shader 勉強としてやったので課題としてよかった^^ 
なんか知識も足りてないと思うけど手を動かす量がもっと足りてないと思っているので、
shaderのいい問題集・課題集? 的なものがあったら教えてくださいー :D~♪