Create particle spawning positions with Visual Effect Graph

Trigger effects between particles with Visual Effect Graph

Challenge: Create a Firework Effect using a GPU Event

Integrate Shader Graph into Visual Effect Graph

Challenge: Use a GPU event to spawn the rocket trails

Creating Fireworks with VFX Graph and ShaderGraph - Recorded Learn Live Session

VFX_201_ProjectFiles.zip

In this project, you will learn how to apply and configure some of the key VFX properties in Unity’s Visual FX Graph tool. You will utilise GPU events to create realistic fireworks effects, and you will learn how to integrate Shader Graph with Visual Effects graph to enhance the look and feel of visual effects.

Suggested Skill Level & Prerequisite Knowledge - It is expected participants should already have some understanding of the following:

Unity Editor level: Beginner to Intermediate

Creating fireworks with VFX Graph and ShaderGraph

5dad85f9-4d48-50f1-9e72-c3dc2f982231:zx7pohSEomVRos4yXEolCH

Introduction

Before you begin

Add position blocks to an effect

Next steps

With Unity’s Visual Effect Graph, you can choose where particles spawn using predefined volumes and shapes. In this tutorial, using a simple fireworks display, we’ll explore what a position block is and how it can be used to initialize particles. This tutorial also covers sequential spawning blocks and how you can use them to extend basic particle spawning.

Games

Film

Automotive

With Unity’s Visual Effect Graph, you can use position blocks to define a space from which particles spawn. Position blocks are configured as basic shapes; you can use these shapes as volume, surface, or thickness areas for spawning particles.

The Visual Effect Graph also has sequential position blocks that allow you to define a grid and cycle through the points on the grid to dynamically sequence the position where particles spawn. This is useful when you want particles to spawn from different positions within a fixed area (Figure 01).

Position blocks can also be layered within a particle system to create more complex shapes and spawning volumes.

This image shows fireworks created in Visual Effect Graph as particles that are spawned from different positions with a sequential line position block:

	Figure 01: A fireworks display effect in which particles are spawned from different positions

Before you begin this tutorial, install the High Definition Render Pipeline (HDRP) in your Unity project. The Universal Render Pipeline is compatible with the Visual Effect Graph, but has limited features due to the performance limitations of mobile devices. 

When you install the HDRP, the Visual Effect Graph package is automatically installed. Make sure that it’s in your project by opening the Package Manager and searching for Visual Effect Graph.

For an introduction to Visual Effects Graph, see Introduction to the VFX Graph.

The guidance in this tutorial can be applied to your own uses of particles in Visual Effect Graph. You can follow the example in this tutorial by importing the Firework Sample Package into your project.

Visual Effect Graphs are created by adding and connecting functional blocks known as Contexts. Particle effects in Visual Effect Graph have an Initialize Context (Figure 01).

In the fireworks example in the sample package, all the effects spawn from the same point at the same time.

Select your Initialize Context and press space to show the Search Menu. Begin to type the word position and entries will appear that show you all the available position blocks. 

Select AABox to apply the Axis Aligned Box position block. AABox is a cuboid shaped block (Figure 03).

You might not notice a change in the particles’ spawning position as the start size of the box is small and the fireworks, or your effect might, work on a large scale.  Set the size of the box to 20 x 5 x 20 and you will start to see an increase in the area from which the fireworks spawn (Figure 04).

This looks great, but what if you want to create a more realistic series of fireworks?  One way to do this is with a sequential position block. Similar to how you added the AABox block, now try searching for the Position : Sequential (Line) block and add this to Initialize Context instead of your AABox block.

The block has additional values for adjusting the length of the line: Count, Start, and End. To spawn sequentially along an x-axis that’s 60 units in length with five spawn points, use the following values: 

The effect now spawns sequentially along the line at five separate increments (Figure 06).  

The Mode option provides alternative sequencing methods. Wrap mode sets the spawning index to move along the line repeatedly in one direction. Changing the mode to Mirror sets the index to move along the line from start to end and then back to the start (Figure 07).

	Figure 02: The Initialize Context from the main firework particle system

Figure 03: The Initialize Context from the main firework particle system with the addition of a new position block

Figure 04: The firework effect in Scene view after increasing the spawning box size

	Figure 05: The sequential position block with the correct values for our effect

Figure 06: The firework effect using Wrap mode for the sequential line block

Figure 07: The completed effect

In this tutorial, you have learned how to implement a position block in an effect to define a particle spawning area and sequence. Compared with Unity’s other particle solutions, the position blocks in Visual Effects Graph provide an easy way to create sequences of particle spawners. 

To build on this knowledge, try experimenting with the other position blocks to achieve different types of effects. Although this tutorial does not cover how to use surface mode on the position blocks,  this method can be a useful way to add particles to the surface area of existing models. Examples include adding fire to the surface of a fireball or adding sparks to a sci-fi-style cube that a player might interact with.

Create particle spawning positions with Visual Effect Graph

1. Introduction

2. Before you begin

3. Add position blocks to an effect

4. Next steps

Complete this tutorial