Trying to reproduce a Heroes of the Storm shader

Hello guys,
i want to recreate this effect. I think that is a semicircle mesh with a refraction and a texture with opacity. Is this correct?

 

Thanks to the help of a tutorial I managed to create the effect, but I cannot reproduce transparency at the top of the models. Currently editing the alpha Color can make the whole model transparent. Ideas?

Code (CSharp):

1. Shader "Custom/Goal Barrier"
2. {
3.     Properties
4.     {
5.         _MainTex ("Texture", 2D) = "white" {}
6.         _Color ("Color", Color) = (0,0,0,0)
7.     }
8.  
9.     SubShader
10.     {
11.         Blend One One
12.         ZWrite Off
13.         Cull Off
14.  
15.         Tags
16.         {
17.             "RenderType"="Transparent"
18.             "Queue"="Transparent"
19.         }
20.  
21.         Pass
22.         {
23.             CGPROGRAM
24.             #pragma target 3.0
25.             #pragma vertex vert
26.             #pragma fragment frag
27.  
28.             #include "UnityCG.cginc"
29.  
30.             struct appdata
31.             {
32.                 float4 vertex : POSITION;
33.                 float2 uv : TEXCOORD0;
34.                 float3 normal : NORMAL;
35.             };
36.  
37.             struct v2f
38.             {
39.                 float2 uv : TEXCOORD0;
40.                 float2 screenuv : TEXCOORD1;
41.                 float3 viewDir : TEXCOORD2;
42.                 float3 objectPos : TEXCOORD3;
43.                 float4 vertex : SV_POSITION;
44.                 float depth : DEPTH;
45.                 float3 normal : NORMAL;
46.             };
47.  
48.             sampler2D _MainTex;
49.             float4 _MainTex_ST;
50.  
51.             v2f vert (appdata v)
52.             {
53.                 v2f o;
54.                 o.vertex = UnityObjectToClipPos(v.vertex);
55.                 o.uv = TRANSFORM_TEX(v.uv, _MainTex);
56.  
57.                 o.screenuv = ((o.vertex.xy / o.vertex.w) + 1)/2;
58.                 o.screenuv.y = 1 - o.screenuv.y;              
59.                 o.depth = -UnityObjectToViewPos(v.vertex).z *_ProjectionParams.w;
60.  
61.                 o.objectPos = v.vertex.xyz;      
62.                 o.normal = UnityObjectToWorldNormal(v.normal);
63.                 o.viewDir = normalize(UnityWorldSpaceViewDir(mul(unity_ObjectToWorld, v.vertex)));
64.  
65.                 return o;
66.             }
67.            
68.             sampler2D _CameraDepthNormalsTexture;
69.             fixed4 _Color;
70.  
71.             float triWave(float t, float offset, float yOffset)
72.             {
73.                 return saturate(abs(frac(offset + t) * 2 - 1) + yOffset);
74.             }
75.  
76.             fixed4 texColor(v2f i, float rim)
77.             {
78.                 fixed4 mainTex = tex2D(_MainTex, i.uv);
79.                 mainTex.r *= triWave(_Time.x * 5, abs(i.objectPos.y) * 2, -0.7) * 6;
80.                 mainTex.g *= saturate(rim) * (sin(_Time.z + mainTex.b * 5) + 1);
81.                 return mainTex.r * _Color + mainTex.g * _Color;
82.             }
83.  
84.             fixed4 frag (v2f i) : SV_Target
85.             {
86.                 float screenDepth = DecodeFloatRG(tex2D(_CameraDepthNormalsTexture, i.screenuv).zw);
87.                 float diff = screenDepth - i.depth;
88.                 float intersect = 0;
89.                
90.                 if (diff > 0)
91.                     intersect = 1 - smoothstep(0, _ProjectionParams.w * 0.5, diff);
92.  
93.                 float rim = 1 - dot(i.normal, normalize(i.viewDir)) * 2;
94.                 fixed4 glowColor = fixed4(lerp(_Color.rgb, fixed3(1, 1, 1), pow(intersect, 4)), 1);          
95.                 fixed4 hexes = texColor(i, rim);
96.  
97.                 fixed4 col = _Color * _Color.a + glowColor * intersect + hexes;
98.                 return col;
99.             }
100.             ENDCG
101.         }
102.     }
103. }
104.  

 

I see at least four ways to get what you want:

1. Vertex Colors:
   Use one of the four vertex color channels (e.g. Alpha) to paint areas of your mesh that should become transparent.
2. UV-Coordinates:
   If you can ensure that the top of your mesh always starts at v=0 (else use 1-v) you could directly map that value to your color.a value. Throw in a pow() function to modulate the transparency falloff.
   
