Copyright: ©2001 Ulead Systems, Inc.


This help file contains topics about selected dialog boxes in your Ulead program. You can access these topics through those dialog boxes or by navigating through a main help file associated with the program.


What is Index Editor?

Index Editor is an advanced GIF file editor, which allows you to modify Global and Local Palette indices for all frames in a GIF animation, as well as the images themselves. This powerful tool is especially useful for optimizing files to the smallest possible size by giving you complete control over the index.

The tools available for editing images (including Pen, Select Fill, Fill, and Eraser) enable you to make color adjustments to your images. This is very useful when you have various shades of the same color that are not entirely necessary and can be replaced with another more commonly used color and, therefore, removed from the palette.

This level of editing is not recommended for newcomers to GIF animation, as simple mistakes, can cause irreversible damage to the file. However, experienced users may find that some of the features available in the Index Editor are, in fact, very useful for generating very compact, high-quality animations.

Using the image-editing tools

Editing the palette

Index Editor Workspace


Index Editor Workspace

Select a GIF file Displays the name of the file currently open in the Index Editor.

Open an existing GIF file Opens the Open dialog box.

Frame Select a frame from the drop-down menu.

Previous Frame Selects the previous frame.

Next Frame Selects the next frame.

File Properties Opens the Properties dialog box.

Optimize Opens the Optimization Wizard dialog box.

Preview Opens the Preview dialog box.

Save As Opens the Save As dialog box.

Exit Closes the Index Editor program.

Options Opens the Options dialog box.

Click a topic below to know more.

Tool Panel

Palette Area

What is Index Editor?


  Pen Tool	  Crop Tool

  Select Fill Tool	  Eraser Tool

  Fill Tool	  Actual Size

  Zoom In	  Zoom Out

  Undo	  Redo

  Foreground Color	  Background Color

  Swap Color	  Similarity


  Palette Window	  Sort by

  Save Palette	  R

  Load Palette	  G

  Add Color	  B

  Delete Color	  Transparent index

  Replace Color	  Transparent Color

  Gradient	  Apply transparent index

to all images

  Color box	  Colors


Pen Tool

Allows you to draw lines a single pixel wide. Right-click to use the background color, click to use the foreground color.

Index Editor Workspace


Select Fill Tool

Allows you to draw filled boxes. Right-click to use the background color, click to use the foreground color.

Index Editor Workspace


Fill Tool

Allows you to replace a single color area with a new color. Right-click to use the background color, click to use the foreground color.

Index Editor Workspace


Crop Tool

Opens the Crop dialog box, letting you trim portions of the image layer.

Crop dialog box


Eraser Tool

Erases pixels and replaces them with either the foreground or background color. If an image layer has a Transparent index, then using the Eraser Tool makes pixels transparent.

Index Editor Workspace


Actual Size

Allows you to view the image at 100%.


Zoom In

Allows you to zoom in on the image.


Zoom Out

Allows you to zoom out from the image.


Undo

Undoes the previous action.


Redo

Redoes the previous action.


Foreground Color

Allows you to set the foreground color used with the Pencil or Fill tools. Selecting either icon engages the custom color picker that you can use to select colors from either the editing window (the image itself) or the Palette Toolbar. To use the foreground color while editing, click the left mouse button. To use the background color, right-click the mouse button while editing.


Background Color

Allows you to set the background color used with the Pencil or Fill tools.


Swap Color

Allows you to switch the foreground and background colors.


Similarity

Select a higher value to adjust a wider range of colors with the Fill tool.


Palette Window

Displays all the colors contained in the image. Each cell is given its own index number (starting with 0) which establishes where it falls in the color hierarchy.


Save Palette

Click to save the current palette as a file for future use.


Load Palette

Click to use a previously saved palette to replace the current palette or selected indices.


Add Color

Click to increase the number of color index entries for the palette. The Add Index dialog box opens where you may specify the number of indices to add. Once added, you may customize the colors for the added indices. (Only available if the total number of color indices is less than 256.)


Delete Color

Click to remove the selected indexes from the palette. This reduces the total palette size.


Replace Color

Lets you change the color on the currently selected index.


Gradient

Click to replace the selected indices with a range of colors so that when shown sequentially produces a gradual shift in the image.


Sort by

