The BEST Outline Shader Graph Tutorial

The BEST Outline Shader Graph Tutorial | Unity Tutorials

Рет қаралды 83,734

Күн бұрын

Hey Guys! Welcome back to another CG Smoothie Video! In this video I'm bringing you guys a new Unity Game engine tutorial! This time, we're learning how to use the unity game engine to make 3d outlines around characters and objects in your game using the Unity Shader Graph! I think this is one of the BEST Outline tutorials out there! If you guys enjoy, let me know what other shaders to create in future videos!
CG Smoothie Discord: / discord
We have a couple members so far and we can all bring each other up so make sure to check it out! We talk Blender and Unity!
IG: / cgsmoothie
Tiktok: www.tiktok.com/@cgsmoothie?la...
CG Smoothie Itch Page: cg-smoothie.itch.io/
Please check out my games and maybe donate a bit if you want 😏
Tools I use in this video:
DaVinci Resolve 18
Unity 2021
Photoshop
OBS
🎵 Music:
Wii Play (Title)
• Wii Play - Main Theme
Originally composed by Shinobu Tanaka
🔗Related Links:
• How to OUTLINE your Me... - How to OUTLINE your Meshes in 2 Easy Methods!
• Making a Game in 24 HO... - Making a Game in 24 HOURS
⏱️Timestamps:
00:00 Intro
01:00 Tutorial - How to Make a 3D Outline Shader!
11:45 Explanation - How does this Really Work?
13:15 Outro
#unity #shaders #gamedev #indie #indiegame #unity3d #tutorial #helpful #blender #cgsmoothie #shader #shadergraph #easy

Пікірлер: 134

@eleocraft278 9 ай бұрын

now i know what most tutorials do...

@GabrielSilva-mv4fm Жыл бұрын

Great tipo, exactly what I was looking for

@hayesgeldmacher8592 4 ай бұрын

This was very very helpful, thank you!

@BreakGlassForMemes 5 ай бұрын

Dude do you have to constantly put others down when doing your tutorial? "Now what most people would do, which is bad, is blah blah blah. But what I would do, which is good, is blah blah blah!" You also constantly do this thing where you say "here's how to fix it", but the actual solution to fix it is like ten steps later.

@CGSmoothie 5 ай бұрын

I just wanted to let people know some other ways people do it and why I personally think that it this tutorial is a better solution. Not trying to actively dunk on any other tutorials, just found them very annoying when trying to make a similar effect in one of my projects, so I thought I would let people know my method! :)

@CREEDxNATION-nn6lj Ай бұрын

excatly

@maciejgorski4657 7 ай бұрын

Thank you for your hard work.

@urboijumpman 4 ай бұрын

Well explained video thanks :D

@kepcukhusamettin9400 Жыл бұрын

thanks, this really helped

@CGSmoothie Жыл бұрын

Glad it did!

@maslouhimounia4088 Жыл бұрын

kepp going man

@KDSBestGameDev 11 ай бұрын

You should leverage the screen position or use a post processing shader. They work with non smooth shaded objects

@CGSmoothie 10 ай бұрын

Yeah, but from what I've seen they also tend to be less uniform?

@jamaalsineke2405 Жыл бұрын

Thank you

@user-pz9kn1un7i Жыл бұрын

Trying to wrap my head around how I could make a radial progress outline... Using all of the directional vectors would produce a full outline, but possibly adding each vector over time would produce the radial outline? Any thoughts on this :D

@AerodromAssets 3 күн бұрын

You can do it easily with the ui slider

@toefour 9 ай бұрын

do you have any suggestions for adding an outline to an objects Texture rather than it's mesh? I have many billboarded objects in my scene, each uses a Quad mesh and has a material that uses alpha clipping to create a 2d cutout visual style. I'd like to add a white border to all of these objects to make them look like they are cut out of poster board. When I apply the process from your video the entire quad is colored white as opposed to just having a white border around the texture's opaque areas. Would love any suggestions that I could try!

@everything-bagel Жыл бұрын

Any suggestions for how to outline objects with sharp edges like a cube or rounded cube? My characters look good but then I have a bunch of walls/cubes in the environment that are not outlined well 😅 Thanks for the tutorial

