Home Game Technologies Tutorials

VFX in Unity: Getting Started

Learn how to create your own custom visual effects using Unity’s built-in Particle System.

Version

  • C# 7.3, Unity 2020.3, Unity

Whether you’re playing a video game or watching a movie, visual effects (VFX) are a big part of the experience. In Unity, you can create VFX with the Unity Particle System, which has almost every feature you need for stunning visual effects.

Unity provides so many settings that the Unity Particle System can be hard to learn. Even when looking at examples of particle effects from the Asset Store, it’s easy to be completely lost when looking at the hundreds of settings in those examples.

You can overcome this barrier by learning some basic settings that create basic effects, giving you a better understanding of how different settings affect the visual effects themselves.

You’ll try some exercises to make basic projectile effects in this tutorial, like firing bullets from a gun or casting magic missiles. Projectile effects are common in many games.

You’ll also learn the following:

  • The four key attributes of particle VFX.
  • How to create the muzzle VFX.
  • How to create impact VFX.
  • Making different projectile effects.

The materials for this tutorial were built in Unity version 2020.3 LTS, but you’ll be able to follow along with any version of Unity from 2019.4 LTS onward.

Note: This tutorial requires basic knowledge of the Unity Editor and C# programming. If you’re new to Unity development, check out our tutorial on Getting Started With Unity.

Getting Started

Download the starter project by clicking the Download Materials button at the top or bottom of the tutorial. Unzip its contents and open the ProjectVFX – Starter project in Unity.

After the project loads, you’ll see the RW folder in the Project window. The folder structure breaks down as follows:

  • Materials: Materials for the scene.
  • Prefabs: Prebuilt components composed of scripts and models.
  • Prefabs/VFX: The base components for building the VFX.
  • Prefabs/Models: The models used in this tutorial.
  • Scenes: The project testing scene.
  • Scripts: Scripts for the projectile and other utilities.
  • Sounds: The sound this tutorial uses.
  • Textures: The graphics that the materials for the particle use.

Now, open the DemoScene from RW/Scenes and click Play to try it for yourself!

The project includes controls for you to move the camera around and switch between different effects. For details, please see the onscreen help at the bottom of the scene.

Testing the VFX

When you work on any visual effects, you should set up the test environment like the Starter Scene.

A good environment helps you answer the following questions:

  • Is the VFX too big or too small?
  • Is the VFX too dim or too bright?
  • How does the VFX interact with other objects?

Sometimes, the VFX will look great in the Prefab view, but the actual scene doesn’t look as good.

Setting up the Testing Environment

Here are the points to consider when setting up a testing environment:

  • Light: The brightness of the environment. This factor will affect the visibility of the VFX.
  • Reference Objects: The reference objects used to compare sizes with your VFX.
  • Launch Control: A key or a button to fire the particle effects.
  • Selection Control: Helps you switch between different effects.
  • Camera Control: Helps you look at the effects from different angles. VFX that are fine from one view angle might not look good from another.

For projectile VFX, consider this as well:

  • Objects for Collision: Objects that collide with the projectile to trigger the impact effects.

This is how the test environment for your demo project looks:

Projectile Testing Environment containing a shooter character, a projectile, its target and some help instructions

Next, you’ll learn about four attributes you’ll need to manage to make great-looking effects.

Understanding Particle Effects’ Key Attributes

Although you can create a vast variety of different visual effects, they all have four key attributes:

  • Size
  • Shape
  • Color
  • Timing

You’ll cover each of these in more detail next.

Size

Size determines how big or small the particles are. Size comes in two levels of granularity: The whole bunch of particles and each single particle.

When you determine the size of a particle, pay attention to how it looks:

  • Relative to the objects in the environment. Place reference objects in the test environment to check if the scale makes sense compared to other objects.
  • Based on gameplay. For example, whether the size of the explosion is the same as its hit area.
  • Based on real-world knowledge. Size should make sense relative to how things look in the real world. For example, sparks are tiny, while smoke is similar to the bullet’s size.

Different particle sizes

These tips only give you a rough idea of how big your particles should be. It’s your job to adjust the size to the right value for your scene. You can apply the Goldilocks principle to find the sweet spot.

Shape

The Shape attribute determines the shape of a particle effect. It gives you the power to define shapes for either individual particles or the whole bundle.

Here’s a simple demo of different shapes:

Different Particle Shapes

Color

