Visual Tech Art
Visual Tech Art
  • 41
  • 707 332
Physically Based Cel Shading
In this video we go through the break-down of the most common approach to create toon looking images in Unreal Engine, we'll see what works and what doesn't.
Then we'll build up to a new Cel Shading approach that doesn't break physically based rules. Following with few sample tricks to improve the image and re-purposing elements as the outlines to work better with this new concept.
__________________________________________
Videos mentioned:
Substrate Intro Breakdown: czcams.com/video/AgVedkJUEyA/video.html
Outline Shader 1: czcams.com/video/Ptuw9mxekh0/video.html
Outline Shader 2: czcams.com/video/UWQonxtG10g/video.html
Intro to PB Lighting: czcams.com/video/vbMvkEITTmo/video.html
Intro to PB Lighing - Follow-up: czcams.com/video/yhu-QoEgHUo/video.html
__________________________________________
Download Sample Project:
Physically Based Cel Shader: jumpeter.gumroad.com/l/VTA_PBCelShader
Outlines Filter: jumpeter.gumroad.com/l/VTA_LaplacianFilter
__________________________________________
Join Discord: discord.gg/YvXq3t675Q
Support me on Patreon: www.patreon.com/VisualTechArt
__________________________________________
Gimli and Legolas models have been made by Gianluca Squillace: www.artstation.com/artwork/d0kyNx
zhlédnutí: 53 616

Video

