Ulead GIF ANIMATOR 5 User Manual

User Guide Ulead Systems, Inc. March 2001

First English edition for GIF Animator version 5, March 2001.

All rights reserved. No part of this publication may be reproduced or transmitted in any form or by any means, electronic or mechanical, including photocopying, recording or storing in a retrieval system, or translated into any language in any form without the prior written permission of Ulead Systems, Inc.

Software license

The software described in this document is furnished under a License Agreement which is included with the product. This Agreement specifies the permitted and prohibited uses of the product.

Licenses and trademarks

Pro are trademarks of Ulead Systems, Inc. All other product names and any registered and unregistered trademarks mentioned in this manual are used for identification purposes only and remain the exclusive property of their respective owners.

Sample files

Files provided as samples on the program CD can be used for personal demonstrations, productions and presentations. No rights are granted for commercial reproduction or redistribution of any sample files.

North & South America: International:

Ulead Systems Inc. Ulead Systems, Inc.

http://www.ulead.com http://www.ulead.com E-mail: info@ulead.com http://www.asiapac.ulead.com

http://www.ulead.com.tw E-mail: info@ulead.com.tw

Europe: Japan:

Ulead Systems GmbH Ulead Systems, Inc.

http://www.ulead.de http://www.ulead.co.jp E-mail: info@ulead.de E-mail: info@ulead.co.jp

Table of Contents

Introducing Ulead GIF Animator ........................................................................................................... 4

Whats new ............................................................................................................................................ 6

Getting started ....................................................................................................................................... 8

Installation .............................................................................................................................................. 8

Running the program ............................................................................................................................... 8

Customizing how you work ....................................................................................................................... 9

GIF Animator at a glance ..................................................................................................................... 11

Introducing the interface ........................................................................................................................ 11

Working modes in GIF Animator .............................................................................................................. 12

For current GIF Animator users ........................................................................................................... 14

Tutorial ................................................................................................................................................. 15

Creating an animation project ............................................................................................................. 16

Introducing the UGA project file .............................................................................................................. 16

Creating a new project ........................................................................................................................... 16

Using the Animation Wizard .................................................................................................................... 17

Starting out with an image, animation or video file ................................................................................... 18

Setting the canvas size ........................................................................................................................... 18

Working with objects ........................................................................................................................... 20

Adding image objects ............................................................................................................................. 20

Object Manager Panel ............................................................................................................................ 21

Manipulating objects using the Tool Panel ................................................................................................ 23

Adding a shadow ................................................................................................................................... 30

Managing multiple objects ...................................................................................................................... 31

Working with frames ........................................................................................................................... 33

Frame Panel .......................................................................................................................................... 33

Banner Text ......................................................................................................................................... 36

Adding Banner Text ................................................................................................................................ 36

Using Plug-in filters ............................................................................................................................. 38

Using Video F/X ................................................................................................................................... 39

Optimizing your animation .................................................................................................................. 41

The Optimize mode workspace ............................................................................................................... 42

Optimization process .............................................................................................................................. 43

Previewing your work .......................................................................................................................... 45

In the Edit mode .................................................................................................................................... 45

In the Preview mode .............................................................................................................................. 46

In a Web browser .................................................................................................................................. 46

Saving & exporting ..............................................................................................................................47

Saving your work ................................................................................................................................... 47

Sharing your animation .......................................................................................................................... 50

Index Editor ......................................................................................................................................... 52

Appendix: GIF color palettes ............................................................................................................... 54

Shortcuts .............................................................................................................................................. 55

Index .................................................................................................................................................... 56

ULEAD GIF ANIMAT OR USER GUIDE

Introducing Ulead GIF Animator

Ulead GIF Animator is a powerful GIF animation tool for creating high impact animation for Web pages, presentations, and multimedia titles. From composition, editing, and applying special effects, you can do them all in GIF Animator. GIF Animator also gives you total control over optimization, allowing you to make animations compact and Web-ready while retaining excellent image quality. And, when it is time to produce the final animation file, the program lets you output your animation in a variety of file formats, including animated GIF, Windows AVI, QuickTime, Autodesk animation, image sequences, and even Flash animation.

