WALKING TEXT ANIMATION

 

 
This Tutorial will show you how to "Walk" text into view.
 
 
1.) Open ImageReady. Press D, then X on the keyboard to set the Background color to Black. Create a New file. Go to File> New. Make it 300 X 150 pixels on Background color, then click OK to Create.
 
2.) At the bottom of the Layers palette, select the Create a new layer icon .
 
3.) Select the Type tool . Go to the Options bar and Select the font. I used Impact 100 px Sharp. (You may have to manually input 100 px for size.) Next, click on the Color well to the Right to launch the Color-Picker.
 
 
Select a color or simply type in #0000FF at the Bottom input box to select the color I used, then click OK to apply.
 
 
4.) Click on the work area and Type your First letter of Text. Select the Move tool to Commit. Reselect the Type tool and Type the Second letter, then press V to Commit. Repeat process until there are a total of 4 letters, all on Separate layers. (Be sure to click a small distance away from previous Letter so a New layer is Created each time.)
 
 
Now, Move each letter into position as shown below. (To move... First Select it's layer, then go to the work area and Drag into position.)
 
 
Animation palette should appear as shown:
 
 
5.) At the bottom of the Animation palette, click the Duplicate Frame icon , to generate a second duplicate Frame.
 
6.) Now, in the Layers palette, click on the W layer. Using the arrows on the keyboard, nudge the letter to the "Left" out of view.
Click on the A layer, nudge the letter "Up" out of view.
Click on the L layer, nudge the letter "Down" out of view.
Click on the K layer, nudge the letter "Right" out of view.
 
With Frame 2 now black, click on Frame 1 and drag to Frame 2 position. Animation palette should now appear as below:
 
 
7.) Next, click the Tween button located bottom of Animation palette.
Dialog box will appear, follow settings Below:
 
 
Animation palette will now show tweened Frames.
 
 
8.) Set time delay to Frame 7 by clicking on the 0 at the Bottom of the Frame. A pop-up menu will appear, Select Other and a Dialog box will appear. Type in 1.5 Seconds, then click OK to apply.
 
 
 
9.) Animation is now ready to play by hitting the play button. (For a more precise animation speed) click the Preview in Browser button, to view in a browser.
 
10.) Optimize and Save the file with File > Save Optimized As... Images Only (*.gif)
 
Copyright © 2006-2008 Glenn Schemenauer - Spacific Designs.com™ - All rights reserved.