Jumping letter animation

Date: 3.12.2007, 12:12    Total views: 74107

See this lesson and learn how to create letter that is jumping from the right to the left and inversely using some special flash tricks. You don't have to use action script code to make this lesson. This lesson is very easy for create but in the same time very powerful and useful. You can use this animation for any text banner, presentation...



Step 1

Create a new flash document. Press Ctrl+J key on the keyboard (Document Properties) and set your dimensions as whatever you like. Select any color as background color.Set your Flash movie's frame rate to 26 and click ok.





Step 2


Take the Text Tool (A) and type any text on the stage. For this example I have typed flashfridge.com. For this example I have used Tahom font size 28px and I have bold it. See the picture below.



Step 3

While the text is still selected, press Ctrl+B key (Break Apart) to break apart this text. See the picture below.



Step 4

While the text is still selected, choose Modify - Timeline - Distribute to Layers (Ctrl+Shift+D). Now, you have placed every letter in separated layer. See the picture below.



Step 5

After that, select layer text and delete it, becouse it is unneedless for now.

Step 6

Select now the first letter (in my example letter F) and press F8 key (Convert to Symbol) to convert this letter into a Movie Clip Symbol.



Do that now, for every other letters.

Step 7

Click on frame 5 and 10 of layer of the first letter (in my example letter "F") and press F6 key. After that, go back on frame 5 and move this letter a little up using the arrows key, or by mouse.

Step 8

Choose right-click anywhere on the gray area between the frame 1 and 5 and frame 5 and 10 on the timeline and choose Create Motion Tween from the menu that appears.See the picture below.



Step 9

Click on frame 5, 10 and 15 of layer of the second letter and press F6 key.



Step 10

After that, go back on frame 10 and move the second letter a little up like we have done for the first letter using the arrows key or by mouse.

Step 11

Choose right-click anywhere on the gray area between the frame 5 and 10 and frame 10 and 15 on the timeline and choose Create Motion Tween from the menu that appears.See the picture below.



Step 12

Go back on frame 15 of layer of the first letter and press F5 key.



Now, we're done for the first two letters. Repeat this process also for every other letters. When you came to the end, repeat the all process again, but for this time do that from the left to the right side.

Have a nice day!

Download source file (.fla)

  Digg it! Add this tutorial to del.icio.us! Furl it! Add this tutorial to reddit! Spurl it! Add this tutorial to technorati!
Share
ShareSidebar