RAVASMARTSOLUTIONS - TECH TIPS Purpose CS5 - Flash - Build a Banner Animation This Tech Tip will illustrate how to build a basic banner animation using Flash. Please build your Flash Image library before beginning this review the Tech Tip at: CS5 - Flash - Building a Flash Image Library Modify Banner to Desired Size From your previous work on building a Flash Image Library open up this Flash file and modify the size of the banner to your desired specifications as follows: Prior File with Flash Image Library: Now click on the Modify menu and click on Document Insert the desired width and height This brings up the following: Adjust the Dimensions (width and height) & Click on OK Author: Rick Rava Page 1 of 8 Revised: 6/4/2011
Build Layers with Desired Timing The following is an overview of process with a sample animation: 4: Add desired text 1: Create layer with good naming conventions 3: Drag desired Flash Library Image to desired location on layer 5: Create the desired web component (ex. SWF) 2: Adjust and setup the length of this layers play time with key frames Author: Rick Rava Page 2 of 8 Revised: 6/4/2011
1: Add Layers Click on New Layer button After clicking on new layer button rename the new layer to a good layer name Double-click layer name When you double-click the layer name then you can rename the Enter good layer name Always use a good description layer name! Author: Rick Rava Page 3 of 8 Revised: 6/4/2011
2: Set Keyframes and Timing With any animation, you need to determine how long any Flash object appears this along with motion tweens determines how the animation looks. In this example, we will setup keyframes so that the first layer appears first, then the second layer appears next and so on. First move to where you wish an object to appear in the above example, I desire to have a new flash object appear after the Marginal Way Flower Picture Next right mouse click and choose insert Key Frame Right Click Here Insert Keyframe This results in: Author: Rick Rava Page 4 of 8 Revised: 6/4/2011
This is the starting point where you wish to have the animation start for this layer! Next you need to set the length Click once on the end key frame marker Now drag (by holding your left mouse button down) the end key frame marker to the desired location This results in the following keyframe length! From the above, the layer 3 is set up for the desired time frame (please note that you may adjust this later if it is not what you desire)! Author: Rick Rava Page 5 of 8 Revised: 6/4/2011
3: Drag Desired Object to Layer Now you need to drag the desired Flash object to your layer. First make sure you click once on your desired layer where you wish the object to first appear Now we need to click once on the GrillingYorkBeachHouse Flash object (remember the key is to use the Flash object) Move the object / image to where you wish it to be notice that the keyframe start and end points for this layer are now shaded in! Author: Rick Rava Page 6 of 8 Revised: 6/4/2011
4: Add Desired Text Now you may add your desired text. Click on the layer and timeline where you wish to insert your text On the toolbar click on the text tool From the Text Menu on top of your screen select the desired color, size, font, etc. Now click on the stage and enter the desired text You have almost limitless possibilities with animation you can add keyframes and have the text appear, move, and much more (the same is for any object). Author: Rick Rava Page 7 of 8 Revised: 6/4/2011
5: Create the Desired Web Component (ex. SWF) Last, you need to save the animation in the desired format. One of the most common methods is to save it in SWF format. This is very easy to do just hold the CTRL key down and press ENTER Author: Rick Rava Page 8 of 8 Revised: 6/4/2011