Allows you to sort the colors in the palette by the method you specify.


R

Displays the red color value for the current index. The color square changes to reflect the current settings.


G

Displays the green color value for the current index. The color square changes to reflect the current settings.


B

Displays the blue color value for the current index. The color square changes to reflect the current settings.


Color box

Use the eyedropper to choose a color from the Windows Color Picker for replacing color in the current color palette.


Colors

The total number of colors in a palette.


Transparent index

Select to use a color in your animation as a transparent color. You can enter the number of the color you want to use as a transparent color based on the color palette in the Transparent index box.


Transparent Color

Displays the transparent index color used in the frame. To change the color, click on this button then select the transparent color you want by clicking (the mouse pointer becomes an eyedropper) on the image. You can also change this by entering a number in the Transparent index box.

Tip:	For best results, the color should match the background color.


Apply transparent index to all images

Click to use the transparent index color selected for all the frames in the animation.


Options dialog box

Always show the Confirm Palette Operation warning message Select to display a 'Confirm Palette Operation' prompt when performing or applying any palette changes.

Index Editor Workspace


Properties dialog box

Global information

Logical screen These settings affect the appearance of the workspace. The only time the Logical screen settings apply to the animation is when the animation is played in a dedicated GIF viewer. For the purposes of the Web, these settings only apply to the appearance of the workspace.

Background color Displays the default background color.

Looping These sets how many times the animation will play once it’s finished downloading. If the ‘Infinite’ option is not selected, then the default setting will be to loop only once (0).

Infinite Loops the animation indefinitely.

Frame information

Dimension

Width Displays the width of the current frame.

Height Displays the height of the current frame.

X-offset Shows the horizontal distance (in pixels) from the top left corner of the composite animated GIF where the top left corner for the current layer's image appears. (You can also adjust this by dragging the image in the image pane to the desired location.)

Y-offset Shows the vertical distance (in pixels) from the top left corner of the composite animated GIF where the top left corner for the current layer's image appears. (You can also adjust this by dragging the image in the image pane to the desired location.)

Delay Enter the length of time (in 1/100ths of a second) that you want the image to remain visible before showing the following layer.

Removal method Select the method for switching to the next image layer.

Index Editor Workspace


Web browser decides Switches layers according to the default method for the Web browser used to show the animated GIF.

Do not remove Places each layer on top of the previous layer.

To background color Removes the image, replacing it with the background color.

To previous state Removes the image, showing the previously shown layer.

Note: Some Web browsers do not support certain removal settings. If you use a setting that a browser does not support, the default method for that browser is used.


To change the background color of the image, click the Background color button in the Tool Panel then click the Color box and select the color you want in the Windows Color dialog box.


Save As dialog box

Save in Find the desired folder.

View the contents of the next higher folder in your system.

Toggles between displaying the folders on your desktop and the folder you last viewed.

Create a new folder.

Lists names.

Lists names with statistics.

File name Enter a name to identify the files selected for saving.

Save as type Lists the available file formats.

Save comment Saves the file with the comment assigned in the Global Information dialog box from the main program.

Index Editor Workspace


Crop dialog box

Image size Displays the selected frame dimensions.

Cursor position Displays the horizontal and vertical coordinates for the cursor while it is over the image.

Rectangle's position and size Displays the current coordinates and dimensions of the crop bounding box

Zoom in Allows you to zoom in on the image.

Zoom out Allows you to zoom out from the image.

Actual size Allows you to view the image at 100%.

Cropping Images

Index Editor Workspace


Preview dialog box

File size Displays the current file size.

Dimension Displays the current file dimensions

Current frame Displays the current frame number and its dimensions.

Play Allows you to preview the animation in the preview window.

Stop Stops the animation from playing in the preview window.

Go to first frame Goes back to the initial frame of the animation.

Go to previous frame Moves one frame back from the currently selected frame.

Go to next frame Moves one frame forward from the currently selected frame.

Go to last frame Goes to the end frame of the animation.

Index Editor Workspace


Gradient dialog box

Assigns a gradient color sequence to the selected colors in the palette. You can specify the beginning and final colors in the gradient.

From Click to select a starting color for the gradient.

To Click to select a final color for the gradient.

Index Editor Workspace


Cropping images

