BurnDir - A Burning Man Directory.

How To Make The Burning Letters

So you want to know how to make groovy burning text? Well here goes...

Firstly, you will need Photoshop. I used PS6, you might be able to do it with earlier versions or other editors but I make no promises!

The first step is to pick a font and create the text that you want to burn as yellow on a black background. You can do it in white too but I got better results with yellow (and BOY did I experiment before I got it right!). Note that this image is at actual size (font height of 72 px) but all the vertical images on this page are shown 1/2 size to save space.

Next, we rotate the image 90° Clockwise using Image/Rotate Canvas/90° CW from the main menus.

Now we apply our first filter. The filters can be found under the "Filter" menu (strangely enough!) but from here on in I will only mention the filter subset that you see under this menu, followed by a slash and the filter itself. Our first filter is Stylize/Wind and the settings are "Wind" and "From the Left".

Apply Blur/Gaussian Blur with a radius of 2.0 pixels

Apply a second Stylize/Wind, again with settings of "Wind" and "From the Left". I found this recursive wind with a blur in between the best way to get those delicate tendrils.

Since we are done with wind, you can rotate the image 90° CCW to straighten it out.

Apply Stylize/Diffuse, using "Lighten Only" to get some graininess to the flames.

Time to make the flames dance! Use Distort/Ripple, with "Medium" size at "50%".

Apply another Blur/Gaussian Blur with a radius of 2.0 pixels

Now it's time to make the letters look hollow and eerie by applying the Stylize/Solarize filter.

10.

The Solarize filter makes the letters really dark, so lighten them up with an auto contrast by selecting (from the top level menus) Image/Adjust/Auto Contrast.

11.

Now we have the basic shape, we need to torch it. Reduce the image to grayscale indexed color mode by firstly converting to grayscale with Image/Mode/Grayscale and then Image/Mode/Indexed Color.

12.

With a smooth grayscale color palette we are ready for fire! Use Image/Mode/Color Table to pull up the table; you should see a gradual gradient. Under the "Table" pulldown select "Black Body" and your text will catch alight...

14.

This final filter is optional as the text is already looking pretty fiery. I like to add a final ripple to give the flames a little more life, again using Distort/Ripple. Note! You must convert the image back to RGB mode using Image/Mode/RGB Color before you can apply a filter.

There! We are done, and we have flaming text. But it's still stationary, that won't do.

To animate the text, I found that the easiest way was to simply create a sheet with several instances of the text on it and apply all the filters in parallel to create successive frames. For example, here is the sheet that I used to create the BurnDir animation:

Make sure you leave enough room above the letters for the flame! Once you are done with the text it should look like this:

You can now snip up the image, align the text on successive layers of a new document by eye, pull them into ImageReady and animate them.

One ImageReady tip: if you want to reduce the size of your animation, convert the finished sheet to a 32 color indexed color before you start snipping it up. This will ensure that your finished animation is small enough for modems, while not noticeably altering the flames.

I hope you find this tutorial helpful and go on to build some beautiful flaming text! Please shoot me an email with the URL if you have created flames for the web...

cheers,

Nick

Home Search Register Update Saved Friends Privacy

BurnDir is brought to you by Nick Donaldson and Lite Brite Camp. If you find a bug or have any comments, please email me.