Color affects the nature and mood of the particles. You can use them to give hints about what is happening in your game. For example, the yellow and orange palettes are associated with heat or fire, while dark yellow and green palettes bring poison to mind.

Here’s a simple demonstration:

Red/orange particles looking like fire, cold blue particles looking like ice, and green/yellow particles looking like poison

Timing

Timing affects how long a particle effect shows onscreen. When setting the time duration of a particle system, you can choose between instant and continuous.

For instant timing, the particles spawn, then immediately disappear. For example, the sparks that appear when two swords hit together would call for instant timing.

For continuous timing, the particles keep spawning until they time out or the owner stops them. The flame of a torch is a good example.

Here’s an example of an instant particle system at various speeds:

Particles with different speeds: Slow, fast and burst

Keep in mind that it’s important to set all these attributes when you define your VFX. In the coming section, you’ll revisit these attributes and get some hands-on experience using them.

Making a Projectile VFX

Now, it’s time to make the VFX for your projectile! Your goal is to create the main Projectile, then complete its look by adding two more effects: Muzzle and Impact.

  • Muzzle: Spawns at the launching position when the user creates a projectile.
  • Impact: Spawns when a projectile hits an obstacle. The effect will appear at the collision’s location.

Here’s a summary of the projectile life cycle:

Effect Location
On Fire Muzzle At the launch position
After Launch Projectile In the air
On Hit Impact Collision’s location

You’ll start with the muzzle effects.

Creating the Muzzle Effects

A muzzle effect has three elements: a muzzle cone, a flashlight and sparks.

First, you’ll create a muzzle cone to simulate a spray of energy when a projectile fires.

Making the Base Muzzle Cone

Open DemoScene from RW/Scenes. In RW/Prefabs/VFX under the Asset folder, there’s a prefab called StarterParticle, which contains the following:

  • A reference object at the origin that helps align particle objects inside an effect.
  • A dummy particle system. This doesn’t render anything, but it helps play or stop all the child particle systems at the same time.

Duplicate StarterParticle by pressing Command/Control-D, then rename the new object to Muzzle. Drag Muzzle from the Project panel into the Hierarchy and position it near the Shooter character.

Positioning the Muzzle near the Shooter character

Right-click to call up the Create menu. Select Effects ▸ Particle System to create a new particle effect and name it MuzzleCone. Select it in Hierarchy and click the Restart button in Scene to preview the particle.

Next, you’ll turn MuzzleCone into a one-shot particle. This is a trick to make the particle system behave like a simple animation. To do this, adjust the following settings:

  • Main: Set Start Speed to 0 and Looping to false.
  • Emission: Set Rate Over Time to 0 and Burst Count to 1.
  • Shape: Disable this option.

Menus containing the settings for the MuzzleCone

Next, you’ll define the shape of the particle using the Renderer module.

Defining the Particle’s Shape

Traditionally, a particle would make use of an image to define the shape. For this example, you’ll make use of a mesh instead.

Apply the following settings to the Renderer to turn the particle from a single image into a mesh.

  • Render Mode: Mesh
  • Mesh: Mesh_Cone
  • Material: Mat_Muzzle
  • Render Alignment: Local

The Render Alignment setting makes the mesh align with its origin instead of always facing the camera.

Selecting the correct settings for the Renderer

Uh oh, nothing appears. That’s because the mesh is too small to see right now. To correct this, you need to change the particles’ start size. Go to Main and change Main Start Size to 50.

Then, adjust the particles’ direction and position by setting Rotation to 180 and Z to 0.5.

Muzzle cone starting to look like a cone

All right, that looks better! Now that the shape and size are correct, you’ll move on to the color.

Changing the MuzzleCone’s Color and Timing

Select MuzzleCone again and update Color Over Lifetime. Expand it, then select Color to open the Gradient Editor. Choose the fire-tone color from one of the presets.

Fire Gradient

The last step is to adjust the timing. To make MuzzleCone disappear right after it appears, change Start Life Time in Main to 0.2.

Testing the Muzzle Effect

So everything looks good, but does it work? To find out, you’ll test the Muzzle prefab using the Shooter Character.

First, hide the reference object by disabling ReferenceSphere in Muzzle. Then, select the Prefab menu from the top-right menu in Inspector and click Apply.

Next, select the Shooter in the Scene and drag Muzzle in Prefab/VFX to Muzzle Prefab.

Click Play to test the effect.

Applying muzzle prefab

You should now see a cone shaped muzzle effect appear in front of the weapon each time the weapon is fired.