Just to give you an idea of how powerful GIF Animator is, here is an overview of some of its features. For more information about the program’s new features, see the section “What’s new” on page 6.

Animation and Optimization Wizards

GIF Animator includes built-in wizards that take all the hard work out of building animations. If you are a novice user, you can easily compose an animation by running the Animation Wizard. This wizard walks you through the whole composition process in four quick and easy steps. After you are done editing your animation, use the Optimization Wizard to automatically make the output file as compact as possible for faster download times on the Internet.

Simple, easy-to-use interface

GIF Animator’s integrated interface makes working with animations a breeze. Its tab-style interface lets you instantly switch between different working modes for you to edit, optimize, and preview your animation. The frames that make up your animation are clearly laid out in the Frame Panel, where you can add, remove, or reorganize the frames and customize playing options of individual frames. You can also easily manage the objects in the animation with the Object Manager Panel.

INTRODUCING ULEAD GIF ANIMAT OR

While editing your animation project, viewing the results of your work is a snap with

workspace previews or instant browser previews.

Object-based editing

GIF Animator, while primarily a post-production tool, does give you the capability to manipulate objects in True Color. With the various tools in the Tool Panel, you can add text objects as well as perform minor touch-ups and edits on image objects. For more advanced editing, you can even send a frame’s objects directly to your favorite image editor for further enhancement or to add special effects. If you use Ulead PhotoImpact to create new text or apply effects to your text, the text objects will still remain editable when you bring them (*.ufo file format) back into the GIF Animator workspace.

Animated banner text

GIF Animator lets you create dynamic and eyecatching banner text in motion. You can combine different effects, such as adding a neon glow and applying move-in and move-out effects. GIF Animator also provides text formatting, alignment and line spacing adjustment controls for banner text.

Plug-in filters and video effects

Photoshop 32-bit plug-ins can be added into GIF Animator and applied to image objects. Also, GIF Animator comes with many video filters and effects, allowing you to create impressive transitions from one frame to another and add impact to your animations.

Note:

GIF Animator 5 can open UFO files created in all Ulead PhotoImpact versions. Yet, UFO files saved in GIF Animator 5 can be opened again in GIF Animator 5 or Ulead PhotoImpact 6 only.

ULEAD GIF ANIMAT OR USER GUIDE

Whats new

This version of GIF Animator offers significant improvements to the overall program interface and brings you a wide range of new features that give you increased flexibility when editing, optimizing, and outputting your animation projects. Moreover, the approach in creating an animation has been enhanced with greater efficiency.

Enhanced usability

• User-friendly interface that allows you to “dock” tool panels where you want them or transform them into floating panels.

• Workspace previews show convenient True Color preview in editing mode.

Object-based editing and composition

• T ext, image, and banner text objects make animation composition and editing easier.

• Transform Tool now lets you resize and rotate objects.

• Improved Selection Tools add/subtract selections. They can also produce soft edges, anti-aliasing, loading selections, and inverting selections.

• New Object Manager Panel lists all the objects in an animation project. You can use it to show objects, hide objects, customize object properties, and set the object layer level.

• T weening automates the process of animating objects. This new feature automatically generates intermediate positions for selected objects to simulate motion and fade-in/fade-out effects.

Cross-application integration

• From within GIF Animator, send objects to other image editors such as Ulead PhotoImpact 6, Photoshop or Paint Shop Pro for further editing.

• Photoshop layers and PhotoImpact objects can now be opened as individual objects in GIF Animator.

Improved text handling

• Text objects remain editable after entry.

• Character-level formatting enables use of different fonts, styles, character spacing, and more for individual characters within the text.

Use a selection with soft edge to create a semi-transparent effect in your GIF.

