Updated March 18, 2007

This is where you can view all the frames of your animation. It displays each frame in your animation as a thumbnail. Each thumbnail frame also displays the time delay of the frame. There are also shortcut buttons on the Frame Panel for quick access to commands like Play Animation. Double-clicking on a frame thumbnail opens the Frame Properties dialog box. You can also click and drag a frame to another position if you wish.

If you need to select more than one frame at a time, hold the CTRL key, then left-click with the mouse on each frame you want to select. If you have several frames in succession to select, select the first frame; then hold the SHIFT key and click the last frame. All frames from the first to last will be selected. (You could now deselect any frame or frames in between by using 'CTRL' + click.)

Frame Panel

The bottom row of the Frame Panel has several buttons. Starting at the left, we have Play and Stop. These allow you to watch your animation in the workspace. The dual arrow buttons are for rewinding or fast forwarding to the next frame or the first or last frame.

The next set of three buttons are: Add a blank (empty) frame (to which you may add objects); Duplicate the currently selected frame (or frames); and Delete frame. Deleting a frame deletes only the frame, not the objects in it. The objects remain shown in the Object Manager Panel.

Tween The Tween button is rather useful. Using it can be confusing. Here is what Tweening is and how to do it.

Tweening is a method for creating new frames, or updating the frames between two frames that contain the same objects but with different attributes - either different positions or transparency. By doing this, the objects appear to be moving or fading when the animation is played.

For example, you have a two-frame animation. The first frame has a car on the left of the frame. The second frame has the car on the right. You then click the tween button, and set it to add frames, adjusting the position of the selected object (the car). When done, you will have an animation of the car moving from the left to the right. You can adjust how many frames are added, as well as the frame delay for those frames.

Before you tween: The following procedure outlines how to prepare for position tweening; however, a similar procedure can be used for transparency tweening. 

Creating newly tweened frames: This procedure outlines how to insert tweened frames into your animation; however, a similar procedure can be used for updating intermediate frames.

Note: While the Tween dialog box is open, you can select frames and/or objects in the workspace, Frame Panel or Object Manager Panel. This is so you can adjust what you would like to tween or select intermediate frames that you would like to update. 

  1. Select Frame, Tween from the standard menu bar or click the Tween button on the Frame Panel.
  2. On the Frame tab, select the Start and End Key Frames by entering the frame numbers in the respective boxes.
  3. In the How to generate frames section, select Insert frames and then type in the number of frames you want to insert between the start and end frames. A larger number of frames will create a smoother animation, but will also increase the file size.
  4. Enter a number in the Frame delay box. This sets the duration each frame will be displayed, in hundredths of a second. A value of 10 means 10/100ths (or 1/10th) of a second.
  5. On the Objects tab, select to tween all visible objects or only those selected on the Object Manager Panel.
  6. Select to tween the objects' position and/or transparency.
  7. Click Start Preview to preview the animation in the workspace and the Frame Panel. Click Stop Preview when done.
  8. Click OK when you are satisfied with the previewed result.

For more details, see the tweening tutorials listed on the Tutorials main page.

Add Banner Text Add Banner Text. This gets complicated... For a full tutorial on Banner Text, see my new Banner Text tutorial.

This allows you to create text banners anywhere in your animation. These banners can be added to your animation as a single banner object, which can be edited later, or as separate objects, which will be treated as text objects. Also, the banner can be distributed to existing frames or added to new frames using the starting frame as its background.

To add banner text to your animation:

Neon Banners are a bit different. Here's how.

To add a neon banner to your animation:

  1. Click Frame, Add Banner Text on the Standard Menu bar or click the Add Banner Text button on the Frame Panel. This opens the Add Banner Text dialog box.
  2. Click the Neon tab and select Neon.
  3. Specify the Direction of the neon effect for the selected text object.
  4. In the Width box, enter the thickness value for the neon effect.
  5. To change the neon color effect, click the Color square to open the Ulead Color Picker dialog box and select the color you want.
  6. Select Glow to make the neon effect fade in and out of your animation or select Transparency to make the text transparent so that only the neon effect is visible.
  7. Click OK.

Reverse Frames Reverse Frame Order. This is fairly straightforward. You can either reverse the order of all the frames, or just the frames you have selected on the Frame Panel. (Ctrl Click each desired frame, or click on the first frame and shift-click on the last frame if in an uninterrupted sequence.) A box will appear to let you select all frames or selected frames. Make your choice and click OK.

Frame Panel Commands The last button is Frame Panel Commands. This will let you set the size of the thumbnails in the Frame Panel, or access the Frame Properties dialog box.

Frame PropertiesYou can access the Frame Properties dialog box in several ways: double-clicking the frame thumbnail; by right-clicking on a frame thumbnail and selecting Frame Properties; or by selecting Frame, Frame Properties from the Standard Menu.

Note that you can change the properties for more than one frame at a time, if you select several frames. If not all frames have the same frame delay, removal method or title, that field will show as blank. Any change made when more than one frame is selected will apply to all selected frames.

With the Frame Properties box, you can set the delay time for the frame. This tells the program playing the GIF how long to display that frame before moving to the next one. A value of 1 equals 1/100 of a second, and 100 equals 1 second.

You can also set the Removal method. This defines how a frame is removed during the animation sequence. (Additional information can be found in the Frame Removal Method tutorial.)

The options are:

Lastly, you can give the frame a name, if desired.

The Frame commands Synchronize Objects Across Frames and Flatten Frames as Single Object are detailed in the Standard Toolbar page.

That takes care of the Frame Panel.

Back to Screen Shot


Viking's Web Animation - Home Page

longship bar

Valid HTML 4.01 Transitional  Valid CSS!