Stylized lines and outlines - Unreal Material

[@npoctobblpogok3730]

чувак, ты не представляешь сколько я посмотрел разных видео, сколько я копировал разных материалов, но никогда не понимал что происходит внутри. Благодаря алгоритмам ютуба, бог послал тебя чтобы я наконец прозрел! Спасибо огромное, на 15 минуте я уже начинаю понимать что к чему. Ты очень хорошо объясняешь и ютуб переводит субтитры правильно и понятно. Мало кто показал бы эту систему, а ты ещё её и объяснил очень хорошо. Спасибо огромное за такой труд.

[@HepnerKamil]

Спасибо большое! Я рад, что вам понравилось. Очень важно понимать, что происходит внутри. Я тоже не люблю видео, которые только показывают эффект, не объясняя, что происходит. С уважением и удачи!

[@npoctobblpogok3730]

@@HepnerKamil а где видео? Что случилось? Собираетесь обратно возвращаться?

[@Virut1316]

These tutorials are so great, the explanation behind his logic are so clear and prepared, love it!

[@HepnerKamil]

Thanks for kind words!

[@agj383]

One tip in case anybody notices that their lines seem to blur when camera moves - turn off motion blur in the post process volume by setting intensity to 0

[@12whitecup]

This video is godsend. It singlehandedly solved so many problems I was having. Thank you for sharing your knowledge.

[@HepnerKamil]

🙏 You're very welcome!

[@roxydere5760]

Awesome video! Finally someone who actually explains what they are doing and why they are doing it! Thank you so much!

[@HepnerKamil]

You're welcome and Thank you for kind comment!

[@dreamsprayanimation]

If anyone is watching this and wondering how to make transparency work for something like foliage with this shader. You must go to the material of the thing you want to make transparent (so for example a plane that has an alpha channel for grass) and change the blend mode to masked instead of translucent. That way the sketch post process will still capture the normal and texture data and sketchily it without drawing the plane.

[@HepnerKamil]

That's a great question, I've touched a bit about transparency on my tutorials for the lighthouse kzbin.info/www/bejne/hl69Z4qwZdyDb9E There a few techniques to use. The question is if you want to have refraction, reflection, and transparency? Or just simple transparency? With stylized rendering, everything depends on what you're trying to achieve and in what context. You could even fake it with stencils.

[@drdeesnutts48]

Brb gonna go make Take on me's video in Unreal....

[@HepnerKamil]

haha definitely!

[@BradenLehman]

I love this effect! Especially how it dynamically adds jitter to the lines

[@HepnerKamil]

I'm glad you've liked it

[@Fabrice_Debarge]

Very good job and tutorial here !

[@HepnerKamil]

You're welcome!

[@steevieartfeed]

Sir, you are awesome. Thanks for sharing such an amazing techniques

[@HepnerKamil]

Thank you!

[@C.E.Alekperoff]

This is great! Thank you so much!!

[@HepnerKamil]

Glad you like it!

[@KUBE.archvis]

Very well presented video. Thank you for sharing.

[@HepnerKamil]

I'm glad you found it helpful!

[@reachingeric]

dude, this is awesome!

[@HepnerKamil]

Thank you!

[@Elkkkkkk]

amazing again!! I guess the next question would be if one could animate these lines!

[@HepnerKamil]

It depends on how you want them animated. Should they appear or draw? Or just wiggle them?

[@董伟-v1h]

nice tutorial, thanks for sharing.

[@HepnerKamil]

Thank you!

[@fosseli]

25:46 When changing to WorldNormal i get - [SM5] (Node SceneTexture) GBuffer scene textures not available with forward shading.

[@HepnerKamil]

This setup only works with deferred shading, is there any reason why are you using forward one?

[@fosseli]

@@HepnerKamildon't know. I'm using the default VR template. Where do i change shading from forward to defend?

[@fosseli]

Found it in the settings... unfortunately turning off forward shading messes up MSAA anti aliasing. Switched to TAA made it better though.

[@dzee7936]

When are they going to redo the "Take On Me" video using this sketch view?

[@HepnerKamil]

Wow, that's my dream 😍! I would love to give it a go when I find some time!

