Cross-Hatching material Post Process [UE5, valid for UE4]
ฝัง
- เผยแพร่เมื่อ 29 ก.ย. 2024
- In this video we go through the realization of a cross-hatching post process material. This shader reproduces the hand drawn look, for a stylized rendering.
Gimli and Legolas models have been made from Gianluca Squillace: www.artstation...
Become a Patreon for a discount ;)
Cross Hatching Sample Project: jumpeter.gumro...
Outline Post Process: jumpeter.gumro...
Discord: / discord
Patreon: / visualtechart
Related Videos:
Outline Post Process - Part 1: • Outline Stylized Mater...
Outline Post Process - Part 1.5: • Outline Stylized Mater...
Voronoi Intro: • Understand Voronoi and...
Advanced Voronoi: • ADVANCED VORONOI fixes...
![Comic Book PostProcess [UE5, valid for UE4]](http://i.ytimg.com/vi/ldv94GUzTOA/mqdefault.jpg)
![Comic Book PostProcess [UE5, valid for UE4]](/img/tr.png)
![Outline Stylized Material - part 1 [UE5, valid for UE4]](http://i.ytimg.com/vi/Ptuw9mxekh0/mqdefault.jpg)
How do you create those purple nodes at 3:37 in the video? Seems like they are "variable" nodes that are used for convenience so that the graph doesn't have too many intersecting lines. I tried searching in the unreal docs but I'm having a hard time finding it
Named reroute nodes :)
can you render post process material in sequencer? i tried it but the filter didn't appear
If you have it in the Post Process Volume while you shoot the sequence should work no problem
Just found your channel. You are on a toootaly diferent level than the usual UE tutorial creator. Outstanding level of understanding!
Please do more.
I think adding the same line thickness variance to the outline would give it an even more hand drawn look, thanks for the tutorial as always!
Can I use this shader but not make everything black and white?
Yes, you can just multiply your colour at the end :)
This is really good! Do you know how to make a paint stroke effect?
Maybe ahahaha
Maybe search for Kuhara effect, that will help you in a direction to start with :)
Absolutely incredible
I wanted to know if this is applicable to games or is it maybe too hard on the performance for stable fps while playing?
also: Do I need to credit you if I publish the game?
Credits would be nice :)
Performance wise, you'll have to take your own measurements as always :D
Wow it's reall nice tutorial!! Thank you!
Is there a way to keep the color? So it's not replaced by black and white
You can multiply it on the PostProcessInput0 :)
How does it look on camera moves? Whether that be a circular dolly or parallel dolly move.
It's not amazing but I thought it would have been worse :) I feel like the only "disturbing" movement is when the camera goes back and forth, otherwise panning and rotation are fine. Of course you want to remove as much of the temporal effects as you can, otherwise you just get a mess of ghosting
A lot of disturbance with these kinds of effects goes away if you can get the any texture you apply to the screen (like that paint one at the end) to project in the world instead of on the camera, which I remember being a real pain to get right, OR just turn those effects way down, you might consider lerping their intensity to something you control with a material parameter collection, then tune it down when your character or camera is apt to do a lot of motion, then back up when they settle down, since these types of effects look so good when you don't have your head on swivvel.
I love your sense of humour. Youre right that other method would be a complete disaster to implement 😂
I might have missed something, but my texture seems to be applied to the screen instead of being specifically on the shadows. If I did miss something what was it, and if this is how it's meant to be how would I go about changing it?
Double check your thresholds or if you missed bits in the tutorial :)
If you have a different light setup your threshold will be different, experiment with parameters
I also ran into this issue (Using UE 5.4)
@@gilnye i found out how to fix it, visual tech art was partially correct in tweaking the values (if the effect is all over your screen you have to change the values), but the main issue that effected the shadows themselves sticking to your screen rather than the world was the fact that (as far as i can tell) thats not what is intended in this tutorial. making it stick would be completely possible if you used the WorldAlignedTexture node, though i dont know exactly how youd implement it.
if youre intending to use this in a game, Kamil Hepner has a tutorial (video is called "Hatching shader tutorial" on his channel) that is much better suited for video games, especially as it isnt procedural and therefore uses far less processing power, and also introduces you to using curves and curve atlases which are very very useful. This however, does have kind of the same issue, but it can be resolved by simply changing the TriplanarCameraVector node that the SceneTexture:WorldNormal node connects into with the previously mentioned WorldAlignedTexture node. this will give you the effect that im guessing you want, though you do need to make your own hatching images that are displayed.
really hope this helps you, feel free to ask any questions here and ill do my best to help more :)
@@gilnye I gave a longer response to this but youtube didn't send it through for some reason. but in addition to tweaking values, take a look at the WorldAlignedTexture node, it'd be possible to implement into here if this is the effect that you want.
@@ec1ipsed93 thank you so much!
Thank you for the good video
Keep up good work. I love this kind of content from you.
thank you !!!!!!!!! on unreal engine 5, depending on the area the character is, is it possible to change the shader of the environment and the shading of the character too ?
how did you create the yellow node at 8:41 ?
Named Reroute Node :)
@@VisualTechArt thanks
I'm curious how it would look to draw one set of lines, and then using a kernel that effectively enhances the line towards a perpendicular angle to the line. WIth a kernel set up correctly it could perhaps produce a cross hatch pattern or something close to it.
how would the performance for something like this be like in VR? Thanks!
No idea, I haven't tested it :)
Now that I've had time to sit and play with this, a couple notes: One: When you switch this to post process material don't apply this after tonemapping if you want that invLerp to work right (change it to something else, like before tonemapping, personally I used Replacing the tonemapper because it introduces a neat artifact that looks like a dither for partial values). You also used the invLerp instead of an If, is that cheaper or something? Also why mask the post process input zero instead of a desaturate? Is it cheaper, more control, something else I haven't thought of? Two: Using the Voronoi Applications stuff you did before adds about 20 instructions per, but opens up some interesting possibilities *like using the smooth min max output to taper the lines as you get close to the edge of a Vcell* Three: I had a couple weird quirks That cool World normal effect you do at the end for some reason only renders the preview ball, but in the editor it is fine, so who cares, might throw some folks though. Also your tex coord has a nice big yellow section, mine is almost nonexistent. I'm pretty sure this makes for a problem with the screen uv squeezing along the light vector. Also if you use the Voronoi applications you built in your other video instead of the regular noise node it pushes the blue values to black, but it doesn't matter since you don't actually need to use that second noise node that way since yours already gives you those color values. Four: If you haven't yet, look at your cross hatching on the UE water plugin. It looks awesome. Last thing I promise, try dropping your number of lines, but making them thinner and darker, otherwise when you put a whole scene in this it looks very David Finch Batman, which is really cool and all, but it seems like it would be impossible for a mere mortal to draw, unless they embrace only the night and dedicate their life to fighting crime on the mean streets of gotham. I'm going to play with adding some distance from camera effects as well. I seem to remember getting a hatching texture to bend around objects using a custom rotating world aligned texture, that wasn't procedural though, and was like a year ago so my memory is a little fuzzy. Best of luck with yours though because I am definitely looking forward to learning more from you.
In general I use InvLerps if I want some in-between grays, not sure which one you're referring to specifically :)
I was interested just in how light the scene is (luminance), the desaturation would have taken into account colour. That is correct too, just depends on what you want :)
How did you create the Node ´CrossHatchingLayer´? at 6:01 ?
Named Reroute Node :)
Hi! Maybe this is a silly question, but how did you merge the nodes into one like you did in 3:37 ?
I've just made a transition with the named reroute nodes :)
Does AO really adds anything? In Unreal Engine 5 there's no Ambient Occlusion anymore right?
Well in my case it was there so I used it :D
@@VisualTechArt XD but it has no effect!
However, if you change your GI method to Screen Space (Beta), you'll get the AO working properly.
Otherwise, if you stay in Lumen it has no effect.
Same for Ray tracing I think, not 100% sure about that one.
Hello friends, does someone know how can I to this scene ad a colored light maybe?
So I have a scene that is black and white and I want to ad simple yellow light or blue for adding that warm/cold effect to the scene.
I tried adding scene texture as postprocess then normalizing, multiplying it and adding to current texture, and it showed colored light but it also showed all other textures :/.
Much grateful if someone can help!
Multiply the PostProcessInput0 on the result of the crosshatching :)
@@VisualTechArt Oh I can understand now, I did multiply it but there is a catch. I can see other materials colors, for example if building has red color I can see it is red and I can see the color of my light that is yellow. I kind of cheated and gave all models black/yellow mat and light is colored hahaahaha. Thank you very much for your response!
Phenomenal stuff! Would it be possible to isolate the specular highlight and outline it also?
Yes, you can run the filter on the PPInput0 and threshold it to a certain amount of luminosity
3:34 How did you consolidate all that stuff into those purple Reroute nodes?
It's just a video transition, I just moved the nodes away and left on screen the getters of the nodes :)
@@VisualTechArt Gotcha, thank you!
how do you create named reroute nodes with the same color?
You can set their colour in the details panel :)
If I remember correctly one of the things about your Voronoi (or how I used it, I forget) was getting a distance field sort of gradient towards the edge of the voronoi cell. That might be something to consider using to vary the line thickness, so the lines trail off at the edge of the cells, instead of just stopping. Also props for getting the light direction that way. I wish I knew about that a year ago. I ended up simulating a whole track the sun across the sky thing pumping the value to a material parameter collection in my level blueprint on tick. Could have saved lots of cost. Has that always been there?
It hasn't been around for lots of time, but I don't remember when they added it :)
sorry if this is a dumb question but what is the purple node you're using and how do i add them in?
You're probably referring to a Named Reroute Node :)
@@VisualTechArt yeah, that was it, thanks!
Amazing! Thank you for your videos!
Hello how do you apply this and keep the orginal colors of the mesh?
Multiply the PPInput0 on it
@@VisualTechArt Thank you but a little more help plz. Im in the discord as well.
Sorry, may I ask, there is a custom node called "Paper Texture" at the end? What is the relevant content?
It's just a Named Reroute Node coming from a Texture Sampler
@@VisualTechArt ok，thanks
@@VisualTechArt What is the engine version corresponding to this material？
@@VisualTechArtAlso, where is the node "Circular Laplacian Filter by VisualTechArt" added at the end
5:51 how on earth do i get this Input node.... Can't seem to find the 'expose in library' anywhere, not in a material or an material instance.
Function Input?
@@VisualTechArtyeah, but the FunctionInput is not on the list when i right-click in an empty part of the material-blueprint
Would like to know that as well, please :)
@@arnoldplanken2017 Are you ina Material Function or in a Material? :)
Can anyone tell me how he turned all the nodes into a purple node?
Are you referring to named reroute nodes? :)
@@VisualTechArt I don't think so, it happens during 3:35, all the nodes just become one. Sorry, I'm super new and not too sure about most terms. Thank you for replying though!
you -> god
Very nice!
AMAZING!!!
why do you sound like Stepen Hawkings computer?
Because I am
His only window into English was through Microsoft Sams