feedburner
Enter your email address:

Delivered by FeedBurner

feedburner count

Cylindrical Text Effect

Labels: , , , , ,

Hot pile of Flash tutorials coming through! This time we will learn an easy text effect which is simple (but fascinating), popular (but cool).

The Final Result:


Step 1) Create a New File with any dimensions to your likings. (P.S. There will be no Action Script work and therefor this effect can be done on any versions of the later Flash softwares.)

Step 2) Go to Insert-Symbol (Ctrl+F8). Name the new symbol anything you like but I have name mine text (so original eh?) and then check the Graphic box.


Step 3) You will enter and blank stage where you will type in your desired text like so. You may also wish to customize the text around to create your own originality.


Step 4) Now that you have finished with creating your text, click on Scene 1 to get back to your main scene.


Step 5) Open up your library (Ctrl+L) and drag the Graphic symbol you just created onto the stage. Then, in the 15th frame or so (can be adjusted to you own liking of how fast the text should spin) add a Keyframe (F6).

Step 6) Go back to Frame 1 and with the Graphic still selected, press on the Free Transform Tool (Q)


Step 7) Move the white dot in the middle to the top like so:


Step 8) Adjust the Graphics's Alpha to 5%.


Step 9) Then reduce the image's height only until so:


Step 10) In between the 1st and 15th frame, right click - Create Motion Tween


Step 11) Create a New Layer and repeat the same steps from 5~10. However it's been reverse so that Frame 1 would have Alpha of 100% whereas Frame 15 will have Alpha of 5%.

Important Note: When dragging the Graphic onto your 2nd layer, it should overlap exactly on top of where the Graphic (text) of layer one in the 15th frame was. To do this, select the Graphic and move it using the arrows on your keyboard.

To see if you're following this tutorial correctly, please see the following images:



This should be how Frame 1 should look like with the visible text and the invisible text slightly above it. (They are placed in different layers)


This should be how Frame 15 (or 16 in my case) should look like with the invisible text below the normal text. The extra empty frames at the end is optional if you want the text to stop for a while before tuning again.


Enjoy your holidays!~





11 comments:
gravatar
Anonymous said...
January 3, 2009 at 2:03 AM  

A really cool effect and an excellent, easy to follow tutorial. Flash is one of those things I keep meaning to get into but never find time for. When I do; your blog is the place I'll start!

gravatar
Anonymous said...
January 3, 2009 at 6:06 AM  

@Liam
When you're able to find time, you will get absorbed in this whole new world of creating Flash believe me and thank you for your compliment.

gravatar
Our Crafty Dreams said...
January 3, 2009 at 11:01 AM  

Thanks for downloading my template and leaving a comment. You asked if I used photoshop. No, I don't. I wish I had it but it's too expensive for my budget. I use PS Elements 5.0. ta ta for now.

gravatar
Anonymous said...
January 22, 2009 at 5:17 AM  

Hello,

this is great and easy to understand tutorial, almost what I need. Actually, if this can be combined with this one : http://www.computersight.com/Software/Flash/Pulsate-Text-Flash-Tutorial.463935 it will be exactly what I need. Is it possible to do it?

gravatar
Maggie Zhang said...
January 22, 2009 at 6:19 AM  

To Pulsate Text:

Thank you, glad that it was helpful. I've went to check out the pulsate text effect but could not get a preview of the effect so I am not sure yet of whether this can be combined but i will be sure to follow through that tutorial and see what i end up with and i'll tell you the results.

Cheers~

gravatar
Anonymous said...
March 4, 2009 at 4:31 AM  

can i have a a copy of the code or something used to create this? thanks.

gravatar
Maggie Zhang said...
March 14, 2009 at 5:13 AM  

This effect requires no action script code to make what so ever so just follow through the tutorial and all should work well.

Thanks.

gravatar
shashi Al Mudhish said...
March 20, 2009 at 12:31 PM  

a cool effect with a difference it can be experimented according to one's imagination.

gravatar
Anonymous said...
April 11, 2009 at 7:05 AM  

i get a bit lost when you make the text smaller. where do you place it after making it smaller?

gravatar
Maggie Zhang said...
April 14, 2009 at 8:17 PM  

Hi:

I think you are referring to Step 9?
You will need to drag the text onto the stage and then at Frame 15 insert a keyframe and while still in the keyframe drag the text until the size is reduced like the image shown above. You do not need to move the text itself. Please look at the last two images in the tutorial and carefully examine them again if you get stuck.

gravatar
ranacseruet said...
January 3, 2010 at 12:18 AM  

Nice effect. I am going to try this out soon...

Post a Comment

Post a Comment