[@KevinStevenson-rq4xd]

Hello, I've completed the tutorial, but my hatching doesn't combine with the lines/paper it "overwrites" it. I've adjusted the priorities to match, and tinkered some, but it feels like my hatch lines are "opaque" for lack of a better term. I feel like it's a blender-order or priority issue, but can't quite figure out why only hatching, or lines/noise shows up, never all of them.

[@HepnerKamil]

Ping me on Twitter or Ko-fi since we can’t share images on KZbin. Please show me a screenshot of the network and how you’re blending those materials at the end.

[@KingAragorn]

How do I render this? Doesn't show up in render!!

[@Balcaceres_Art]

How do you blend it with another postprocess - is there a way to tint those lines with color and say - "overlay" the post like in photoshop, another blending mode perhaps? I've always tried to replicate the outline effects in drawing.

[@HepnerKamil]

Yes, in Unreal, you have blend nodes like overlay, lighten, screen, etc. They behave similarly to Photoshop layer blending modes. You can also apply any color you want for the lines or use it as an alpha for your custom colored texture.

[@Balcaceres_Art]

@@HepnerKamil ok - is there a way to purchase your filter so it’s UV-based ? You know so it doesn’t move all over the place on screen? If so - I’ll buy it right now for my project

[@gregfranklin1350]

Beautiful work! Does this work on animated characters as well as static objects?

[@HepnerKamil]

I have an example with birds flying around a lighthouse on my channel. However, I haven't uploaded any with a character walking or anything like that. I should definitely do that.

[@zfabvi3867]

Hello Sir! I followed the tutorial in UE 5 and when i start moving the viewport near an object some white lines across the screen starts appearing, even a bit on the objects themselves. I already disabled the bloom and the auto exposure but them still appear, any suggestion? Thanks, appreciate your work ❤

[@HepnerKamil]

First, try to identify at which pass those artifacts appear. Is it an issue with scene depth? Go through the entire setup and try to identify the stage where it's happening by connecting the outputs from the nodes to the emissive color. Once you pinpoint where the issue is, we can sort it out. Also, just to double-check, set all of your lights to Moveable.

[@zfabvi3867]

​@@HepnerKamil ​ Appreciate your response! I tested the whole shader setup and it seems that the Sobel Operation is fine, but when i plug in the RemapValueRange (or the output of the if node used to remove the skybox outlines) in the multiply node for the thickenss-over-distance scale it starts to create some "jittering". I tried putting a fixed value and that solves the problem, but in that way the thickness of the outlines doesn't change based on the distance.

[@HepnerKamil]

Can you please send me an email or ping me on ko-fi? I will try to help you out with it.

[@zfabvi3867]

@@HepnerKamil Thanks, what's your email?

[@joneske22]

I seem to be having the same issue. Did you happen to find out what the issue was? Going to go back through the setup and see if I can identify in the meantime. I appreciate your help in these tutorials !

[@MrTeathyme]

Is it possible to maintain the colour channels? I’m envisioning like a “cell shader” post process but rather than cell shading use hatch shading.

[@HepnerKamil]

Yes, yes it is possible to have diffuse colors with it. This question has come up a lot, I'll post soon how to modify it.

[@kiritoking3007]

Thank you for this amazing video,and i want to know how to calculate shadow position？

[@HepnerKamil]

What do you mean exactly by shadow position? Or maybe you just want a light direction?

[@DillonBoucherDesigns]

First, thank you for the tutorial Kamil! This worked wonders for me! I had a quick question. Is there any way to deform the outlines without deforming the meshes themselves? I’m looking to have loosely drawn lines around objects but this seems to stretch the meshes themselves with the outlines. I understand why it’s doing it, but is there a way around it? Thank you in advance!

[@HepnerKamil]

That shouldn't be the case, you can see on the video with textures and colors that only outlines being deformed. You would have to double check your network, what are you passing to the deformation pass.

[@HepnerKamil]

kzbin.info/www/bejne/lYeadXmCmpZkqas

[@GMVitus]

