Shadergraph: Sine
Tutorial
·
Beginner
·
+0XP
·
15 mins
·
(66)
Unity Technologies

Sine waves are useful and versatile when it comes to shaders and animation. With sine waves, you can create an illusion of vegetation moving in the ambient wind, or creating rolling waves across the ocean. In this tutorial, you will learn to use the Sine node to create Custom Shaders.
Languages available:
1. Shadergraph: Sine
This tutorial has been verified using Unity 2019 LTS and Shadergraph 7.3.1
Sine waves are useful and versatile for Shaders and animation using the Sine Shader Graph node. For example, you can use sine waves to create an illusion of vegetation moving in the wind, or rolling waves in the ocean. A sine wave is useful because its curve can be used to oscillate a parameter, such as speed. As the curve rises and falls, a smooth increase and decrease in speed will occur. This natural motion makes sine waves popular with animation in Shaders, such as when applied to physical animations and for animating a color changing for more complex solutions.
2. Creating the Shader Graph
To begin, create a Shader to use as an example:
1. Right-click in your project and select Create > Shader > PBR Graph.
2. Name the new Shader SampleGraph.
3. In the new window that opens, right-click and select Create Node.
4. Type the word Sine and click the result that matches.
You will now have a Sine node in your graph (Figure 01).

Figure 01: Sine node
The Sine node provides access to a single input and output.
- In: This takes a dynamic vector as its input value.
- Out: This returns a dynamic vector as its output value.
An example of using the Sine node is to create peaking waves for your Shader. To do this:
1. Create an Absolute node and plug your Sine Out to the Absolute In.
2. Create a One Minus node, and plug the Absolute into its input.
3. Create a Power node and plug the One Minus into the A input (Figure 02).

Figure 02: Nodes to create a peaked sine wave.
Because the Sine node uses World Space and time to generate a sine wave, you need to use an absolute node to flip the negative values. The One Minus node then inverts these values so that the wave tips are at the top (Figure 03).

Figure 03: The sine wave representation after each operation.
Here, you have a peaked sine wave that you can apply to a more complex Shader, such an ocean.
3. Next steps
The Sine node is a fundamental and useful node for building more complex Shaders that deal with animation, such as grass sway, foliage, or ocean waves. Why not try to make a simple ocean Shader with the knowledge of how to use the sine wave to create those much-needed wave peaks?