Codezwiz >> Forums >> Graphics Help >> Masking text

What I am trying to do is create some text on my logo that is on fire.

I have a 10 frame gif named fire and want it masked with the text, so the text will be on fire.

I have played with this for a couple hours in Macromedia Fireworks and can't seem to get it to work. I don't have Photoshop.

Thanks

I've never used Fireworks. The best that I can suggest is do a google for "Fireworks Tutorials" and see what you come up with. I'll do some checking and if I come up with any links, I'll post em here.

Kelly

Is there a way anyone else can do this in Photoshop for me, and post the results here?

OK, what is it you're wanting the logo to "do"? You want the fire moving behind the text? Or do you want the letters moving? Are the images above the ones you want used? And are the images above the size you want your logo?

Kelly

Originally posted by Kelly_Hero:

You want the fire moving behind the text?

Exactly.

I have the logo already done that I will place the text onto. The site is at this location:
[ Register or login to view links on this board. ]

Thanks for all your help.

How's this?

Outstanding!!!

XXXOOO

/Edit

It has a small hitch in the animation, probably around frame 10. I wonder if this can be fixed?

See it in action at [ Register or login to view links on this board. ]

I was jus wondering kelly how did u get the fire on to the text that was amazing did u learn it off a tutorial somewhere if u did could ya tell me where or could ya me what tutorial i will need to find to learn it ?

Cheers Hitman

nice work Kelly!

Thanks Recoil.

Hit, here it is, step-by-step:

1. Open the fire animation in ImageReady and then jump to PS from ImageReady. What this does is open an image with each frame on a separate layer.

2. Open the text image in PS. Change the mode to RBG from Indexed since it's a .gif file.

3. Paste the text into a new layer on top of all the layers.

4. Use the Magic Wand to select the letters in the text. Inverse the selection, then delete to get rid of part of the image that you don't want.

5. Deselect.

6. Click on the top fire layer in the Layers pallette to make sure it is activated.

7. Still in the layers pallette, hold down Control and clickd the text layer to select the text.

8. Do not deselect. At the bottom of the Layers pallette, click the Add Layer Mask button. You'll see everything except what you had selected disappear. It's still there, just covered up by the layer mask.

9. Repeat steps 6-8 for each fire layer.

10. Jump back to Image Ready. Make any adjustments to the animation that are needed.

11. Save as an animated .gif. In this case, the .gif was going to be used over the top of a background image, so it needed to be transparent. To make sure the edges were as smooth as possible, I applied a Matte color that was close to the color of the background it would be sitting on top of. This helps smooth the transistion between the image and the background that it's sitting on.

That's it! Easy peasy.

Kelly