While using the Transform Tool, drag the control points to transform an object in the animation.

Tweening

WHAT’S NEW

Left: True Color View Right: Index Color View

• Line spacing and baseline shift adjust the

spacing between multiple lines of text.

• Gradient and texture fills provide multiple color

and pattern fills for text.

• Add Neon or Split Text to be able to edit the

individual characters.

Improved banner text

• Re-editable banner text lets you modify banner

text effects and settings.

• Full typographic control enables character-level

formatting, line spacing, and more.

• Combine effects by adding a neon glow and

applying move-in and move-out effects.

New video filters

• New ColorReplace and ColorShift video filters

provide animated color effects.

Greater optimization control

• Improved optimizer engine reduces the file size even more!

• Side-by-side before and after previews show real-time optimized results and file sizes.

• Dither and Lossy adjustments give you more control over GIF compression.

• Web snap control increases the relative proximity of colors to the Web safe palette.

• Palette Weight reserves a larger number of palette entries for red, green or blue.

• Color palette management enables locking, sorting, and snapping of index colors.

• Compress by file size or compression ratio.

Improved output options

• Save objects as layers in Ulead PhotoImpact 6 UFO and Photoshop PSD file formats.

• Export projects as T rue Color Flash animations in BMP or JPEG formats.

• Save animations as AVI videos, MPEG videos, or QuickTime movies in True Color.

ULEAD GIF ANIMAT OR USER GUIDE

Getting started

It is easy to install GIF Animator. The Installation Wizard will guide you through the steps for completing the installation. Once you have GIF Animator up and running in your computer, start out by first customizing the program to best suit your needs.

Installation