The Crop dialog box allows you to cut away redundant portions of an image and keep only the region you want.

To crop an image:

1	Click Crop on the Toolbar to open the Crop dialog box.

2	Use your mouse to drag the bounding box to the region of the image you want to keep.

3	Resize the bounding box by dragging the control points with your mouse pointer.

4	Click OK.

Crop dialog box

Index Editor Workspace


Editing the palette

Important note: Changes made to the palette are irreversible. Therefore, it is a good idea to save a copy of the palette before making any modifications. Then, if you want to undo your adjustments, you can load the saved copy of the palette.

After modifying the palette using any of the tools on the Palette Toolbar, you will be prompted to remap the colors in the image with the colors in the palette.

Remapping will cause the Index Editor to match the image colors with the new palette colors. Where a color is no longer available in the new palette, the closest matching color will be used instead.

If you select not to remap, the Index Editor will not try to match colors. It will, instead, continue to use the same image mapping with the new index, even if the colors are entirely different from the previous palette.

To save the palette

To load a palette file

To add new colors to the palette

To remove colors from the palette

To replace colors in the palette

To create a gradient between two colors

To sort the palette


To save the palette:

1	Click Save palette on the Palette Toolbar.

2	In the Save palette file dialog box that appears, enter the file name and location to save the file.

3	Click Save to save the file with *.PAL extension.

Note: You can also save individual color cells or a series of cells, by selecting the color cells before clicking Save palette.


To load a palette file:

1	Click Load Palette on the Palette Toolbar.

2	In the Choose a palette file dialog box that appears, enter the name and location of the saved *.PAL file.

3	Click Open.

4	A message will prompt you to add the file to the current palette or to replace it entirely. Click Yes to add the colors, or No to replace the palette.


To add new colors to the palette:

1	Click Add Color on the Palette Toolbar.

2	In the Add dialog box that appears, enter the number of colors you want to add.

3	Click OK. The color cells will be added to the end of the index.


To remove colors from the palette:

1	Select the color cells that you want to remove from the palette (use CTRL to select groups of colors one cell at a time or SHIFT to select whole rows of colors).

2	To remove multiple cells, click Delete Color on the Palette Toolbar.


To replace colors in the palette:

1	Select the color cell which you want to replace.

2	Click the color square, or Replace Color on the Palette Toolbar to open the Color Picker, where you can select a color for the color cell.

3	Click OK.


To create a gradient between two colors:

1	Select two color cells between which you would like to use a color gradient.

2	Click Gradient on the Palette Toolbar to open the Gradient dialog box.

3	Confirm your start and end colors. If you want to change these, click the color cells displayed to open the Color Picker.

4	Click OK. The gradient colors will replace the previously selected colors.


To sort the palette:

1	Select one of the sorting options.

2	Click OK.


Using the image-editing tools

There are four tools that can be used for changing colors in your images: Pen, Eraser, Select Fill, and Fill. The first two, Pen and Eraser, are best used for editing individual pixels as their size cannot be adjusted. Fill and Select Fill, on the other hand, work best for larger areas.

When using any of these tools, you can switch from applying the foreground and background colors by clicking either the left or right mouse button. For Pen, Select Fill and Fill, the left button applies the foreground color, and the right applies the background color. For the Eraser tool, the colors are reversed.

Note: The colors that you can use to edit images are limited to the colors available in the palette.

Editing the palette


Interlaced

The browsers currently available on the web don't support interlacing. Some of the image layers in your animation have the interlacing attribute set.


Local Palettes

Some of the image layers in your animation contain Local Palettes. The presence of each Local Palette can increase your overall file size anywhere from 12 bytes (4 colors) to 768 bytes (256 colors) depending on the number of colors the image layer contains. 1 or 2 Local Palettes generally won't make that much of a difference, but if every layer contains them then your file size could be significantly larger.


To Previous State

Some browsers do not support this removal method therefore your animation may have display problems when viewed in those browsers.


More than one comment block

As with Local Palettes, comment blocks can unnecessarily increase your animation's file size. Try to put all of the information into a single comment block if possible.


Wait For User Input

Some image layers in your animation have the 'Wait for user input' attribute selected. This attribute is not currently supported by most Web browsers, and consequently will not work unless the animation is being played in a dedicated GIF viewer.