Here’s a topic I’ve been meaning to put together a tutorial on for quite a while, and that is how to make a good-looking lightburst effect. For years I’ve been seeing effects like this in games, from full-on light explosions, to glowing balls of energy, to tiny sparkles used as particle effects. It seemed a very useful thing to be able to create this “glow” effect but I had never been able to find any good information on how to do it. So one afternoon I decided to sit down and figure it out for myself. Except it took me a week. And ths is what I came up with!

To get us started, here is an image of the end result we’re after:

This screenshot was taken from within the 4GE engine, the driving force behind Thorodin. This effect uses a combination of 3 techniques which I aim to cover in this tutorial series.

So without further ado, how to make a lightburst in 3 easy steps:

1. Make a Texture
2. Set the Blending Mode
3. Do Crazy Tricks

Part 1 of this tutorial covers only Textures; Blending Modes and Crazy Tricks will be coming shortly. If you are looking for information on HDR or bloom, you will not find any here, those techniques are beyond the scope of this tutorial. I do however use some simple shaders in subsequent sections, so stay tuned!

Make a Texture

There are a lot of Photoshop tutorials on the web detailing how to make lightbursts. I’ve posted a link to an excellent video at the end that details a lot of the same steps I used. However I first want to re-present that tutorial here because the video lacks some key steps that should not be skipped.

First off, create a new 512 x 512 image with a white background:

Making sure you have Black as your foreground color and White as your background color (Note: you can hit ‘d’ to do this fast), use the Gradient tool (set to “Foreground to Background”) to create a bottom-to-top gradient over your entire image. Note: Leave a decent margin at the bottom of your image when you use the gradient tool. It’s important that the bottom of your image be solid black.

Now, go to Filter->Distort->Wave and rock the following settings:

We’re after a few big chunky light rays in our lightburst, if you want a lot of smaller rays in yours then you can play with these numbers and hit the Randomize button a few times until you get the desired effect. The most important part about this filter is that you still want to ensure a lot of black space at the bottom of you image. This must be TRUE black, when you run your cursor over the bottom of your image after applying the filter, your info panel should display (0, 0, 0) for the color values.

Next, go to Filter->Distort->Polar Coordinates and use the following settings:

Things are starting to look more like a lightburst now. I’d like to add a little randomness to the lightbust, so we’re not quite done yet. Go now to Filter->Distort->Ripple and apply the following settings:

Finally, do a Filter->Blur->Radial Blur with the following settings:

This adds some jagged energy-looking spikes to the center and rocks out the edges a little bit. For a finishing touch, I like to smooth out the center with a (gasp!) 105mm Prime Lens Flare. Go to Filter->Render->Lens Flares and put one right in the center with a brightness around 70 or so.

And now we’ve got a pretty decent looking lightburst texture. Note that there is AMPLE black space around the lightburst, thanks to the way the gradient was created initially. The reason for this is to ensure the burst has no hard edges and that any color information has plenty of room to fade all the way to black. In the next part of this tutorial, once we start blending things, if there is any color information all the way to the edge of the image, a sharp line will be visible which ruins the good effect of a light beam. The burst might look small, but it will scale nicely and look very clean. You can get the final image here in TGA format.

Here’s the video tutorial mentioned above - http://revver.com/video/435861/exciting-photoshop-energy-burst-tutorial/ Note that it does not attempt to keep color information away from the edges of the image, this is very important!

Tune in soon for Part 2 of this gripping tutorial to learn how to properly blend the texture we’ve made!