Once you’ve installed GIF Animator, take a moment to register online. Just point your Web browser to the Ulead Web site (http://www.ulead.com). Becoming a registered user entitles you to product and information updates, as well as technical support if you encounter any problems with the GIF Animator program.

Running the program

To install GIF Animator:

1 Place the GIF Animator CD into your

CD-ROM drive.

2 When the setup screen appears, follow

the instructions to install GIF Animator onto your computer.

Note:

If the setup screen doesn’t appear automatically, click the Start button on your Windows task bar and then click the Run command. When the Run dialog box opens, enter D:\setup.exe and click OK (where D is the letter of your CD-ROM drive).

To run the GIF Animator program:

• Double-click the GIF Animator icon on

your Windows desktop.

• Select the GIF Animator icon from the

Ulead GIF Animator program group on the Windows Start menu.

Note:

To learn more about GIF Animator, you can access the program’s online help. Simply press [F1] to open it. You can also visit the Ulead Web site for tutorials by selecting Help: Online Tutorials.

GETTING STA RTED

Customizing how you work

Before you start creating your animation projects, select File: Preferences [F6] to customize GIF Animator and specify how you want to work with your animations. For instance, you can define a standard delay time for displaying frames in your animation, choose the Web browser to use when previewing your work, set up the number of undo levels, and more. Click the tabs in the Preferences dialog box to select the desired options.

Here are some tips on what options to use when working with animations. For information on all the available options, click Help in the different tabs of the Preferences dialog box.

Preferences dialog box - Add Image/Video, Open/Save, and Edit tabs

Preferences dialog box - General tab

To set the desired undo/redo levels:

• Click the General tab. Setting a high value for the Levels of undo allows you to perform as many actions as you want, yet still be able to change your mind and remove or reapply some of those actions to come up with desirable results for your animation.

Note:

The maximum number of undo/redo

levels is “50.”

To define standard playback settings for animations:

• In the General tab, set a standard display time for each frame by entering a time Delay. This determines the speed of your animation. Also, from the Removal method list, select a method for removing frames before displaying the succeeding frames.

Note:

Setting a Delay value of “100” displays

each frame for one second.

To show or hide popup messages:

• In the Add Image/Video, Open/Save, and Edit tabs, select what messages or option selections you want GIF Animator to display before performing certain file operations or object manipulation.

ULEAD GIF ANIMAT OR USER GUIDE

Preferences dialog box - Optimize tab

Preferences dialog box - Preview tab

Preferences dialog box - Plug-in Filters tab

To use plug-in filters:

• In the Plug-in Filters tab, select a check box. Next, click Browse to link GIF Animator to the plug-in folders of other programs (such as Ulead GIF-X.Plugin or Adobe Photoshop), and access that program’s plug-in filters. Then, you can apply the plug-in filters to your animation project from within GIF Animator.

Note:

For more information on how to load plug-in filters and apply them to animation projects, see the section, “Using Plug-in filters” on page 38.

To select the Web browser(s) to use for previewing:

• In the Preview tab, make sure that the

Auto-detect Internet Explorer/ Netscape Navigator option is selected if

you want GIF Animator to automatically locate and use any of these Web browsers when you preview your animations.

Note:

To use another Web browser of your choice, click the browse button under the Other browsers option to locate the desired browser.

To set a default optimization preset:

• In the Optimize tab, select a preset from

the Optimize preset manager list which you think you will most likely use when optimizing your animated GIFs. Then, click Set selection as default to make it as the default preset everytime you move to the Optimize mode.

Notes:

• The default optimization preset is Photo 256.

• For more information on optimization, see the section, “Optimizing your animation” on page 41.

GIF ANIMA TOR AT A GLANCE

GIF Animator at a glance

Everything you need to build great animations is included in GIF Animator’s single, WYSIWYG interface. With its drag-and-drop capabilities and the power to import files from more than 30 different file formats, the sky is the limit to what GIF Animator can help you create.

Introducing the interface

At the heart of the GIF Animator interface is the workspace where you create and edit your animation. In the workspace, there are three mode tabs which allow you to switch between different working modes to complete your animation. The available toolbars and panels change as you click each mode tab.

When you run GIF Animator, the program starts in editing mode where you can begin composing your animation. The illustration below provides an overview of the GIF Animator interface in editing mode. The next few pages give more details about the interface in each of the three modes.

Standard Toolbar

Provides the most commonly used functions and commands in the form of single-click buttons.

Attribute Toolbar

Provides a set of options and controls for specific tools.

Object Manager Panel

Lists all the objects used in the animation.

Tool Panel

Contains various tools for editing objects.

Frame Panel

Lays out the animation frame by frame.

Workspace

This is where you compose and edit your animation frame-by-frame.

Mode tabs

Allows you to switch between the three working modes.

ULEAD GIF ANIMAT OR USER GUIDE

Working modes in GIF Animator

In GIF Animator, going through three different working modes - Edit, Optimize, and Preview

- is essential to complete an animation. While creating an animation, click to switch between these three tabs in the workspace as needed.

Each working mode provides you with a different set of tools to work on. The following sections describe how you can accomplish a GIF animation in different modes and introduce the tools available in each mode.

Edit mode

The Edit mode is the default working mode for GIF Animator. In this mode, the workspace provides a work area where you can compose and edit your animation.

In Edit mode, you can start by first planning out the number of frames or ‘scenes’ needed for the animation. This can be accomplished by using the Frame Panel. In the course of developing your animation, use the Frame Panel to add, remove, and arrange frames as well as set playback options.

You can then add objects. Think of objects as the ‘casts’ that participate in your animation. When you add them to your animation, they will be enlisted in the Object Manager Panel. The Object Manager Panel keeps a record of all your objects. Most importantly, you use the Object Manager Panel to specify which objects will (or will not) appear on each frame in the animation.

Objects, be it text or image objects, can be edited and manipulated. The Tool Panel provides tools for editing objects. When you select an editing tool, the corresponding controls and options used with the tool appears in the Attribute Toolbar.

Frame Panel

Object Manager Panel

Tool Panel

Attribute Toolbar

Note:

To learn more about the Frame Panel, refer to the section, “Working with frames” on page 33.

Floating panels

By default, these panels are docked in a location within the program. Double-clicking the pinpointed area creates a floating panel (with a title bar) that can be moved anywhere of your choice. Doubleclicking the title bar returns to the default docked location.

GIF ANIMA TOR AT A GLANCE

Attribute Toolbar

Before and after previews in the Optimize mode

Optimize Panel

Color Palette

Optimize mode

Optimize mode is where you can work on compressing and compacting your animations before saving them as animated GIF files. Optimize your animations to come up with good quality images yet with smaller file sizes for fast transmission on the Web.

In Optimize mode, the workspace displays sideby-side before and after previews. It shows you the resulting file size after optimization and estimates the required download time for your animation.

To optimize your animation, first, specify the number of colors you want to be available in the animation. GIF Animator simplifies this task by providing you with a list of color palette presets in the Attribute Toolbar which you can directly select and use. The optimization settings associated with a selected preset can be further adjusted through the various controls and options in the Attribute Toolbar. You can also click the Optimization Wizard button for stepby-step guidance on customizing your settings.

For advanced optimization, use the Optimize Panel to customize more settings and specify whether to use a single global palette or apply unique local palette(s) to certain parts of your animation. Use the Color Palette to view and edit colors in the global or local palette.

Preview mode

While working on your animation, click the Preview mode tab from time to time to view the progress and results of your work. This mode shows you a preview of your animation within GIF Animator as it will appear when displayed on your Web browser.

Tip:

The Optimize Panel and Color Palette

can be shown or hidden from the View menu.

Notes:

• To display a “Web preview” in GIF Animator, you need to have Internet Explorer 4.0 or higher installed in your computer. Otherwise, the Preview tab will not be available.

• To preview animations directly in a Web browser, click a browser button on the Standard toolbar. Customize these buttons by selecting File: Preferences - Preview.

ULEAD GIF ANIMAT OR USER GUIDE

For current GIF Animator users

While much of this program may already be familiar to users of GIF Animator, many of the menu commands and functions in this version have been changed in context and further enhanced. The table below is provided to assist users to easily migrate from previous versions to Ulead GIF Animator 5.

In previous versions

Saves only in animated GIF file format.

Uses the concept of image layers to create animations. The Layer pane organizes the layers in an animation.

Layer: Moving Sprites creates motion effects by automatically generating a series of layers and adjusting their positions.

Layer: Moving Animations combines two different animation files, effectively putting an animation within an animation.

Makes areas in an image layer transparent by setting a color as the transparent index.

Edit: Global Attribute Change makes image layer attributes all the same.

In Ulead GIF Animator 5

Saves in a native file format (*.uga) that retains frame and object information and provides more output options.

Uses the concept of frames and objects to create animations. The Frame Panel lays out the frames contained in an animation. The Object Manager Panel displays objects and lets you set object properties.

Frame: Tween creates motion and fading effects through varying object positions and applying different transparency levels in the generated animation sequence.

Object: Distribute to Frames takes selected objects in a frame and spreads them out to the succeeding frames.

When you drag an animation or video file from another program into GIF Animator 5, the program provides options to determine how to insert these frames into the current workspace.

In an object, it’s easy to make a selected area transparent with the Eraser Tool or by simply deleting the selection.

Frame: Synchronize Objects Across Frames is useful when you select object(s) in

an animation, and want its attributes to be the same throughout all or selected frames.

TUTORIAL

Tutorial

When you create an animation, it is important to plan beforehand the sequence of ‘scenes’ before you actually start composing the contents of the animation. Also, make sure that you can get avail of all the objects that you need, or that you are capable of creating them.

This short tutorial walks you through the steps on how to create an animation from start to finish. In each step, references to more detailed sections are provided in the manual. Refer to the referenced pages for information about each stage in the animation production process.

Adding blank frames

Creating and adding objects

To create an animation:

1 Select File: New and set a canvas size to

create a new project. (For information on the different ways of

creating a new project, see page 16. See page 18 on how to set the canvas size.)

2 Add some frames in the Frame Panel.

(See page 33 for details.)

3 Insert some objects. You can add image

files as objects in your project as well as create simple text and banner text.

(For details on text and image objects, see page 20. See page 36 on how to create banner text.)

4 For each frame, choose which objects

should appear by showing or hiding them using the Object Manager Panel.

(See page 21 for more information.)

5 While the frame(s) is selected, click

Frame: Frame Properties to set the Frame delay. This specifies how long

you want each frame to be displayed. (See page 33 for details.)

6 Click the Optimize tab to optimize the

animation. (See page 41 for details on optimization.)

7 Select File: Save to save your work (as a

*.uga file). You can also save it as an animated GIF, Flash, and many more.

(See page 47 for more information on saving and exporting animations.)

Setting frame properties

ULEAD GIF ANIMAT OR USER GUIDE

Creating an animation project

An animation is composed of ‘frames’ which are displayed sequentially to give the appearance of motion. GIF Animator lets you build your animation frame by frame. In each frame, you can add images and other types of objects (such as banner text), as well as insert portions of digitized videos. You can also insert the contents of an entire folder or a range of selected files by the drag-and-drop operation.

Introducing the UGA project file

When you create a new animation, GIF Animator opens a new project in the workspace. The project uses a special file format, *.uga, which is exclusive to GIF Animator. In this type of file, you can compose an animation by adding text, images, and banner text. GIF Animator saves them as objects in the project. The next time you open your project file, you will still be able to edit the objects individually.

Creating a new project

There are several ways to create an animation project, and these are clearly listed in the Startup Wizard that pops up when you run GIF Animator. Choose the desired method by clicking its corresponding button.

Here is a brief overview of the different methods in the Startup Wizard. Alternatively, they can also be accessed through menu commands in GIF Animator, which are also indicated below.

Startup Wizard

• Animation Wizard - Guides you through

the process of creating an animation, step by step. (File: Animation Wizard)

• Blank animation - Opens a new project

based on your selected canvas size and color. (File: New [Ctrl + N])

• Open an existing image file - Opens an

image file and adds it as an object to the new project. (File: Open Image [Ctrl + O])

• Open an existing video file - Opens a video

or animation file and adds all its frames to the new project. (File: Open Video)

• Online Tutorial - Links you to the GIF

Animator tutorial section in Ulead’ s Web site.

Note:

When you use the Animation Wizard or open an image/video file, GIF Animator creates the new project with a transparent background. When you start out with a blank animation, you can select a canvas size and color. The color will be added as an independent object in the new project.

CREATING AN ANIMATION PROJECT

Using the Animation Wizard

The Animation Wizard provides a quick and easy way to create an animation project. It guides you step by step through the process of setting a canvas size, adding images (or video), up to customizing playback options for your animation. Use the buttons found at the bottom of the Animation Wizard window to move forward or backward through the steps.

To use the Animation Wizard:

1 In the Startup Wizard, click Animation

Wizard. (Or, select File: Animation Wizard.)

2 Select a preset canvas Size, or if you

want to specify your own size, enter the desired Width and Height for the canvas. (See the section, “Setting the canvas size” on page 18 for more information).

3 Click Add Image to select one or more

image files to add them as objects to the new project. If you want your project to start with video, click Add Video to select a video file.

4 Specify a default playback speed for each

frame in your animation by entering the desired Delay time. This is measured in 1/100th of a second. If you want each frame to be displayed for one second, for instance, enter 100 as your Delay time.

Another way of specifying playback speed is by entering the desired Frame rate (number of frames to display per second). When you specify a value for either setting, the other one is automatically adjusted.

5 Click Finish. A new project then opens

in the workspace, with image objects or frames added against a transparent background.

+ 39 hidden pages

Ulead GIF ANIMATOR 5 User Manual

Specifications and Main Features

Frequently Asked Questions

User Manual