Sprite depth sobel screen space filter

Unity Engine
1

Heya, I’ve gotten myself a little lost in what I’m trying to do it would seem.

What I’m after visually:

3064959--230367--shaderTarget.png
3064959--230367--shaderTarget.png700×1083 447 KB

(paper model of the targeted aesthetic)

Now I figured that I could just make a screenSpace/imageEffect shader running a Sobel function to make the “glow” similar to what I’ve done here on a sprite shader:

3064959--230368--capture_05092017_193158.jpg
3064959--230368--capture_05092017_193158.jpg1283×625 52.8 KB

(single colored sprite renderers with directional sampling to simulate simple shading, code below if you want it)

            void surf(Input IN, inout SurfaceOutput o)
            {
                fixed4 offsets = _Offset * 0.001;
                fixed2 dir = fixed2(cos(_Angle), sin(_Angle));
                ///////////////////

                fixed4 base = offsets.xyxy * dir.xyxy;
                fixed4 uv01 = IN.uv_MainTex.xyxy + base * d01;
                fixed4 uv23 = IN.uv_MainTex.xyxy + base * d23;
                fixed4 uv45 = IN.uv_MainTex.xyxy + base * d45;
                fixed4 uv67 = IN.uv_MainTex.xyxy + base * d67;
                ///////////////

                fixed4 color = fixed4(0,0,0,0);

                color += 0.195 * tex2D(_MainTex, uv01.xy);
                color += 0.195 * tex2D(_MainTex, uv01.zw);

                color += 0.140 * tex2D(_MainTex, uv23.xy);
                color += 0.140 * tex2D(_MainTex, uv23.zw);

                color += 0.100 * tex2D(_MainTex, uv45.xy);
                color += 0.100 * tex2D(_MainTex, uv45.zw);

                color += 0.065 * tex2D(_MainTex, uv67.xy);
                color += 0.065 * tex2D(_MainTex, uv67.zw);

                o.Albedo.rgb = blendScreen(IN.color.rgb, color.a);
                o.Alpha = tex2D(_MainTex, IN.uv_MainTex).a * IN.color.a;
            }

But I can’t even seem to find a proper way to get the sprite depth into or have the actual alphacutout shape translate into the depth buffer to even begin playing with mathematical ways of solving this.

If anybody has any ideas, experiences or dare I say solutions please let me know.

2

Sobel is for edge detection and doesn’t really get you a smooth gradient from a step.

I’d take more samples (from the z-buffer). Closer to SSAO really.

3

Yeah detecting an edge and projecting it at different lengths in a common direction, like i did in the example code… that’s not a problem.
The problem is getting the sprites into said depth buffer properly in the first place.

4

Looks 2D. If that’s the case you’ll save time and effort just biting the bullet and authoring the style like this.

1 Like