How to Make a Dissolve Shader Unity (Updated 2023)

let's learn how to create a really cool dissolve effect in unity we're going to cover how to make the Shader and how to apply it to a material and object in your game first off in order to do this you're going to need to be using the universal render pipeline or the high definition render pipeline if you don't know what that means which one you're using or which one you should be using check out this other video that I made or I explain it all and then come back to this one now to make a dissolved Shader we have to attack two things one being the transparency of the object and the other being the glowing Edge to make it look like the material is disintegrating from the edges so let's create a new Shader we're going to right click go to new Shader graph urp because I'm using the universal render Pipeline and then we're going to select lit lit just means that we want our material to be affected by light if we make this as an unlit Shader we actually won't be able to make that cool glowing effect on the edge because anything that glows by definition is emitting and using light first let's tackle the transparency aspect so we don't want the object to just disappear to go from here to not here that wouldn't really be a dissolve effect so we know that there has to be some sort of transition happening between the object being completely opaque and completely transparent there has to be and in between so if you're wanting to change the transparency of an object you're going to be manipulating the alpha Channel but you might notice there is no option currently for Alpha so we have to go into our graph settings and make sure that Alpha clipping is on and you'll see now the two nodes have been added Alpha and Alpha clipping all Alpha means is level of transparency and it's on a scale of zero to one zero being completely transparent and one being completely opaque so if you'll notice if I bring the alpha value below the default Alpha clipping value the object completely disappears which this is not what we want to control the transparency we need to plug something in to the alpha channel to explain how this really works I'm going to plug in an image texture that I have I have this black and white picture of a rose that will showcase how this works so if I plug this into the alpha Channel Unity looks at all of the values of this and converts it into transparent and non-transparent values depending on how light or dark the colors are so as soon as I start to drag the clipping value up from zero all of the darkest parts of the image are the first to go transparent and as I drag closer to one the Grays and the whites start to go as well until I'm taking in all of the values of the photo however this is a dissolve effect so we want something that looks pretty organic that's why you see a lot of game developers using the noise node for this think of this as a mathematically generated image because as we just saw you could plug in your own image if you wanted to but the nice thing about noise is that there is a wide variety of color variations there's a lot of that in between gray going on here so as we affect the clipping threshold the transition between opaque and transparent is super smooth and control rolling this clipping value is what's going to give us this effect so we're going to want to be able to control this in code so we're going to want to bring this value into a node and since we're working on a scale from 0 to 1 here this has to be a float value or a floating decimal number now let's move on to the glowing Edge first things first if we want something to glow on our Shader we're ultimately going to be plugging something in to the emission node however it has to be smart we need to find a way to know exactly where the edge of the transparency stops if we add a color straight into the emission node it affects the whole Shader and overrides the base color that we set up and we only want to know where the edge is so what we do is take our noise node and run it through a step node I'm not sure why this is called a step node versus a threshold node which is just a little more common in the design space but that's what it is and it's doing something very similar to the alpha clip node over here it's converting the values of the noise into on or off values or transparent versus non-transparent depending on how dark the color is only problem here is that as I adjust the alpha clip value the step value isn't adjusting with it and the step value needs to know exactly where the alpha clip value is in order for this to actually look like an edge the step value needs to be aware of what the alpha clip value is at all times so we're going to connect the two values instead of these values being independent I'll be able to control both values at once so that the edge value is constantly following the transparency value now once I do this you might notice it looks like nothing has changed and that's because well the alpha clip value and the edge value are exactly the same so both of these are running at the exact same time in the same place so we actually can't see the emission value for the edge because the transparency effect is clipping it off so we need to add a teeny tiny value to our float before we plug it in to the step node so instead of these values being exactly the same The Edge value will always be ever so slightly larger than the alpha clip value revealing our glowing Edge and when I say teeny tiny I mean teeny tiny we're talking .01.02 value Here and Now now we can see that our Shader effect is working beautifully and we can actually apply this to a material and see how it shapes up but before we do that I want to update my colors I messed around a little bit but I eventually like the idea of having something fiery so I want a glowing orange Edge but currently the edge color is just the default white so what I need to do is multiply my step node by a color node so I'm going to plug in the out value into my multiply node that I'm going to create a new basic color node and plug that into the in and when I do that you can see that all of the white parts of my step node are now taking on the color that I've chosen now I can just plug the multiply node into the emission slot and we're good to go I messed around with the color a little bit more and now that I'm mostly happy let's make sure to click that save asset button at the top and head back on over to our scene view now now let's create a new object and a new material on that material I'm going to change the Shader to the one that I just created and then drop it onto the object now that you've saved your asset you should be able to find it by name under the Shader graph section here I've named mine dissolve and there it is now let's just drag and drop that onto our new object and while this is looking pretty cool I still have the question how do I control the level of dissolve so if I look at my dissolved material here and look at it in the inspector it's not giving me a whole lot of information so to control this value this is actually our main float value back in our Shader graph so I'm going to head back to Shader graph and turn this float value into a property and name it dissolve strength now if I save that and go back if I click on my Shader now I can see that that value is in the inspector or I can control it from the editor pretty cool right and while that is how to make a dissolve Shader if you want to learn how to control the is through code follow me along to the next video

Channel: Rigor Mortis Tortoise

Views: 2,796

Keywords: shader, unity, shader graph, dissolve, dissolve shader unity, unity material shader, materialize shader, dissolve shader, unity tutorial, game dev, game development, shaders, shader tutorial, shader tutorial unity

Id: U60U9KC7jxk

Length: 8min 5sec (485 seconds)

Published: Fri Jun 30 2023