Seaweed or Fish Animation Using Vertex Wave Shader Graph - Unity Tutorial

[Music] hey everyone it's been a long time since last video and in today's video we'll show you how to create a vertex wave animation using shader graph this shader graph has been brought to you by my friend andre vasquez so thanks to him for this this vertex animation can be used to animate maybe seaweeds fishes or even flags so without any delays let's get started and it's worth to mention that we will use the sine formulas to shape the waves using the sine formulas allows to create realistic waves and here is also a reference if you want to go deeper in understanding the sine waves this shader can work on both hdrp and urp pipelines but i decided to go with hdrp scene and i've added some volume effects like the visual environment i made it greater in sky i i set a gradient sky to a gradient from cyan to black to imitate or give the feeling of underwater scene let's start by applying the shader to a basic shape like capsule for two reasons first to understand the concept of the sine waves also because some imported models might have a different accesses than the normal unity accesses so let's create a capsule then let's create new material vertex wave mat and create new lit hdrp shader graph vertex wave apply the shader graph to the material then apply the material to our capsule let's open the shader graph and start by creating a position node to gain access to the vertices of the object so change the space to object then we want to do a wave a sine wave on the y axis so we need a split node to gain access to the y axis the best sine waves can be created using the multiples of double pi so one pi is 3.14 so double pi is 6.28 so we create a multiply node and we set the b value to 6.28 then we create a new flow to control the multiples of the double pi and let's name it the height wave frequency then drag that to the a point on the multiply then let's multiply the results with the y-axis since we want to do a movement first for something like a seaweed it will move on the y-axis if you want to do a fish animation it should be on the z-axis because it will move on the depths of the object not the height of it let's group all those nodes and name the group height wave then simply to create the wave we add assign node and link to it the results of multiply and then we link that to the vertex position let's save and see what happens on the scene as you can see the model has totally disappeared from the scene and that's because we calculated the additional wave which will be added to the original position of the vertices so we forgot to add the original position of the vertices then we will add to it the wave value so let's create a position node and set the space to object then use an add node to add the wave to the original position of the vertices then link the results to position in the vertex section now if we save and hit play we will notice that when we change the frequency the height wave frequency it will move the vertices in all accesses at the same time but we want only to move the vertices on the x-axis along the y of the wave movement so to fix that we go back to the shader graph and we split the position node to gain access to the x-axis then we re combine the results using a combined node again and now as you can see the vertices moving on the x-axis only but i'm moving that manually but we need it to move automatically over time so let's go back to the shader and create a time node then we need to control the speed of the vertices movement or the speed of the wave so let's add a new property called wave speed then we multiply that with the time then we add the results before the sine node so now as you can see the vertices keeps moving over time automatically and you can control both the wave speed and the height wave frequency and to control the threads of the wave we simply can create a new property a new float called amplitude then we multiply that with the results of the sign but as you can see now all the vertices are moving which is not logical in the case of the seaweeds or the grass we need only the top part of the model to move while keeping the bottom of it stable or without any movement to do that we need to mask the vertices on the y-axis so let's go back to the shader graph and create this mask create position node using the object space then use a split node to gain access to the y-axis then use a smooth step node to control where show the wave on the game object so let's create two new floats the first one is the min mask and the second one is the marks mask to control where the wave should be visible on the y-axis then link both the new floats to the min and max and link the y-axis to the int of course the white areas means where the wave will be shown while the black area it will mask the wave so in our case the top area should be white and the bottom area should be black and the seaweed or the game object will move on the upper side only then we can apply that mask using a lerp node to layer between the original position of the vertices and between the waved ones so let's create a new position node using the object space not the workspace i made a mistake here then we learn between them using the mask we created by linking the mask to the t at the lerp node then we link the results to the position of the vertex as you can see here in the preview only the top side of the game object or the model is waving and now as you can see we reached a satisfying result where the wave is masked at the bottom side of the game object or the model now we have only one final problem if we copied this capsule three times and moved it on the z-axis all the capsules will move exactly the same way which is unrealistic to solve this issue we can add additional wave on the z-axis at depth wave so let's go back to the shader graph and repeat everything we did for the height wave with only two differences the first one is to change the space to the world then we will use the z-axis to do the wave all other things or no and or nodes are the same we just needed to create a new float to control the wave trends or frequency on the z-axis by creating a new property called depth wave frequency then we add the results of the depth wave before the sign save and go back to the scene now change the frequency of the depth wave that will randomize the wave on the z-axis and gives randomization to the waves on the z-axis which gives the seaweeds or the model that's moving a lot of variations and more realistic and logical results i've downloaded two models from sketchfab one is seaweed and the other one is the fish then apply the same technique to create this nice looking vertex wave shader graph and as you can see we can control everything freely to reach the desired results we can control the speed the height frequency the amplitude of the wave in addition to the depth frequency how the animation is masked based on the min and max height of course if you wanna apply a materials or a texture to the shader simply you can add sample texture to the node then link it to the albedo or the color of the shader graph and that's it for today's video if you found this useful don't forget to hit like subscribe on the notification bell so you don't miss the next tutorial of course this project is available to our dear supporters on patreon henry chen dmitry jablowski joan lynn huang edward vadias paul de ruras alexander schwetz supreme bose we john fishman xiaorun lee has prax hedgehog andre pires jim bacholo ortz young alejandro randaz wing chuan chain mark digital pinot beer cms justin gibson dream charter ken masuda ravio christopher mansi claude ua leave the manual cheneys easter the sky lord panda owl brian forman zhenyang rami hanano jose enrique mohammed aiden pirachambonchem fu rts shaharbar dimitri vasily parker nelson james valentine and jack crystal thanks for watching and till next video see you soon [Music] you

Channel: Binary Lunar

Views: 8,734

Keywords: unity tutorial, unity effects, game effects, unity particle tutorial, unity game effect, unity shader graph tutorial, unity shader graph, shader graph tutorial, unity shader tutorial, unity shaders, vertex shader, unity vertex shader, shader graph vertex displacement, unity vertex animation, unity vertex animation shader, shader graph vertex, binary lunar, vertex wave shader graph, seaweed wave animation, fish wave animation

Id: f0fWMHcbe20

Length: 12min 50sec (770 seconds)

Published: Sun May 30 2021