Unity Shader Graph - Liquid Effect Tutorial

hey kids you want some potions that's right today we are going to see how liquid in a recipient is done in unity it's a pretty cool technique to fake a potion for example or water inside a bottle as you can see i've enjoyed a lot this and made a few variations a few more potions i just want to say that these videos are possible thanks my patrons they keep the channel going and they have access to all of my projects as a reward alright so let's see how we can create liquids by the way we need three things a recipient 3d model the liquid shader and then a script to control the liquid shader to create a wobble effect so i'm using unity 2020.3.11 with the universal render pipeline and in the package manager i have installed shadowgraph and that's all we need for any recipient you will have the exterior mesh the recipient model i also have a cork but what's important here is the specific mesh for the liquid which will have the shape of the recipient i have here another example where as you can see i have the shape of the recipient for the liquid as you can see the recipient is a shell with faces inside the mesh okay so that's what i have here in unity i only added a very simple material for the cork it's a lit material with a brownish color for the base map and well for the glass if you want to create something transparent super simple you can also create a lead material set it to transparent the surface type and then you can decrease the alpha in the color and you will control the transparency right and then you can play with the metallic and smoothness and you will have kind of a glass thing going on now for the liquid we want to start with a blank shadow graph we can rename it and then double click it to open it up now in here in the graph inspector the target is going to be universal and in this case the material if you don't want light to influence the liquid you can set it to unlit the surface can be a pack and we need alpha clip and two-sided as well once you get that what we are going to do if you think about it if you rotate a bottle of water you will notice that the liquid will kinda stay parallel to the ground to the world so we kind of want to align our liquid to the world axis always we can do it by subtracting the position of the object to the world position and this outputs a vector 3 which means if we split this we get access to the x y and z axis and if we connect it to a step node which is a threshold that will return 1 if the input value is greater or equal than the edge value that's why we see black and white it's either 0 or 1. and let's try with the x it's going to look weird we want to connect this to the alpha and we can save the shader and now we want to create a material out of this shader with a right click and if we assign it to the liquid as you can see it's vertical and album but if we use the y axis the g value of this plated node now you will notice that we get this horizontal cut which is exactly what we want and if you rotate this equal notes that the cut will always stay horizontal that's exactly what we want because it's always facing the y-axis of the wall no matter how much you rotate it now this input value of the step if we control it we will control the fill option basically of the liquid which can be a float a property that we can create and set it to a slider by the way between 0 and 1 and connect it like this and now and in the inspector if you play with this you will notice that doesn't go below alpha of the liquid that's because we need to remap this field we need to say that the x the zero that comes in we need to say that it's going to be minus 1.2 for example the y is fine it can be one but the x instead of zero we want to output minus one dot two and this will increase the range of our slider now between zero and one it will represent the right amount of fill one is full zero is empty great and to add color to this now we actually are going to use something very interesting we are going to use this branch to control the color we are going to need two colors one for the side color and the other for the top color and basically if this is true what we are going to connect here in a moment it will be the side color but if it's false it will be the top color and what we are going to connect here is a very simple thing called is front face is it rendering a front face then assign the side color if it's rendering the back face then assign the top color that's why we are using two-sided so we can see the inside of the liquid mesh now we can simply connect this to the base color of the fragment function if you save it yeah now it's black because i forgot to set the side color for example let's set it to white and alpha at 100 we can also set it to hdr let's do the same for the top color and now let's save it and now in the inspector for side color i'm going to select a darker blue a little bit darker and for the top color i'm going to select brighter blue yeah something like this seems fine now as you can see we already have kind of a leakage shader the only thing that's happening here or missing actually is the script that can control a liquid according to the way we move it or rotate it a script that can simulate a basic liquid motion and you can find that script in the description it's a script from minions art an awesome artist i cannot stress how awesome it is and the amazing things she come up with pretty cool so once you go to that link and download the script make sure it's simply wobble you don't need the dot cs and we want to attach this to the mesh of the liquid to the mesh that has the leakage shader this one as you can see you have some controls over here that you can play with what's really really important is if you open up the script you will notice that it's trying to communicate with the shader and it communicates through two floats called underscore bubble x and underscore wobble z so we basically need something to control the rotation in the x and in the z axis and if we go to the shader we have a few nodes that can do it we want to add something here before we use only the y axis we want to rotate this with a rotate about axis in this node the input option is for which position do we want to rotate well we want to rotate the position of the object of the vertices of the object in the z-axis so let's set it to 1 90 degrees not radians but degrees and if we multiply these with the set float in this case wobble z and then connect it to this add down here now if you save it and go to the inspector you will notice that we kind of tilt the liquid as you can see that's exactly what we need look at this it's awesome and the shader will control this it will kind of simulate a liquid motion that's great now we just need the wobble x and it's the same thing but first don't forget to copy the name we want to rename the reference remember it's underscore wobble z otherwise the script will not detect this float and now we can copy these nodes right here copy and paste it with ctrl c and ctrl v we don't need to repeat this position of the object and we want to instead rotate in the x and not in the z we also don't need the bubble z because we want the vowel x float that we can create and then don't forget to rename the reference as well and then connect to this multiplier lastly we just need to add these two together just like this and then add it down here we can create a group if you select all of these nodes with right click you can name this to wobble group cool if you save this now at this point you have pretty much everything done we just need to fix this faces issue this is happening to me because the liquid mesh is intersecting with the potion mesh so i'm going to scale the liquid a little bit down just like this and now it looks perfect cool i'm going to press play and as soon as you start playing with this if i select the potion and rotate it or move it the script is continuously updating those two variables and it seems like it's a fluid you know it's faking the fluid [Music] it's an awesome result that's pretty much it as you can see i've enjoyed a lot this and made a few variations a few more potions they are all available on my patreon page the links in description your support will help me a lot in the channel as well it keeps things going on i want to say thank you to each patron and as usual a special quick shout out goes to the top tier patrons which are a-lac frost alex burke jones irie koftikin bradford errant cristobal velasquez vault david croup david maid lars donald thompson dewey trump goblin plug hostile mars game jan denis paul jonathan paris josh mccarmick jules clane congar al tangirell lyannos matthieu shatter nat sims oitsk radioactive bullfrog rickard cruz a known enigma verisuta and in gooda your spot really means a lot and it's very much appreciated thank you guys and thank you everyone for watching this video i hope you have enjoyed consider subscribing and liking and i hope to see you on the next video thanks bye [Music]

Channel: Gabriel Aguiar Prod.

Views: 97,690

Keywords: Unity tutorial, unity effects, game effect tutorial, unity magic effects, unity particle effects, unity particle tutorial, unity game effect, unity vfx, vfx, tutorial, unity particles, unity, unity graph, shader graph, unity shader, shader, unity shader graph, liquid, fluid, water, potion, liquid shader, unity liquid, unity fluid, unity water, unity potion, shader graph tutorial, shader graph liquid, liquid effect, shader graph water, unity fluid simulation, unity liquid shader

Id: tI3USKIbnh0

Length: 11min 40sec (700 seconds)

Published: Tue Jun 15 2021