Creating Animated Particles - Dota 2 Workshop Tools

A detailed picture guide that will run you through the process of creating animated particles for use in the Particle Editor tool for the Dota 2 Workshop Tools.

Introduction

In this tutorial I will be guiding you through the process of creating an animated particle for use in the Dota 2 Workshop Tools.

I will be using the following image as an example which will hopefully help you understand the process better. We will be creating a basic custom animated crosshair.



Ok. So let's get started.

Creating The Particle

Normally the particle is created in an external graphic program. For this one, I will use Photoshop. It consists of five frames.

Frame 1



Frame 2



Frame 3



Frame 4



Frame 5



Once you have your frames ready, save each frame as a TARGA (.tga) file.

Note: If you have alpha regions (transparency) like I do, make sure your Alpha Channel is defined in the Channels Tab and tick 32-bit when you are saving so the channel can be read. You can check out an example of an alpha map below. It is for Frame 5.



That's it. We have the visuals of our particle ready.

Defining The Particle Animation

We have created our particle but they are still static images. So how do we make them play out as an animation? Simple. We make use of something called Sprite Sheets.

A sprite sheet is nothing but a single image that has all our frames in it. It is defined by a .mks file that tells it how to play out the frames.

So to get started - we create a new text file in the same folder where our TGA files are. Let's call it - crosshair.mks

Now what do we write in this .mks file?

Any line that begins with '//' is considered as a description and not read by the game compiler. I'll start with naming my animation as First Sequence. It is handy to have them named especially when you make many animations out of your frames.

// First Sequence

Then I will start off defining the sequence. The game numbers begin at 0 and not 1. So the first sequence should be 'sequence 0'.

//First Sequence
sequence 0

Next up I want to define that I want my animation to be a loop. So I'll just add that in. If I do not set this, it will just play once and stop.

//First Sequence
sequence 0
loop

Now that we have the sequence defined, time to define the frames in it. Basically all your need to do is enter the file name followed by the time you want it to play for.

Note: The time is in respect to the time factor of your particle system in-game. So if you set it to 1, it will play at the same speed and if you set it to 2, it will be double the speed you have defined on your particle system and etc.

// First Sequence
sequence 0
loop
frame 1_Outer_Circle.tga 1
frame 2_Two_Circles.tga 1
frame 3_Three_Circles.tga 1
frame 4_Bulls_Eye.tga 1
frame 5_Full_CrossHair.tga 1

This should make the frames play one after the other giving us something like this.



That's it. We have our first sequence. If you want to create a second sequence, same process again. Just give a line break and do the same thing.

Note: You can use frames multiple times in a sequence. So you can control how they appear exactly as you want it. Also there is a good amount more you can do with the sprite sheets. You can learn all about them on the Developer Wiki. I'll be doing another tutorial going a little more in-depth with these at a later date.

Save the file.

Compiling The Animated Particle

Now that we have our particle created and defined to how we want it, we need to compile it for it to be usable in the game. For this we will use the "resourcecompiler" that ships with the Workshop Tools. You can find this in the 'game/bin/win64/' sub-folder of your Dota 2 installation.

Before we start using this tool, there's a two things that need doing.

Step 1:

Most of tools that come with the Workshop Tools are pre-defined to function accurately with relative directories. This allows for automatic generation of game friendly formats that you will need. In this case - a VTEX_C file.

So move your content to the correct folders. In this case move the folder in which you have your tga's and mks file to the 'content/dota_addons/<your addon name>/materials/particle/' folder.

This way when you compile it, you will have the VTEX_C file generated for you in the 'game/dota_addons/<your addon name>/materials/particle' folder automatically.

Step 2:

Now that is done, you will need to create a VTEX file. How many more? This is it. Last thing to do.

What is a VTEX file?

A VTEX file is basically a text file that has all the data related to the properties of the textures. I could go in to the details of how to create one yourself, but that will take too long and is kind of unnecessary for you to learn as far as animated particles are concerned. If you are interested in this, I will do a detailed guide about it later.

So instead, you can just use a template that comes with one of the other addons to create one.

First, make a text file in the same folder as your tga's and mks and name it - <particlename>.vtex

Now open this up in a text editor program.

Next go to 'content/dota_addons/<your mod name>/materials/' and find an already existent VTEX file. Open that in a text editor. You should see something like this.



You don't need to bother yourself with it. This is basically the core structure of a VTEX file. All you need to care about is one line.

First copy this entire thing in to your own VTEX file.

Then in this line that starts with "m_fileName" "string", edit the file name to that of your tga (if it's just a texture file) or mks (if it's an animated particle).

"CDmeInputTexture"
		{
			"m_name" "string" "0"
			"m_fileName" "string" "materials/particle/crosshair/crosshair.mks"
			"m_colorSpace" "string" "srgb"
			"m_typeString" "string" "2D"
		}

Once this is done. Save it. Time to compile.

Open Command Prompt (Run>cmd).

In Command Prompt, go to your 'game/bin/win64/' directory. Once you are there, enter the following code with the required details changed.

resourcecompiler -i "<the location of your vtex file>"

Once you have it compiled, the tool would have automatically generated a VTEX_C file in the 'game/dota_addons/<your mod name>/materials/particle' folder that you can use in the tools.



Let's go find it in the tools.

Using The Animated Particle

Now that you have the animated particle created and compiled, launch your Workshop Tools and open the Particle Editor.



1. Create a New Particle.



2. Under Renderer > Add Render Sprites and under Emitter > Add Emit Continuously. This will load up the sprite and make it emit always so it is visible.

3. Select Render Sprites. Under the Properties Tab, find texture and click on the magnifying glass.



Once inside the asset search, just search for your VTEX. You should see it and it should be animated as per how you defined it in the .mks file. The preview will be on the right hand side.



4. Once you load it in, it should show up in the viewport. It will be playing the animation. If your particle has more than one sequence, you can change it to any you want in the Base Properties of the particle.

5. Get started on your particle effect. You're all set. When you save your particle file, the equivalent game friendly format file for the particle will be generated in the 'game/dota/<your addon name>' folder automatically too.

6. Have fun.

Conclusion

That's it for this guide. I'll be going a bit more in to detail on sprite sheet properties and etc in another tutorial when I am going to help create full fledged particle systems in the Particle Editor. But that's for another day when I have the time.

If you have any queries, feel free to PM me on my Facebook[www.facebook.com] or Twitter.

[英国の死]

Напишите мне в профиль комментарий пожалуйста

[nao]

Help my please, it returns an error when compiling
ID3D11Device has 1 outstanding references indicating leaked D3D11 resources.

[Folkye]

Nice tutorial!)

[love]

maby you know hou to create particles fore item?