Intro to Unity Shader Graph (Part 4 - The Depth Buffer)

in part three we saw how transparent rendering Works in Shader graph and in this part we will be exploring the depth buffer in the previous part of this series I mentioned that we can skip over rendering parts of objects if we know something was already rendered in front of it but how does the rendering pipeline know anything about the relative order of objects colors get rendered to the frame buffer it's essentially an image with the same dimensions as your screen and a shaders job is to fill this buffer with color values with this information alone it's impossible to tell if we're about to draw over a pixel when we're not meant to that's why we use a secondary buffer called the depth buffer it's sometimes also called The Zed buffer this is a second image which is the same size as the frame buffer except it stores the distance between a pixel on an object and the camera well it doesn't store this distance exactly but this is a bit complicated the depth buffer stores values between zero and one in a nonlinear relationship which prioritizes more bits for closer objects for higher Precision close to the camera all we need to know right now is that when we render something we calculate the depth value of wood draw ring and compare it with the depth buffer value this is called depth testing if the thing we're drawing has a lower or equal depth value we draw our new object over the existing one then if the thing we are drawing is opaque we also overwrite the existing depth value transparent objects typically don't write depth values all of this comparison happens automatically partway through rendering the object we don't need to write anything or add any nodes to make it happen now now let's explore depth in more depth I'm going to copy the color example Shader from part one and name the new one depth example don't worry if you never watched that part the graph is very basic and looks like this we are interested in the graph settings window in particular the depth right and depth test options depth right lets you decide whether this object will overwrite depth buffer values if the depth test was successful the the default setting is auto which does right for opaque objects and does not for transparent objects you can choose to force the setting to be enabled or disabled but I'd mostly just keep it as Auto depth test is more interesting it lets you pick which kind of comparison is made when attempting to write new pixels the default is L equal short for less or equal which is the behavior I described the test passes if the new object is closer or equal to the last drawn object at the same position however we can change it in many ways always means the new object is drawn regardless of the depth of any existing objects never will fail every time greater will only draw the object if there is an object in front of it and so on you can create all sorts of strange materials using these settings and I'd encourage you to play around with different settings to see how they interact with regular objects which use Lal dep testing the allow material override button is especially useful here because enabling this option means you will be able to modify these depth settings and some of the other settings on a per material basis rather than on only a per shade basis if we leave it unted remember to hit save acid as usual when you are done tweaking settings so far it doesn't really feel like we've done much Shader work so let's explore other ways of working with depth our shaders can't read the depth buffer directly instead after all opaque objects have been drawn Unity copies the state of the whole depth buffer into What's called the camera depth texture or just depth texture for short this texture is accessible to our shaders however we should keep two things in mind first the texture only contains useful information if we're writing a transparent Shader and second the texture will not contain any information about the depth of transparent objects to use this texture in urp we will first need to enable it this is another of those things I really want to drill into your brain because you will forget this step in future projects first find the urp asset your project is using if you created the project using the urp template then this asset is in assets SL settings in fact there will be three of them and you should follow these steps for all three select each one and tick the depth texture setting right at the top of the inspector window now that we have everything set up let's make a silhouette Shader which I'll make from scratch via create Shader graph urp unlit Shader graph and I'll name it silhouette example first things first go to the graph settings and change the surface to transparent then I'll add two new color properties one called foreground color and the other called background color just to make sure that default values are distinct next add a node called scene depth by default this node samples the depth texture using the screen coordinate of the current pixel being rendered so we don't need to worry about imposing anything to the node it has a little drop- down menu with three options the raw option grabs the depth value and does no changes to it this is the weird nonlinear value I talked about previously and it is between Z and one the linear o01 option linearizes the depth value and it is also between zero and one being linear in this context means an object that is twice as far away or have twice the debt value which doesn't happen in raw mode the I option converts depth values to distances in World space units basically meters from the camera it's useful for some effects for a silhouette effect linear o1 is actually perfect next I'm going to add a lurp node to My Graph lurp is short for linear interpolation which is a fancy term which just means I'm going to blend or mix between two values the A and B inputs are the two values getting mixed and the T input is how far along between A and B we are on a straight line T should be between Z and 1 so when T is 0.25 it means we mix 75% of a and 25% of b as you might have guessed we can plug the scene depth output into the t- slot then plug the foreground and background colors into the A and B slots respectively finally we can locked the L output into the base color output block hit save asset and come back to the same view I'm going to place a sphere with my Silhouette material in front of a few objects and see what it looks like in the game view here I can't really discern some of the scene objects and that's because the far clip plane of the camera is 1,000 by default so the0 to one depth range is stretched over 1,000 World space units if we reduce the this value massively to something like 20 we should see the difference more clearly in the next part we will cover the vertex Shader stage and create some effects that operate on the vertices of an object rather than the color of its pixels hit the Subscribe button if you want to know when more parts come out thanks so much to my patreon supporters who are on three right now your support means a lot you can sign up today with perks like Early Access and free copies of my premium Shader packs until next time have a great time making shaders

Channel: Daniel Ilett

Views: 3,694

Keywords: unity, gamedev, unity3d, shader, shader graph, shader tutorial, gamedev tutorial, unity beginner, beginner shader, depth, depth buffer, depth texture, camera depth texture, rendering, graphics, transparency, opaque rendering, transparent rendering, render, renderer, render pipeline, urp, silhouette effect, effect, vfx, visual effect, shader basics, hologram, lequal, depth sorting, front to back, back to front, tutorial, camera, far clip plane, near clip plane, clipping, culling

Id: MndZYDHB4zE

Length: 8min 36sec (516 seconds)

Published: Wed Dec 20 2023