Follow-up of Physically Based Lighting and Cinematics - Lighting for Videogames
zhlédnutí 1,4KPřed měsícem
This is a follow-up of this video: czcams.com/video/vbMvkEITTmo/video.html Full Playlist: czcams.com/play/PLeZBLcP_xVMj9_CnnbrAwI_InfEwwVqac.html Remember to join my Discord to have a direct channel of communication with Eros! Discord: discord.gg/YvXq3t675Q Patreon: www.patreon.com/VisualTechArt EROS CONTACTS: LinkedIn: www.linkedin.com/in/eros-dadoli-642777122/ Artstation: www.artstation.com/a...
Next Level Triplanar Mapping: Assets, Skeletals and Dithered [UE5]
zhlédnutí 6KPřed 3 měsíci
This video is the continuation of my previous one, in which we go through a correct implementation of the triplanar projection mapping technique for locally map textures in our shaders. Previous Video: czcams.com/video/Cq5H59G-DHI/video.html Download: jumpeter.gumroad.com/l/tri-penta-enna-planar Discord: discord.gg/YvXq3t675Q Patreon: www.patreon.com/VisualTechArt
Intro to Physically Based Lighting and Cinematics - Lighting for Videogames
zhlédnutí 8KPřed 4 měsíci
This video has a follow-up: czcams.com/video/yhu-QoEgHUo/video.html Full Playlist: czcams.com/play/PLeZBLcP_xVMj9_CnnbrAwI_InfEwwVqac.html Remember to join my Discord to have a direct channel of communication with Eros! Discord: discord.gg/YvXq3t675Q Patreon: www.patreon.com/VisualTechArt EROS CONTACTS: LinkedIn: www.linkedin.com/in/eros-dadoli-642777122/ Artstation: www.artstation.com/aerys97 ...
Your Triplanar is wrong. Here's how to make one that works. [UE5]
zhlédnutí 19KPřed 5 měsíci
In this video we go through a correct implementation of the triplanar projection mapping technique for world mapping textures in our shaders. We discuss it's properties, advantages and shortcomings. Then we build on that to create some new and better tech to fit it on the landscape material. Download: jumpeter.gumroad.com/l/tri-penta-enna-planar Discord: discord.gg/YvXq3t675Q Patreon: www.patre...
Comic Book PostProcess [UE5, valid for UE4]
zhlédnutí 11KPřed 8 měsíci
In this video we go through the realization of an analogic offset print dotted pattern post process material, for a printed comic stylized look. This tutorials covers the creation of the grid of dots, the reproduction of an image through discrete shapes, the conversion from RGB to four colour process (CMYK) and viceversa, plus a bonus. Gimli and Legolas models have been made from Gianluca Squil...
Cross-Hatching material Post Process [UE5, valid for UE4]
zhlédnutí 24KPřed 11 měsíci
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.com/artwork/d0kyNx Become a Patreon for a discount ;) Cross Hatching Sample Project: jumpeter.gumroad.com/l/VTA_CrossHatching Outline Post Process: jumpeter.gum...
Bringing the Spiderverse into UE5 - Tech Art exploration fun
zhlédnutí 4,2KPřed rokem
This is not a tutorial as usual, but more of a showcase of what I've been up to lately! Since I saw Spider-Man: Across the Spider-Verse at the cinema I really wanted to try out few things that might lead towards a real-time reproduction of that amazing style. Here I managed to reach a satisfying result, given the time I put in, even though there would be much more work to do to make it actually...
Dissecting Substrate - Part 1 [UE5.2]
zhlédnutí 7KPřed rokem
In this video we dive into the new shader pipeline that was revealed by Epic in Unreal Engine 5.2, Substrate! We try to analyze everything as best as we can and make our own conclusion about how a new generation material pipeline might work. The test shader you see in this video can be found on my Patreon. Discord: discord.gg/YvXq3t675Q Patreon: www.patreon.com/VisualTechArt
Procedural UV Mapping in Shaders
zhlédnutí 8KPřed rokem
In this video I walk you though how to obtain some of the most used UV coordinates directly inside the material editor. This is a universal topic that applies to every software that allows you to play with shaders: Unreal Engine 4, UE5, Unity, Godot, Blender, Shadertoy, you name it! The uv mappings I explain are the cylindrical, the spherical and one that as far I know I've invented while worki...
Outline Stylized Material - part 1.5 [UE5, valid for UE4]
zhlédnutí 19KPřed rokem
Previous video of the serie: czcams.com/video/Ptuw9mxekh0/video.html This is a follow up of the first video of a series I want to make about transforming 3D renders in "hand-drawn" images. It's a topic that always fascinated me quite a lot and I had the opportunity to work quite intensively on in the past year. Here we go through the "standard practice" for making an outline art stylized Post P...
How to fake 8K texture quality [UE5/UE4]
zhlédnutí 7KPřed rokem
How to fake 8K texture quality [UE5/UE4]
4K textures are USELESS!
zhlédnutí 15KPřed rokem
4K textures are USELESS!
This is NOT a Sphere! - A brief Ray-Casting overview for gamedev [UE5, UE4]
zhlédnutí 7KPřed rokem
This is NOT a Sphere! - A brief Ray-Casting overview for gamedev [UE5, UE4]
Outline Stylized Material - part 1 [UE5, valid for UE4]
zhlédnutí 41KPřed rokem
Outline Stylized Material - part 1 [UE5, valid for UE4]
The ONLY texture a game NEEDS [UE4, valid for UE5]
zhlédnutí 70KPřed rokem
The ONLY texture a game NEEDS [UE4, valid for UE5]
ADVANCED VORONOI fixes problems you didn't know about (UE4, valid for UE5)
zhlédnutí 11KPřed rokem
ADVANCED VORONOI fixes problems you didn't know about (UE4, valid for UE5)
Smooth Min&Max - math for visual people
zhlédnutí 4,4KPřed 2 lety
Smooth Min&Max - math for visual people
HYPER-REALISTIC Grass Wind Animation [UE4, valid for UE5]
zhlédnutí 33KPřed 2 lety
HYPER-REALISTIC Grass Wind Animation [UE4, valid for UE5]
Dissecting and Optimizing UE's Simple Grass Wind material function
zhlédnutí 4,3KPřed 2 lety
Dissecting and Optimizing UE's Simple Grass Wind material function
Understand Voronoi and its Implementation (UE4, valid for UE5)
zhlédnutí 12KPřed 2 lety
Understand Voronoi and its Implementation (UE4, valid for UE5)
Fish Eye Post Process Effect (UE4, valid for UE5)
zhlédnutí 11KPřed 2 lety
Fish Eye Post Process Effect (UE4, valid for UE5)
Comprehensive Niagara Structure Overview (UE4, valid for UE5)
zhlédnutí 3,3KPřed 2 lety
Comprehensive Niagara Structure Overview (UE4, valid for UE5)
Advanced Volumetric Fog with Ray Tracing (UE4, valid for UE5)
zhlédnutí 18KPřed 2 lety
Advanced Volumetric Fog with Ray Tracing (UE4, valid for UE5)
How to make Camera Facing Billboards (UE4, valid for UE5)
zhlédnutí 29KPřed 2 lety
How to make Camera Facing Billboards (UE4, valid for UE5)
Vertex Animation Basics in Shaders using World Position Offset (UE4, valid for UE5)
zhlédnutí 20KPřed 2 lety
Vertex Animation Basics in Shaders using World Position Offset (UE4, valid for UE5)
Worn Out VHS Post Process Effect and creative uses of Vector Noise node (UE4, valid for UE5)
zhlédnutí 10KPřed 2 lety
Worn Out VHS Post Process Effect and creative uses of Vector Noise node (UE4, valid for UE5)
Cel Shading and Light Types (UE4, valid for UE5)
zhlédnutí 94KPřed 2 lety
Cel Shading and Light Types (UE4, valid for UE5)
Infinite Non-Repeating details in materials (UE4, valid for UE5)
zhlédnutí 7KPřed 3 lety
Infinite Non-Repeating details in materials (UE4, valid for UE5)
How Naughty Dog does puddles [UE4, valid for UE5]
zhlédnutí 13KPřed 3 lety
How Naughty Dog does puddles [UE4, valid for UE5]