Hi Kamil! Thanks for the tutorial! Do you know of any way to exclude objects from the PP effect? I set up "Render Custom Depth Pass" and allocated a number to the CustomDepth Stencil Value. Next, I threw some forks at the end of the shader graph, which look for my stencil number (Scene Texture:Custom Stencil) and if it's the same as the one I set up in the mesh, it'll simply push the SceneTexture:PostProcessInput0 value through. Otherwise it'll push the newly calculated values. This works fine for the hatching effect, but unfortunately it won't work for the Lines. My guess is that the lines are drawn around the object as well as inside, but only the ones inside are getting ignored by my if-fork. Any ideas how I can account for that and have the PP Material ignore some objects entirely?

[@HepnerKamil]

You can use a stencil to specify which objects should be included in calculating the outlines. It becomes trickier when objects without outlines start overlapping objects with lines. In such cases, you'll need to perform some stencil subtractions to ensure that only the correct objects are used.

[@raingod5942]

Well seems that epic removed Before tonemapping "Blendable Location" option for post processing material, unless i am wrong. Trying this with UE5.4.

[@KevinStevenson-rq4xd]

I couldn't find it once but that was on a Material I forgot to set to "Post Process" so it was just a regular material. I set it to be a Post Process material and the option showed up!

[@danD315D]

Amazing Video! I've got a question, is there any ways to have the post process affect only the edges of an object, instead of the whole scene?

[@HepnerKamil]

Hi Daniel, would you like to have a simple single line outline or more of a hatching lines on the edge of the object?

[@danD315D]

@@HepnerKamil With more hatching line please! Since no one has done any tutorial about it on KZbin yet, most of them focus on a single outline.

[@irusu.]

can it be used in games?

[@HepnerKamil]

Of course

[@simonemonaco42]

Lines squiggliness becomes more accentuated when i move far away the camera from objects. Is there a way to fix this? And is there a way to wiggle the lines at a low fps rate?

[@HepnerKamil]

The effect should be the opposite; lines farther from the camera should be thinner. However, there's a limitation at some point because the lines can't be thinner than 1 pixel. Just double-check that the remap node is set correctly. You can reference it in the video around 0:21. Squiggling the lines in a stop-motion fashion is trickier but sounds pretty cool. Hopefully, I'll find some time to record a video about it.

[@hajime8904]

IDK, i was following all steps, but line distance doesnt work for me on 5.2

[@HepnerKamil]

It should work wihtouth the problems, what is your monitor resolution?

[@lilouhaefner3352]

23:24 Couldn't you also just saturate the emissive value?

[@HepnerKamil]

Absolutely. However, I personally prefer to turn off bloom for stylized looks anyway.

[@lilouhaefner3352]

@@HepnerKamil Fair enough.

[@carloscerralba8512]

Hello! Im doing in unreal 5 and I have like a flickering in the whites, like a reflective light bounces and flash, what could it be? maybe lumen? Thank you so much for this tutorial!

[@carloscerralba8512]

Ok it was the bloom effect!

[@HepnerKamil]

Also please check if you have automatic exposure turned off in your post process volume.

[@HapZungLam]

Thanks for the tutorial. In the last video you have taught us how to randomize the line when we translate the camera. This video your lines are static even when the camera is translating. How do we do that?

[@HepnerKamil]

Hi, you would need to reverse what was done in description of this video: kzbin.info/www/bejne/Y5TRhKugiduIpMk Or follow first video about hatching shader: kzbin.info/www/bejne/Z2m4ZmOBhcl3aKM. Since the first video had a dynamic hatching.

[@ramirez5399]

hi mister kamil,i have a quesition,how can i use this shader for transparency object likeVFX?It will all become white.

[@HepnerKamil]

It's not set up for transparency in this example. Transparency was not something I wanted in this black-and-white look. However, the shader from Stylized Series Vol1 does support it. : ko-fi.com/s/183e60bde2 P.S it's because we're using SceneTexture:SceneColor that doesn't have transparency information

[@ramirez5399]

@@HepnerKamil I just found that before translucency can help me fix that,btw Vol1 very good work,I’ll buy it when I need it

[@begolu9907]

hi mister kamil, i have a question, can this tutorial be used under certain conditions, for example when line and outline is used for characters can it change realtime color and thickness based on direct sunlight and camera movement? Thank u.

