![Visual Tech Art](/img/default-banner.jpg)
- 41
- 770 214
Visual Tech Art
Italy
Приєднався 4 лип 2020
Hi,
I'm a Senior Technical Artist, specialized in Shaders, VFX, Procedural Content Generation and any cool visual stuff that has been working in the video game industry for several years.
I've always been passionate about teaching and I want to share my knowledge in form of tutorials using this channel.
I cover basic and advanced stuff, always spiced with some extra stuff that usually is never explained in standard tutorials.
I'm a Senior Technical Artist, specialized in Shaders, VFX, Procedural Content Generation and any cool visual stuff that has been working in the video game industry for several years.
I've always been passionate about teaching and I want to share my knowledge in form of tutorials using this channel.
I cover basic and advanced stuff, always spiced with some extra stuff that usually is never explained in standard tutorials.
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: ua-cam.com/video/AgVedkJUEyA/v-deo.html
Outline Shader 1: ua-cam.com/video/Ptuw9mxekh0/v-deo.html
Outline Shader 2: ua-cam.com/video/UWQonxtG10g/v-deo.html
Intro to PB Lighting: ua-cam.com/video/vbMvkEITTmo/v-deo.html
Intro to PB Lighing - Follow-up: ua-cam.com/video/yhu-QoEgHUo/v-deo.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
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: ua-cam.com/video/AgVedkJUEyA/v-deo.html
Outline Shader 1: ua-cam.com/video/Ptuw9mxekh0/v-deo.html
Outline Shader 2: ua-cam.com/video/UWQonxtG10g/v-deo.html
Intro to PB Lighting: ua-cam.com/video/vbMvkEITTmo/v-deo.html
Intro to PB Lighing - Follow-up: ua-cam.com/video/yhu-QoEgHUo/v-deo.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
Переглядів: 90 561
Відео
Follow-up of Physically Based Lighting and Cinematics - Lighting for Videogames
Переглядів 1,9 тис.2 місяці тому
This is a follow-up of this video: ua-cam.com/video/vbMvkEITTmo/v-deo.html Full Playlist: ua-cam.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]
Переглядів 7 тис.4 місяці тому
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: ua-cam.com/video/Cq5H59G-DHI/v-deo.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
Переглядів 9 тис.5 місяців тому
This video has a follow-up: ua-cam.com/video/yhu-QoEgHUo/v-deo.html Full Playlist: ua-cam.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]
Переглядів 21 тис.6 місяців тому
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]
Переглядів 12 тис.9 місяців тому
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]
Переглядів 26 тис.Рік тому
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
Переглядів 4,5 тис.Рік тому
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]
Переглядів 7 тис.Рік тому
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
Переглядів 8 тис.Рік тому
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]
Переглядів 21 тис.Рік тому
Previous video of the serie: ua-cam.com/video/Ptuw9mxekh0/v-deo.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]
Переглядів 7 тис.Рік тому
How to fake 8K texture quality [UE5/UE4]
This is NOT a Sphere! - A brief Ray-Casting overview for gamedev [UE5, UE4]
Переглядів 8 тис.Рік тому
This is NOT a Sphere! - A brief Ray-Casting overview for gamedev [UE5, UE4]
Outline Stylized Material - part 1 [UE5, valid for UE4]
Переглядів 44 тис.Рік тому
Outline Stylized Material - part 1 [UE5, valid for UE4]
The ONLY texture a game NEEDS [UE4, valid for UE5]
Переглядів 71 тис.Рік тому
The ONLY texture a game NEEDS [UE4, valid for UE5]
ADVANCED VORONOI fixes problems you didn't know about (UE4, valid for UE5)
Переглядів 11 тис.2 роки тому
ADVANCED VORONOI fixes problems you didn't know about (UE4, valid for UE5)
Smooth Min&Max - math for visual people
Переглядів 4,5 тис.2 роки тому
Smooth Min&Max - math for visual people
HYPER-REALISTIC Grass Wind Animation [UE4, valid for UE5]
Переглядів 34 тис.2 роки тому
HYPER-REALISTIC Grass Wind Animation [UE4, valid for UE5]
Dissecting and Optimizing UE's Simple Grass Wind material function
Переглядів 4,4 тис.2 роки тому
Dissecting and Optimizing UE's Simple Grass Wind material function
Understand Voronoi and its Implementation (UE4, valid for UE5)
Переглядів 12 тис.2 роки тому
Understand Voronoi and its Implementation (UE4, valid for UE5)
Fish Eye Post Process Effect (UE4, valid for UE5)
Переглядів 11 тис.2 роки тому
Fish Eye Post Process Effect (UE4, valid for UE5)
Comprehensive Niagara Structure Overview (UE4, valid for UE5)
Переглядів 3,3 тис.2 роки тому
Comprehensive Niagara Structure Overview (UE4, valid for UE5)
Advanced Volumetric Fog with Ray Tracing (UE4, valid for UE5)
Переглядів 18 тис.2 роки тому
Advanced Volumetric Fog with Ray Tracing (UE4, valid for UE5)
How to make Camera Facing Billboards (UE4, valid for UE5)
Переглядів 30 тис.2 роки тому
How to make Camera Facing Billboards (UE4, valid for UE5)
Vertex Animation Basics in Shaders using World Position Offset (UE4, valid for UE5)
Переглядів 20 тис.2 роки тому
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)
Переглядів 10 тис.2 роки тому
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)
Переглядів 96 тис.3 роки тому
Cel Shading and Light Types (UE4, valid for UE5)
Infinite Non-Repeating details in materials (UE4, valid for UE5)
Переглядів 8 тис.3 роки тому
Infinite Non-Repeating details in materials (UE4, valid for UE5)
How Naughty Dog does puddles [UE4, valid for UE5]
Переглядів 13 тис.3 роки тому
How Naughty Dog does puddles [UE4, valid for UE5]
hi, i love your tutorials.. can you make a tutorial where seeing from above the water has no outline effect under the water and vice versa.
Let's see :)
The gumroad store makes me laugh, since it asks to "name a fair price" for the shader, but the minimum price is $55. No, I don't think $55 is a fair price. Nor do I think spending $3 on your patreon to bring it down to $44 is a fair price, but it's closer (oh yeah, and this is just the cell shading, so you'd still have to buy the outline shader for the full effect). I know it's a lot of work, but I honestly think you'd make a lot more if the price was lower or they were just included on Patreon for $10-$20 a month. For that price, I'd be happy to play around with it. For the $70 or so it would take to get it all in a project, I'd have to be pretty committed to actually using it for something.
If you hired me in your studio and asked me to make this, by the time it was done you would have paid me around 15000€ more or less, based on my last salary :) The fact that you have no clue about what you have in front of your face doesn't really matter to me. And you can always put in the work and replicate it for free, so why the complaint?
can you please make this effect also available in gumroad to buy?
This is more of a collection of Shaders, Blueprints and systems that I mashed up together to demo the thing, it's not good enough from a professional point of view to be sold :D
@@VisualTechArt i see, maybe you have take out only the shader from the project and sell it ;)
Wish he would use this on a fully textured model so i can see the before and after rather than on a statue
Finally not the average UA-camr. You are in my list of 3 now, and thank you for the accent, easily recognizable fratello
:D
@@VisualTechArt can I ask you where are you working? All colleagues I found in this job are rarely at this level
Since July I've gone full time on this, my last job was at Underdog (CI Games), before that I worked at Splash Damage, even before in Milestone (as every Italian that works in video games, I think xD)
Legend for sharing this
Hi, Just purchased the gumroad pack. I was wondering if there's a way to exclude meshes? So that it can just be used on particular assets. Also are you on Discord? Thanks!
You can do the usual set up with the Custom Stencil for that :) Yes I have a Discord Serv
@@VisualTechArt Awesome thanks. I've swapped out the sky mask for the stencil as this allows me to turn it on per object.
This is the best tutorial to explain how a cell shader works that I’ve come across thank you so much, I’m going to be rewatching this over and over to learn what is really going on in the shaders.
excellent video - I really like all the diagrams to explain the math
Fantastic video, and im not just talking about the information, just a really good, pedagogic/approachable, entertaining and well made explanation.
Coming back to this video after seeing the "Unfeatured Features of Unreal Engine in 2024" video from EPIC and wanted to bring up something I don't remember you touching on, in UE5 there is now a "Local Expose" setting as it does 2 expose passes and blends them together letting you bring out details in the darker areas.
We didn't touch Local Exposure on purpose in this video :) Eros has more stuff cooking on that topic! :D
Your video was interesting and I appreciate the time you've put into it. I zoned out a couple of times but I think I can understand the why more than the how. I've been trying to make a universal foliage (trees, bushes, flowers, weeds, grass, flotsam) bundle for all of my own game ideas going from blender into Godot or Source 2 (Sandbox). It's only been 5 months since I started and I don't think I'm any closer to getting it completed, just a whole bunch of false starts.
Great stuff! Really amazed. However I got stuck at the RGBToHSV and HSVToRGB nodes. Cannot seem to find them anywhere in the engine (are they custom made?). Tried to gather all the references i could find on the internet, however it seems like the information have been well hidden (some sort of exotic lighting guys secret tecniques that must not be shared with the unworthy?). I am sure I am missing a step. Could anyone please address me to the solution? thank you all in advance.
They're Engine Default nodes :) Even though depending on which version you have you might not have them, they haven't been added too long ago
@@VisualTechArt Thank you for the prompt reply. I am currently using a 5.0 version of the engine. Probably this is more of a 5.4 node. The fact that i could find references on the UE documentation, but no way to call those nodes really put me on a struggle. Thanks for the heads up, and again, awesome tutorial serie! you really gave me a great perception of how lighting works in a virtual environment. can't wait for more :)
is there any way too randomise the colors of each voronoi to a different hex code
What do you mean? What would be the purpose of the hex code?
I found that post-processing Scene after DOF, the sceneTexture gets a metallic that is all black.
Be sure to select the correct Buffer
Circa 18:57 is the actual node setup, of anyone was wondering
8:20 Wait a second, you're subtracting camera position from object position meaning you're getting a vector that points from camera to object, NOT from object to camera, which was what the X axis should be. How come this works?! Normally a vector from point A to B = B-A.
Follow the signs xD
@@VisualTechArt I can see that the normals are rotated later towards camera. that is enough? It doesn't matter that the triangles are drawn in reverse order?
HOW ARE YOU THIS GOOD WTH!!!!!!!! You've just completely transformed my pitiful attempts of cell shading in UE, seriously! I may be just a minuscule passionate game dev, but geniuses like you inspire me to keep pushing at it. Here's my subscription and my eternal gratitude, CHEERS!
COOL
this is the first unreal tutorial i have tried to follow, came across a problem with weird artifacting of the shapes not fitting together entirely, and it partially showing a second grid of colors behind the voronoi, took me about 2 days too fix, in the end i made a 5 by 5 grid at 6:01 instead of 3 by 3 and that seemed too fix it, i assume it was something too do with the voronoi stretching outwards more then they were able too render,
what a legend!! thanks for the consise and clear tutorial
10:25 - Ah, I see you too are a veteran of the game development industry.
I keep saying that all the time 1K and 2K are more than sufficient. 4K textures will only hinder the systems with little to no gains in visual quality
This tutorial was amazing! I'm curious though, is it possible to increase the size of the darkest EV band?
As long you can translate your idea to a formula, you can do whatever you want ;)
what ?
How do I exclude some objects/characters from the postprocess with this approach :(
Usual custom stencil stuff :)
I very much appreciate this tutorial and also watched the lighting discussion as that information is so valuable. However, The issue I have with following this method is emissive or unlit materials are not talked about (unless I keep missing it)... and they don't seem to work when adjusting the directional light and post process settings in the very beginning. I don't have the knowledge to work around this. For example, my sky sphere, which is emissive and contains all my sky, sun, moon and clouds is black and broken as it is an emissive unlit material and I have no idea how to recover it without lowering those MinEV100-MaxEV100 values. It's forever black... I've tried messing around in it's material but to no avail. Am I missing something something obvious here?
Whoops, I see this is discussed in the follow up lighting video. Just need to apply those changes inside the emissive materials. HOWEVER, shadow invalidation is still a problem with post-process cel shading and an animated directional light (i.e Day/Night) This problem is never discussed. I hope to bring awareness to this somehow. After exploring as many options as possible I am starting to come to the conclusion that the engine just isn't practical at face value for this style. The best approach as always would be to modify source and create your own shader model... but that is an extreme jump from In-Engine Post-Process... I'll keep trudging through the web to see what I can find. But I'm certain you start animating that directional light and your shadows will fall apart.
Shadow invalidation is completely unrelated to the cel shader, it's an issue you get from using the VSM. You can't run away from it if you want a dynamic light :) But those are things that I hope to be able to discuss in another context
@@VisualTechArt You're right it is unrelated, I guess the shading method just reveals the underlying behavior more? Either way, I'm struggling to get these methods of cel-shading to produce "stable" shadows with an animated directional light using VSM or standard. I'm definitely sticking around for more. I've gained so much from your videos I've managed to apply already. Thanks heaps!
You kind of sound like Microsoft Sam
Such a great video! However, I'm facing a small problem where I have a red tint appearing mostly in the shadows, regardless of the time of day. Looking at the graph, it appears after the last HSVToRGB node, before the SceneTextures Input0, BaseColor, and BlackMask lerp. Do you have any idea why? Thanks in advance!
Can't tell, try to ask in my Discord Server maybe :)
@@VisualTechArt No problems! Thanks again!
masterpiece
Awesome! But, i'm having this issue: when i work with the bend parameter, it bends only in the center of the leaf, and not a rounded movement like yours. And it stretches the mesh, making it larger. Could you help me please?
It's a bit hard from here... Is the pivot point at the base of the blade? Is Nanite disabled on the mesh? (You need to modify the shader a bit to make it work with it)
hi this is awesome i dont know how to fix the color effect of the waves it is not visible on the white landscape but if you paint landscape green R=0 G=0.03 B=0 the closer to the camera the darker the further it is lighter as if you yourself are the source of the darkness
That's weird... But in general, as I say in the video, you don't want to go that low with Base Colour values :)
@@VisualTechArt it means that I was inattentive, i think for the same reason floating dark spot in the shadow around an object where it touches something, 36:19 example of a dwarf foot
Thank you very much for your tutorial. 😘😘😘I completely reproduced it in version 5.3 according to your method, which is very good. The effect is exactly the same, and you really saved me. But there is a doubt: why does the 3D model finally become a 2D patch? I don't understand. It's good to use it to make grass. It's strange to apply it to trees😅
Since I wrote the shader for grass, I did some simplifications and assumed the 3D mesh is flat, probably :) So if you try it on trees it might flatten them
@user-cz1de3uy5l Have you made it work with 3D objects? I try to replicate the look of wind effect with a wheat field and at least for the models in front, I want them to be 3D. :)
Okay, but why? Is this more performant? Wouldn't ray casting be more computationally demanding?
Up to you to decide what to do with the knowledge :)
@@VisualTechArt No worries. I was just curious to know what the motivation behind making it was. It's very cool and impressive.
I can't seem to implement the "animation" on this. any tips?
Try rotating the vectors that offset the cell center ;)
For the Directional Light Material, if you use an Atmosphere Sun Light Vector (UE5.4) rather than a float 4 color parameter at the start -- then you'll have the cells actually following the directional light's rotation.
When I made this video that node didn't exist xD
Wow this is great
Mate, the value and quality of this video is beyond anything I've consumed in regards to UE learning videos on UA-cam! The editing is so incredibly well done as well. I started watching this in bed last night while doing research for my project and usually when I find stuff this late I just bookmark it and go through it in my next session but the start of the video and every single minute until the end was so captivating that I ended up watching the entire thing immediatly anyways. Spectacular job!
Cheers! :D
Unfathomably based.
A really fantastic explanation.
dude....
Fantastic video, you did a great job explaining the pitfalls of commonly-taught methods and how to circumvent them. I do, however, have a minor correction for your comment at 20:15 In many applications HSL stands for Hue, Saturation, Lightness and is different from HSV or HSB. With HSL, the output will always be white when L is 1.0, where with HSV white can only be achieved if V is at 1.0 and S is at 0.0. That application of HSL is not very relevant here, but distinguishing between the two might help someone coming from a CSS background or something similar.
Yep, that was an oversight :)
Pretty good. The only real thing I really see is that it's slightly lighter.
This is the quality I wish every unreal video had.
This video is absolutely terrific! As someone who's trying to learn unreal based on tutorials I find online, I find this approach for sharing knowledge extremelly effective. Not only dumping information, but explaning why you used each node, comparing with other approaches, explaining their downsides, etc. Not to mention how good looking the result is, showing how good of an artist you are. If you ever decide to create an Unreal course, please let us know!
I'll make a proper course at some point in the future for sure :D
Idk about anyone else but this video makes me want to be your intern lol. Although I would clearly need to re-learn calculus so I could follow along. But nonetheless, seeing cel shading being represented through a physically appropriate viewpoint makes the entire style seem formulaic, which is baffling. An art style beginning as hand drawn and then being created in an engine as sophisticated as UE is genius work. I want to try these ideas out myself for an indie game I’m working on. All credits for the shader will absolutely go towards this channel and expect a fat donation if it makes money haha 🙏🏽
I used to have a trainee tier on Patreon, actually, but I stopped it for the time being :D
@@VisualTechArt I am actually starting my journey at the Academy of Arts Uni in San Francisco. I’ll be networking as much as I can, but definitely would hope to someday meet. I appreciate the amount of resources on your channel as said by others in the comments; this information is great for indie devs. It’s a breath of fresh air for me as I don’t just want to follow the node system verbatim, I would need to know the WHAT, WHY, WHEN, WHERE, and HOW of game development standards. Your tutorials do just that and when further detail is needed, you mention so as to communicate that the professional pipeline has more to teach which I haven’t seen from other channels I’ve found. Also from watching your video with Eros, I’m going to take it upon myself to ensure I pickup some forms of coding along the way. And LIGHTING FUNDAMENTALS BEFORE STARTING! lol. Much appreciated!!
Great video, however I must note that HSV is not the same as HSL, only very similar.
Is there a way to make this pp material work with emissives? Can't find a way around emissive materials... All emissive surfaces showed as black, only lumen is slightly leaking through this pitch black color. I've seen you answered that Emissive is not considered as another channel, but what is it then? I wish i could just make a mask for all emissive surfaces, like you did with metals... Would appreciate your input and opinion on this problem, thanks!
Hey, sorry for the wait for my reply, but I was scared I didn't test it at all, given your comment, so I needed to find the time to double check ahahah It works perfect as it is with emissives, maybe you're just using values that are too small, if you set the lighting as I did in this video :) Crank it way up, like 40000 or more, they'll show up :D
@@VisualTechArt yeah, i guess i missed something, but when i break down my scene to HSL values and then back to RGB, it completely darkens emissive values. What did work out is passing emissive values into actual base color. Ill try cranking it up to big values, thank you! Guess its one of the reasons to rewatch lightning video
Great breakdown! I'm using the M_CPD_Base material on a asset with multiple material slots. How can I set different primitive data for each material slot?
Never thought about that use case tbh xD I guess you can't, the Data is set once per mesh
woow. i llove the look!. i think moebius artworks might have influenced you.