Komentáře

  • @SuWoopSparrow
    @SuWoopSparrow Před 2 hodinami

    Is it possible to use Curves to control band number/smoothness/offset the shadow with this setup?

    • @VisualTechArt
      @VisualTechArt Před hodinou

      You can control the falloff of the bands for sure :)

  • @_Vesper
    @_Vesper Před 6 hodinami

    I think HSV and HSL etc are different colour models which represent colour differently, just similar

    • @VisualTechArt
      @VisualTechArt Před hodinou

      It's true, I didn't remember while making the video :(

  • @artblock3233
    @artblock3233 Před 12 hodinami

    so this is what its based on

  • @user-si3ms3um1j
    @user-si3ms3um1j Před 21 hodinou

    you sound italian as hell... fire video.....

  • @SillyOrb
    @SillyOrb Před 22 hodinami

    1:20 Maybe you weren’t serious in this section, but I’ll still mention it here for people who don’t know it: A sample is called that because a texture’s elements (shortened to texels) are sampled. Just like you can sample a function at discrete points and display the results in a graph. (Textures don’t store samples.)

  • @davidbolt9370
    @davidbolt9370 Před dnem

    my head hurts but im thankful for this tut

  • @florethebrave
    @florethebrave Před dnem

    How do you get rid of the jittering? My outline is also very aliased.

  • @ceidricabitong
    @ceidricabitong Před dnem

    Bicubic must be standard for games

  • @Quaz-jinx
    @Quaz-jinx Před dnem

    This was a great video!! It taught me a lot, but I'm having a little bit of a problem. When the Kernel pixel is near 3 different depths (Like 3 objects at different distances, and the Kernel pixel is on the middle one) the line doesn't fill in. I believe this is because the Laplacian Filter adds all the depths together, and since the back object is far it causes it to not draw the pixel, but it should because it's on the edge of the closest object. I can see it a little bit of this happening on your project but on mine it's very visible. Do you have a workaround for this? I should add that the reason it's more visible on mine is because I changed the code to fix an issue with the Normal filter doubling up with the Depth filter on overlapping objects. I fixed it in a very weird way though so if you got any tips for that too that would be awesome :D

    • @VisualTechArt
      @VisualTechArt Před dnem

      I didn't find any way to avoid it, sadly. But what's happening is that where you don't see the line, there's the edge, actually, but it has the opposite sign... So if you create the line from the depth by initially doing abs() on the filter result it should go away. The compromise here is that you'll have a thicker line that runs also inside the mesh :)

    • @Quaz-jinx
      @Quaz-jinx Před dnem

      @@VisualTechArt Aw man, that’s alright. I did find that solution but i kinda wanted my depth lines to be the same thickness as my normal lines. I guess i’ll keep tinkering with it, if i don’t find a solution then i guess I’ll just live with it. Thank you for responding so quickly though :)

  • @leferdie
    @leferdie Před dnem

    So I implemented this whole thing following this video, unfortunately in the game, specially the outline part, looks pretty bad, specially around folliage. The light division part, really is better than the alternative you picked up(prismatica one, which I also Implemented here), but I feel we loose the "artistic" ability to explode lighter shades vs darker ones. It does look pretty good on landscapes, accentuating the landscape geometry.

  • @TheCrimsonSeven
    @TheCrimsonSeven Před 2 dny

    A true goldmine of a video, addresses every headache I've ever had with PP shading nonsense. Seems like understanding the tonemapper really unlocked it all for you. Thank you very much for sharing!

  • @robinj6997
    @robinj6997 Před 2 dny

    Really nice tutorial, I was going through this one again, and I'm not certain what texture is used for roughness? Is it a simple color or is there any patterns? I only see light blue

    • @VisualTechArt
      @VisualTechArt Před 2 dny

      If you're referring to the puddle it's just a constant

    • @robinj6997
      @robinj6997 Před 2 dny

      I meant the texture sample which goes into channel A Lerp before roughness.

  • @user-kt1pj9xd9e
    @user-kt1pj9xd9e Před 2 dny

    Through the conversation between the two of you, I was grateful to receive excellent advice on how to proceed with unreal lighting through experience.

  • @纪云良
    @纪云良 Před 2 dny

    有人在吗 我的卡信息添加不上买不了这个 谁能帮帮我

    • @VisualTechArt
      @VisualTechArt Před 2 dny

      I don't know, maybe text me on Discord and we can sort it out :) You find the invite in the description of the video

  • @纪云良
    @纪云良 Před 2 dny

    怎么添加卡信息 为什么我总是添加不上

  • @LadySaytenn
    @LadySaytenn Před 4 dny

    This video was extremely helpful to me. I don't use Unreal but I implemented something similar through Blender's compositior, and it works really well! It's the low-maintenance accurate toon shader I've been searching out for years!

    • @VisualTechArt
      @VisualTechArt Před 4 dny

      Glad to see there's someone able to extrapolate concepts outside the specific software :D

  • @IIStaffyII
    @IIStaffyII Před 4 dny

    Wow, I'm blown away. Great video, Gonna take a while for me to digest all the info. But I'm going to have have fun playing with the new knowledge once it settles.

  • @MarshallSweet
    @MarshallSweet Před 4 dny

    9 times out of 10 if the video is barely 10 minutes ill skip it over as a garbage tutorial unless i already know the channel such as this one. Nobody these days puts out useful tutorials, they all just copy eachother so they can get some quick and easy content out which in my opinion is why there are so many incorrect tutorials.

    • @VisualTechArt
      @VisualTechArt Před 4 dny

      After building up some experience in the industry it became very clear that basically no one making tutorials actually worked in a real production context :) It was one of the realisations that convinced me to open the channel without being afraid of becoming just another guy regurgitating the same stuff

  • @Conbini.
    @Conbini. Před 4 dny

    Came for the physically accurate cel shading tut, but was stoked to finally learn how to achieve a LOG output from Unreal!! This is huge, thank you. I can now use this post process to send production renders to colorists and let them grade it. Been wondering about this forever, I knew it was somewhere in there. Amazing.

    • @VisualTechArt
      @VisualTechArt Před 4 dny

      Be sure to check the video I did with Eros then ;)

  • @Vashie
    @Vashie Před 4 dny

    This is amazing and incredible helpful! I was wondering how would it be possible to implement something like SSS to this stylized Cel shader? It's hard to find info on how to create stylized shaders while still having SSS work.

    • @VisualTechArt
      @VisualTechArt Před 4 dny

      Well you can start by assigning an usual SSS shader to your meshes and see how they react ;)

  • @arceyominyin
    @arceyominyin Před 5 dny

    It is so wild seeing someone who really understands what theyre doing in multiple areas bring all that information together to nail down exactly what theyre looking for. This makes every other solution feel like its just faking it. Every time I start to think I know what I'm doing some wizard comes along and just does some crazy voodoo magic and blows me away. Awesome stuff.

  • @maanunoo
    @maanunoo Před 5 dny

    Just an incredible tutorial. I love you.

  • @Monkeymario.
    @Monkeymario. Před 5 dny

    0:24 agree games do look all a bit the same well really different game engines have different graphics but games of the same game engine just look very similar especialy ROBLOX (yes i know ROBLOX is a cloud gamimg platform but it kindof is a game engine) games even comparing crossroads to adopt me to dig to china to blox fruits (formaly known as blox piece) to blox tales to TDtNTOR to TDtNTOR 2 to TDtNTOR 3 to jailbreak to meep city to epic minigames to madcity to blah blah blah they all look very similar the most similar of any game engine

  • @MithosKuu
    @MithosKuu Před 5 dny

    Easily the best video on this topic for Unreal that I've seen. I do have a couple of questions though; 1. Is there a way to control the amount of light banding? I've tried playing around with the numbers associated with the V channel but all I can manage is to alter the contrast and intensity of the banding. 2. Is there a way to get emissive materials to work with this post process? With this setup it looks like the emissive channel is completely ignored

    • @VisualTechArt
      @VisualTechArt Před 5 dny

      1. You can control the amount of bands with the stuff I do, yes they have more difference in value between each other if you reduce them as bigger bands must do bigger EV jumps :) If you know what you're doing you can play with lighting to mitigate that. 2. Emissives should just be considered as light, as they're not contained in the BaseColor pass and already composited in the Scene :)

    • @MithosKuu
      @MithosKuu Před 5 dny

      @@VisualTechArt For 2. I must be doing something wrong then, as a test I made a material whose only property was an emissive set to 5 in the red channel, when I put it in the scene on a cube it just appears grey and doesnt emit any light into the scene

  • @SeanStClair-cr9jl
    @SeanStClair-cr9jl Před 5 dny

    Looks great honestly

  • @Mcl_Blue
    @Mcl_Blue Před 5 dny

    I was really hoping you'd come out with a method for reducing the line's thickness based on distance, so this was great. There's only one problem now: a given object's line thickness will change based on what is visible behind that object and how far away it is. With that one wrinkle gone, it'll probably be perfect.

  • @33chooch
    @33chooch Před 5 dny

    Do you have any workflows/lumen settings to reduce lumen artifacts. I'm getting very wobbly/fuzzy shadows

    • @VisualTechArt
      @VisualTechArt Před 5 dny

      No magic that I know, that's why I warn you in the video xD

  • @Mittzys
    @Mittzys Před 6 dny

    9:43 Do you know how to match EV100 values in 5.4? They've been replaced with "Min/Max Brightness" and the values don't seem to match 1:1.

    • @VisualTechArt
      @VisualTechArt Před 6 dny

      This tutorial was made with 5.4

    • @Mittzys
      @Mittzys Před 6 dny

      @@VisualTechArt I found the issue - it seems that if you have the project setting "Extend Default Luminance Range" disabled, the EV100 measurement is replaced with cd/m2. Enabling this setting fixed it for me!

  • @jackryan8588
    @jackryan8588 Před 6 dny

    Banging.

  • @MrKrelker
    @MrKrelker Před 6 dny

    Note for 5.4 users doing this now - the post process material at the time of this video was supposed to be set to Before the Tonemapper, however this option was removed in favor of several new ones. Using Scene Color After DOF produces visually similar result.

  • @YourSandbox
    @YourSandbox Před 6 dny

    As I understand, your outline works outside the mesh, which means I can't apply stencil check to not render it let's say if model is half in water. Any advice? UPD. Also, with this approach, I can exclude object that I don't want to use with shader :( correct me if I am wrong, but I can't see workaround here

    • @VisualTechArt
      @VisualTechArt Před 6 dny

      You can run a filter to expand the stencil of the pixels you need :)

  • @thomas-ly1zt
    @thomas-ly1zt Před 6 dny

    i really love all your videos and the mathematical approach! :-) But to be honest, i allways miss the "shader complexity graph". Anyways, grazie mille!

  • @songmars2713
    @songmars2713 Před 6 dny

    Does it work on mobile?

    • @VisualTechArt
      @VisualTechArt Před 6 dny

      Usually on mobile you use the forward rendering pipeline, right? If that's the case I would do a completely different thing :)

  • @Bunibuwu
    @Bunibuwu Před 6 dny

    Great video looking forward to part 2 :D

  • @RomarioDev
    @RomarioDev Před 6 dny

    yeah baby this is what i've been waiting for

  • @makachu4899
    @makachu4899 Před 6 dny

    How did you make the material at 14:28?

    • @VisualTechArt
      @VisualTechArt Před 6 dny

      If you mean the Custom Primitive Data, it's just a check you can turn on when you create a parameter

  • @MrZelda1313
    @MrZelda1313 Před 6 dny

    Firstly, THANK YOU for this amazing breakdown. I'll def watch the rest of your videos as well and come back to this one once more haha. I have a question, do you think there is a way with this approach to control the look of individual bands on the shadows? for instance making the transition have some texture, or a specific tint of color on one of the bands.

    • @VisualTechArt
      @VisualTechArt Před 6 dny

      If you want something only on a specific band, it's a bit tricky but I think you can take the CameraExposure value (the one for the bichromatic filter) and then go up or down by one band until you reach the one you want and do stuff :)

    • @MrZelda1313
      @MrZelda1313 Před 5 dny

      @@VisualTechArt thank you! I’ll make sure to try it 🙏

  • @troyhayder6986
    @troyhayder6986 Před 6 dny

    Are you a fookin robot??? Im about as good as you can get at unreal in the scope of still only human ...but your obviously nerdamatron robot...

  • @robadc
    @robadc Před 6 dny

    When I was in university I struggled for years (literal years) to try and make a toon shader in Unreal. Eventually I just gave up as the resources available and my own capabilities made me feel like I'd wasted a not insignificant part of my life. It's too late for me, but thank you so much for providing something so that the next batch of bright eyed kids don't give up on NPR.

  • @Aurich88
    @Aurich88 Před 6 dny

    I learned so much! Thank you for making this!

  • @pinkmoon5332
    @pinkmoon5332 Před 7 dny

    I'm glad they finally caught up to some of the other softwares that already have this. I guess everyone's leapfrogging everyone else.

  • @Tawbzz
    @Tawbzz Před 7 dny

    great work thanks !!

  • @swisspunker94
    @swisspunker94 Před 7 dny

    Hey man love the video, regarding the outline, you could also use the inverted hull method. This would yield a more defined and darker outline that (as far as i understand) doesnt compromise our lighting integrity. Would you agree with that or am I missing something?

    • @VisualTechArt
      @VisualTechArt Před 6 dny

      Thanks to the overlay materials it's finally possible to do the inverted hull, yes :) Depending on how you handle it's shader I think it can be adjusted to the same context I was working in

  • @Nvrwdntlso
    @Nvrwdntlso Před 7 dny

    If I just want to use this 21:06 as my cel shader is there a way to make hdr backdrops work because mine is just black

  • @RwanLink
    @RwanLink Před 7 dny

    How would you make the outline wiggle as if it was hand drawn each frame?

    • @VisualTechArt
      @VisualTechArt Před 7 dny

      With some UV offset probably :)

    • @RwanLink
      @RwanLink Před 7 dny

      @@VisualTechArt I don't know if you plan to make another part on outlines but that would be great to see how you would do that :)

  • @Mittzys
    @Mittzys Před 7 dny

    35:37 I think you invented image sharpening

    • @VisualTechArt
      @VisualTechArt Před 7 dny

      Well if you know how that works it's not that far off xD

  • @Mittzys
    @Mittzys Před 7 dny

    You singlehandedly saved thousands of indie devs... This is astounding!

  • @MarcoCaruso
    @MarcoCaruso Před 7 dny

    Man this is a gem!

  • @tylercathey8848
    @tylercathey8848 Před 7 dny

    you should do a kuwahara filter video! ive been really wanting to try it but i have no idea what im doing

    • @VisualTechArt
      @VisualTechArt Před 7 dny

      I used it once and definitely going to put my hands on it again :D

  • @ppgrillo9531
    @ppgrillo9531 Před 7 dny

    Can this be replicated on UE4?