@CGSmoothie Жыл бұрын

A rounded cube works if you use shaded smooth

@CGSmoothie Жыл бұрын

You could try shading smooth with your sharp cube but I do not think it will work

@everything-bagel Жыл бұрын

@@CGSmoothie Ya shading smooth doesn’t quite work for a sharp cube. Hm I’ll have to do more research or maybe switch to using rounded cubes as you suggested. Thanks 😄

@CGSmoothie Жыл бұрын

If not, there is a different shader method which I don't personally like as much that uses fresnel that I think might work, but I don't think it looks as good.

@everything-bagel Жыл бұрын

@@CGSmoothiehm I’ll look into a fresnel method thanks. I’m reading some articles that suggest baking spherical (smooth) normals into vertex colors and use those for a cube mesh. 😅

@iambored9888 Жыл бұрын

Great video, really appreciate you making this tutorial. I just wish you could have mentioned that it doesn't work well on flat objects like cubes at the start of the video, and not the end.

@CGSmoothie Жыл бұрын

Sorry about that, the tutorials are unscripted so I kinda didn't remember til the end 😅

@cancelled2455 Жыл бұрын

Thx

@AvivXR 2 ай бұрын

Thanks you!. I want to use this to mark targets. What will be the best (efficient ) way to show and hide the outlines? (change thickness \ hide material \ change layer?)

@CGSmoothie 2 ай бұрын

You can actually change materials on the fly through code, so I might just do that.

@starbuck3980 Жыл бұрын

How do you apply the opaque layer mask in HDRP?

@Zeepblok 8 ай бұрын

Nice tutorial I only have 1 problem. The outline doesnt stick to my model but flies a bit around it. Every face from my model has its outline but its with an ofset so its floating around the object.

@DapperNurd 4 ай бұрын

Did you ever get a fix for this?

@ten_sen_no_jin 3 ай бұрын

U need to smooth ur model

@iamground31332 Жыл бұрын

This video was very helpful. Thank you. I have a question. Is there a way to apply the inside of the outer shell line in different colors?

@CGSmoothie Жыл бұрын

You mean like 2 shells?

@CGSmoothie Жыл бұрын

If that's what you mean, not with this method except if you just apply a second material with the shader on your mesh

@iamground31332 Жыл бұрын

@@CGSmoothie I see. Thank you for your answer.

@panopea1104 Жыл бұрын

Hey, the effect works exactly like i wanted thanks! The only problem i have now is that these objects dont work with soft particles, i believe it has something to do with depth texture? Is it a limitation of this technique? Is there a way to solve it?

@CGSmoothie Жыл бұрын

You could always just not do the depth texture part but I believe it sacrifices looks

@veliaygul1884 Жыл бұрын

gj ^^

@CorleoBabar 6 ай бұрын

I managed to get this working 99% with HDRP, using two custom render volume instead of doing a custom renderer like you did, thank you very much. It seems that this method renders the outlines behind the fog in the scene however. It's fine if you don't know the answer to fix this as I recreated your steps in HDRP instead of URP, but do you know of any possible solutions?

@CGSmoothie 6 ай бұрын

Sorry, I am barely familiar enough with URP to mess around until I got these results... I would assume it would have to do with the render order in the pipeline asset? That would be where I would start

@iggyboyo Жыл бұрын

Great tutorial, thanks! I have one question! I want to do an outline on a flat shaded (unlit) object, with no texture like your Eevee. So I want the object to have its own color, and then an outline color. If I use your tutorial for this, the entire object is just the color of the outline and increasing the outline or decreasing it just makes the object bigger, or smaller. How can I differentiate between the outline color and the base color of the object?

@CGSmoothie Жыл бұрын

To be clear, is your outline material on a new material layer of the mesh? It should be.

@iggyboyo Жыл бұрын

@@CGSmoothie I didn't, sorry. But then I went and added it but it still doesn't work. I think the problem is that outline shaders only work for more complex meshes - In my case it is a literal planar mesh facing the camera, so the "outline" gets projected outward (towards the camera) when I change the thickness - I will have to find some other way

@CGSmoothie 11 ай бұрын

Yeah, as I said in the video, unfortunately this shader only works for smoother objects, my bad!

