Unity VFX Graph - Level Up Effect Tutorial

so what is going on guys i'm gabriel again currently working on a game called rabbit style links below for more and today we are going to see how to create a level up effect super useful for your characters whenever they are evolving we are going to use vfx graph and shadowgraph how to time this right and now to create a glow so without further ado let's jump right into this and as usual this wall project is available on my patreons page links below and before we start just make sure that in package manager you have installed visual effect graph and shadow graph and then indeed in preference you have invisible effects experimental operators slash blocks turned on right so we are going to start by creating the visual effect graph with right click in a folder i'm going to rename this to vfx graph underscore level up tutorial and we can simply drag and drop it to our scene and press the edit button to open this up so for this level up effect we are going to apply particles to this character the way we do it is by using a position skin and mesh block we are going to need a skidded mesh information a property so let's create one connect it here and then and then we need to use a set position so you can tell vfx graph the transform where is the transform of our character in this case the bones but we need a transform position block as you can see we have the input for the transform which is going to be the bones once again so let's create a transform property for that and connect it right here and for the position well we can use the git attribute position which represents the position of each particle connect like this and then to the set position and if you save this for example this character comes with two skinned rash mandarins one for the joints and another one for the surface for the body the head the arms and the legs for example i'm going to use that one so i'm going to drag and drop it this skin and mesh render to the vfx graph for the transform we cannot drag and drop it but what we can do instead is use the vfx property binder in this plus sign we are going to say that we are going to bind the transform the name of the property its transform it should be the same as this property right here and the target well it's going to be the bones in this case the root of the bones drag and drop it it becomes green and by the way don't forget to select your character and turn on read and write option right here in the import settings and then press apply and as soon as i stop this and then press play you may not see it because the particles are way too big but they are indeed spawning at the surface of the character which is great if you want to learn more about this a minute tutorial a while back links below by the way are up here in the screen so our next step now is to improve this a little bit for example let's increase the capacity to 1000 or even more bounds we can say to manual and we want a single burst instead up here in the spawn of 30 particles for example as you can see they are spawning exactly from the character these are going to be a few quick adjustments for example let's double the velocity of the y axis and down here what we can do is let's select the default particle for the main texture and control the size with the set size for example you can say it's random in the inspector if you select the set size between 0.1 and 0.01 for example we just need to say that the set size of our life is multiply instead of overwriting any previous value and then we can say that the curve goes from big to small for example and now we get these little particles coming out of the character great let's add some color to this for example with a set color and then create a property particles color for example and we can say that this is going to be a bright orange we can increase the intensity so it close oh this set color of life we actually need to set it to multiply the composition in the alpha composition and once we do it here we go we have some very bright particles coming out of the character anyway our next step now in this case is to play these particles along with the level up animation of this character as you can see i have an animator up here and this animator only adds an idle and the power up state and it only goes to the powerup state when the powerup property is triggered nothing much nothing special on this character i also have a powerup test script on this script what we have is something super basic we have two variables one for the animator and the other one for the visual effect in this case the level up by the way i'm using up here this library so we can have access to the visual effect graph scripting options i have a boolean to know if it is leveling up or not and the only thing i'm checking is if there is an animator if we have pushed the fire button and if it isn't leveling up then we triggered the property of the animator the power up property we check if there is a vfx graph if there is that we play simply the vfx graph that's how simply it is we trigger the power up animation and we play the vfx graph this is attached to my character i have already assigned the animator now we just need to assign drag and drop our vfx graph that we just created and if we press play if i press the fire button whenever he is leveling up there's some particles coming out or at least he should because we need a delay as you can see and it's very simple to use a delay let's for example go to the vfx graph if we select the spawn block we have this loop and delay options in the inspector what we want to do is go to the delay mode and say before loop how much time we want to delay well let's create a property for that a float 0.6 in my main 0.6 in my case so it matches with the animation save it and if i fire this up as you can see now every time he levels up some particles come out that's a great step we can spice this up for example we can make our character glow it's a very interesting technique and very simple but with a few limitations let's with right click create a black shader graph or elite shadow graph i'm going to rename this to glow tutorial double click to open it up and i'm going to say the target in the graph inspector is universal i'm going to turn on allow material over right so you can control these options in the inspector i'm going to say it's transparent and that's it now we only need a fresnel node and the color property let's say the color property is hdr with a white color as default and we can multiply these two together and then connect to the emission and that's it if you want you can create a float to control the fresnel power i'm going to set it to 2.5 it controls the thickness the radius of the thread node you can save this shader then we right click we can create a material out of this shader and this is a quickest solution there's other solutions but for example we can select our character the skin and mesh renderer more specifically and in the materials option we can add another slot drag and drop the material we just created as you can see it's already taking effect the fresnel and in here we can choose whatever color we want for example we can say it's going to be like this but since we are going to animate this because we want this to match with the animation right well we are going to leave the intensity close to -10 or -5 as long as we don't see the glow that's fine now here's a little trick that you can do so we are going to open the animation window i have the character selected and what i did to control the animation is open this and with ctrl d i duplicated this animation as you can see it comes out of the model of the 3d model and this is the animation i'm using i'm going to delete the one that i created now because i already did this so this is the animation i'm using and this is the animation i have assigned to the power up state and in this animation down here i have already animated the let me select the character i have already animated the glowing material as you can see the only thing i did is press this red button so it starts recording in the beginning it's going to be with a very low intensity as long as it isn't visible minus 10 for example or even more and as it gets closer to the climax of this animation i increase the intensity of the color i hold on to that intensity for a few seconds and then i switch it off by going all the way to negative values of the intensity so so we don't see the glow as you can see in the curves the curves are much easier to understand what's happening there's only one drawback you cannot choose different colors because this is art code let's say in the animation but i'm sure you will find a better solution this was a quick very quick solution so you can animate the color of the material of the glow and now the cool thing is that when you press the fire button we get this cool level up animation kinda very nice very sweet now it's all a matter of spicing this up so for example we can copy this particle system ctrl c ctrl v we are going to create some particles that goes towards the character we are not going to need the skin and mesh or the set position we can remove it and in terms of speed we also don't need this block for now let's create the set sphere position sphere so the particles start all around our character let's increase the radius as you can see it's small and it's at the feet at the bottom of the character to 3.5 and push this by a value of 1 in the y axis so it's centered with the character and then for the velocity we are going to use the set velocity from direction and speed spherical exactly we also need to have set this in the y axis the center and it's going to be random the velocity between minus 10 and minus 20. and in this case we want for a brief time to have particles going towards the characters so we are going to use the constant spawn rate instead of a single burst with around 200 particles as you can see there's a lot of particles going on and in this case we also don't need delay what we really need is to control the duration of this particle system so in the inspector let's say the loop count and loop duration are constant and we can even use this delay but we need to subtract a small value like 0.1 or 0.15 so it stops pounding particles before the climax and as you may have noticed the particles go through the characters so we can fix it in the update particle by using a kill sphere anytime a particle touches this sphere it will die we also need to have set this in y and then decrease the radius to 0.3 for example and as you can see now every time the particles go towards the character they die whenever they touch this sphere now let's stretch these particles with a set scale for example we want to say it's 1 in the x and 4 in the y but now as you can see they are not going towards the character that's a very easy fix in the orient block we can say it's a long velocity exactly like this looking good if we test this out quickly as you can see now we have a much more interesting anticipation before the climax it's all a matter of adding details to these now for example we could add a simple bright flash whenever he levels up whenever the climax is reached let's copy this particle system for example control c control v we only need one particle in the single burst we don't need velocity short lifetime 0.15 0.2 we don't need skin and mesh but we need the set position block let's offset this by a value of 1 so it's centered with character you could create a property for that controlling the inspector by the way and then for the size we want to use something big like four and five and the color is a little bit too bright so let's multiply it with a smaller volume like 0.1 and as you can see now we get a bright flash whenever we reach climax we can turn on new soft particles so it becomes softer whenever it touches geometry and that's pretty much it if we test this out you have now created an awesome level up very simple but quite punchy and catchy from here you can create a bunch of different type of level up effects but at least now you know how to set that up and how to use a glow for your characters so that's it guys this wall project is available on my patreon page with all of these variants and with many more assets as well links below in case you are interested i want to take this moment to appreciate each patron and as usual a quick shout out goes to the top tier patrons which are 3d sorcery adrienne briad risky el shante carvajal austin schneider aviate tobali brandon ollie claudy creepy dubidu danielle mrazek desmond tang dieg marks deutron edward chai frank striker kills walter goblin black guillermo trinidad yeon julian john nix casey miller cannon anselm little tsai maxim mark anu meters braganza mograph tech nat sims hoytsk pradeepson kwenta at radioactive bullfrog remezal tabas revenant games sergio oliveira twente very soother will use will polio and in good dads really appreciate your support guys throughout last month you guys are awesome you guys rock i hope you have enjoyed this video and 21 watch this i hope to see you in the next one thanks bye [Music]

Channel: Gabriel Aguiar Prod.

Views: 52,214

Keywords: Unity tutorial, vfx, vfx graph, vfx graph tutorial, unity, visual effect graph, unity visual effect graph, unity vfx graph, unity visual effect, tutorial, shader, shader graph, unity shader graph, unity shader, fx, graph, visual effect graph unity, unity tutorial, level up effect, power up, unity level up, level up, unity power, unity power up, unity effect, level up tutorial, unity vfx tutorial, unity visual effects, visual effect graph tutorial, shader graph tutorial, level

Id: tnUPngBEnQ8

Length: 16min 9sec (969 seconds)

Published: Tue Jun 28 2022