Tag Archives: particle

04 Oct

Using Optimized Texture Atlas for Particle System in Unity!

header

The tutorial will be much more helpful if you already have a basic understanding of the Shuriken particle system / Native particle system of unity and is directed towards Intermediate unity users.

The particle effects in your game which adds a lot of polish can also increase the Draw calls resulting in spike or decrease in FPS. This usually occurs when you have multiple elements of same effects  visible in the gameplay camera.

particl

As an example, I made a spark particle effect for this tutorial. The particle was created using 5 particle elements and when used, it costs 4 draw calls. Now If I duplicate it multiple  times and simulate it all together in the game camera, it will cost 14 draw calls as shown below. This can be a huge problem and can impact the performance of your game especially when you have a ton of effects later in the development.

unoptimized

In order to curb this issue, we can always optimize the particles to help make sure that it is as efficient as possible. There are many guidelines on optimizing the particles and we recently started using Atlas for our textures in effects. This is a standard technique used in the game industry however while researching on this subject, we never found a good tutorial or concise document explaining the method and hence we thought why not share our technique!

I have used 4 different textures to make the below effect. It consists of a glow effect, sparkle effect, radial effect and a variant of sparkle effect. For the sparks flying, I just used stretched billboard with the glow texture. There are 5 elements used in order to create the particle but 4 materials hence when simulating it, it takes 4 draw calls!

elements

In order to use this technique, we need to create an atlas and for the same purpose, we can use any photo editing software. Since each of our textures are 128 x 128 resolution, we can compile all the 4 textures into 256×256 as shown below!

atlas

Once done with atlas we can go ahead and import it to unity and prepare the material. We will use Additive shader for this particular effect.

If you replace your particle effect with the atlas material, it will not look as intended. This is because you  need to point out the correct texture to each element of your particle system.

mess

We can select the correct texture in the atlas by using the texture sheet animation tab.

texturesheet

The texture tab in default setting looks like above. we need to change it according to our needs. We have 2 rows in our textures with 2 frames each in X and Y coordinates. We need to input the required coordinates, change the animation tab to Single sheet and turn off Random row. Then besides the Frame Of Time graph, you will see a drop down menu. Select the Constant option from the list.

constant

After making the above said changes,  the texture sheet should look like something as below.

texturesheetwithvalues

There are two options now available to us, Rows and Frames Over Time. Below I will explain what each does!

rowsandframes

Rows:This is the value which denotes which row you would like to select in your sheet. Every horizontal break in your texture sheet will be called as Row. They ascend from the top of the page to the bottom. rows

Frames over life a.k.a Frames: Frames are the respective image in your atlas. Since atlas is a compilation of all the textures, the frame number can be used to identify and select the desired texture from your sheet. Refer the image to understand how frame numbers are divided.

frames

After understanding the rows and frame settings, now we can select the desired texture from the sheet. Let’s have a look at our atlas below. If we want to pick a glow texture, then we would need to add Row:1 and Frame: 1. Using this mapping technique we can now start optimizing our entire particle system by selecting each element and replacing it with the corresponding texture in the atlas.

texturesheetanatomy

I went ahead and optimized all of the elements in the particle effects with the atlas texture and now we can see that the draw call has reduced to 1! No matter how many duplicates or instances I make of the same particle, the draw call is always 1. SUPER OPTIMIZED!

optimized

Using the atlas can a very powerful method when using with particle effects in your game. It can help maintain an optimal draw call and boost its performance. Making use of this technique can be very useful especially for mobile games where draw calls are a bane and can drastically impact the fps of your game.

Hope the tutorial helped you in understanding how to use Texture Atlas for your particle effects and may nothing stop you from creating that epic effects for your awesome game! :)

giphy

If you have any queries or if you were confused at any point when following the above process, please do let us know via the comments or email.

Cheers!

For any queries please contact zain@ogrehead.com or support @ogrehead.com| Get Presskit here: http://ogrehead.com/press