@johnnyboy2653 Жыл бұрын

Is it possible to have a drop shadow effect on a model, like a "black glow" around a character? I've looked into glow stuff but I think that since black is 0,0,0 it can't be done.

@DT-hb3zu Жыл бұрын

If 0,0,0 doesn't work, do 0,0,1 or similar. It will be hardly noticable, and you'll get the same result. Game dev is all about trains on heads 😅

@chefedaora2490 9 ай бұрын

The normalize node isn't working in mine and I don't know why... The thickness of the outline is all messed up and I tracked the problem to it. I even tested it by removing the node and saving. Nothing changed. Can you help me please?

@feedelstick4670 4 ай бұрын

Same thing for me. You got it working?

@chefedaora2490 4 ай бұрын

@@feedelstick4670 I eventually did, but I dont remember how 😂😂

@AngersFiction Жыл бұрын

Is it possible to change the outline thickness after this is all done? My outline still ended up kinda big and I can't figure out how to shrink it down

@AngersFiction Жыл бұрын

I got it to work, I had to change quite a bit due to the way my assets were made, but we good now

@lupulo89 Жыл бұрын

I'm new to unity, I'm only using it to add an outline so my question is probably silly, but when creating the shader in the main preview window a purple circle appears, and when i do what you do it doesn't change color, Also, the border around my 3d model does not appear, do you know why it could be? On the project I have added the 3d model with its respective texture

@lupulo89 Жыл бұрын

nevermind, im dumb, i erased the render object at the start, I managed to do the tutorial, thank you so much!

@schonkigplavuis8850 Жыл бұрын

5:42 i have NO clue why or how you can have a list like that, to add materials in HDRP??

@frogmasto1316 5 ай бұрын

bro please fullscreen shadergraph next time

@lucasalmeida240 Жыл бұрын

Hello! What is the name of the font you used in the text "the best unity outline shader", in the video image?

@CGSmoothie Жыл бұрын

Komika Axis

@HarrisonVogl Жыл бұрын

I really do owe you a beer

@HarrisonVogl Жыл бұрын

Curious I see how the renderer moves the lines further away the more I increase the thickness - how can this mitigated?

@CGSmoothie Жыл бұрын

I don't really know what you mean... Could you send a recording on the discord possibly?

@crunchy9814 2 ай бұрын

i love you

@ExploitingTheWoW Жыл бұрын

Does this double or increases the faces, like it did with the blender solidify? Wondering whether it has potential as a style in games, but if it makes all objects too intense it will be pointless.

@CGSmoothie Жыл бұрын

I don't think so, I think it just renders the objects twice

@CGSmoothie Жыл бұрын

That being said I have not looked into the effect it has on memory or anything

@aser28860d 2 ай бұрын

When I add and assing the material to the object, it only outlines the last submesh of the mesh. And from what I can tell, I did everything exatcly like in the video. The outline works, but for some reason it only out lines a single submesh of the object and not all of the object. I can't seem to find a solution so far. Do you have an idea why this is happening ?

@CGSmoothie 2 ай бұрын

Do you have multiple materials on your object? I've seen that being a problem for some... I would recommend baking your materials into a single texture in your modeling software

@jamaalsineke2405 Жыл бұрын

Do you know how to effect the color of the outline based on your light source? Like if the sun is coming from the top left, the outline is yellow/white and the outline on the shadow side isa darker color say purple/navy?

@CGSmoothie Жыл бұрын

You could do that if you mixed this shader with a toon shader, or if you just want basic lighting you can use a Lit URP shader instead of an Unlit one

@CGSmoothie Жыл бұрын

GREAT question though

@BakinKoljac 3 ай бұрын

thank you for your work and the great explanation but i could read anything on the screen, i was only able to rely on the audio. very frustrating

@GustavoMondini 7 ай бұрын

how can i make it work on hdrp ?

@Lc9real 9 ай бұрын

How can i do this for HDRP?

@Coolkidstan Жыл бұрын

alright so overall a good tutorial BUT HOW DO I ADD THE VERTEX LIST you didn't explain that nor did you show yourself doing it so I'm stuck here with no instruction just trying to find it myself

@CGSmoothie Жыл бұрын