The basic settings for Muzzle are ready. However, adding a flash and some sparks will make it look even better. You’ll do that next.

Making the Muzzle Flash

Your next goal is to create a flash effect consisting of a sudden light that appears with the muzzle cone. It’s composed of a big circle and a point-light object.

Select Muzzle in Hierarchy. Next, right-click and select Effects ▸ Particle System. Name the newly created particle object Flash.

Now, you need to change some settings to make the particle a one-shot particle. In Main, set Start Speed to 0 and Looping to false.

Next, in Emission, change Rate Over Time to 0 and Burst Count to 1

Finally, disable Shape.

Since the default particle material is already a circle, you don’t need to do anything to define the shape.

Next, adjust the size, timing and color by going to Main and changing the following settings:

  • Start Size: 3
  • Start LifeTime: 0.1
  • Start Color: FFF247

Finally, you’ll add a light to the effect by right-clicking Flash and selecting Light ▸ Point Light. Disable the light object. Next, select Flash, check and open the Light. Finally, drag the light object to the light property and set the Ratio to 1.

Click Restart in Scene to preview.
Adding point light

Now, a bright flash of light appears for a second everytime the weapon is fired.

Making the Muzzle Sparks

Your last step is to add some sparks to the Muzzle to make it look super realistic.

Select Muzzle in Hierarchy. Right-click, then select Effects ▸ Particle System to create a particle object. Rename the new Particle System Sparks.

Next, you want to modify the size and timing of the particle object. Go to Main and select the following settings:

  • Start Size: 0.05 – 0.1.
  • Start Life Time: 0.1 – 0.4.
  • Start Speed: 3- 5.
  • Looping: false.

Next, under Emission, select:

  • Rate over Time: 0.
  • Bursts/Count: 15.

Rename particle system

Finally, you’ll modify the particle’s shape and color. Under Shape, change the Radius to 0.1. Under Color over Lifetime, set the color to a white/yellow fade-out gradient.

white yellow gradient

The muzzle effect is ready! Apply the changes to the prefab, remove the working VFX from Scene and click Play to preview.

Apply Muzzle Effect

You should now see the cone shaped muzzle blast, a flash of light along with tiny debris flying outward.

Making the Impact Effects

Your next goal is to use an effect, a simple glowing light, to show where the projectile hits. To do this, you’ll select an impact effect that spawns when a projectile collides with another object.

First, create the parent impact effect with the following instructions:

  • Duplicate StarterParticle in Prefab/VFX and rename it Impact.
  • Drag Impact to Hierarchy.
  • Move the impact particle near the Target by changing its position to X:2.5, Y:2, Z:11.85

Here’s the setup:
Impact effect setup

Let’s continue by adding an Impact Glow.

Adding an Impact Glow

When the projectile hits the target, a tiny explosion should go off. This effect is achieved by making the impact point glow.

Next, you want to add a Glow to the effect.

Create a new particle system under Impact in Hierarchy, and rename the new object Glow.

Make the Glow object a one-shot with the following settings:

  • Main: Set the Start Speed to 0 and the Looping to false.
  • Emission: Select 0 for the Rate Over Time and 1 for the Burst Count
  • Shape: Select Disable.

Adjust the size, timing and color by going to Main and selecting these settings:

  • Start Size: 3.
  • Start Life Time: 0.1.
  • Start Color: FFE68D.

Do another play test, and if the impact glow effect looks OK, hide or remove the Reference object — you no longer need it.

Menu settings to hide or remove the reference object

You should now see the impact glow effect, but there’s some kind of clipping happening. Let’s fix that.

Fixing the Glow Cut-Off Issue

You’ve probably noticed that there’s a problem with the Impact effect — namely, half the effect disappears! That’s because part of the Target object renders after the Impact object.

To fix the issue, create a Camera object under the main camera and name it VFX Camera.

Change the properties of the VFX Camera as follows:

  • Clear Flags: Depth only.
  • Culling Mask: a new layer VFX.
  • Depth: 1

Finally, uncheck VFX in the Culling Mask in the main camera.

Select Glow and click Restart to test the result.

Fixing glow cut-out issue

Now, the effect should disappear properly. Note that you can only see the corrected effect in the Game View.

Testing the Impact Effect

Now to see the fruits of your labour, time to try the Impact effect in the testing environment!

First, commit your changes by clicking Apply All in the Prefab menu of the Impact object. Then, remove the object from the testing environment. The impact effect will be spawned back into the scene when an actual impact occurs.

