2 Simple Vertex Displacement Shaders in ShaderGraph | Unity Tutorial

using shaders we can manipulate the geometry of objects to get some really cool effects in this video you're going to learn some basic operations to apply to vertices to get some cool effects like moving the entire object or a breathing effect hey Chris here from lawn Academy here to help you yes you make your Game Dev dreams become a reality by diving into vertex manipulations and Shader graph I think it's important to understand the basics of what we're talking about with vertex manipulations before we start getting into more complicated things like wind on a cake while these are simple and you might be tempted to use something like a tweening library or an animator to get the same outcome this lays down the foundation that will build on in some future videos to do things like putting waves on a plane or moving a cape with wind or trees with wind and I've personally used the animator a bunch of times to get these exact same effects but it's really cool to see them working in a Shader we'll start off by creating our Shader graph by going to create Shader graph urp lit Shader I'll just name it vertex displacement because we're going to play with some different options on how we can do vertex displacement if we double click that that opens up our Shader graph node editor up here at the top left we have the ability to create input parameters at the top right we can adjust the settings of the Shader you might not have those we have Blackboard and graph inspector in case those don't show up for you right now we're not going to change any settings in the graph inspector so I'll click this button to get rid of it over here on the right we have two different sections vertex and fragment you can see in the fragment that's where we're going to set up base color normals metallics movements emissions and ambient occlusion today we're only going to apply the base color you can apply the same processes to allow you to input different textures for the normals metallics and all this other stuff the vertex is the interesting one for us today we're going to be playing with the positions specifically and manipulating the positions of each vertex how the Shader works is for every vertex on our Target object it's going to execute whatever code gets generated by this Shader graph pretty important distinction that we only know about the specific vertex that we're dealing with at a given time and I'll get into why that's important in a little bit because we want our Shader to be able to represent a texture let's add a base map and a base color property the base map will be a texture 2D I like to name them in this way because it allows us to very easily retain our textures that we assigned when we're coming over from a different Shader using the same naming convention for example the default Erp lit Shader or all of the default Erp shaders call the base texture the base map and for the base color we'll make that a color we can just drag That Base map into our node graph drag over on this little red dot into the empty space It'll ask me what node do I want to connect to we'll say a sample texture too deep and now we can see the sample texture 2D node we're going to also drag the color and on that output we're going to drag into a multiply node drag the rgba of the sample texture 2D to the multiply and then the multiply out to the base color it looks a little bit weird with this being black so we'll open up that graph inspector again select our base color and give a default color of white now we can use basically the same workflow that we're accustomed to by assigning a texture and some color to this material that uses the Shader you'll see this sphere cube and cone thing already have a testing material using the universal render pipeline lit Shader I'll change them over to using the Shader graphs to vertex displacement which is the Shader we just created we see the base Color Works basically as we expect it to do cool we'll go back to the Shader and let's start making it do something something we frequently use the animator for that we could use a Shader for instead is to have an object move back and forth I'll press space to get prompted for creating a node and I'll search for time we want this thing to move automatically on its own so the time is exactly what we need we'll drag that into the empty and create a multiply node so to go into the a property and I'll press space again get prompted for which node do I want and say position I'll change the space to object space and drag that to the multiply B we can see in the preview that it's moving over time back and forth perfect and connect the out of the multiply to the position let's see how does that look so that didn't move our object instead it's like scaling it up and down why does that happen over here we have multiple space options for the position and remember that this is calculated for every vertex on our object so every vertex what we're doing is multiplying its current position by a value from negative one to one so that makes kind of sense that it would go down to be completely invisible become inside out and then go back to its original state probably instead we want to just add the position to our current position foreign getting it to move around but this Shader isn't very customizable because now all of our objects will only move this way we can't change the direction or how fast they do this if we want to do that let's create some new inputs make a vector 3 movement Direction and we'll multiply the movement Direction by the sign time and then add the results of that into our object's current position we set the default value for movement direction to be one on the X we would expect it to only move on the x-axis cool and if we set the value to be more than one it'll move Farther Along on the x-axis what about speed though all these will always move at the exact same speed instead of using sine time what we can do is multiply the time by some speed value and then input that into the sine function the reason that we get this kind of back and forth movement is any value ever pass into the sine function will always give you a value between negative one and one that's some trigonometry you maybe forgot about in your math classes I'll set the speed to be 1 by default and then let's take a look at how it looks right now it looks the exact same as we saw before which is expected but we can now increase the speed cool we can also change the direction and they start moving in all kinds of different directions great just for fun let's take a look at the space we have object view World tangent absolute World in most cases if we're trying to manipulate a particular object we're going to want to use the object space because we want to move it relative to itself but potentially you might want to move something around in the world that doesn't exactly give you the result we want unless we're actually at the origin why is that because we're taking the vertex position in World space and moving it around some based on the time and movement direction we really want to move the object relative to where it currently is you can kind of think of this as the same as using the local position and the position properties on a transform let's leave this Shader alone and create a new one where we can play around with a little bit different options instead of creating a new one from scratch I'm going to save this vertex displacement as and save it as vertex displacement 2. that's a cool trick if you want to keep your Shader or use it as a base for a new Shader let's remove the movement Direction we'll keep our time multiplied by speed into a sine function and then let's multiply by the normal that's under input geometry normal Vector again because we're dealing with a particular object we want to use the object space normal vector we'll then add in this multiplied amount to our current object's position and map that back to the vertex position outputs and a normal is just a vector pointing out from the face of this plane we'll change our Shader to this new vertex displacement and we'll see we get a very similar result to what we had before except now you can see unlike the box it's not just scaling up and down we're actually moving the faces of this box based on the normal Direction so we're not just scaling it up and down the sphere looks more or less the same as we saw before but as we get different input geometry it looks a little bit different you can see when we have hard angles we get detachments to the bottom of the cone and all the sides of the cube we end up with holes in the mesh because we have hard normals like that the mesh doesn't stay together properly so that's something to consider if you're doing vertex displacement based on normal directions really hard angles don't end up showing up very well or you can end up with holes like that if you only wanted an object to like grow slightly bigger how could we modify this to prevent it from going like backwards well remember that sine gives us a value from negative one to one we're multiplying by a normal Vector so really anything that's negative we want to get rid of anything positive we want to keep there there's this cool node called remap which defaults to exactly what we want we want the in minimum maximum which is negative one to one for sine so we're saying that's what we're expecting to get in we want to remap that out to be from 0 to 1. perfect we'll put that into the multiply node a multiplied by that normal vector and see what happens cool now they go back to the base scale scale up and then back down that's how you can get like a cool breathing effect on some objects if you want to adjust the amount that it moves we can add in a new input we'll call it grow amount and set the default to be one we'll drag that into our graph drag the output to a multiply node and multiply it by the output of that normal Vector times the remap in our scene right now it looks the same but we can increase the grow amount to two I think it's much bigger and of course we can still play with the speed we can get a nice little subtle movement here it's important to note that when we're doing vertex manipulation like this the base object position needs to still be within camera otherwise it gets cold because of the fustrum full strum if it's not in view of the camera the camera doesn't render it that kind of calling so if you're doing very large displacements on small objects you may run into some weird scenarios where the object doesn't get rendered I encourage you to take what you've learned here today and use it to apply new cool effects with vertex manipulation I think that's the best way to get a better understanding of the basics that we've covered today this should be a really good foundation for you to be able to jump in and do things like applying vertex and manipulations based on Textures or noise if you want to see more cool tutorials like this and maybe even applying wind to our fire Cape make sure you've liked and subscribed to stay up to date when those videos come out and if you want to support this channel you can go to patreon.com academy get your name up here on the screen or just click join or super thanks right here on YouTube get a shout out to the awesome tier and some other cool perks too at the awesome tier there's Gerald Anderson Autumn K Matt Parkin Ivan rulin iffiopolis and Fernando and at the tremendous tier there's Bruno bozich and at the phenomenal tier there's Andrew Bowen thank you all for your support I'm so incredibly grateful

Channel: LlamAcademy

Views: 13,524

Keywords: Unity, Tutorial, How to, How to unity, unity how to, llamacademy, llama academy, video game development, development, shadergraph, shader, shader graph, shader graph basics, basics, introduction to shader graph, shader graph beginner, beginner shadergraph tutorial, beginner shader graph tutorial, vertex, vertex displacement, move vertex shader, vertex shader, vertex displacement shader, vertex move shader, move object shader

Id: MbD6ZTupmws

Length: 10min 49sec (649 seconds)

Published: Tue Apr 25 2023