I believe the vertex list adds to the shader graph by default... I'm gonna rewatch the video to make sure but I think that's the answer I can give you

@kiryonnakira7566 2 ай бұрын

i followed exactly that tuto in unity 2022 and get "Shader error in 'Universal Render Pipeline/Lit': maximum ps_5_0 sampler register index" my google researches don't help at all, idk what to do. I'm so confused seeing the "Lit" thing as we use an unlit shadergraph too

@CGSmoothie 2 ай бұрын

Yeah, the later versions of unity have been very frustrating to me... I prefer builds from 2020 or earlier

@DevGamerShripadAgashe Жыл бұрын

Any Ideas on giving such Outlines to Transparent Materials

@CGSmoothie Жыл бұрын

Hmm, unfortunately this one would not work for transparent materials... I think you could do something with raycasts? I'd have to look into it

@Darkho1y 8 ай бұрын

The *best* outline shader (works only with smooth shaded objects) lol

@dubium3380 5 ай бұрын

Good tutorial. But seriously though, how do stylized games like Genshin Impact render outlines so perfectly in Unity?

@CGSmoothie 5 ай бұрын

They probably use a post-processing pass that does it all in one go, rather than this shader if I had to guess

@Flowyan Жыл бұрын

Wish it worked with non shade smoothed models :/

@schonkigplavuis8850 Жыл бұрын

why why WHY is it so incredibly difficult to find HDRP NPR tutorials. I want realistic materials, cool lighting but just a cool outline. There are virtually no shader tutorials for HDRP

@wye43 9 ай бұрын

what's with the voice affectation?

@DPDPDPDP Ай бұрын

It shows dark weird line on selected outlined mesh, when I push play button while rotating the object

@CGSmoothie Ай бұрын

I don't really know what you mean by this, if you go to the discord and send a screenshot I might be able to know more?

@DPDPDPDP 25 күн бұрын

@@CGSmoothie I don't turn on depth, my bad

@andrarte1602 2 күн бұрын

I'm having a problem, in my main preview the sphere doesn't come out of pink, How do I resolve this?

@CGSmoothie Күн бұрын

I'm not sure what you mean, make sure you save your assets and the material is using the right shader

@diveshdogra7449 10 ай бұрын

Hello, This shader works great on unity but it is not visible in an android build. Is this compatible for android or do I have to change some settings in unity or urp. I have my depth textures and opaque textures enabled in Urp settings. Please help....! Any help would be appreciated. Thank you

@yoonkim3198 10 ай бұрын

did you solve it? If you just can't see the outline, suspect if it's hidden by the UI. I'm using Screen Space - Camera in Canvas mode, but I haven't seen the outline so far, so I looked for it and turned off the UI to see it.

@diveshdogra7449 10 ай бұрын

@@yoonkim3198 yes i did, switching the shader type to spriteunlit solved it for me , it was a lit shader previously.

@user-qh9xl9ry7d 10 ай бұрын

It was a good content, but the screen is small, so it's frustrating...

@hilbertsla1986 Жыл бұрын

For some reason my Shader Graphs are pink, do you know what i can do to solve this problem?

@CGSmoothie Жыл бұрын

That would usually mean they're textureless? So maybe your color node isn't connected?

@NotCorrin Жыл бұрын

@@CGSmoothie mine is pink as well. By colour node, do you mean the outline colour? If so, mine is connected

@CGSmoothie Жыл бұрын

Yeah I don't know what else the problem could be... Unless you have a texture node but even then it should just default to a pure white texture if you have one

@hilbertsla1986 Жыл бұрын

@@CGSmoothie finally figured out what happened and forgot to subscribe to programmable rendering pipeline settings lol

@user-kappa-nitori Жыл бұрын

Thank you!But how to do it in alpha texture object?like tent,leaves

@CGSmoothie Жыл бұрын

Now that's a difficult situation! Personally I would outline the texture itself but that might not look good from all angles. This method would not work with that unfortunately

@user-kappa-nitori Жыл бұрын