Select Shooter in the Hierarchy. Drag the Impact object in Prefabs/VFX to the Impact Prefab field of the Shooter and set Selected Impact to 0.

Click Play to test.

Projectiles glowing when they hit the target

At this point, both Muzzle and Impact are ready, which means you can move on to creating the main projectile effect.

Understanding the Projectile Structure

A projectile effect consists of a head and a tail. The head is the core of the flying body and the tail is a trail following it.

When the projectile only has a head, the visual just doesn’t look right. Adding some particle effects to the tail improves this particular effect quite a bit. You’ll make a projectile tail for the current bullet next.

Making a Projectile Tail

First, create a new prefab from the origin bullet by pressing Command/Ctrl-D to duplicate Bullet_Basic_3dModel in Prefabs/Projectile. Rename it Bullet_Flame_Tail.

Next, drag the Prefab to the test scene and move it close to the gun. Right-click in Hierarchy and select Effects ▸ Particle System to create a particle. Finally, name the new particle FlameTail.

Making a projectile tail

Adjusting the Tail’s Shape and Size

Now, you’ll build the shape and size of the projectile by adjusting some parameters. Make the following changes in Basic:

  • Start LifeTime: 0.1 – 0.6.
  • Start Size: 0.15 – 0.38.
  • Start Speed: 1 – 3.

Then, under Shape, select:

  • Angle: 0.
  • Radius: 0.1.
  • Rotation(Y): 180.

In Emission, change Rate over time to 200. Finally, under Transform, set Position(Z) to -0.75.

Adjust shape and size of projectile

Making the Tail Look Fiery

Next, you’ll change the color and texture to make the tail look like fire. Change Color over Lifetime to a fire color palette from one of the presets. This time the alpha value should fade from opaque to completely transparent.

Gradient

The particle is cooking now!

However, you can improve the effect even more by adding some randomness.

Change the texture of the particle from a circle pattern to a smoke-like pattern by modifying the particle’s material. In the Renderer, change Material to flame_add.

Changing the particle texture to make it look like fire

Doesn’t that look more exciting?

Testing the Projectile Tail Effect

Now that everything is ready, you’ll bring the improved bullet to the Shooter Character.

First, save the effect setting by selecting Apply All in the Prefab menu. Then, remove the prefab from the scene.

Drag Bullet_Flame_Tail in Prefabs/VFX to the Projectile Prefab field of the shooter object in Inspector. Set Selected Projectile to 1 so the effect plays by default.

Click Play to see the effect.

Testing the projectile tail effect

Making a Fireball Projectile

Now, it’s time to try another projectile effect — a fireball! You’ll make both the particle’s head and tail this time.

Setting up the Projectile Particles

First, you’ll create a projectile particle effect. Duplicate StarterProjectile in Prefabs/VFX by pressing Command/Ctrl-D. Rename it Fireball.

StarterProjectile already contains a script that handles the projectile’s movement and collision.

Drag Fireball to the Projectile Prefab property of the Shooter character and change Selected Projectile to 2.
Setting up the projectile particles

Click Play and you’ll see a red dot shooting out from the gun.

Demo of the projectile particles

Now, you’ll transform that dot into an impressive fireball!

Making the Fireball Head

Your next step is to add a fireball head to the projectile. The head of the fireball is simply a stretched hemisphere with fire-tone colors.

Start by dragging Fireball from Prefabs/VFX to the scene. Move it beside the Shooter character. Doing this helps you tune the particle effect to the right scale.

Select the Fireball particle in Hierarchy. Right-click on it, and select Effect ▸ Particle System to create the projectile head particle. Rename the particle ProjectileHead.

Now, you need to turn the projectile head to a one-shot particle. To do this, go to Main and adjust the following settings:

  • Start Speed: 0
  • Max Particle: 1

Next, under Emission, set Rate Over Time to 1. Finally, disable Shape.

Then, modify the Renderer settings as follows:

  • Render Mode: Mesh.
  • Mesh: Mesh_HalfSphere.
  • Material: Glow_Add.
  • Render Alignment: Local.

Again, you can’t see anything yet because the mesh is too small. Change the Transform Scale to X:15, Y:15, Z:15 so the mesh is big enough to see. Hide the reference object inside the particle effect by disabling its Mesh Renderer.

Here’s the demo:

Hiding the reference object inside the particle effect

Now, define the particle shape by changing Transform Scale to Z:55. This stretches the mesh, making it look like the head of a fireball.

