Monday, 22 June 2009

Disappearing text effect

In this tutorial you will learn how to create a simple disappearing text effect in Flash. The results of this text effect will show each individual letter in the sequence disappear in order. You need to use the alpha property for this effect. I have used an Actionscript 2.0 file for this tutorial, but an Actionscript 3.0 file should also work fine.

Disappearing text effect

Step 1 – Type text

Open a new Flash document.
Select your text tool and type your message on the stage. I have used Impact font type with #FF0000 colour, but you can use whatever colour or font type you wish.




Step 2 – Convert to symbol

Select your text message with the selection tool (V) then right click and select Break apart. Convert each letter of your text message into a symbol by pressing F8. Give your letter an appropriate name, check movie clip and click ok.


Step 3 – Add drop shadow filter

Select all your letters on the stage then add a drop shadow filter at the bottom of the screen. Then add the following settings:



You can experiment with the various settings if you wish. I have added 130 % for the strength and 6 pixels for the distance.


Step 4 – Timeline

Select all your letters on the stage again and right click then select Distribute to Layers. This splits all your letters onto separate layers.

On the timeline select the layer of your first letter and insert a key frame (F6) at the 15th frame. Then select your second letter and insert a key frame (F6) at the 30th frame. Now repeat this for all your letters, each letter should have a 15 frame interval from the previous letter. Your timeline should look something like below:




Step 5

On the timeline for all your letters, right click in between the two key frames and select Motion tween. If you are using Flash CS4 then select Classic tween.

Select the second key frame for your first letter on the timeline, then the click the letter on the stage and change the Alpha properties to 0%. Repeat this for all your letters.




Step 6 – Test movie

Test your movie clip Ctrl + Enter.



You should now have a disappearing text effect. Feel free to contact me for any questions or comments and remember to subscribe. You can download the source files here.

3 comments:

vidhu 30 September 2009 at 00:49  

the notes really sweet and crisp.. thank u for u wonderfull notes

Anonymous 28 December 2009 at 07:47  

hi...this looks so great but i have one problem - when i want to distribute to layers, i don't get all layers separately in the timeline, only the last one appears for some reason (i did selection by Cntl + click on each letter). Help, thanks!
Alex

iliketo 28 December 2009 at 10:09  

@Anonymous

You need to make sure you have selected all the characters. If this does not work, you can try manually placing the letters into separate layers.

  COPYRIGHT © 2014 · ILIKE2FLASH · Theme by Ourblogtemplates

Back to TOP