@@CGSmoothie sad to hear about this:( Anyway,your method still fantastic!I really appreciate you.

@user-kappa-nitori Жыл бұрын

I found a temporary soltuion: 1.go to your shader graph and change your surface type into transparent 2.go to your custom render pipeline,and find your new add two rendering rule,change your filter->queue into transparent. After that your transparent object will stop drawing outline but opaque will.Hope someone will find a solution in the future

@CGSmoothie Жыл бұрын

Thanks for leaving this solution in the comments!!

@yazicib1 4 ай бұрын

You should focus on your tutorial and stop criticizing or caring about other tutorials

@Sukaichae Жыл бұрын

How could I do this without using layers? Because I need my layers for something else!

@CGSmoothie Жыл бұрын

You could just quit before I do the layer thing, but it ends up with the messier version that I personally don't like as much, up to you

@Sukaichae Жыл бұрын

@@CGSmoothie Yeah I figured I'd have to do that. Thank you so much for the response!

@ProxyAddress Жыл бұрын

Is this part 2 of some video? Following along in a brand new project with this is almost impossible.

@inukithesavage828 Жыл бұрын

Any idea how to do this in HDRP?

@CGSmoothie Жыл бұрын

Hdrp is not really good to use shader graph on, unfortunately

@mfedorov 9 ай бұрын

Nice! but to heavy for performance.

@eneseren8332 8 ай бұрын

What is going on at 5:00? You've had cut the video and started from a different part.

@CGSmoothie 8 ай бұрын

I think I just had a LONG silence while I was thinking

@tysondennis1016 Жыл бұрын

How do I outline UI elements?

@CGSmoothie Жыл бұрын

That can be done with just the outline component for text, or just outline images in your image editing software

@tysondennis1016 Жыл бұрын

@@CGSmoothie I got it.

@mahsamohseni994 Жыл бұрын

I wish you could find a way to do the outline without switching to the URP renderer

@CGSmoothie Жыл бұрын

Unfortunately most shaders require use of the universal render pipeline, but I see the inconvenience

@mahsamohseni994 Жыл бұрын

@@CGSmoothie Thank you 👍

@TheGameLecturer 10 ай бұрын

ok but most 3D objects have some hard edges.

@Yan-bo1hc Жыл бұрын

Can it work on 2D

@CGSmoothie Жыл бұрын

I don't believe this method can since it uses 3d mesh normals... Plenty of other 2d outline tutorials out there though!

@Yan-bo1hc Жыл бұрын

@@CGSmoothie thanks for ur reply

@Vendaar 5 ай бұрын

Unfortunate to only mention the downsides at the end of the video after following your otherwise mostly ok-ish presented advice. Thumbs up anyway,

@CGSmoothie 5 ай бұрын

I am a forgetful guy what can I say

@briskled8955 Ай бұрын

Interesting idea to use layers for fixing other problems. But... have you considered that there might be good reasons for other tutorials to do it differently as you desperately stated repeatedly? The problem I see is the following: In order to use your solution you are entirely forced to use that one specific layer. But the layering system in Unity is a pretty crucial thing. Almost every asset or package in unity has some integration using layers. It starts with rendering and collision detection and ends somewhere at layers influencing volumetric fog in some payed assets. By being forced to use a specific layer for your outlined objects you will not be able to use any of these features entirely. And this makes it unusable in my opinion. It's almost like making a tutorial about a first person controller but limiting it's movement to only one direction and no camera movement at all and then calling it the BEST tutorial. bold statement

@CGSmoothie 27 күн бұрын

The reason why I keep saying why other tutorials do it differently is to give natural stopping points if you wanted to leave it there, so I could show a wide range of what the solutions for an outline shader can be in unity. I consider it the best tutorial because it has the most uses and explains why things work the way they do and provides variations if you like it a certain way

@SMORIGINALS 7 ай бұрын

At least maximize your your work windows... Can't see clearly all things.

@user-ly7vp5ng2z 21 күн бұрын

bro is telling me it doesnt work for this and this after letting me watch another now useless ten minutes of tutorial.

@mansurnashaev6486 11 ай бұрын

wasted 10 minutes just waiting for the solution. i don't care what others do, i just want to see a quick solution)) sorry for the bad comment.

@CGSmoothie 11 ай бұрын

I'm trying to be informative as to why and how this solution works, you can skip around if you just want to know the solution, but I'm trying to help people learn what the nodes actually do in the shader graph.