Next, modify the particle’s color by enabling Color Over Lifetime. Expand it so that you can select the Color, which opens the Gradient Editor. To finish it off, choose the fire-tone color from one of the presets.

Change particle's color over itslifetime

Making the Primary Projectile Tail

With the fireball head ready, you can move on to making its tail!

Select ProjectHead. Right-click, then select Effect ▸ Particle System to create a new particle for the tail. Name the new object FlameTail.

Once again, you need to adjust the shape and direction of the particle. Do this by going to Main and adjusting the following values:

  • Start Life time: 0.1 – 0.3.
  • Start Size: 0.1 – 0.4.

Under Emission, change Rate Over Time to 50. Then, under Shape, pick the following settings:

  • Shape: Cone.
  • Angle: 0.
  • Radius: 0.15.
  • Rotation: Y:180.

After these are done, your fireball will look like this:

Cone-shaped fireball

Improving the Fireball Tail

This looks pretty good, but it’s not perfect. You’ll further improve the shape of the tail by changing the following rendering settings:

  • Rendered Mode: Stretched Billboard.
  • Material: Flame Add.
  • Length scale: 3.3.
  • Pivot: 0.33.

Using Stretched Billboard helps turn the square texture into a long rectangle. It’s an excellent trick to represent particles that move very fast.

Next, adjust the color by modifying Color Over Lifetime to the familiar yellow/orange fire tone palette.

Rendering settings for the fireball

At this moment, your fireball is ready! You should feel the heat when it plays.

Making the Secondary Projectile Tail

Although the fireball effect works, you can still improve it. In this case, you’ll upgrade it by adding a secondary, darker flame tail to help it stand out from the original flame.

To add the darker flame, duplicate FlameTail and rename it DarkenFlame.

Select DarkenFlame and change Color Over Lifetime to a brown color palette. Then, under Renderer, change Material to Flame_AB

Instead of using yellow and orange, you use red and brown to mimic half-burned ash. Using an Alpha Blended material helps make the color more solid and dark.

A second, darker projectile alongside the first

Now, you need to change the Renderer’s Sorting Fudge properties from 0 to 5 so the DarkenFlame particles spawn behind the FlameTail.

Add fire spark to decorate the projectile flame

Lastly, you’ll add some fire spark to decorate the flame!

Adding Projectile Sparks

Sparks enrich many different visual effects, including the muzzle VFX and the projectile tail you made earlier. For your fireball, you’ll try something new — sparks that generate continuously instead of just once.

First, select Fireball and make a new particle by right-clicking and selecting Effects ▸ Particle System. Rename the new particle system Sparks.

To give the particle system the right scale and shape, go to Main and change the following settings:

  • Start Size: 0.05 – 0.1.
  • Start Life Time: 0.1 – 0.4.

Then, under Shape, change the following settings:

  • Rotation: Y:180.
  • Angle: 10.
  • Radius: 0.2.

The fire makes the sparks, so you want to give them a flame-like color. To do this, modify the Start Color to a light yellow shade, FFE981.

To improve the sparks, you’ll now make them thinner and give them some randomness. First, you’ll start by using the Renderer to stretch the particles by changing the following settings:

  • Render Mode: Stretched Billboard.
  • Length Scale: 7.

Under Main, change the Start Size to 0.01 – 0.05.

Finally, you’ll use the Noise module to add some randomness by changing these settings:

  • Strength: 0.5.
  • Frequent: 1.

Add randomness and stretching

Select Apply All in the Prefab menu and click Play to see the final result:

Shooting fireballs at a tutorial

Congratulations on finishing the tutorial! At this point, you should have a solid understanding of the settings you need to create basic but beautiful VFX.

Where to Go From Here?

Now that you’ve finished the tutorial, you can download the completed project files using the Download Materials button at the top or bottom of this tutorial.

This tutorial only scratches the surface of VFX in Unity. Your next independent step is to immerse yourself in the artistic and technical side of things so you can create bigger and better effects!

On the art side, explore the particle effects in your favorite games or the works of great artists on platforms like ArtStation. Just search ‘VFX’ at www.artstation.com and you’ll be off and running. You can also read this great “League of Legends” VFX style guide made by Riot Games.

On the technical side, check out the Unity Shader Graph for building fancy materials and VFX Graph for building advanced effects:

I hope you enjoyed this tutorial! If you have any questions or comments, please join the forum discussion below.

Reviews

More like this

Contributors

Comments