3. Texture Mask:
   Use the original, undistorted UV-coordinates to sample into a texture mask and multiply that with the alpha of your moving effect texture at the cost of another texture sampler.
   
4. Vertex Position:
   If you use a "normalized" mesh (e.g. maximum distance of vertices from pivot of your mesh equals 1 unit length) you could use this information to drive your transparency gradient.

 

I'm trying the third option. I have added a Dissolve Texture but I don't understand how to integrate it. Any hint?

Code (CSharp):

1. Shader "Custom/Goal Barrier"
2. {
3.     Properties
4.     {
5.         _Color ("Color", Color) = (0,0,0,0)
6.         _MainTex ("Texture", 2D) = "white" {}
7.         _DissolveTex("Dissolve Texture", 2D) = "white" {}
8.     }
9.  
10.     SubShader
11.     {
12.         Blend One One
13.         ZWrite Off
14.         Cull Off
15.  
16.         Tags
17.         {
18.             "RenderType"="Transparent"
19.             "Queue"="Transparent"
20.         }
21.  
22.         Pass
23.         {
24.             CGPROGRAM
25.             #pragma target 3.0
26.             #pragma vertex vert
27.             #pragma fragment frag
28.  
29.             #include "UnityCG.cginc"
30.  
31.             struct appdata
32.             {
33.                 float4 vertex : POSITION;
34.                 float2 uv : TEXCOORD0;
35.                 float3 normal : NORMAL;
36.             };
37.  
38.             struct v2f
39.             {
40.                 float2 uv : TEXCOORD0;
41.                 float2 screenuv : TEXCOORD1;
42.                 float3 viewDir : TEXCOORD2;
43.                 float3 objectPos : TEXCOORD3;
44.                 float4 vertex : SV_POSITION;
45.                 float depth : DEPTH;
46.                 float3 normal : NORMAL;
47.             };
48.  
49.             sampler2D _MainTex;
50.             float4 _MainTex_ST;
51.             sampler2D _DissolveTex;
52.  
53.             v2f vert (appdata v)
54.             {
55.                 v2f o;
56.                 o.vertex = UnityObjectToClipPos(v.vertex);
57.                 o.uv = TRANSFORM_TEX(v.uv, _MainTex);
58.  
59.                 o.screenuv = ((o.vertex.xy / o.vertex.w) + 1)/2;
60.                 o.screenuv.y = 1 - o.screenuv.y;              
61.                 o.depth = -UnityObjectToViewPos(v.vertex).z *_ProjectionParams.w;
62.  
63.                 o.objectPos = v.vertex.xyz;      
64.                 o.normal = UnityObjectToWorldNormal(v.normal);
65.                 o.viewDir = normalize(UnityWorldSpaceViewDir(mul(unity_ObjectToWorld, v.vertex)));
66.  
67.                 return o;
68.             }
69.            
70.             sampler2D _CameraDepthNormalsTexture;
71.             fixed4 _Color;
72.  
73.             float triWave(float t, float offset, float yOffset)
74.             {
75.                 return saturate(abs(frac(offset + t) * 2 - 1) + yOffset);
76.             }
77.  
78.             fixed4 texColor(v2f i, float rim)
79.             {
80.                 fixed4 mainTex = tex2D(_MainTex, i.uv);
81.                 mainTex.r *= triWave(_Time.x * 5, abs(i.objectPos.y) * 2, -0.7) * 6;
82.                 mainTex.g *= saturate(rim) * (sin(_Time.z + mainTex.b * 5) + 1);
83.                 return mainTex.r * _Color + mainTex.g * _Color;
84.             }
85.  
86.             fixed4 frag (v2f i) : SV_Target
87.             {
88.                 float screenDepth = DecodeFloatRG(tex2D(_CameraDepthNormalsTexture, i.screenuv).zw);
89.                 float diff = screenDepth - i.depth;
90.                 float intersect = 0;
91.                
92.                 if (diff > 0)
93.                     intersect = 1 - smoothstep(0, _ProjectionParams.w * 0.5, diff);
94.  
95.                 float rim = 1 - dot(i.normal, normalize(i.viewDir)) * 2;
96.                 fixed4 glowColor = fixed4(lerp(_Color.rgb, fixed3(1, 1, 1), pow(intersect, 4)), 1);          
97.                 fixed4 hexes = texColor(i, rim);
98.                 fixed4 dissolve = _Color.a * tex2D(_DissolveTex, i.uv);
99.  
100.                 //fixed4 col = _Color * dissolve + glowColor * intersect + hexes;
101.  
102.                 fixed4 col = _Color * dissolve;
103.  
104.                 return col;
105.             }
106.             ENDCG
107.         }
108.     }
109. }
110.