Shader Graph basics in Unity

Introduction

Shader Graph lets you create cool visual effects for games without writing code. You connect blocks to design how things look.

You want to make a shiny or glowing surface in your game.

You need to create water or glass effects easily.

You want to change colors or textures based on game actions.

You want to learn how graphics work in a simple way.

You want to make your game look unique with custom visuals.

Syntax

Unity

1. Open Unity and create a new Shader Graph asset.
2. Double-click the Shader Graph to open the editor.
3. Add nodes by right-clicking and selecting from the menu.
4. Connect nodes by dragging from output ports to input ports.
5. Save the graph and assign it to a material.
6. Use the material on your 3D object in the scene.

Shader Graph uses a visual node system instead of text code.

Each node does a small job like color, math, or texture.

Examples

This makes the whole object red using a simple color node.

Unity

1. Create a Color node and connect it to the Base Color input of the PBR Master node.
2. Change the Color node to red to make the object red.

This example shows how to animate glow using time and math nodes.

Unity

1. Add a Time node and connect it to a Sine node.
2. Connect the Sine output to the Emission input of the PBR Master node.
3. This makes the object glow rhythmically over time.

This example applies an image texture to the object.

Unity

1. Use a Texture2D node to add an image.
2. Connect the Texture2D output to the Base Color input.
3. The object will show the texture image on its surface.

Sample Program

This script shows how to assign a Shader Graph material to a 3D object in Unity. It prints the material name before and after applying the Shader Graph material.

Unity

// This is a Unity C# script to create and assign a Shader Graph material
using UnityEngine;

public class ApplyShaderGraphMaterial : MonoBehaviour
{
    public Material shaderGraphMaterial;

    void Start()
    {
        if (shaderGraphMaterial != null)
        {
            Renderer objectRenderer = GetComponent<Renderer>();
            if (objectRenderer != null)
            {
                Debug.Log("Before applying Shader Graph material: " + objectRenderer.sharedMaterial.name);
                objectRenderer.material = shaderGraphMaterial;
                Debug.Log("After applying Shader Graph material: " + objectRenderer.material.name);
            }
            else
            {
                Debug.Log("No Renderer found on this GameObject.");
            }
        }
        else
        {
            Debug.Log("Please assign a Shader Graph material in the inspector.");
        }
    }
}

Important Notes

Shader Graph runs on the GPU, so it is very fast for graphics.

Creating complex effects may need many nodes connected carefully.

Common mistake: forgetting to save the Shader Graph before using it in the scene.

Use Shader Graph when you want visual control without coding shaders manually.

Summary

Shader Graph lets you build shaders visually by connecting nodes.

You can create colors, textures, animations, and effects easily.

Assign Shader Graph materials to objects to see your effects in the game.

Practice

1. What is the main purpose of Shader Graph in Unity?

easy

A. To write complex shader code manually

B. To create shaders visually by connecting nodes

C. To design 3D models for games

D. To animate characters in Unity

Solution

1. Step 1: Understand Shader Graph's function

   Shader Graph allows users to build shaders without writing code by using visual nodes.

2. Step 2: Compare options with Shader Graph's purpose

   Options B, C, and D describe other tasks unrelated to Shader Graph's visual shader creation.

3. Final Answer:

   To create shaders visually by connecting nodes -> Option B

4. Quick Check:

   Shader Graph = Visual shader creation [OK]

Hint: Shader Graph means visual node-based shader building [OK]

Common Mistakes:

• Confusing Shader Graph with coding shaders manually
• Thinking Shader Graph is for 3D modeling or animation
• Assuming Shader Graph is a text editor

2. Which of the following is the correct way to add a Color node in Shader Graph?

easy

A. Right-click in the graph and select Create Node > Color

B. Type 'color' in the console window

C. Drag a texture file into the graph

D. Use the Material Inspector to add a Color node

Solution

1. Step 1: Recall how to add nodes in Shader Graph

   Nodes are added by right-clicking in the graph area and choosing from the Create Node menu.

2. Step 2: Evaluate each option

   Right-click in the graph and select Create Node > Color correctly describes adding a Color node. Options A, B, and D do not add nodes in Shader Graph.

3. Final Answer:

   Right-click in the graph and select Create Node > Color -> Option A

4. Quick Check:

   Add nodes via right-click menu [OK]

Hint: Add nodes by right-clicking inside Shader Graph [OK]

Common Mistakes:

• Trying to add nodes via console or inspector
• Dragging textures instead of adding Color nodes
• Looking for Color node outside the graph editor

3. Given this Shader Graph setup: a Color node set to red connected to the Base Color input of the PBR Master node. What color will the object appear in the game?

medium

A. Blue

B. Green

C. Red

D. White

Solution

1. Step 1: Identify the Color node value

   The Color node is set to red, so it outputs red color values.

2. Step 2: Understand connection to PBR Master node

   The Color node connects to Base Color input, which defines the object's visible color.

3. Final Answer:

   Red -> Option C

4. Quick Check:

   Base Color input = Color node output [OK]

Hint: Base Color input shows connected Color node's color [OK]

Common Mistakes:

• Assuming default color instead of connected node's color
• Confusing node connections and outputs
• Ignoring the Color node's set value

4. You connected a Texture2D node to the Base Color input but the object appears white. What is the most likely error?

medium

A. The object has no mesh renderer

B. The PBR Master node is missing

C. The graph is saved but not compiled

D. The Texture2D node has no texture assigned

Solution

1. Step 1: Analyze the Texture2D node connection

   If the Texture2D node is connected but no texture is assigned, it outputs white by default.

2. Step 2: Check other options

   The PBR Master node is required but usually present; saving compiles automatically; mesh renderer missing would cause no rendering, not white color.

3. Final Answer:

   The Texture2D node has no texture assigned -> Option D

4. Quick Check:

   Unassigned Texture2D = white output [OK]

Hint: Assign textures to Texture2D nodes to avoid white output [OK]

Common Mistakes:

• Forgetting to assign a texture to Texture2D node
• Assuming saving is separate from compiling
• Confusing mesh renderer issues with shader color

5. How can you create a shader that smoothly changes an object's color from blue to green over time using Shader Graph?

hard

A. Use a Time node connected to a Lerp node blending blue and green colors, output to Base Color

B. Add a Color node set to blue and animate it manually in the inspector

C. Connect a Texture2D node with a blue-green gradient texture to Base Color

D. Use a Vector1 node to switch instantly between blue and green colors

Solution

1. Step 1: Understand color blending over time

   Smooth color change requires blending two colors based on time, which Lerp node does.

2. Step 2: Use Time node and Lerp node

   Connect Time node output to Lerp's T input, and set Lerp's A and B inputs to blue and green colors respectively, then connect to Base Color.

3. Step 3: Evaluate other options

   Add a Color node set to blue and animate it manually in the inspector requires manual animation, not smooth automatic change. Connect a Texture2D node with a blue-green gradient texture to Base Color uses static texture, no time change. Use a Vector1 node to switch instantly between blue and green colors switches instantly, no smooth transition.

4. Final Answer:

   Use a Time node connected to a Lerp node blending blue and green colors, output to Base Color -> Option A

5. Quick Check:

   Time + Lerp = smooth color change [OK]

Hint: Use Time node with Lerp for smooth color transitions [OK]

Common Mistakes:

• Trying manual animation instead of node-based blending
• Using static textures instead of procedural nodes
• Switching colors instantly without interpolation