Falling Text Effect


In this tutorial, we're going to have a glance at a very popular text effect you might have come across somewhere on the internet.



As you can see, in this effect, a text falls down on the stage with so much speed and impetus that, for a split second, it gets small and flattened, but then bounces off and smoothly returns to its normal size.

Here is how to create it

i. Traditionally, create a new Flash document, make it 550*400 px and set the fps to 20 or more.

ii. Create some text with your Text Tool or use my text.

iii. Press F8 to convert the text to a Movieclip.





The rest is animation

i. On the first frame, make the text very big. Then, select it and, in the Properties window, apply a blur filter to it. Because we want it to be very blurry, as if it was just in front of our eyes, we must set both y and x blur to as much as 80.



ii. Select the 5-th frame and press F6 to create a keyframe there. On this frame, the text should be much smaller and not blurry at all. So select it, press Alt + Ctrl + S and type like 10 in the Scale field. This will make the text 10 times smaller. To get rid of the blur, just type 0 in both x and y blur field.




iii. Right-click anywhere between the 1-st and 5-th frame and create a motion tween there.




Now, this will create a gradual transition from one text to another - from a big and blurry to a small and distinct one. However, this is not exactly the tween we want. What do I mean by that? Consider this:

A car drives past you. At first, it shrinks very quickly, but then, as it gets further and further from your point of view, this process of shrinking is much slower.

That's the reason why we'll need to ease in our motion tween.



Thanks to this, the effect is much more convincing. We can sort of feel the speed of the text.


TIP: If you've never worked with tweens, it's good you to see my tweening tutorial. It may clear some doubts.

A car drives past you. At first, it shrinks very quickly, but then, as it gets further and further from your point of view, this process of shrinking is much slower.

That's the reason why we'll need to ease in our motion tween.




Make the text on this keyframe flattened and about 20% smaller. You can use your Free Tramsform Tool (Q) to do that.



Thanks to this frame, the speed of the falling text becomes even more clear to the viewer, even though just how much flattened and smaller the text gets is a little cartoony.


v. Create a keyframe on the 8-th frame. Enlarge the text that is on this keyframe by around 30%, plus make sure that the text is not flattened any more.



vi. Right-click anywhere between the 6-st and 8-th frame and create a motion tween there. For better effect, you can ease in this 2-frames-long motion tween slighly.




vii. Create yet another keyframe (this is the last one!) on the 11-th frame. The text on this keyframe should be around 20% smaller.


viii. Right click anywhere between the 8-th and 11-th frame and create a motion tween there.

This time we want the tween to be fast at first and then smoothly drop down on the stage.

That's why, we're going to ease out the tween. Type 100 in the Ease field.





Hope this tutorial was helpful. To read other tutorials, click here.

Cheers!


Average: 4 (8 votes)
FLA
Download FLA - Complete