[@HepnerKamil]

Yes absolutely. But that would be a bit more "complicated", everything depends on the case. Having a limited number of light sources makes it easier. The easiest case is when you only have one light source, such as the sun (directional light). Then you need to get info about light direction via MaterialParameterCollection. After that, I would project that vector to the camera plane and use the object centroid to calculate where lines should disappear. This is a very simplified explanation, but hopefully, it gives you some direction.

[@begolu9907]

@@HepnerKamil Ah I see, does changing the color and thickness of the line outline in realtime require more than one light? is it possible to use the three basic lights on the character?

[@DAYT1998]

I bet no one will read this, but I'll post it anyway: I have the problem that on some objects, lines get drawn where there's supposed to be a smooth transition, making them look more geometrical than they should. The meshes are smooth shaded. The only way I was able to remove these unwanted lines was to disconnect the part of the shader with the scene depth, but of course that removes a lot of the lines. By the way these lines are the most visible when the camera is further away from the object and disappear if I get close. If anyone has an idea on how to solve this, I'd be very grateful :)

[@sarahragheb3819]

Amazing tutorial! Thank you so much! Is there a way to make the lines thinner than the minimum value 1?? it's just that the further lines are still too thick. and when I tried to make it 0.5 it got the whole scene scratched

[@HepnerKamil]

No you can't, the value 1 is close to one pixel thick lines. Now try changing values on your RemapValueRange node. Maybe it goes too quickly to thicker lines. Also you can remove it and use a fixed value, just 1. Does it work?

[@Shamimreza]

Nice work, But I have a question in the hatching tutorial, the hatching moves, but here at the preview it doesn't. How to make the hatching fixed, not moving?

[@HepnerKamil]

Hi Shamim! Follow the instructions in the description of this video: kzbin.info/www/bejne/Y5TRhKugiduIpMk

[@omerrudnick8195]

Is there a way to do this in Blender's compositor or Photoshop?

[@HepnerKamil]

Oh yes definitely! In blender you can make it look even better. In Photoshop we can recreate as well, but at certain stages we would have to use specific techniques only for the Photoshop.

[@omerrudnick8195]

@@HepnerKamil How?

[@HepnerKamil]

@omerrudnick8195 It's challenging to answer that question comprehensively in a comment. Essentially, you would need to follow the tutorial and attempt to replicate each step in your chosen software. It's merely a technique that can be utilized in most softwares

[@marph3d]

Hello great effect! Bought!:) For you, can it also be used on an Oculus? I did a test and it is only visible in one eye. Not so if I'm doing something wrong Otherwise is it possible for you to create a shader material that is not a post process?

[@HepnerKamil]

Hey Matteo. Answering the last question first. The answer is NO, for this particular setup and look it's need to be done as post process material. Speaking of Oculus, i don't have a much experience with it. But I remember that there was some issues with it around 4.24 version or so. Also take a look at that: forums.oculusvr.com/t5/Unreal-VR-Development/v35-causes-one-eye-not-to-render/td-p/897959

[@shaunpatrick5458]

Thank you for this. Was trying this out, is there any way to mask out the deformed lines so that the character won't be affected by it?

[@HepnerKamil]

Hi Shaun, Victor asked similar question under this video kzbin.info/www/bejne/lYeadXmCmpZkqas Give a try to stencils, that should give you mask that you can use in a Material.

[@MasterPiffy]

you need to update those project files to reflect all the changes you've made if you expect money, I kinda want a refund for having to go through and fix things in order to make something I paid for work. I had to watch the tutorials anyways, coulda saved the money.

[@HepnerKamil]

Thank you for your feedback; this is definitely an area that requires improvement on my part.

[@MasterPiffy]

@HepnerKamil well yea, I legit wasted my money. Like I said i had to watch the whole tutorial anyways to patch it up. Its pretty useless and just a money grab, and if you have any proper morals you'll take down the files, or at least stop charging for them until theyre fixed. You dont deserve money for that shit.

[@ultracapitalistutopia3550]

I appreciate you sharing your knowledge, but "depth" is not pronounced "dipth".

[@HepnerKamil]

You're welcome