Home HomeProductsSearchSupportShopWrite Us Microsoft Home

Image Composer 1.0 GIF Animator
Overview | Guided Tour | FAQ | Samples

Home
About Image Composer
Using Image Composer
GIF Animator
The Gallery
Site Map
Download
Related Links


A Guided Tour of Microsoft GIF Animator

Updated February 14, 1997

Microsoft® GIF Animator is the fast and easy way to create and customize animations for your Web sites. This guided tour shows you how easy it is to create an animation from scratch. You will see how you can work in tandem with Microsoft® Image Composer to get the animation you want.

Getting Started

  1. Install and open Microsoft Image Composer and Microsoft GIF Animator. Arrange the programs like you see in the figurebelow.
  2. Microsoft Image Composer and Microsoft GIF Animator

  3. Download the image "sunflower.tif"

Customize sprites

  1. Insert the image with shape — called a sprite — "sunflower.tif" into Microsoft Image Composer. For more information on sprites, visit the WHAT? section of the Microsoft Image Composer Web site.
  2. Size it to approximately the size of a frame in Microsoft GIF Animator.
  3. Duplicate the sprite three times by selecting the Duplicate icon on the main Microsoft Image Composer menu bar.  The Duplicate icon
  4. Place the four sprites below each other. You will now rotate each sprite separately and slightly differently to create the illusion of movement. Click the Arrange tool from the toolbox.
  5. Select the 2nd sprite and Click Rotate once to rotate the sprite 90 degrees.
  6. Select the 3rd sprite and click Rotate twice to rotate the sprite 180 degrees.
  7. Select the 4th sprite and click Rotate three times to rotate the sprite 270 degrees.
  8. Now you will add an art effect to each sprite as well. Click the Art Effect tool on the toolbox.
  9. Click the Paint pull-down menu item.
  10. Click the Spatter effect.
  11. Make sure that the Spray Radius is set to 19.
  12. Click the 2nd sprite and apply the Spatter effect with the Opacity set to 25.
  13. Click the 3rd sprite and apply the Spatter effect with the Opacity set to 60.
  14. Click the 4th sprite and apply the Spatter effect with the Opacity set to 100.

Drag-and-drop directly into Microsoft GIF Animator

You can drag-and-drop sprites directly back and forth between the two programs to get the look you want.

  1. Select the 1st sprite. Drag it over to the 1st frame in Microsoft GIF Animator.
  2. Repeat this process for the other three sprites.

Customize your animations
Microsoft GIF Animator's three property sheets allow you to control how your animations will look and play.

  1. Select all the sprites by clicking the Select All button on the main Microsoft GIF Animator menu bar (the 9th button across).  The Select All button When you select all, a blue border will appear around your sprites.
  2. Click the Animation property sheet.
  3. Click the Looping option to make your animation loop.
  4. Click the Images property sheet in order to begin setting options.
  5. Click the Transparency option to make the backgrounds of your sprites transparent.
  6. Click the Undraw Method option and select Restore Background from the menu. This makes your animation more fluid by restoring the background between frames.
  7. Increase the Duration selection to 12 (the units are in milliseconds).

Preview

You can easily preview your animation in-line so see what it will look like on a Web browser. Simply click the Preview arrow on the far right of the main Microsoft GIF Animator menu bar.  The Preview button Now that you are done, you can save your animation as a .gif file and use it on a Web site. You can also drag your sprites back into Microsoft Image Composer and continue to customize them there.

Summary
Congratulations! You have successfully completed the guided tour of Microsoft GIF Animator. In the tour, you have seen how easy it is to create and customize animations for your Web sites. And you have seen how Microsoft GIF Animator and Microsoft Image Composer work together to allow you to make your Web site come alive with motion!

GIF Animator
Overview | Guided Tour | FAQ | Samples




© 1997 Microsoft Corporation. All rights reserved. Terms of use.