SIMPLE CARTOON WATER in Unity

so one of the requests we get the most is to do a video on how to create water in unity and that's with many things in game development there are about a billion different ways to create water from realistic water with refraction to a more cartoony look of course all these techniques are great if you've been working with unity for a long time and want to pour pun intended a lot of effort into making the perfect water for your game however I think most of us probably just want to get some darn water working so in this video we'll have a look at how to create a water shader in what I think is the simplest possible way this should also helped act as a solid base if you want to look into expanding the effect with stuff like reflections refraction sine based waves or in normal maps but before we get into it this video is sponsored by hosting er if you've ever thought about creating a website or hosting your game on a server I really recommend you check out that different web hosting services they are extremely fast very affordable easy to get started with and provide a lot of value in their different solutions and that website builder will make everything a lot easier for you trust me building a website from scratch can be something else but what makes this really cool for game hosting is that they also offer cloud hosting services which means that you can store your or your users game data in the cloud get 82 percent off for web hosting and a free domain included and use the coupon code practice for an additional 15% simply click the link in the description to get started also our friends from game dev unchained are hosting a really cool event it's called G ducks and it's basically an online game development conference I think this is such a cool thing since events like GDC can often be hard for the average developer to attend both because it's often very expensive and in another part of the world so instead G Ducks is going to be fully online and freely accessible the event will have three days of talks or live streamed which will include plenty of time to talk to other developers anyway just thought you guys should know about it if you think it sounds cold we'll have a link for that in the description now let's get floating so first of all you need to make sure that you're using unity mm 19.1 or later and that your project is set up to use the lightweight render pipeline if you don't know how to do that I'll of course have a link to where you can learn how in the description now let's go ahead and right-click in our hierarchy here and let's create a 3d object plane and this is going to be the base object for our water I'm just gonna go ahead and scale it down and kind of move it up and above some of the other objects here let's go ahead and rename this to simple cartoon water let's also go to our project and create a new shader and let's create a PP art graph let's call it cartoon water and hit enter and to create a material based on the shader that's right click on it and go create material and we can also call this cartoon water let's take this material and drag it on to our plane and that's pretty much all the setup we need to do I'm also just going to show you my lightweight rendering pipeline settings just so if something isn't working for you you can try to replicate these one thing that I've noticed is that working with transparent materials is a bit weird when Cascade is set to 2 or 4 so for now I'm gonna leave this at no Cascades let's then double click on a cartoon water shader to open it up in shader graph now the first thing that I'm gonna do is change the preview here from a sphere to a plane so I'm gonna choose custom mesh and search for the plane here and select the default plane I'm also going to go to our master node here and click on the little cog and change the surface type from opaque to transparent and now we're ready to add some notes and the first thing that I'd like to do is give our water a base color so let's go to a blackboard and let's add a color let's call it base color let's make this a bright blue something like that let's drag this in and link it to our albedo and right away you can see that our water changes color however having water that is only one color is of course not so interesting so let's go ahead and add some ripples to do this we'll hit space and search for the Voronoi node this is a very interesting type of similar andum noise and it's perfect for ripples since it creates all of these weird-looking cell that if we distort them a bit we'll look like ripples in water in fact let's try and do that now so if we adjust the angle offset here over time we can get a really interesting effect to do that let's create a time node let's hook this up to a multiply node in order to be able to control the speed of these ripples so that's go ahead and actually create a vector one for this let's call it ripple speed and let's just default it to something like point one drag it in and hook it up to our multiply and let's take the multiply over to our angle offset and right away we can see that they are slowly changing let's go ahead and bump this up to say 1 and we can now see how the different cells are kind of moving around we can also adjust the cell density here that's how many cells are kind of packed together so you can see we can increase or decrease that in fact let's go ahead and create a property to control this so let's again add a new vector 1 let's call this ripple density and let's default it to something like 7 let's drag that in hook it up to our cell density and clean up our graph a bit here there you go the next thing that I want to do is kind of tighten up the edges of our Voronoi currently everything is very blurred together and I'd like to bring out more contrast in the Voronoi in order to really show these lines going across so to do that let's take the output of a Voronoi and plug it into a power node and for the power here let's try and set that to something like 5 and now we really start to see how this looks like ripples in water let's just quickly create a property for this as well so up here and now the vector 1 let's call it let's call it slimness and we can just default it to 5 let's make some space here drag in that ripple slimness and hook it up and I think at this point we're ready to start mixing together or ripples with our base color however in order to do that we probably want to give a ripple some color other than just a solid white so let's again go up here let's create a color property and let's call it ripple color for this one I'm gonna choose as the mode HDR just in order to allow us to control the intensity Ripple's let's set the color to a bit brighter of a blue and let's also give it an intensity of say one we can then take the ripple color and multiply it into the output of our power node so let's go multiply and multiply that with our ripple color and we can really quickly start to see how that looks pretty cool and let's then add that on top of our base color so let's take the output of our base color into an add node let's have the ripples go on top and there we go you can kind of see how we've created this cold looking ripples in the water and if we simply go from the output of an add node into the albedo we can see what that looks like when overlaid onto a plane and that is really the base of our water effect let's also decrease our alpha to something like point eight just to make the border a tiny bit see-through and with that let's try saving this asset and going into unity and voila we actually have some fairly decent looking cartoonish water and everything is done with just these few notes you can of course select the material and try and play around with the base color as well as the ripple color in order to get a nice blend between the two but I actually think that the default settings here are already looking quite fine however one thing that I think is a bit boring is the way that the Voronoi is currently moving it does seem like the water is flowing but it does so very uniformly let's go ahead and add another layer of distortion to this using a radial shear so if we go into our cartoon water here you can see that our bar enoy node has a UV input and this means that we can go ahead and create another node here called the radial shear this is going to go ahead and kind of distort a Voronoi by rotating it around a center point now I'm just gonna set the strength of this to something like one by one but you can see how really quickly that makes the effect much more interesting to look at and if we save that and go straight into unity I think that already looks much much cooler you can definitely play around with adding multiple layers of noise like this to your waters stand out so our water is looking pretty cool now however the plane is still completely flat and as you know water kind of moves around a bit so let's try and add vertex displacement to make this effect more interesting to that that's open up shader graph again and on top of everything we have going on here let's try and create a gradient noise let's go ahead and set the scale of this to something like five you can of course created probably for that if you want and as you can see right now this noise is completely static so let's have it move over time we can do that really easily with a tiling and offset node sets hook that up to the UV of our gradient and as you can see we can now control our noise by simply moving the offset of our tiling an offset node in fact if we go ahead and update this over time so let's add a time node and let's take the output of this time node and it's multiply this so that we can control the speed in fact let's go ahead and create a vector one here let's just call this wave speed let's default it to something like point one let's drag it in hook it up to a multiply node and hook a multiply node up to the offset you can of course control this on the X and the y independently if you want to be able to control the direction but for me I just like it to scroll in any direction here so I'm just gonna go for both at once and as you can see right away the gradient noise is now moving across the screen so this point we can take the gradient noise and we can multiply it into the normal vector of our object in the case of our plane here the normal vector is the vector that points up so if we multiply it into the up vector we can distort the plane on the y axis so to do that we'll simply create a normal vector node and this is going to be in object space and we'll simply multiply this or multiply that with our gradient noise and then we can add that so we'll go into an add node here on top of our current position so on top of the vector position here and that is also in object space so we simply add that on to the normal position and taking the output of that so that it's the distorted position after our waves have been applied and dragging in into the position input of our master node now that is going to go pretty crazy in the preview here I'm just going to go ahead and load in a plane again so we can see this working on an ordinary plane and that looks pretty good if we try and just move this over a bit there we go and save this asset and go into unity we can indeed see how the plane is being shifted on the y axis and our water now looks way more realistic in fact if we go ahead and add another object on top of our water here so I have a tiny rubber duck we can see how the water is kind of shifting up and down this duck yay that looks really cool and that's pretty much it for this water effect now again there are 8,000 things that you could do to improve this water you could do reflections and refraction you can add foam whenever the water intersects with objects such as where it's hitting the dark right here in fact you can do that really simply using the same technique as shown in our force field videos so if you haven't seen that definitely check it out and yeah there are just a lot of opportunities for you to customize this and make it your own I definitely encourage you to do so however this should definitely act as a solid base that's pretty much it for this video if you enjoyed it make sure to subscribe and ring that notification bell so you don't miss the next one also don't forget to check out hosting her for fast web hosting solutions simply click knitting in the description to get started on that thanks for watching and I will go change my shirt also supposed to think hey do you want to do it yeah you should do it alright thanks all of the patreon supporters who donated April and a special thanks to infinity PBR Sybok mommy Dennis Sullivan Chris Shane Cleveland fight basil basil basil basil Merrifield Lincoln Chang Luna said Roulin Daniel to Sonic Constantinus corinthis Naoki Misaki Gregory Pierce Rob fern dr. poon moon Erasmus Kiril Swedish ski Tim I've hauled the back and Tyson Knopf ski you guys know you know what I can't I'm not authorized for that you have to do that you guys Rock

Channel: Brackeys

Views: 405,150

Keywords: brackeys, unity, unity3d, model, texture, beginner, easy, how, to, howto, learn, tutorial, tutorials, fix, tip, game, development, develop, games, programming, coding, basic, basics, C#, water shader, water, shader, shader graph, graph, cartoon, hostinger, game water, vertex, voronoi, ripples, waterripples

Id: Vg0L9aCRWPE

Length: 13min 26sec (806 seconds)

Published: Sun May 19 2019