Image Effect Shaders w/ShaderGraph - Unity Tutorial/Showcase

hello anybody in welcome I'm Christian for my sign and this is a tutorial slash showcase of my image effect shaders so I've been working on this I had an idea we had eye pencil sort of pins were drawn shader and so I did some research and how making image effects and I've come up with a way to create image effect shaders using shadow graph which is something I couldn't find any information on so this is just a simple pencil shader it's got some features at Riina's using a couple of different pencil textures that i have here and then just uses that the brightness of that pixel to draw that was different textures it also has some function on you for adding colors as well as if i generate current density you can see it also has this sort of pencil draw and look to it be colors as well and that can all be you know you can affect the saturation and stuff so yeah that's what I've done and there's also this some stop-motion style jitteriness stuff to it but it sort of changes it look works better when I'm not recording when I'm recording it has a bit of glitchyness but but I'm not it looks quite nice and it can give that look of them every frame being drawn differently it would look better if my textures would didn't tile as much so if i zoom in you can clearly see the repeating textures the whole way through so that kind of breaks the illusion a little bit it would look much nicer if you had higher resolution textures so um I've also made some other ones and I'll show you how to use them but this is the one I'm using currently it uses the render features of the board rendering our universe arena pipeline so I'm using a little outline at what outline trader which gives you these lines around the edges and it gives it a more sketchy look it looks like to ask each down someone drew the outlines around everything and stuff so to use them you've just got to put your shader in there and sit the blip material past to zero when it works I've got another one that I'll show off yet this one's sort of a differ it just uses the different node inside of the shed graph so it just gives you this sort of decide effect you probably can't see it on the youtubes it's also got a bit of noir nice I've done a smart so that can be customized but I'm also going to try making a another shader to show off how to actually use these I'll create a new paragraph and I'll call it night vision and let's open this up Oh to have remembered the shader I did as a demonstration before I started I'm going to delete this and show everything that needs to be done so I make sure I don't miss anything so let's just delete all these settings and stuff so the first thing you need to do is you need a texture so this will be how unity gives you the screen texture to actually work with I normally call it base RGB that's not important what is important is this has to be called main ticks if you don't call it main takes this will not work so make sure it's called make it and iso gets a bold font when you name it main ticks original that's just to let you know that it's actually working so you can just drag this in and then you can sample from a texture so put it sure and you can pass it in right now you've got an image of fix shader it's just not doing anything so if I just save this and go back to the scene I will create a material for this create uriel just call it a night vision and I will also create a new fort in Reno to demonstrate how to do that so you just want to go to rendering Universal render pipeline and a for drink run I'm just gonna call it custom that's fine and you just need to add a new arena feature and do blitt so this is not something you'd have by default with lightweight render pipeline this is a render feature that I have I got it from a unity tutorial on tomb shading and what the blitt allows you to do is like you would do if you were doing image of fixed shading in code it just uses the blood of a it just lets your material to the screen pretty much if I just put this on here it won't do anything because I haven't seen it sitting here and there you go so everything's black which means it's working and what happen you have to do is you have to set this to zero or else and that it won't work well some shaders do but it's a shader graph you have to see it to zero if you had like multi pass shaders you can see it which material pass you actually want to be blissing with so if you have like a multi pass shader you would have to put it in like three times or whatever and then put one for each of the Blitz I'm pretty sure each material pass you want to do so anyway this looks fine you can rename this to whatever you want I'm just going to do that in case you have multiple and multiple image of fix you'd run maintenance you can keep track of them easily and I think you want to do that as well change that name if you've got multiple so I'll call this let night vision bigger I'm pretty sure you have to name that or else so you might get conflicts when it's doing things I'm not hunting sure anyway let's add some more to this no question shooter so now you've got access to the actual material itself you can do stuff with it so I'm going to create like a night vision effect so I've got this and I can pass it through I've got the scene renewing in green oh and also that some hunters realize you have to see this - after renewing transparence there you go now it's got a background you shouldn't do after rendering because you can get well you can but as you can see it's kind of doesn't look as nice it's skips post-processing it'll override any post processing you have affixed you have and if you see that - after winning post-processing it doesn't actually render at all so just after ending transparence is the preferred because you still get things like bloom and vignette and stuff like that so you know what I want to do it after ending transparence anyway so I'm going to add some more features to this for instance I'm going to rather than just something the green I'm gonna run the entire texture into a dissing ode and then run that differ into the green channel of this combine so now instead of just sampling green rinses they'd say you have read a read room you won't see anything at all if you just went through the green but if you sample it as like a grayscale texture and then do green you'll actually get I'm sort of more realistic night vision texture so yeah where the death or it kind of looks night vision II just going to make a few more adjustments I'm going to add a right I've seen i'm just got opposite occurs often when night vision to fix you gonna want maybe it's a bit like he you know do want it to be a hundred percent black you always want to have a little bit of noisy green luck to it so i'm just going to pop this and and AD there it goes and we can offset the brightness and we also want to multiply it I'm gonna do a brightness factor just to make it more pronounced you're probably gonna want to do this before the differ if you do it after the death of the dis that want to look right because you'll be multiplying it after if you do it before the DISA the dis that will adjust its differing based on how bright it is coming in so make sure you do that if you're making your own shooters schools brightness you and I can just plug that in and so if I say this and go back to the scene they got back at the scene so now you can go into the night vision shader and I can see it a brightness all see it so you can see I can make if the dark areas just a bit brighter so if I do X 0.5 and if I set the brightness to 0.5 it'll change the range of the shader so now the range will go from 0.5 to 1 and 0 from 0 to 1 so you can fit brightness to get the kind of effect you want - Oh darker much better so yeah but you can do a lot of other I found one of the coolest things you can do is if before I do the if I mean actually before I do anything I will you can create gradients in cheetah graphs so just by inserting gradient these will not be exposed these are just um in in shady graph you can actually change them elsewhere so if I do a black and light you've got a sort of a black on white gradient but you can stick one in the middle just go fifty and set it to 50 you can set it to fixed price it this fixed maybe I'll add some more let's go and five and I leave a lot definite with them if a nice effect you just pop your gradient in and add a gradient let's just say this what you'll get is almost a tune shading look so you could sample from a gradient where you can sample from I can texture if you've got like a per ticket II X you want to sample from but you can see now I've got this sort of um color banding on things so with more different gradients you can customize it to how you want so this one's got a bias towards brighter colors and dark colors are much smaller on the scale so you can do tune shedding and the best part about I find about this whole system is because it's doing things like tune shading and stuff in the just inside the arena so if I was to just bypass everything and just sample from the gradient and the incident in color I've pretty much see it a global tune training so anything I earn it at the game will get a tune training to it actually this is going to make it black and white what you actually want to do is you're gonna want to multiply this if you want to have color as well but just modify this to demonstrate yeah this is an attacker because I'm multiplying colors melt multiple times which means darker colors gonna be even darker but still that something you'd want to think about free room projects and what kind of look you're going for but this is a global tuned shading and I can add any other shaders or materials or you know I can make vertex offshoot shaders and if I want to in shading on them instead of having to every single shader I create I'm gonna try and do tune shading for it instead I can just have this as a global pretty much global tuned shading and I can have any shaders I want I can get showed this from the assets door or whatever and they'll all conform to the same style because it's all done with a image effect so yeah that's pretty much what I want to show off I think it's kind of a neat system and it's pretty easy to make shaders and custom shaders for any way you want to do also another thing you're going to want to think about a rule when you're sampling textures the textures will become skewed by aspect ratio so I've just created this s beat corrected screen chords all it does is just um it adjusts the teeth the UV coordinates of the screen based on the actual aspect ratio of the game that way you don't get stretched and textures or anything anyway so that's pretty much all I've got for now any questions or starts in the comments and I'll see you next time you

Channel: IronStar Interactive

Views: 27,873

Keywords: unity, indie, gamedev, game, dev, 3d, unity3d, shaders, image effect, image effects, urp, universal render pipeline, lwrp, lightweight render piepline, shadergraph

Id: FpvJAG6R99k

Length: 11min 42sec (702 seconds)

Published: Fri Mar 13 2020