360 DEGREE TEXT ANIMATION

 

This Tutorial will Animate Text in a Circular path using a Wheel as it's vehicle.
 
 
1.) Go to the Samples folder for this CD and Open it. Inside locate the file named Butterfly.psd, then Double-Click it to Open in Photoshop. (I have prepared a starting image for you to use.)
 
2.) Once loaded, go to View > Rulers. Click on the Horizontal Ruler and pull out Guide until it snaps in the Center of the work space. Now, repeat process for the Vertical Ruler.
 
 
Now, press Ctrl +R to turn Off the Rulers.
 
3.) Click the Foreground Color swatch to Open the Color-Picker.
 
 
Select a color or simply type in #CC0000 at the Bottom input box to select the color I used, then click OK to apply.
 
 
4.) Press Shift +M until the Elliptical Marquee tool is Selected. Go to the Options bar and Select the Fixed Size tab. Enter 200 px for Both Width and Height.
 
 
Now, click on the work area to Create a Selection, then place curser Inside Selection and Drag until it snaps to Center. Go to Select > Inverse.
 
 
We will now Cut the unwanted corners to the image. Go to Edit > Clear. Next, go to Select > Inverse to return to a regular Selection.
 
 
5.) Go to Layer > New > Layer. A dialog box will appear. name this layer Wheel, then click OK to Create.
(It is important to name it with a capital "W" here for the Actions later to run properly!)
 
 
Press Alt+Backspace to Fill Selection with Red.
 
 
Go to the Options bar and change Width and height to 100 px, then click twice on the work area and Drag New Selection to Center. Now, go to Edit > Clear.
 
 
6.) In the layers palette... click the Create a new layer button to Create a New blank layer. Now, press D on the keyboard to return Foreground/Background Colors to their default. Go back to the options bar and change Width and height to 190 px. Click twice on the work area and Drag New Selection to Center. Now, press Alt+Backspace to Fill Selection with Black.
 
 
Go to the Options bar and change Width and Height to 110 px. Click twice on the work area and Drag New Selection to Center.
 
 
Now, go to Edit > Clear, then press Ctrl+D to Deselect Selection.
 
 
7.) Go to the Layers palette and Ctrl+Click the Top layer to Create a New Selection. Now, click the Create a new layer button to Create a New blank layer.
 
 
Press Ctrl+Backspace to Fill Selection with White, then press Ctrl+D to Deselect Selection.
 
 
8.) Next, press Shift+M to Select the Rectangular marquee tool . Go to the Options bar and change Style to Normal. Drag a Selection around the Bottom half of image.
 
 
Go to Edit > Clear, then press Ctrl+D to Deselect Selection. Now, go to View > Clear Guides.
 
 
9.) Time for the Text to be layed. Select the Horizontal Type tool . Go to the Options bar and Select the font. I used Impact Roman 24 pt Crisp. (If the Color well is not Black, click it to Open the Color-Picker and change.)
 
 
Click on the work area and Type your Text.
 
 
Now, in the Options bar, click the Warped Text button and the panel will Open. Select Arc and adjust Bend to the Right like shown. (The amount needed will depend on how many characters the word has.) With the panel Up, Drag the font into position, then click OK to Close and click the Commit button .
 
 
10.) Next, go to the Options bar and click the Color well to Open the Color-Picker and change to White.
 
 
Click on the Lower half of the work area and Type the rest of the Text. Click the Warped Text button , then Select Arc and Bend this time to the Left as shown. With the panel Up, Drag the font into position, then click OK to Close and click the Commit button .
 
 
11.) In the Layers palette... click the Eye icon to the Bottom layer to turn Off it's visibility, then click the Wheel layer to Select.
 
 
Go to Layer > Merge visible.
 
 
12.) Next, we will create the Rotation cels that will Create the Animation. I have Created an Action for this to save you alot of time. Go to Window > Actions. Find the Folder named TA Actions, then click the triangle to the left to Display it's contents. Select 360 Degree Text. Now, click the Play button to run it's Actions.
 
 
The Action will Duplicate the Wheel layer 11 times and Rotate each layer by 30 Degree's consecutively, then turn On the visibility for you, the needed layer to prepare for the Animation stage.
 
 
We are now ready to move to ImageReady...
13.) Click on the Edit in ImageReady button . (Located at the bottom of the Tool palette.)
 
14.) Go to the Animation palette and click the blue arrow (located Top Right corner) and a pop-out menu will appear. Select Make Frames From Layers.
 
 
All of the Frames for the Animation will populate the palette. Click the Delete Frame button to Delete the image at Frame 1.
 
 
Go to the Layers palette and Click the Eye icon to the Bottom layer to turn On it's visibility and the Butterfly image will now return, but this time, will add to All the Frames.
 
 
 
15.) Go to Frame 1 and click the 0 at the Bottom of the Frame to set Delay time. Set to 2 Sec. as shown Above.
 
16.) 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.
 
17.) Optimize and Save the file with File > Save Optimized As... Images Only (*.gif)
 
Copyright © 2006-2008 Glenn Schemenauer - Spacific Designs.com™ - All rights reserved.