Lesson 35 +10 XP

ShaderGraph Visual Editor

ShaderGraph Visual Editor

Shader Graph is a visual editor in URP and HDRP that lets you create custom shaders without writing code.

Node-based Architecture

In Shader Graph, you construct shaders by connecting Nodes together on a canvas:

  • Input Nodes: Feed data into the graph (e.g. UV coordinates, Time, custom variables).
  • Operator Nodes: Perform math operations (e.g. Multiply, Add, Sine, Lerp).
  • Master Stack: The final destination node. It has ports for Base Color, Normal, Metallic, Smoothness, and Emission. You connect your math nodes to these ports to produce the final material look.

Creating Shader Graphs

  1. Right-click in the Project Window and select Create -> Shader Graph -> URP -> Lit Shader Graph.
  2. Double-click the asset to open the Shader Graph editor window.
  3. Right-click the canvas and select Create Node to search for nodes (e.g. "Time" or "Multiply").
  4. Drag connections between ports.
  5. Click Save Asset in the top-left of the graph editor.

Material Properties (Blackboard)

To make variables editable on materials in the Inspector:

  1. Click the + button on the Blackboard panel in Shader Graph.
  2. Select a type (e.g. Color, Float, Texture2D) and name it.
  3. Drag the property onto the canvas to use it.
  4. Check the Exposed box in the Blackboard details to make it visible in the Material Inspector.

TL;DR

  • Shader Graph is a visual, node-based shader editing tool for URP/HDRP.
  • Connect math and texture nodes to ports on the Master Stack.
  • The Blackboard is used to create exposed material variables.
  • Remember to click Save Asset after making changes in the graph editor.