How To Highlight An Object With An Outline In Unreal Engine 5 (Tutorial)

hey guys and welcome back to another unwrenching five tutorial in today's video what we're gonna be going over is creating something which looks a little bit like this where we're gonna be creating a highlight and outline object material so we can highlight objects like so so we can actually have an outline of them as you can see here so this would work great for x-rays or anything so you can see them through walls or anything along those lines early and it's very easy to customize and set up and change for your own personal games as well so i'm just going to get right into it so without further ado let's leave this code and i'll show you how i've done it so the first thing we want to do is we want to actually create our material so to do that we're going to control space to open up our content browser right click and create a material and i'm going to name this one highlight matte like so open that up straight away let me just move this onto crack monitor like this and the first thing we want to do is in the bottom left down here we have the details panel for our material we want to change the material domain from surface to post process and then we can leave everything else the same on here so you'll notice we now just have the emissive color under the highlight mat like so as that is what we want to create the actual outline of our object and next we're going to go straight into just creating the different nodes inside of our material and now this is quite a lot and can be quite confusing to write the head around initially but bear with me and we'll try and get through it so we're going to go quite far to the left just to give ourselves plenty of space so the first thing we're going to get is we want to get a scalar parameter so to do that we can hold down s and left click to get it like so there we go and then what we're going to call this is line render width so as you can guess the first thing we're going to be setting up is the width of our line so we'll have that there like so and we're going to give this a default value of 0.3 so the values i'm using are the ones you saw at the beginning of the video in the preview and it's just ones which i personally like but you can obviously change all of these different values to get it set up perfectly for how you want then straight out of this we're going to go into a multiply node so multiply like so and what we want to multiply this by is going to be the view size so we're going to right click and get view size coordinates like so so the view size but under the coordinates then after this we're going to get a seal or keel i can't remember how to pronounce it but the c e i l it is seal i've just looked at it is actually pronounced seal and after this we're then going to get a clamp so clamp like so now the minimum default for this we want to be one any maximum we want to be two and this is now going to go straight into the multiply node simply like so and that is what we need to do for this bit here out of the multiply of this we want to go into another multiply so go straight out into multiply and the b of this wants to be the scene texel size like so going straight into there like this let me just move these over to keep it organized like that and then out of this multiply once we've got all of this bit here set up we want to go into some masks and appends and more multipliers before we start going into these scene textures so again this can be a bit confusing but bear with me so we'll come out of the multiply here straight into a mask node and the one we want to get is we want to get the components mask under math there so component mask and you'll notice it says r and g as we have the values of r g b and a but rng selected we want to untick g so it's only r it's obviously red green blue and alpha we just want the red then we're going to duplicate this and connect that into the multiplier as well so we now have two of them with this one being just the g like so and then the top one is going to go into an append vector and same with the bottom one but into its own append and this one i'm just going to put into b like this and then for both of these we want another scalar parameter so we're going to hold down s left click this one i'm just going to leave the default name as parameter connecting that into b and a like so soon i have something which looks like this then in between these appends what i'm going to do is get another scalar parameter like so again leave this with the default name as it is as that works for me and then these are going to go into some multiplies so out of the append we're going to get a multiply and that'll be for both of them and multiply for both like this and again this new scale parameter is going to connect into both of those multiplies like this and then we want to do some addition so before we do that we're going to scroll up and we want to right click and get the screen position nodes under the coordinates once again and we're only going to be using the viewport uv instead of the pixel position so out of viewport uv we're going to get another component mask like so leaving this as the default of r and g and then we're going to hold down a left click to get an add and we're going to do that four times we have four different edition nodes like so and then the mask rg wants to go into a of all of these additions so we're going to connect that into each one like so so into a of them all like that and then the b of the top one wants to be this first append node that we have here so depend of the r let's go into there the second add wants to be the multiply of the first node then the third add wants to be b of the second append and the final and fourth add wants to be the multiply of that second multiply like so so i'm also just going to double click these to get some root notes just to keep it looking nice and organized as this can get a bit messy quite quickly so we want to make sure we're keeping it organized and easy to read so this will also help you to understand fully what's going on so you can see it a lot easier so i hope this helps for you to understand what connects where let me also just move these about a bit so it looks a bit nicer like so and now we're about halfway through the code so let me just move this over a little bit more and again we need a bit more space than this so what we're going to do now is right click and get a scene texture like this then under the scene texture id in the details panel for it we're going to go from scene color to custom depth like so and we're going to leave it as custom depth and then we want to select this hit control c and hit control v to duplicate it another four times so we now have five in total like this i'm gonna move these down a little bit like that and then we have five of these nodes and four additions pretty much what we're doing is the top one doesn't connect into anything but the other four have the corresponding edition nodes going straight into the uvs so the first add goes into the second scene texture uvs the second goes into the third the third goes into the fourth and the fourth goes into the fifth like this so we now have something which looks a little bit like this now what we're going to do is you want to do some subtract nodes so we can right click and get a subtract like this and we can duplicate this three times so we now have four in total like so similar to the addition nodes we had before it and the top scene texture custom depth wants to go into the subtract so we want to get the color going into a of the subtracts so we're going to be subtracting from this like so let me just move those out a little bit out a little bit actually and then the color of the other custom depths wants to go into the corresponding subtract notes so color goes into b like so basically just line them up like we did with the addition notes as well and again you should now get something which looks a little bit like this then we want to add the subtract so again this is quite a lengthy process it might be a bit confusing but once you finish the whole thing you can just go over it and look at it a bit more closely to see what we're doing so once we've actually subtracted these from each other we want to add them and the reason we're adding them now is because we want to get all these different values into one value so we're going to hold down a once and twice to get two addition nodes connecting the a and b's like so of these subtracts like this and as i said earlier we want to get these into one value so we're going to get one final edition node for these so we're then going to add those additions like so so now we've basically condensed all of these values into one value like this and let me actually move this out quite a bit further once again so i keep moving it but i just like to have more space then once we've got all of these addition nodes we want to divide this so we're going to come out of this and get a divide node like so and what we're going to be dividing by so b we want to have as the edge angle fall off so we're going to hold down s left click to get a scalar parameter naming this edge angle fall off like so like i say connecting that into b there like this and the value i'm going to have is this the default value will be minus 100 like so out of the divide we're going to get a subtract node if i could spell it correctly subtract there we go and we're going to leave b as a default value of one so we're not putting anything else in there it's just subtracting one and then we also want to put this straight into a clamp as well again like we did earlier minimum and maximum again leaving us at default values of zero and one and now we're nearly at the end this last bit is going to be the main section where we're going to be deciding the color and actually setting up as the post process so what we're going to do first is right click and get a scene texture once again this time we're not going to change it to custom depth but we're going to change it to post process input 0 so now it is actually going to be post process the color of this is going to go into a lure so we can hold down l and left click to get settler connecting a and color there and then b we want to have as the glow and color so if i have to move this up a little bit what we can do is hold down three and left click to get a constant three vector ie a color and we're gonna change this color to be whatever color you want i personally want to have it as a yellow like this as i think that's gonna work best for me so you can obviously set it to what you want and once you've got that what i'm going to do as well is right click the arrow and convert it to a parameter and i'm just going to name this one highlight color and this just means we can then change it later on more easily if we wanted and it also gives us access to the values of r g b and a i read green blue and alpha which we do need to have so we're going to drag out the red and we're going to make float 4 like so and it's a 4 because we want to have all four values here and we're going to connect the red into x green into y blue into z and alpha into a perfectly like so because rgb xyz a and a that makes perfect sense and the result of this is going to go into a multiply so let me actually just move this over a bit once again result will go into a multiply node like so and that multiply is going to go into b of the lap which we created earlier but what we're actually going to be multiplying this color by well that wants to be our outline glow intensity so we actually know the intensity of the glow that one's pretty self-explanatory so once again we're going to hold down s left click to get a scalar parameter naming this one outline glow intensity very simply like so and i'm going to give this a default value of 0.5 as i want it to be not too intense but i also want it to be fairly intense to have it shown easily in the tutorial now in the game i'm creating i've actually set it as 0.05 just so it's not too prominent again just for the purpose of the tutorial i'm making it a bit more intense and this is going to go into the b of the multiply like so once again multiply going into the b of the lab now the alpha of the larp is going to be our clamp which we created earlier simply like so connect this over here and this lap is now going to connect into the emissive color of our highlight material and this should now be it completely done and set up and working for us so let's hit apply and see if this works so let's also save this now like so now this might not look like much at the moment in the preview but this should look different once we actually get this onto an object in our scene so we can now minimize this and how do we now put this onto objects so what we need is a post process volume as this is obviously a post process material so you should have one by default even if you don't i'm going to create a new one anyway so we're going to go to the quickly add the project up in the top left up here we're going to go down to volumes and create a post process volume down here like so and now in here what we're going to do is search for materials open the post process materials add an array element click choose asset reference and we want to choose a material which we have now i named mine highlight matte like so perfectly like this and now if you want this to affect all objects in your level what you need to do is give it an unbound or infinite extent like so we're going to take that which means this will affect everything in the level however if you only want to affect it whatever's in the box untick that and just place it over what you want it to affect for example if i wanted to only be this cube i can just place it over the cube like so there we go like this now you'll notice that's not doing anything and that's because we haven't actually set up this cube to have a highlight on it so if we set the cube what we can do is remove the unbound search there and search for something else and that wants to be render custom depth and we can just tick that there like so now if we were to unselect this you'll notice that's still not actually been highlighted and i think the reason for that will be i've actually forgotten one tiny thing if we go back into our material go to param underscore one that we have here going into the multiplies i left that as a value of zero however it was meant to be minus one so my apologies i did miss out there and we just press apply now like so and it still looks like it's not working entirely and i wasn't too sure why this was happening so i decided to just make the box a little bit bigger and there you go it now works so i'm not sure why because it was completely within the post process volume however making it bigger did make it work as you can see it's now got a faint outline on there like so so what i might do is make this bigger and more intense to again show it off better so we go in here and we can do change the intensity to let's say one apply and see what that looks like you'll notice it's now a lot more prominent like so and what we can do is also go over here to change the width so let's also put it as one hit apply see what it looks like and just we now get something which looks a little bit like this and actually i've just realized why it wasn't working it wasn't to do with the size of it not covering the cube it was the camera the camera wasn't in the post process volume i completely forgot that for some reason this is the first thing i've done all this morning so you have to excuse me for forgetting that but the post process affects the camera that is inside of it so the camera actually has to be in it like so which is why if we were to untick infinite extent or ticket sorry so it is infinite extent we can now see it from anywhere and it would be affecting these other cubes if these ones to have render custom depth on them as well like so so now we get something which looks like this and this is now working perfectly for us so sorry about that at the end if it wasn't too great that was just me forgetting some basic stuff so really sorry about that but we have got it sorted like this and again you saw you can just change these values like this so what we can do as well is if we were to right click on our material create a material instance and then use that one in the post process volume instead what we can do is i was using this one then change the material over like this so we're now using the instance we can open the instance and we can just change the values from within here instead hold on let me just open this like so we can now just change the values in here so we can tick all of these and then just change them so we can increase these like this to have it perfectly how we want so it's a lot easier to change like this i'm just going to reset these all back to default though like so so i think that'll be for this video as we've done everything we've wanted to do this is very easy to customize as well so again you can change the color and the intensity and everything which i've just shown you and you can also change when these will be highlighted so if you wanted to just be when you're close enough or when you're hovering over it or anything like that that's very easy to set up i won't be doing that in this video as this has already gone on for quite a bit of time so sorry about that but if you do want further videos explaining that or you just want personal one-on-one help you can just leave a comment down below or message me on discord or email anything along those lines and i'll be happy to help out or create a video and again what we've gone over today is we've created a highlighting and outline object material in which it's going to create something which looks a little bit like this and you can obviously see it through walls like this as well so you know where things are so for example this might be good if you want to highlight players if you've got like an x-ray or anything along those lines so thanks for watching this video i hope you enjoyed it and i hope you found it helpful and if you did make sure to like subscribe down below so thanks for watching and i'll see you in the next one [Music] you

Channel: Matt Aspland

Views: 70,851

Keywords: ue4, unreal engine 4, unreal engine, tutorial, ue4 tutorial, unreal engine 4 tutorial, how to make a game, how to, blender, unity, games design, ue5, unreal engine 5, unreal engine 5 tutorial, ue5 tutorial, highlight, object, outline, hover, close, enough, post process, post processing, material, texture, ue5 highlight object, ue4 highlight object, highlight object, outline object, mesh, static

Id: rGqlReFObYQ

Length: 17min 36sec (1056 seconds)

Published: Mon May 16 2022