Intro to Shader Graph in Unity (Part 1 - Your First Shader)

Shader graph is unity's visual editing tool for shaders and it lets you create many of the effects that were previously only possible to make with Shader code but nodes are fun and quicker to get to grips with so here we are in this tutorial I'm going to go over the absolute basics of Shader graph from setup to the interface to making your first shaders I will be working with unity 2022.3 the latest long-term support version of unity as of the making of This tutorial I will also be focusing on 3D although shadowgraph does support 2D one of the biggest changes to ShadowCraft in recent-ish times is that it works in all of unity's render pipelines if you've never encountered unity's different render pipelines before then welcome to the southern circle of Hull which is apparently violence yeah that checks out when you create a new Unity product through the unit Hub you will be confronted with several template options but there's three main ones I want to highlight 3D creates a new project with the built-in render pipeline which is the Legacy renderer which has been around forever Christ only knows why it doesn't name something like 3D with built-in render pipeline for clarity then there are options to create a urp project which is the universal render Pipeline and is intended for games to work on any device from Mobile to desktop to console and an hdrp project which is the high definition render Pipeline and is intended for high-end PC and console development if in doubt I suggest picking urp as a starting point that's what I'm going to use for the tutorial if you paid urp or hdrp you'll need to install the Shader graph into your product great if you pick the built-in render pipeline by clicking the 3D preset it won't in that case go to window package manager change the packages drop down to unise registry to bring up the full list of available packages and search for Shader graph with the Search tool once you've found it in the bottom right click the install button it might be a good idea to check it's there even if you are using your PR hdrp just in case the first Shader we will make will let us set a color for the object and change that color to whatever we want to visualize the Shader once we're done I'm going to add a sphere to my scene and later will attach materials to the sphere to see our shaders in action it's not the fanciest thing in the world but it's a start everything should be set up now so I will create a new graph I usually put my shaders into their own folder named shaders but you can organize your project however you see fit right click in the project View and go to create Shader graph you may see slightly different options based on Pipeline you are using but generally you should pick from the ulp hdrp or built-in submenu whichever one corresponds to the pipeline you picked each pipeline has slightly different presets but all pipelines have lit and unlit presets I'm going to pick unlit to begin with and I'm going to name my graph color example even though I'm British I am forced to adopt American English spelling of color to stay consistent with how every programming language spells color by double clicking this graph icon Unity will open the Shader graph editor window like many Unity Windows it's dockable and resizable so you can have it in place of the scene view or as a sidebar or you can undock it and maximize it to take up the whole screen the interface is split into a few disdained parts all the magic happens in the Middle where you will see the output stack the bit I'm interested in right now is called base color if you click the little box links to base color a color wheel will show up and we can choose any color we want I'm going to use a lovely blue color then we can click off the pop-up now go to the top left and click the save asset button this step is important and I want to drill it into your mind right now that you need to click the button because for some reason just pressing Ctrl s doesn't actually save your changes to the graph so save acid is your friend and you should treat it right back in the scene view I want to use this Shader for my sphere so create a material by right-clicking the color example graph we made and going to create material you should see a material which uses the color example Shader but if you ever want to manually change the Shader that a material uses you can go to the Shader drop down at the top of the inspector and pick it from the list your graphs should be in the Shader ref's subfolder by default drag the material onto the sphere at water and Bloom Mission successful that's nice but of course it's just one color so we can create a million materials with the Shader and will all be the same blue it would be nice to be able to modify the color in the inspector so that we can have lots of materials with different colors by making just one Shader hop back into the Shader graph window we are going to add a property which is like a variable this small window in the top left corner is called the Blackboard and the plus arrow lets us add graph properties click it and find the option called color you can double click the property to rename it so a name like color or base color or my color or all fine just go with something descriptive now left click and drag it towards the middle of the graph that's your first node nodes are the bits of functionality that we can string together to make up the behavior of the Shader but this is a pretty simple Shader so left click and drag a wire between the tiny circle on the right of the color property node and the tiny circle on the left of the base color output I variously refer to these circles as pins or sometimes just inputs or outputs the graph is now set up to use this property for the color of our object but we can go a bit further to make it nicer to work with the property when creating materials click back on the property then turn your attention to the window in the top right corner which is the graph inspector it has two tabs so make sure the node settings tab is selected here we can change a few things about the property like the default value which starts off as black I'm going to change it to Blue which means any material created with this Shader will start off as blue also make sure the exposed box is ticked which makes it appear in the material inspector we're done with the graph for now so click save asset again and come back to the scene View now we can choose any color we want and when we duplicate the material with Ctrl D we can pick a different color with one very simple Shader we've added some customizability that will make the Shader a little bit more versatile I will continue this tutorial in future Parts which will cover textures lighting transparency and some scripting hopefully Unity still exists at that point thanks to my patreon supporters for making this video possible and until next time have fun making shaders

Channel: Daniel Ilett

Views: 6,918

Keywords: unity, unity shader graph, shader graph tutorial, shader graph basics, shader node, node, base color, unlit graph, your first shader, beginner shader, shader, shaders, unity3d, made with unity, urp, universal render pipeline, unity 2022, unity 2022 lts, unity lts, unity shader, unity setup, install shader graph, shader graph node, shader property, gamedev, game shader, shader tutorial, gamedev tutorial, unity tutorial

Id: TbZYoSu1w8Y

Length: 7min 40sec (460 seconds)

Published: Tue Sep 26 2023