hello and welcome back to another Unreal Engine tutorial in this one we're going to be working on the echol on the echol localization effects like you see in games like lurking or stifled I think that's what it's called so I'm going to be working on Unreal Engine 5.1 and we're going to be creating a blank Project based on the first person template so go ahead and leave the settings as is we're not going to be needing starter content we'll call the project Echo also make sure you set the quality preset to scalable unlike me or the actual postprocessor won't work and we can create it so we'll just wait for that to load now once our project's loaded we're going to need to want first start by wait for Shad the shaders but the first thing we want to do before I mainly before I forget is we need to go into our project settings as for this to work we need to enable something here so we're going to search for stencil and custom stencil pass is enabled but we need it to be enabled with stencil which pretty much what this will allow us to do is if we want to outline a specific object in a specific color we can use this so let let's remove that compile save so now that that's done we don't need to restart the engine for that by the way it's okay so for this one we're actually going to be working mainly in this scene not going to change much because it'll make it easier to to deal with so what we're going to start by doing is we're going to be making our different assets we don't actually need that that many but we're going to do that anyway so we're going to create a folder we'll call Echo and inside of it we're going to create a few materials first so the first one will be mcore dark and this is going to be the base material we have everywhere around the scene because we need to have something completely dark without light to have the result that we want so that's how we're going to be doing it but to be fair if you want to have this effect without the light with light that is possible as well even though it's not very interesting next we want a material decal which is going to be the material for the ring we see so we'll just call it ring decal and two more materials one we're going to be calling mcore post for postprocess and we're going to be calling it move this is going to be the one that we're going to be adding so actually maybe add will be more clear we'll call it add and the second one we're going to be calling mcore postore permanent so this one is going to be the default one that we're going to set on our postprocess volume that will never be removed it will always be active and we're going to need one last thing which is an actor which going to be called aore sound generator so I'm just going to be giving you the basis of what I did and then pretty much you can do whatever you want so the sound generator is as the name suggests it's going to to create a sound of the location you spawn it so what we'll be doing is we're going to set it up in the I think actually no we'll set it up in the first person part and we're going to be just simply going to be applying it here once the projectile bounces because that's going to be very simple we don't have to make too much code for it to work pretty much if I remember correctly inside of here we're simply going to add impulse that location we're going to remove well we'll leave the destroy and we'll call our actor here so the first thing we want to do is we'll set up our materials because they have the key components here well actually we can also start by adding our postprocess volume so we're going to add that anywhere in the scene and we want to make sure that we check Unbound because otherwise it's just going to be once we're inside which is not very useful unless that's something that you're looking for so this will leave for now we're going to need it later so back in our content and in the folder Echo we're going to start with our dark material so one of the things while I was working is here we actually have to do this a bit different you would expect something to be dark to be simply a tick here unlit finished but we can't do that because if we do that we actually lose the um ring on the decal it won't actually be visible because I think how the decal works is it's additive on the surfaces so it won't work because this can't have any additions to it so we need to leave it as default lit but to get the same result we simply need to plug this into base color and plug it into specular as you can see we get the same complete dark unlid color that we want so apply this save and we won't be needing that anymore now to make it easier on on ourselves we're actually going to leave everything like this and what we'll do is in the either in the level blueprint here or we can also do it in the game mode we're going to will get all static mesh actors like this and tell them to set the material to our dark material so let's go to our next material next one is going to be our decal now so for the decal we it's going to be pretty simple we'll start off first by changing it to a decal otherwise it won't work so once we done that we want to make sure it's not opaque but translucent because we need need a ring I'm just going to check there's no other settings we need to change and that's all we need so let's get to it so first we want a four Vector which is going to be color which we need to convert to a par parameter which itself will be called color which will be going to base color obviously but also to emissive so it stands out of it and next we're going to make our actual ring so for the ring just want to check something here okay so next up is now the location so for the location we're going to need to get a vector for or constant and convert it to a parameter like with the color and we'll call it location we're going to feed the location into a sphere mask because that's what's going to act as our actual ring so make sure you connected to B not a and for a what we want to get is absolute uh sorry get World position and it it's called absolute World position but for some reason you can't re search for it like that leave it as default and now we need to set up our actual actual radius so we're going to need parameters here as well because it will get bigger or it will expand it won't be automatically big or automatically small so we can press s for the scal of parameter call it radius and another one which we'll call hardness now hardness we don't actually touch but maybe you might want to so we're just going to by default I have it at 97 if you feel like it's better at something else that's fine as well so we want to put this at 150 by default doesn't really matter we then want to do a sign node which is pretty much initially this if we go and preview the node it's just going to be a sphere but if we preview the sign it's going to turn into a ring you can see so it's a bit off fit because that's the size that we gave it but that's going to change later don't worry and then we can clamp it just to create to be sure for safety clamp it between Z and one and to finish we will multiply this into opacity which will then make it that if we stop previewing now it's an actual ring so we can also add well sorry not we not also we actually want to put this which is the value called intensity and for the intensity by default it's one and what this will do is for instance when we want to fade it out it will actually slowly disappear instead of just snapping out of existence also want it to be by default white looks a bit better let's put this at actually 100 so we can maybe see the actual ring and if we put this to .1 it's less visible zero gone so let's apply that and that's all we have to do for the actual ring material so this may look actually a bit small but in reality once we apply to the decal actor it'll look perfectly normal so next up is our other our final two materials which are by far the most complicated ones because they're going to be dealing with the actual outline we'll start with the permanent we're going to be copying some stuff over from one to the other so it's start with it so the first thing we want to do is we want to make sure that it's set to postprocess CU otherwise this won't work so post process and we're only going to be using the emissive color but we actually need to change one variable in here we need to go into at the bottom here look for postprocess material toone mapping we want to change the blendable priority to one output Alpha and we want to remove move is blendable so the reason we do this is because we want to have an alpha here now for the permanent one we're not going to touch it leave it as it is it's not a problem but for the emissive color we're going to put outline here but for the sorry for the add post process that we're going to be doing later we actually will be touching the opacity here because we need to tell it which areas not actually effect so now we're going to be working on pretty much the outline effect and that's pretty much it in this part so let's do that so we're going to need a lot of space here to be fair so we're going to start with a one value here which will be setting to one we're going to then pass this into a blur sample now this blur s pretty much gets in if I remember correctly in local space the different offsets you can have so 01 1 Z Etc so this is going to be pretty much going top down and side views in The View Port we're not talking about in 3D but in 2D here so what we want to call from each of these is a sample scene depth and make sure everything's connected to the pixel offset here so we're going to need four of these so you can copy paste them and they're going to go into well in order pretty much there we go I'm going to need one last one which is going to be here separate and it's going to have a two Vector node so we call it here and once again into the pixel offset we're going to multiply this and we want to connect that to the depth using pixel offset we're going to multiply it by minus 4 and we're going to add now we're going to be adding everything here together once again from the depth the bottom on both of these as well and one last time here and then we can attach this to the end here now if you're looking for more information on how all this works I can leave link to the tutorial I actually followed which is a really good one so if you want to check that out and uh maybe understand more of what I'm doing then please do next you want to add an absolute and for the absolute we're going to multiply and if I remember correctly the multiply we're going to get here is the thickness correct for the actual outline um so we're going to I'm going to leave it at 0.1 because I'm not going to change it we have no point in actually changing it so we're going to do that then we want to call a power node which will then do by two so we're not going to change it so we can leave it like that we can actually do the same here .1 next up we're going to saturate this node and we're going to multiply it and we're going to multiply it by we're going to get our scene depth mode so if the scene depth I'm not exactly sure what it's for but um we're going to divide it by a very large number so if we don't divide this if I'm correct we kind of get very strange how to put it at the edge of the map you'll see a grid if you don't do if you don't divide this by a really large number so I think it's 8,162 is what we want and we want to one minus this with the one minus then we want to saturate it as well and put that into the multiply now right here we're actually going to add something later and that's going to be to have custom outline colors but for now we're just going to leave it here and we'll add that later so then we want to perform a linear interpolate and attach this to the alpha because this is going to be our outline pretty much so we then want to get a scene texture node and we want to convert this to postprocess input zero then attach the color to a and next we're going to need here is going to be the color so if you don't want any particular outlines like a red for an enemy or a yellow for an interactable item then you can just leave this as white so that works fine and then you won't have to add anything here either but we're going to make it so that we can do that so we're going to add the other parts so for the other parts it's pretty simple we're going to call a named reroute node and we're going to call this we'll call it outline color so for the outline color we want to we're going to work well from the start let's say we're going to get in our case we're going to have simply four to start this is going to be our default color so actually there we go we'll just call this default color color just so that we very aware of what it is we're going to add a LP and the L is pretty much going to be a on B sorry we're going to use this and then we're going to have a well we'll leave it at one we won't do any more than that we'll then go and put this into a multiply now in our case actually we want to have this be so we want it to be at one so we want to multiply this by another scaler parameter we'll call intensity which is once again to change the intensity of the color if we need to most of this stuff isn't actually going to be changed I don't think this is even necessary but just to keep to what i' done before that works we'll just keep it next we want to do a SC texture once again and this time we'll do once again the postprocess zero so think of this as just before the postprocess is what you get and we want to add these together so this is kind of the key part if you don't do this as an add or if you do this as a multiply or anything else then the actual what we're going to be doing is adding materials on materials and that's what's going to give us the effect we want if you don't do this as an ADD and you do this as a multiply then you won't actually get the effect that you're looking for it will just look a bit strange with things skipping in and out of existence and only one area being able to appear at once so then I'm going to clamp give it between 0 and one and that will be our outline color so we can call that here outline color and to finish this will be a named reroute as well and it's going to be called outline let's make that a different color it's bit difficult s the difference so outline and we're simply going to call that here so that may look a bit strange here let's just uh start previewing this and stop previewing LOE so right now we have this outline as you can see now we're not done obviously we still need to apply this if I remember well so currently right now this will be the outline for everything so let's try and apply that to our actual box and see if that happens so ins out of our post process we want to look for material and in postprocess materials here we want to add an element and the element we want to add is is actually sorry we need to make this an asset reference and we're going to look for our postprocess permanent selected and we can click the arrow here and we have an outline on everything now I don't know why it's looking a bit strange okay so I'm back and so I was having a bit of an issue as you can see with my um with my actual outline effect so the reason for that is very strangely it doesn't seem to function correctly if you use the maximum quality selection once you create your project so which I find extremely strange um so normally I warned you ahead of the video that you need to put the game in scalable so hopefully that message got through and you didn't run into the same issue as me so right here if I go and now I select my material again and I go and get my permanent outline we can see that it works as intended everything is outlined as it should be and there are no issues so we actually don't need that this the second one so our post process is just this one so next up on the list is we need to make our our second material so the post move or the post add in our case so we're going to double click and open that and we'll start off by copying this because most of it is going to remain almost identical so you could turn this into a parameter that would probably make things a lot easier but in our case we're just going to go with this for now so what we need to do is is we have our outline and we don't need to change anything about that I don't think it's exactly the same but we need to actually work on some changes here so first you want to turn it back to a postprocess and just like with the other one we're going to go down to our tone mapping and material here and make sure we enable Alpha we need opacity especially now disable blendable and put Priority to one we can then apply and so what we're going to do here is we're going to get a scene texture again and we're going to get our postprocess we're going to call a linear interpolate or just L and put it in a for the color for the B we want to get our outline which we made there and for the alpha we're going need to make a sphere mask now because we only want this ring to appear in a sphere mask right so unlike before we don't need to make it a proper ring so we'll start with a location with a parameter here location which we will then plug into a sphere mask once again on the B and here we want to get a world position again right there and two Scala parameters a radius which we'll put at 150 by default and another one which will simply use a vector one where he float and we'll put out 095 so this goes into our Alpha but this also goes into our opacity this time the lur itself will go into the emissive color because pretty much if there is if we add these together we need to make sure that we get what's happening behind with this and if it's not in the mask then we keep what's behind if it's on the mask then we will add our mask on top of it so that's where the opacity comes in and the emissive color will deal with what it looks like so we can apply this and that's our materials done we need to touch them again next we just need to make our actual blueprint so for now this all looks like it's illuminated but we're going to be changing that once we get to work on the actual material well the active component so one thing we can actually do is we don't need any of these and that's going to make it look already more in the amage that we're looking for so if you need to work like this you can always press out three which put in unlit but we don't have the outline now so we'll just leave it like this so currently if we play we see everything with the outline which is it looks nice right but that's not what we want we want it to actually be completely dark and when we move or when we apply a sound with our sound generator actor we then want to actually see everything so to do that by default what we want to do is sorry I actually made a mistake here in the permanent one we want to by default set this to zero that means the outline will be off so here this doesn't look very easy to work with so we'll put in in out three so which is UN now what I did here so the default one here pretty much just think of it as if you want something to be displayed so this is very particular on the case that I had where I wanted a specific color to appear which you haven't set up if we want a specific color then we can use that here and if it was Zero it would appear here only with an alpha that we would set with the custom stencil so now all the work we have to do is inside of our a sound generat so I'm going to go and open that make sure you open for blueprint editor or it should be by default looking like this as well it's fine as well so the first thing we'll do is in our construct script in our construct script we're going to set up our actual ring so to say our decal so to do that we need to get our decal so let's add it here this is going to be our actual outline and I want to make sure this everything correct so first select our ring decal and we want to make sure the size is uniform so I put 100 and 100 on all of them because there is no way to modify the decal at runtime you can only modify it scale so we have to do that so that's why everything needs to be the same here just double checking there's nothing else needs to be changed Noe everything left as is other than that so inside of our construct script we're going to create a dynamic material and this Dynamic material will be based on our decal so call that here ring decal we want to promote this to a variable which we're going to call mi for material instance decal the first thing we want to do here is we're going to set Vector parameter value and this parameter value is going to be called color so we're doing this so that we can set it up here as a variable which is decal color and the reason we do that is so that once we spawn this we can actually tell it to be any color we want so we're going to make this expose on spawn so if for instance we have an enemy we just select it as red also by default we want it to be white otherwise it's going to be a bit weird so with that we can now select any color we want that the the outline to be and we also make it sad it well it's not actually going to be able to apply to the decal to the thing to the thing here because we haven't can't really TI to do that or at least we could but it's been more complicated so we're not going to do that for this next we want to call our location from the decal so call again and we're going to say set Vector PR value again and location and for the location well we're going to get this act location so get actor location and with actor location just plug it into the color and it will automatically swap it and the last thing we need to do is we need to get our decal and say set material and it's going to be set decal material app it like that and the construct script is finished next we're going to go event graph and in event graph we're going to need first things first we need to get a reference to the postprocess material or postprocess volume so we're going to get actor of class and obviously get actor of class will select the first one here and there should only be one so we don't need to worry about that so with our post process we're just going to record record it as a variable here which we'll call Post process volume very simply and for now we'll leave it like that we don't need to touch it next what we want to do is want to get a our material our postprocess material which we going to be adding after so once again create Dynamic material instance and we're looking for postore add this will also be promoted to a variable which will call postprocess material and finally now we're going to do the last bit which is going to be the sound so pretty much we're calling it sound but it's the ring pretty much the size so we're going to create a variable called sound range here it's going to be a float and we're going to plug this in as a Time 0.01 this more about how we write the number on it because it doesn't really matter it's it's whatever you want but we want to make it visible so that we can change it when we spawn so expose on spawn as well and we're going to start by saying sorry so get our decal here and we're going to set relative scale split that and we're going to assign it to all three of these because we want it to be uniform let's just align that so the next thing we want to do is actually there's a few more functions we need but we don't have them yet so let's do that we want a custom event which we'll call ccore expand and this is going to be linked to a timeline later but we just want to be able to call it here we'll call C expand and then we're going to need another function which we'll use for the postprocess material here and we're going to say set vector parameter value and it's going to be location so this is for our sphere mask inside of the postprocess so once again like in the construct we can just grab this paste and apply it here sorry like that and with that we finished our event graph we just need to do one last thing and that is to tell our postprocess volume now we've added a material so to do that we want to get the settings and from the settings we want to what's it called we want to break it so there's a lot of stuff in here but what we're looking for is the postprocess materials so search them in here and add the pin we can then right click and split it which will just turn it into a an array so we can then just add our actual material so make sure use add and not add unique I'm not sure what that would do but I don't think it's what we want so we want to then search for make which will get us a make blendable so make sure you change the weight to one and the object well it's the actual postprocess material that we made so let's apply that here and with that we've now added a material once our sound generator spawns it will add the material to the actual list that we have for instance right here so if we look at the so pretty much it'll be adding it to this exact array so with that we can now move on to our actual expanding decal and obviously not just expanding decal will also be the actual sphere mask as well so we want to get a timeline sorry not up there we want to call a timeline here tlore dcal we call it and we're going to play from start even though play would work as well because we only going to call this once so in my case we're going to set the variables to 1 second we want the length to be one and we're going to have three different things here so the first one is going to be radius the second one is going to be intensity intensity and the third one will be intensity decal so it's just easier to manage these separately which is why I'm doing it like that so we'll start with the radius for the radius we want it to go from 0 0 to one one so we want to then select everything and we're going to turn it into an auto because it's just smoother that way now let's just make it like that if you want to modify this you can it just has an impact on how it appears that's the only difference we'll see so for the intensity we want to do pretty much the same thing but once again the reason we're separating them is if you want to do it separate or different more like cuz sometimes you want the intensity to be a bit smoother in my case I did make some modifications but to keep things simple here we'll just do a basic curve and for the dec inity we actually need to do the opposite we want it to start at one and we want it to go down to zero so we can then also put that in Auto so it moves out so now we have our three floats here and we're going to go into our event graph so the first thing we want to do here is we want to call we want to actually create a function we'll call update radius radius so update radius here and it's going to take in a float obviously which going to be radius now turn that to a float and what we want to do here is we're going to use two of these and we're going to update our decal and our postprocess material and we say set Scala parameter value and in both cases it's radius but I don't know if we can well we can attach like that so we'll just make things simple normally the names are identical so we shouldn't have any issues here so compile and Save and we're going to start by calling that one here so update radius now we're not going to directly plug this here we want this to be our Alpha for a l so for the left we're simply going to call our sound range which is going to be the max range but we also want to have a starting range which will be just like sound range so we actually inverse them that makes bit more sense start range will go here most cases we'll leave it at zero and I'll do it for updating the radius next we want to update the intensity so for that we simply want to get our postprocess here our material and say set scaler parameter value intensity and attach value because intensity is 0 to one we don't need to have a lurp like this and then we're going to do the exact same thing but for the decal which will get a reference here drag it there and into the decal it goes so so now we have our different materials changing as we go and we just need to do our finish so as we did with our decal the actual decal goes VIs visible to Invisible so we can just say at the end here that we want to destroy it now the reason we're doing it this way because we could just destroy the entire actor but I want it to actually slowly fade out instead of immedately destroying it right so we want to have a delay we'll put something like 0.6 and we'll then call a function called well actually we're going to have another function here called custom or custom event C finish so what this will do is we'll have another timeline so let's just call it here the reason we want to do this is that once the Decon expands we don't want to immediately make our vision disappear so we want to have it wait a bit and then slowly Fade Out so do that we'll call another timeline here let's get that TL and we'll call it fade so very simply we'll open it it's going to be 4 seconds when it's Tak it very slow and we'll say intensity again and we're going to go from zero at time but one in value back down to zero at time four we want to select the two and make them have more of a curve so with that we can then move on and we want to Simply call our update intensity again so we're then going to call one last function or to be fair we don't need it to be a function we just want to get a reference to our settings so we'll call both of these again but this time instead of calling add we're going to say remove item want to attach that make sure you do select the same so as you won't be intervening it properly and then we can call destroy actor there we go so we have pretty much finished our setup here oh okay I seem to have made a little bit of a mistake here I'm updating radius that's a bit stupid on my part we want to update intensity that's my bad I'm completely dumb and didn't even see that it is getting kind of late them a bit shouldn't be recording this time so let's try doing that again and and it should Fade Out now so obviously we can't see the ground very well because there's no actual outline to be seen but it'll slowly disappear now with that it is completely functional now let's just set it up so that when the player shoots for instance he will actually sorry let's just move that so the player actually can pick it up even though he can't see let's make it that when these bullets hit we actually call the function let's do that so for the projectiles get it here and we're going to say create oh my spawn actor from class the class we want to select is our sound generator the spawn doesn't really matter we just want to make sure that we get the actual impact point so get active location will work we want to have a de color white we don't want to bother too much sound range we put 500 and that'll work let's give it a try so in front of us well apparently I didn't okay I didn't put it in front of me I'm a bit dumb okay so let's go forwards oh wait a minute it's because okay it's only when it simulate physics so let's actually if it doesn't simulate physics we'll just avoid it and call this here let's do it like that so let's walk forwards and shooting the buts actually spawns our ring so we can actually move around and see things as and behind us it slowly disappears if we don't do anything one thing to note is if you shoot as you can see if I walk through with the gun and walk out it's no longer visible because we're no longer in the actual effect of what we shot so one last thing we can actually do or I'll show you how to do is to make it that it reacts to your voice because although it's not necessary it's kind of an interesting thing to know how to do so let's get that it's rather simple we simply need to add a value called an audio capture now the audio capture works pretty much just like that we don't have to do anything else we can just call Audio envelope value and this is going to be when you speak so one thing to note I'm going to turn something off here because other you're going to hear an echo and I'm going to hear an echo and I don't want to hear that it's a bit annoying if you don't want to hear yourself when you talk you need to disable this and what we'll do here for instance we will print just to give you an idea how it works I need to enable auto activate otherwise it doesn't work there we go so now as you can see it's actually capturing sound if I stay quiet it'll be almost silent obviously because it's not completely silent but if you talk louder or makes more noise then it actually picks that up so you can use these values to adjust that and make it well make sound so in my case what we'll do is we'll just say we'll just make a few variables we'll say if it's above so here if it's Superior to 0.04 now obviously this is dependent on your mic so we'll then make another variable which we'll call enable voice now this is because we don't want it to be calling every time we make a sound above that because it'll be constantly spamming and that's not very interesting so we want to kind of give it a CO down so we'll then call spawn actor from class and the spawn actor is going to be our sound generator sound generator we'll get active transform and with the active transform we're just going to say let's say 500 once again we'll add a small delay of 2 and then we'll say sorry we actually need to say you are by default true and untrue we want to say you're false and once the cool down or the T the delay is up we want to reenable it so let's try this so if I talk as you can see we have the actual sounds appearing outside so it's pretty useful when you want to actually find what you're looking for now that we have the gun we can shoot and walk around as well and it's pretty now obviously they need some fine tuning I think it's linked to my other microphone and that's why it's not perfectly adapted to what you guys for instance here so with that thank you for watching and I'll see you guys in the next tutorial or next showcase goodbye