By Austin Chalk  

FireSpellWhen I’m in-between doing environment art stuff here at BonusXP, I share some of the attack and impact FX for our characters. This can be anything from trails on the end of a swinging sword, to a fire alchemy spell, like the one I’m going to walk you through in this week’s post.

To begin this effect, I decided to make it in the order that each element appears in the sequence. Thus, let’s start with the summon rings. Since this post is quick and focused on the particle system, I’m not going to go into much detail about making the textures themselves. I made some quick (alchemically incorrect) summoning circles in Photoshop, but they can be made in any photo-editing software like Gimp. I made two unique circles because it adds an extra layer of visual interest once they’re parallaxing on top of each other.

austin_fx_001

Once you’ve got some rings that you like, import them into Unity by right-clicking into a directory and selecting “Import New Asset”. Find your rings and import them both!

austin_fx_002

The particle editor within Unity does not directly use textures when it renders particle systems, instead we must plug in materials that reference those textures. Because we have two unique textures for our rings, we must create two unique materials. To do this, right-click in your directory and navigate to Create > Material. This new material will be using Unity 5’s standard shader by default, so we want something that will give us a more magical feel. For our shaders at BonusXP, we have a few custom and stripped down shaders that I use frequently for FX. One of them is a simple additive shader with vertex color.

Note: While additive shaders for particle FX are great for creating a magic look, they sometimes become washed out in front of bright backgrounds. In those cases, consider using an alpha shader instead.

austin_fx_003

I’m going to show the full setup in the particle editor at the end of the walkthrough, so rather than go through every drop down individually, I’ll just briefly talk about each component in the order that I made them.

For the rings, I wanted to stagger the timing of when they appear to create a little bit of a build-up to the explosion. I set a Start Delay of .2 seconds and made the Color Over Life fade-in a little slower.

austin_fx_004

The next several components happen simultaneously, but the first part I started with was the fireball, which acts as the main flare for the explosion. The set up was fairly straight-forward, simply a rotating billboard with some color and size over lifetime tweaks.

austin_fx_005

Next, I wanted something vertical to give some interest to the silhouette of the effect. I used a 4×4 sprite sheet animation along with a stretched billboard to make it feel more like a controlled pillar than a wild explosion.

austin_fx_006

For the sparks, I used two different components: A lower set with gravity that collides with the ground collider, and an upper set without gravity that used the Force Over Lifetime dropdown to create sparks that float and disappear unpredictably.

austin_fx_007

Lastly, I added some dark smoke slightly delayed to play after the explosion to finish it off. With smoke I find that it looks great the more variation you add. Try really playing with starting size, rotation (both direction and speed), color, emission, etc. and it will start to feel really organic, even with stylized textures like the ones I’m using.

Here is the entire particle editor with as many drop-downs as I could fit in the screen. Particle FX of course vary greatly based on need, but I like to construct them all one piece at a time to make sure everything works as a whole and doesn’t become overwhelming to work in.

austin_fx_008

austin_fx_009