Search Unity

  1. Megacity Metro Demo now available. Download now.
    Dismiss Notice
  2. Unity support for visionOS is now available. Learn more in our blog post.
    Dismiss Notice

Dissolve Shader

Discussion in 'Shaders' started by Grune, Jul 7, 2010.

  1. Grune

    Grune

    Joined:
    Nov 8, 2009
    Posts:
    136
    Is a dissolve like effect possible in unity:
    this is from fear3


    It would be a some how animated noise which is used as a Opacity map.
    And it's not a regular noise. It's more like Perlin.
    And what i wonder about is, the edges get filled with a third red map.

    Any wisdom would be welcome.

    Is i t even possible to realtime draw on a map in unity ?
     
  2. niosop2

    niosop2

    Joined:
    Jul 23, 2009
    Posts:
    1,059
  3. Slin

    Slin

    Joined:
    Jun 27, 2010
    Posts:
    85
    Should be kinda easy to create using clip() (hoping that this function exists in CG, there is also something like that in GLSL, I think it is called discard and it is clip() in HLSL).
    Just look up from a noise texture which maybe even has some black to white gradient in it to have few bigger parts disappear and not only many small ones and substract a value which is 0 in the biginning and growing up to 1 from it. Use the result as parameter for clip(). The red outline around the dissolving parts can be determined in a similar way. The red outline around the whole object looks like a simple dot product of the camera direction and the normal. Add some shading and you are done :).
     
  4. Grune

    Grune

    Joined:
    Nov 8, 2009
    Posts:
    136
    Thanks i watched the videos. Makes totaly sense but is pretty advanced stuff to me.

    But i will keep track. I want this shader to blend in some objects.
     
  5. niosop2

    niosop2

    Joined:
    Jul 23, 2009
    Posts:
    1,059
    Hmm, just had an idea about this.

    Make a second texture that's a grayscale image. Make the chunks you want to appear first black, the ones you want to appear last white, smooth gradient in between.

    Pass a value from your shader from your program, increasing this value from 0 to 1 over time. The shader could compare the value passed from the program to the red channel of the grayscale image. If the value is greater than the red value, render the pixel from the diffuse map/normal/etc, if not, render it w/ a 0 alpha value. If it's within a certain range then render it dark red with a 1 alpha value.

    This would give you decent control over what parts appeared in what order, how fast, etc.

    EDIT: Thinking more about this, you could just the existing Transparent Cutout shaders, then just use the alpha channel of your texture to determine what appears when. Change the alpha cutoff value to make more stuff appear.
     
  6. bobthefish

    bobthefish

    Joined:
    Jul 7, 2010
    Posts:
    18
  7. Deleted User

    Deleted User

    Guest

    to BobTheFish:
    i don't know how to use your shaders to get a animated effect :(
    would it be possible if you create a package with an example scene so i can see the end result working?
    that would be very nice,

    thnx in forward
     
  8. Deleted User

    Deleted User

    Guest

    wow thnx - it works perfectly! that's an amazing effect and so simple to use! thnx to BobTheFish Meh11 for explaining me!!!
    one more little thing xD is there somehow a way to get those little red "glowin" edges working, like on the pictures above ? xD

    I really appricate if others are not avaricious or selfish!

    one more...THNX AGAIN! =)
     
  9. Deleted User

    Deleted User

    Guest

    is there somehow a way to get those little red "glowin" edges working, like on the pictures above ? =)
     
  10. Deleted User

    Deleted User

    Guest

    but where or how to use "this term" to get the red edges?
    i use the shader like he posted it.
    do i need to animate a material value ? cause nothing seem to work
    i also used his noise texture. the vanishing happens. but the red edges don't!

    Also i miss a emessive value. and i tried to copy emessive strings into the shader, but without success. :/
    scripting is not my fortitude :(
     
  11. Deleted User

    Deleted User

    Guest

    please someone can help me? how to use thi value? > "BobTheFish used this _Color.a - texd.r as alpha value"
    it's in the shader. but how do i activate it so i can see the red borders like on the photos shown above?
     
  12. Deleted User

    Deleted User

    Guest

    Please can anyone response to my issue?
    Shader works. But the red edges not. Don't know how. Tried everything.
     
  13. bobthefish

    bobthefish

    Joined:
    Jul 7, 2010
    Posts:
    18
    Sorry I took so long to reply, I have been away from the forums for a while.

    I hadn't tried red edges but I modified my shader a bit to see if it could do what you wanted. Try replacing the section from "void surf" to "ENDCG" with this:
    Code (csharp):
    1. void surf (Input IN, inout SurfaceOutput o) {
    2.     half4 tex = tex2D(_MainTex, IN.uv_MainTex);
    3.     half4 texd = tex2D(_DissolveTex, IN.uv_DissolveTex);
    4.     o.Albedo = tex.rgb * _Color.rgb;
    5.     o.Gloss = tex.a;
    6.     o.Alpha = _Color.a - texd.r;
    7.     if ((o.Alpha < 0)(o.Alpha > -0.1)(_Color.a>0))
    8.     {
    9.         o.Alpha = 1;
    10.         o.Albedo = float3(1,0,0);
    11.     }
    12.     o.Specular = _Shininess;
    13. }
    14. ENDCG
    The -0.1 in there can be used to modify the thickness of the redness, for example -0.2 is thicker and -0.05 is thinner.
    If you're using my noise texture, you'll probably want to turn its tiling down to 0.1 or less to get a decent effect.
     
  14. allen

    allen

    Joined:
    Mar 21, 2010
    Posts:
    81
  15. Deleted User

    Deleted User

    Guest

    Hi Master =D

    i changed the strings exactly with the new ones, but the result is a defekt shader. shader changes objects to purple with an error message: "SurfShaderInternalFunc", undefined variable "_Shininess" at line 34 xO

    If i would be able to write a shader, i would not bother you!

    By the way, is it somehow possible to make that shader working with emessive? Beside the fact i don't know how to delete things like specular values, cause i'd like to optimize the shader for iOS purposes.

    A honest big THNX for your efforts!!!!!!!!!!!
     
    Last edited by a moderator: Apr 7, 2011
  16. Deleted User

    Deleted User

    Guest

    I got it working by deleting the "o.Specular = _Shininess;" string xD, since i don't need any specular effects!
    But still i am trying to get the shader working with emessive. no matter what i try, which line i take out and replace from other emessive shaders. i don't get it working :(

    by the way - the effect with the red edges looks crispy-superordenary-extra-coool!!! =D

    are you working in the game industry?

    greetings and best regards!!! and another BIG THNX for you!!!!!!
     
  17. Sicklilmonky

    Sicklilmonky

    Joined:
    Feb 15, 2011
    Posts:
    30
    That top pictured effect is just what I'm looking for the death of my "Alien Zombies" only with green blood
    Now does anyone have a tutorial on how to do this step by freaking step??
     
  18. Paulo-Henrique025

    Paulo-Henrique025

    Joined:
    Dec 12, 2010
    Posts:
    230
    Did you read the entire thread?
     
  19. Sicklilmonky

    Sicklilmonky

    Joined:
    Feb 15, 2011
    Posts:
    30
    Yup, and what I need to know, is what goes where and how to set it up... near I can tell no one has mentioned how to set something like this up?? Unless I missed something?
     
  20. Deleted User

    Deleted User

    Guest

    Still i need the shader with emessive color values, so i can use it for IOS purposes.
    please!!!! someone who can help me on that issue?
     
  21. Deleted User

    Deleted User

    Guest

    bump... O_O
     
  22. Deleted User

    Deleted User

    Guest

    would anyone please give me a hint what causes to stop emessive color change lines in that shader, so i dont need to use a realtime lightsource? as a non scripter i allready tried everything to get it working, but without success. the goal would be a iOS shader.
     
  23. Slin

    Slin

    Joined:
    Jun 27, 2010
    Posts:
    85
    Code (csharp):
    1.  
    2. //  Created by Nils Daumann on 04.06.2011.
    3. //  Copyright (c) 2011 Nils Daumann
    4.  
    5. //  Permission is hereby granted, free of charge, to any person obtaining a copy
    6. //  of this software and associated documentation files (the "Software"), to deal
    7. //  in the Software without restriction, including without limitation the rights
    8. //  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
    9. //  copies of the Software, and to permit persons to whom the Software is
    10. //  furnished to do so, subject to the following conditions:
    11.  
    12. //  The above copyright notice and this permission notice shall be included in
    13. //  all copies or substantial portions of the Software.
    14.  
    15. //  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
    16. //  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
    17. //  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
    18. //  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
    19. //  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
    20. //  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
    21. //  THE SOFTWARE.
    22.  
    23. //  www.slindev.com
    24.  
    25. Shader "SlinDev/Mobile/Special/TexDissolveColNocull"
    26. {
    27.     Properties
    28.     {
    29.         _Color("Dissolve Color (RGB), Range (A)", Color) = (1.0, 1.0, 1.0, 1.0)
    30.         _AlphaDisc("Dissolve state", Range(0, 1)) = 0.5
    31.         _MainTex("Base (RGB), Dissolve Mask (A)", 2D) = "white" {}
    32.     }
    33.    
    34.     //GLSL shader used on devices rendering with OpenGL ES 2.0
    35.     SubShader
    36.     {
    37.         Tags {"IgnoreProjector"="True" "RenderType"="TransparentCutout"}
    38.         Pass
    39.         {
    40.             Tags {"LightMode" = "Always"}
    41.             Cull Off
    42.            
    43.             GLSLPROGRAM
    44.                 #pragma fragmentoption ARB_precision_hint_fastest
    45.                
    46.                 uniform vec4 _Color;
    47.                 uniform float _AlphaDisc;
    48.                 uniform sampler2D _MainTex;
    49.                 varying mediump vec2 texcoord;
    50.                
    51.                 #ifdef VERTEX
    52.                     void main()
    53.                     {
    54.                         gl_Position = gl_ModelViewProjectionMatrix*gl_Vertex;
    55.                         texcoord = gl_MultiTexCoord0.xy;
    56.                     }
    57.                 #endif
    58.                
    59.                 #ifdef FRAGMENT
    60.                     void main()
    61.                     {
    62.                         gl_FragColor = texture2D(_MainTex, texcoord);
    63.                         if(gl_FragColor.a < _AlphaDisc+_Color.a)
    64.                             gl_FragColor.rgb = _Color.rgb;
    65.                         if(gl_FragColor.a < _AlphaDisc)
    66.                             discard;
    67.                     }
    68.                 #endif
    69.             ENDGLSL
    70.         }
    71.     }
    72.    
    73.     //CG/HLSL shader used on all other devices with shader support
    74.     SubShader
    75.     {
    76.         Tags {"IgnoreProjector"="True" "RenderType"="TransparentCutout"}
    77.         Pass
    78.         {
    79.             Tags {"LightMode" = "Always"}
    80.             Cull Off
    81.            
    82.             CGPROGRAM
    83.                 #pragma exclude_renderers gles
    84.                 #pragma vertex vert
    85.                 #pragma fragment frag
    86.                 #pragma fragmentoption ARB_precision_hint_fastest
    87.                
    88.                 uniform float4 _Color;
    89.                 uniform float _AlphaDisc;
    90.                 uniform sampler2D _MainTex;
    91.                
    92.                 struct appdata_base
    93.                 {
    94.                     float4 vertex : POSITION;
    95.                     float4 texcoord : TEXCOORD0;
    96.                 };
    97.                
    98.                 struct v2f
    99.                 {
    100.                     float4 pos : POSITION;
    101.                     float2 texcoord : TEXCOORD0;
    102.                 };
    103.  
    104.                 v2f vert(appdata_base v)
    105.                 {
    106.                     v2f o;
    107.                    
    108.                     o.pos = mul(UNITY_MATRIX_MVP, v.vertex);
    109.                     o.texcoord.xy = v.texcoord.xy;
    110.                    
    111.                     return o;
    112.                 }
    113.                
    114.                 float4 frag(v2f i) : COLOR
    115.                 {
    116.                     half4 Color = tex2D(_MainTex, i.texcoord);
    117.                     if(Color.a < _AlphaDisc+_Color.a)
    118.                         Color.rgb = _Color.rgb;
    119.                     clip(Color.a-_AlphaDisc);
    120.                     return Color;
    121.                 }
    122.             ENDCG
    123.         }
    124.     }
    125.    
    126.     //Fallback for devices not supporting shaders at all
    127.     SubShader
    128.     {
    129.         Tags {"IgnoreProjector"="True" "RenderType"="TransparentCutout"}
    130.         Pass
    131.         {
    132.             Tags {"LightMode" = "Always"}
    133.             Cull Off
    134.             AlphaTest Greater [_AlphaDisc]
    135.             SetTexture [_MainTex]
    136.             {
    137.                 ConstantColor [_Color]
    138.                 Combine texture*constant, texture*constant
    139.             }
    140.         }
    141.     }
    142. }
    143.  
     
  24. Deleted User

    Deleted User

    Guest

    cannot figure out how this shader should work. i tried to animate every material value is saw.
     
  25. Deleted User

    Deleted User

    Guest

    My goal is to modify this shader so it works only with emessive, without the need for a lightsource.

    Code (csharp):
    1. Shader "Dissolve/DissolveDiffuse" {
    2. Properties {
    3.     _Color ("Main Color", Color) = (1,1,1,1)
    4.     _MainTex ("Base (RGB)", 2D) = "white" {}
    5.     _DissolveTex ("Dissolve (R)", 2D) = "white" {}
    6. }
    7.  
    8. SubShader {
    9.     Tags {"IgnoreProjector"="True" "RenderType"="TransparentCutout"}
    10.     LOD 300
    11.  
    12. CGPROGRAM
    13. #pragma surface surf Lambert alphatest:Zero
    14. sampler2D _MainTex;
    15. sampler2D _DissolveTex;
    16. float4 _Color;
    17.  
    18. struct Input {
    19.     float2 uv_MainTex;
    20.     float2 uv_DissolveTex;
    21. };
    22.  
    23. void surf (Input IN, inout SurfaceOutput o) {
    24.     half4 tex = tex2D(_MainTex, IN.uv_MainTex);
    25.     half4 texd = tex2D(_DissolveTex, IN.uv_DissolveTex);
    26.     o.Albedo = tex.rgb * _Color.rgb;
    27.     o.Gloss = tex.a;
    28.     o.Alpha = _Color.a - texd.r;
    29.     if ((o.Alpha < 0)(o.Alpha > -0.07)(_Color.a>0))
    30.     {
    31.         o.Alpha = 1;
    32.         o.Albedo = float3(1,0.5,0);
    33.     }
    34.    
    35. }
    36. ENDCG
    37. }
    38.  
    39. Fallback "Transparent/Cutout/VertexLit"
    40. }
    41.  
    42.  
     
  26. Slin

    Slin

    Joined:
    Jun 27, 2010
    Posts:
    85
    Put some noise into your diffuse textures alpha channel and animate the "Dissolve state" variable.
     
  27. Deleted User

    Deleted User

    Guest

    even if this works, it's not an optimized shader for iOS.

    addition: sorry it seems to be a nice shader, just with a different tecnique.

    addition#2: to clarify my inaccurate words, i thought the shader is for standalone games, cause i didn't figure out how it works. That's why i used the blindfold words "not optimized". i apologize for that!
     
    Last edited by a moderator: Jun 21, 2011
  28. Slin

    Slin

    Joined:
    Jun 27, 2010
    Posts:
    85
    It is probably as optimized as it can be. I bet that everything you would consider more optimized, would be slower.
     
  29. Deleted User

    Deleted User

    Guest

    sorry for misunderstanding, i tried your shader again and i realized you wrote that one different. so i need a alpha channel with a noise to get the effect working, as you wrote before. i see. but my question and problem is now.

    the dissolve effect shell appear on wrecks from destroyed enemies. the thing is, all the enemies and the wrecks of them are sharing the same texture but not the same material by using the dissolve effect from bobthefish.
    if i integrate now a alpha channel on this texture and save this to a png, with the goal of using your shader, then i have a transparent texture on all enemies, and the noisy transparencies of the alpha channel effects also on the enemies, or? and beside that isn't that taking to much performance and brings z-order problems, if my enemies are getting consecutive by an z-order?

    sorry for misinterpretation, if so! and BIG THNX too for your efforts!
     
    Last edited by a moderator: Jun 20, 2011
  30. hippocoder

    hippocoder

    Digital Ape

    Joined:
    Apr 11, 2010
    Posts:
    29,723
    Guys stop with the begging stuff now, you have a perfectly good shader and it didn't cost anything. Consider paying for a great shader if you want further support from the authors.

    iOS will be very slow at this stuff unless you're using ipad2, its simply the nature of mobile.

    To fix your issue, just swap the material from a normal material to this dissolve effect when required by changing renderer.material = newmat;
     
  31. Deleted User

    Deleted User

    Guest

    in the 1st moment i thought the shader is a joke. i realized the functionality of it after i looked another time on it. pitty you didn't read my last post to that. i apologized for that :) and one hand washes the other! i think so... peace!
     
    Last edited by a moderator: Jun 21, 2011
  32. Deleted User

    Deleted User

    Guest

    i changed the texture into a TIFF with Alpha Channel. Your Version is much more editable, then the other shader, cause the color value of the dissolve is also animatable. i still miss the emessive value, but i am anyway thankfull for this shader!
     
  33. Deleted User

    Deleted User

    Guest

    i have a problem: i am working on Unity WINDOWS and MAC OSX. The shader works on Windows but not on Unity MAC.
    I also looked in build settings for "switch platform" - its on iOS - and also the emulation on OpenGL 2.0. even without emulation, the shader
    is not working. i just see a bright blinking, when animation material parameter changes somewhere. On Unity Windows
    everything works perfect with the same scene!

    What can be the problem? I need that shader working on iOS

    please help!!
     
  34. bobthefish

    bobthefish

    Joined:
    Jul 7, 2010
    Posts:
    18
    I can't help with that shader but here's my code updated to be emissive, and it also has function to easily change edge colour and width.
    If you want it diffuse instead of emissive, just replace any word "Emissive" to "Albedo".

    Code (csharp):
    1. Shader "Dissolve/DissolveEmissive" {
    2.  
    3.  
    4.  
    5. Properties {
    6.  
    7.     _Color ("Main Color", Color) = (1,1,1,1)
    8.  
    9.     _EdgeColor ("Edge Color", Color) = (1,0,0)
    10.  
    11.     _EdgeWidth ("Edge Width", Range(0,1)) = 0.1
    12.  
    13.     _MainTex ("Base (RGB)", 2D) = "white" {}
    14.  
    15.     _DissolveTex ("Dissolve (R)", 2D) = "white" {}
    16.  
    17. }
    18.  
    19.  
    20.  
    21. SubShader {
    22.  
    23.     Tags {"IgnoreProjector"="True" "RenderType"="TransparentCutout"}
    24.  
    25.     LOD 300
    26.  
    27.  
    28.  
    29. CGPROGRAM
    30.  
    31. #pragma surface surf Lambert alphatest:Zero
    32.  
    33. sampler2D _MainTex;
    34.  
    35. sampler2D _DissolveTex;
    36.  
    37. float4 _Color;
    38.  
    39. float3 _EdgeColor;
    40.  
    41. float _EdgeWidth;
    42.  
    43.  
    44.  
    45. struct Input {
    46.  
    47.     float2 uv_MainTex;
    48.  
    49.     float2 uv_DissolveTex;
    50.  
    51. };
    52.  
    53.  
    54.  
    55. void surf (Input IN, inout SurfaceOutput o) {
    56.  
    57.     half4 tex = tex2D(_MainTex, IN.uv_MainTex);
    58.  
    59.     half4 texd = tex2D(_DissolveTex, IN.uv_DissolveTex);
    60.  
    61.     o.Emission = tex.rgb * _Color.rgb;
    62.  
    63.     o.Gloss = tex.a;
    64.  
    65.     o.Alpha = _Color.a - texd.r;
    66.  
    67.     if ((o.Alpha < 0)(o.Alpha > -_EdgeWidth)(_Color.a>0))
    68.  
    69.     {
    70.  
    71.         o.Alpha = 1;
    72.  
    73.         o.Emission = _EdgeColor;
    74.  
    75.     }
    76.  
    77.    
    78.  
    79. }
    80.  
    81. ENDCG
    82.  
    83. }
    84.  
    85.  
    86.  
    87. Fallback "Transparent/Cutout/Soft Edge Unlit"
    88.  
    89. }
     
  35. bobthefish

    bobthefish

    Joined:
    Jul 7, 2010
    Posts:
    18
    Aww I wish :(
    Nah I have no training so I basically don't know what I'm doing :D

    Yep just copy the code from my post just above, paste it in a new shader file, make a new material, and choose the right shader. Make sure you have a dissolve texture like the one on page 1 of this thread.
     
  36. Martin-Kraus

    Martin-Kraus

    Joined:
    Feb 18, 2011
    Posts:
    617
    It works for me with Unity 3.4 on a MacBook Pro with NVIDIA GeForce 320M.
     
  37. I am da bawss

    I am da bawss

    Joined:
    Jun 2, 2011
    Posts:
    2,574
    I am curious, does these shaders work on fixed function pipeline (eg. OpenGL ES 1.1 - Pre-iPhone 3GS)??

    I know for certain a dissolve shader that works for 2G iDevices exist - take a look at the video below, scroll to 0:48 and watch closely at the airship's destruction :



    This game "AirAttack" was made in Unity, and I bought it on iPod 2G and I can confirm that effect looks the same on iPod 2G.

    So does anyone know how it is achieved in OpenGL ES 1.1 (MBX Lite)?
     
    Last edited: Aug 18, 2011
  38. Deleted User

    Deleted User

    Guest

    Bly the looks of it, a mix between a vertex-based blending shader using an alpha texture. That should be quite quick on iPod2G hardware. It's also how we used to do dissolves on DX7 and below :)

    Edit: A simpler way of doing that effect is just to modulate the alpha at each vertex in a script.
     
    Last edited by a moderator: Aug 18, 2011
  39. mrSaig

    mrSaig

    Joined:
    Jan 14, 2010
    Posts:
    68
  40. I am da bawss

    I am da bawss

    Joined:
    Jun 2, 2011
    Posts:
    2,574
    That's pretty awesome, I would buy it if it works for OpenGL ES 1.1 though (MBX Lite).
     
    Last edited: Sep 2, 2011
  41. Disati

    Disati

    Joined:
    Oct 5, 2009
    Posts:
    111
    Feels good when good stuff are being shared.

    I think what Sicklilmonky meant is that we need some kind of script changing the dissolve variable.

    The live demo looks just how it's supposed to be!
    Did anyone try this on iOS?
     
  42. Andrew.M

    Andrew.M

    Joined:
    Mar 1, 2012
    Posts:
    236
    Last edited: Mar 1, 2012
  43. tomneo2004

    tomneo2004

    Joined:
    Jul 2, 2010
    Posts:
    2
  44. cedrico

    cedrico

    Joined:
    May 4, 2009
    Posts:
    40
    Hey guys great thread, I haven't tried any of these cool shaders yet but would it be possible to have another texture replacing the existing one instead of the cut out effect, if so which channel or slot would have to be modified ?
    THX a lot
     
  45. cryland

    cryland

    Joined:
    Jun 22, 2011
    Posts:
    14
    how to make button or script dissolve it ?
     
  46. Andrew.M

    Andrew.M

    Joined:
    Mar 1, 2012
    Posts:
    236
    @cedrico in fact I just accomplished to recreate that effect and added it to my Dissolve Shader Pack

    Here's a simple preview
     
  47. homer_3

    homer_3

    Joined:
    Jun 19, 2011
    Posts:
    111
    Been trying to get bob's shader working by slowly reducing the alpha of the main color, but I get no effect. Once I get to .6 alpha, the object completely disappears. I'm using the provided noise texture and unity 3.5. Is there something else I need to do to animate it?