3D Muzzle Flash Tutorial
*Making a 3D muzzle flash for a low-poly game evironment.* by Tom Purcell, originally published in 2002
I left that typo in there as this is was an “original” tutorial about hrmmmmm 6 years ago. It “won” me a free subscription to some 3D website that exploited me so people would click on their pop-ups. Life before pop-up blockers. Or even further back in the days before Internet Explorer. The internet was just the “old west” and we were all cowboys whose time was spent reading elite issues of Phrack. Ascii art was the coolest using that program TheDraw. Remember the “animation” mode? Oh man I do.
Yeah so here’s that tutorial I was talking about from my old website… If you read it, you’ll have a basic understand how a lot of special effects are created in games. I worked on a a lot of modications for games as a texture artist/skinner.
These same basic techniques can be applied towards a range of effects from jet-engine exhaust, soaring fireballs, fire belching monkies… It’s up to your imagination.
Part 1) Creating a muzzle flash texture. Part 2) Apply it to a low-poly 3D shape as an “additive” texture. Part 3) Animate the shape to simulate a muzzle-flash. Part 4) Making it look better.
*Part 1 – Making the Texture:*
1) Open a new image: 256 x 256 Map. Fill the background with black.
2) Scrawl out a blast shape with the pen tool in white. Switch to smudge tool, and brush outwords along the edges of flash. I recommend using a natural/grainy brush provided in Photoshop.
3) Set your color to a nice orange shade (R:255, G:168, B:0). With your Airbrush set to Color, Pressure 100, brush the orange onto your flash to give it some color.
This should give the flash an orange/yellow tint like you see below.
4) Switch your color to white. Set airbrush to Color Dodge, Pressure 10%, brush size 100. Using circular strokes, start from the center and spiral out with the dodge. This will intensify the blast, but avoid too much dodge. Keep the undo button handy and experiment with it until you get something like this:
Save this image as a Targa or other hi-quality image. This will be the texture we apply to the 3d sphere.
Open up your 3D software of choice. I will use 3D Max 3.1 to demonstrate. You need to have a basic understanding of your 3D package to follow along.
*Part 2 – Applying texture to sphere.*
1) Open up your 3D modelling package. Create a low poly sphere. These are the max settings I used. Radius 50, Segments 8. Generate Mapping Coords. 24 Polys total.
2) Convert this to an Editable Mesh, and Chop the sphere in half like so:
3) Now apply a Planar UV Map to the front side of it. This will provide a UV map that will look something like this:
4) But our Muzzleflash texture is a square shape. So the trick here is to select the vertices of the UV map, and slide them out like so:
Image 3D Max, use Modify -> Unwrap UVW -> Edit
Tip: A common texturing mistake is to believe you are limited by how the UV unwraps. But knowing your 3D package’s Unwrapping tools, you can instead adjust your UV map to fit the texture. Now every pixel of our 256×256 texture is used on the model with no waste.
5) Apply your Muzzle Flash texture to the Diffuse channel. Set polygons to 2-Sided in your Texture Editor so it will show through:
Note: Background set to white for easier viewing.
Note: All modern 3d game engines I’ve dealt with have a method of applying textures to surfaces in an “Additive” way. This basically means anything thats black will not seen, and dark hues become semi-transperant. This is how our muzzleflash texture would be treated by the game engine.
To fake this effect in your 3D package however, simply apply the same muzzle flash texture as an Opacity channel. (There are other ways as well, but this is quick and easy)
Same view as above image, but now you can see how it would look in-game.
*Part 3 – Animating the muzzle flash.*
For this step, I really have no choice but to assume you have a fairly good grasp of basic animation principals within your 3D package. Even if its new to you, the concept here is simple so it isn’t difficult to follow along. Of course these are all just general guidlines, you can manipulate and animate your 3d shape in any way that suits your needs.
The pictures provided at the end of this Part should help clear up these steps.
1) Load up your now textured half-sphere from Part 2.
2) Set the number of keyframes to 5. (Assuming 30 frames= roughly 1 second) Pretty decent timing here to get nice flash for a single shot.
3) Lets assume now that your 3D object now represents the muzzle flash in full bloom. Scale and centering is up to you or the requirements for the game. Of course you can always parent it to the muzzle of a gun if you want.
4) Key-Frame this “full bloom” state at frame 2 and frame 4. This will represent the state of firing.
5) Go to frame 1 and Scale it down to roughly 5% of its size. So basically it is unseen–or hiding right inside the barrel of the gun. Key-frame this at frame 1, and repeat for the last frame 5 (So it dissapears).
If you play this through, you’ll notice it looks a little weak. Here is what I suggest for improving:
6) This will involve some vertex animation. At frame 2, select the points at the open end of the 3d object. Drag these outward, roughly doubling the length of the object. Key-frame it. If all your frames now use this stretched object, then go to frame 4, and slide these points back to roughly the original position. Key-Frame it. Dont worry about frames 1 or 5 since they will be too small to notice anyway.
7) Lastly, some rotation. At frame 4, rotate the object about 40 degrees along the axis the gun barrel would be on. Considering the short period of time it will be seen, this will give the flash a better firey effect and appear less like a scaled 3d object.
Here is how each completed frames appears having followed these steps:
Frame 1: Scaled Down
Frame 2: Original Shape
Frame 3: Tweened frame.
Frame 4: Stretched out and rotated along Y axis.
Frame 5: Scaled down again.
*Part 4 – By now you got the basics — Lets make it look better.* And hey, what you made would probably be at least an improvement on at a few games you play. But to get the full effect you need that central blast that really makes an AK flare like an AK. Or in this case a WWII MP38, which was modelled by a fella who goes by Stryker.
From the screenshot below its pretty clear. A rectangle with a texture. Alone it would look bad when viewed from most angles, but When complimented by the surrounding 3D blast, the overall effect works well, and is efficient even on lower end 3D cards.
Don’t forget of course, the scene lighting! Kick that surrounding ambient lighting up to 110% for a split second when that puppy goes off. Will look schweeet I promise.
The texture (applied to a rectangle) –
Screenshot of its placement in 3D –
Feel free to use my muzzle-flash textures for anything you want. All I request is to show me some of your work in return!
Drop me a line: firstname.lastname@example.org