Create Parallax Fog and Dust Particles | Unity Tutorial

hey guys so I'm going to show you how we can take a scene that looks like this and change it to this environment particles and effects can make a really big difference in how your game looks first I'm going to show you how to create these simple dust particles and then how to create this rolling fog using a simple Shader let's go let's start with the dust particles create a new particle system and make it a child of our main camera and that part's important because there are only two ways to get environment particles to display across your whole level and that's to either stretch them over your entire level which you would have to size correctly for every single scene or you can attach the particles to your camera itself which is easier more scalable and more performant first let's turn on texture sheet animation if you have a simple Sprite that you want to apply to your particle system you don't have to create a new material for each and every one we can simply change the mode to Sprites and I just want to use a simple circle with a soft Edge and there we go by the way if you like the art assets you see in this project feel free to download them from the link in the description they are free for you to use in any way that you want even commercially and I've got some circle textures included in that pack if you need them now let's set the duration to 10. make sure looping and pre-warm are checked set the start lifetime to 8 and the start Speed to 0.05 and the size will range anywhere between 0.15 and 1.2 let's make start color B random between two colors and change the alpha on the first to 10 and the second one will do 20 and change the max particles to 100 so that we don't get too many in the emission let's change rate over time to 8. in shape let's make it a box and let's drag up the scale so that it's a fair bit bigger than our camera frustum 110 on the X and 80 on the Y should be fine for my settings but you might need to change yours based on your camera zoom settings let's turn on color over Lifetime and add around 60 percent let's add an alpha marker so that we can change the alpha to zero on the last marker that way once each particle has reached 60 of its life it'll start to slowly Fade Out feel free to do something similar at the beginning if you want it to fade in as well but I'm just going to leave it as is and finally since this is dust it'd be nice to get some just random movements going on so let's turn on noise and I actually find that the default settings are quite nice for this and in the renderer I'm going to adjust the order and layer so that these are drawn over top of my ground and character so 10 should be fine for me here just for example and I'm just going to crank the emission up for a sec so that it's easy to see now you'll notice that if we hit play that this is actually stupid because when we walk around the particles just follow us around which is definitely not what we want so even though we've attached this to the camera we need some way of ensuring that each individual particle is not anchored to its spawn point in any way and that once they're spawned in they can just freely kind of float around and we do this by changing the simulation space from local to world now if we hit play you can see we're getting the results that we do want I'll go ahead and change the emission back now now here's the really cool part if you were using a perspective camera you can Parallax these particles really easily so let me switch from orthographic to perspective and that's going to mess up the zoom so I'll go to my virtual camera and change the camera distance to 25 which you can see all that really does on perspective is it moves the position of the camera on the z-axis now you can accomplish Parallax layers using orthographic with code but if you use a perspective camera which I do for my games you can achieve natural Parallax by simply moving things around on the z-axis for example I'm just going to move my background to a 10 and let's go back to our particles and change the position on the z-axis to be 25 the same as our camera distance settings and if I hit play you can see that the background actually looks like it's in the background and the particles look like they're on the main layer and that's because of literally how they are layered in the scene which is a lot easier to see if you turn off 2D mode in your scene view so I'm going to go ahead and duplicate these particles twice one will be used for background particles and one will be used for foreground particles that appear really really close to the camera for the background particles I'll just change the start size to be between 0.1 and 0.5 and we'll change the order and layer to -30 to make sure that these are drawn behind all our scene elements except for the background which I have set to -50 and finally change the position on the z-axis to be 35. the higher the number the farther away they will be from your perspective camera for the foreground particles I changed the start Speed to 0.1 and the start size from 0.65 to 1.2 I also changed the scale on the shape since these are literally closer to our camera we don't need them to be as big for my settings 90 on the X and 60 on the Y is fine and let's change the position on the z-axis to be 10 nice and close to the camera don't forget to change the order in layer and we'll draw these in front of everything else including our main particles so let's do 25. now when we hit play we get this nice layered effect with our particles obviously you can add even more layers for more Parallax depending on what look you're going for next let's handle the fog but first I'm hoping to get 100 likes on this video because that will help boost my self-esteem so go ahead and click that like button I'll wait [Music] okay cool now fog create a new Sprite lit Shader graph or choose unlit if you don't want them to be affected by 2D lights and if you don't use 2D lights it's really not going to make a difference for you so in order to get a nice fog look we are going to use a simple noise texture you can press space on the keyboard to get this create node functionality to show up this simple noise is what's going to be what displays as our actual fog you can use your own texture if you want to do that instead you would just plug in an exposed texture 2D here instead of the simple noise so to give ourselves control of how the fog looks we want to be able to control the scale here so let's create a float called fog size and give it a default of one and make it a slider between 0 and 500 and plug that into our scale input here now I like options and I'd like the option to control the color of the fog if that's what we want to do so first let's create a new color here called fog color and give it a default of white with an alpha of 30. so if you want to basically tint something in Shader graph you want to use the multiply node you multiply one color with another and it applies a tint so let's multiply our simple noise with our fog color to actually display this let's drag the output into the base color and we only want the alpha to go into the alpha so let's split these colors into their four individual colors and drag the alpha into the alpha input now we want to get this fog scrolling around a bit otherwise it's going to look boring as hell and if you want to be able to scroll and repeat any kind of texture in Shader graph you'll do that with a tiling and offset node plug that into the UV input on the simple noise node you can see that tiling allows you to kind of stretch the repeated texture and the offset allows you to infinitely scroll through it so we want to set this up so the Shader Scrolls through this for us and to do that we use a Time node and we could just plug that in but it would be better to be able to control the scrolling speed in the inspector so let's set up a vector 2 called fog speed with a default of 1 on the X and 0 on the Y and let's multiply the time by the fog speed and plug that output into the offset input and save your asset so we have our Shader here you can right click that and create a new material which will create a new material with that Shader already applied to it now we need to apply this material to something so let's create another child object on the camera set its Z position to 25 so it'll be on the main layer and let's add a Sprite renderer to this game object so that we can actually apply a material to it set its order in layer to 10 and we want to stretch this to be bigger than our camera frustum or our camera's view so let's make it 40 on the X and 25 on the Y now this will give us an error right here but first let's add a square to the Sprite slot and we can just search for a square and if you have all the proper 2D packages installed you can click this little eye icon to display any hidden graphics and select any one of these so our fog is showing up despite this error the error doesn't really matter however if it bugs you the way that we can get rid of it is to add a texture 2D to our Shader graph and call it main text Sprite renders specifically look for a material within the Shader called underscore main text spelled this way exactly you don't even need to plug this into anything but if we save you can see that now the error is gone play with the values until you're happy and actually it can be really annoying to work with shaders this way where it looks all choppy in the scene view so to smooth this out let's click here and check always refresh so that the scene view updates more often so that we can properly test these effects without hitting play but now we want to test this and when we hit play you can see that this is again stupid because the fog is following the camera as opposed to being in World space like our particles are so how do we fix this well that's where this UV input comes in handy here using this we can feed it different positions so if you add a position node and make sure the space is set to world we can plug that into the UV input here but I like shaders that can perform multiple functions so I'd love to add the ability to give ourselves the option between World space and local space because who knows maybe you really only do want this Shader to be in one particular room or scene we don't want to have to create a whole separate Shader for that so let's just expand the functionality on this one to do that we're going to add a bull that we can check in our inspector called World space and set the default to true now to handle the logic of a bull in a Shader we need a branch node and our Bool gets plugged into the predicate input and the outputs of our logic is what gets plugged into the true and false on the branch node so let's plug this world space position node into the true and make one more that's in object space which is going to operate as local space and plug that into the false now you can plug the output of the branch node into the UV input on our tiling and offset node and you'll notice that this drastically affects the size of our noise texture which is fine we'll just tweak it to our liking Again by massively decreasing the fog size and now you can see we have this nice World space fog texture let's duplicate this twice like we did with the particles but if we want to change change material settings for any of these individual game objects will need a new material for each one so let's just make one material for each of them so that we can tweak them as we like I believe that in unity 2022 there's something called material variance but I'm using Unity 2021 because I like the long-term support versions so for me doing it this way is fine for the background let's change the Z position to 30 and the order in layer to -30 and maybe slow down the fog speed a little bit and this is further away so we'll need to scale this up to 60 and 35 and for the foreground a z position of 10 and an order in layer of 25 should be good let's also change the fog speed here a little bit as well now if you play you can see these nice layers of fog at different distances from the camera which looks really nice let me know if you found this video helpful by commenting down below like share subscribe hit all those buttons to let YouTube know this is a video that should be shared with more people thanks guys see you in the next one I want to thank all of our generous patreon supporters yakub yondak zondercast Darren perine throbbing wind Fontaine weight couch and xioma head on over to our patreon page if you want early access to all our videos monthly Alpha builds and more

Channel: Sasquatch B Studios

Views: 5,078

Keywords: particles, unity, unity2d, unity tutorial, tutorial, sasquatch b, sasquatch b studios, create dust particles, create fog particles, create fog shader, fog shader unity, 2d fog shader unity, parallax particles unity, parallax effects unity, environment effects in unity, unity how to improve game mood, unity how to improve game atmosphere, unity parallax FX, unity parallax dust and fog, unity parallax fog, unity what is world space, unity how to, unity beginner tutorial

Id: 3z3dmYaKNzU

Length: 11min 24sec (684 seconds)

Published: Thu Mar 23 2023