Web Design   Web Hosting   Photoshop Tutorials   Free Fonts   Drawing Basics  
Photoshop Tutorials - Free Fonts
[Read Me First!]
[Photoshop Tutorials]
[Canvas Tutorials]
[Corel Tutorials]
[Quark Tutorials]
[Illustrator Tutorials]
[FreeHand Tutorials]
[Drawing Basics]
[Porting Files]
[Free Fonts]
[Font Tutorials]
[Misc Tutorials]
[About Mike]
[Related Sites]

  Animated Egyptian Eye Tutorial
Part One - Tutorial Overview

This is an intermediate level tutorial. Shown below is an archive file which you will need to download. You can select the archive flavor of your choice: Stuffit™ or Zip. Inside the archive are two files. One is a master frame in PDF format and the other is a drawing template in GIF format containing the shapes of all the frames:


Click to download tutorial files (select one):


What You Will Need For This Tutorial

You will need a drawing program to create the frames and an animation program to assemble them. This tutorial uses CorelDRAW® to create the frames, but you could also use Adobe® Illustrator®, Macromedia® FreeHand® or Deneba Canvas™. Once all the frame images have been created, you will assemble them in an animation program. This tutorial uses Adobe ImageReady™, but you could also use Macromedia Fireworks or Jasc® Animation Shop™ to make the animated GIF file. There are many animation programs available to do this. Check Royal E. Frazier's software page for details.

This tutorial assumes that you are already familiar with basic path manipulation in a drawing program. If you need practice, you can go to this page in the illustration section of this site and download the practice templates then do the drills until you have enough familiarity with shaping points and paths.

Tutorial Description

There are ten frames in this animation. You will first place the GIF template in the drawing program on its own layer, then create a new layer for the frames. Then you will open the PDF file and copy and paste the vector data as frame number one. Then you will export the frame as a bitmap image. Next you will copy (or duplicate) the frame and paste it as frame number two and shape its points and paths then export it as a bitmap image. You will continue this process of duplicating one frame to make the next then shaping its points and paths then exporting the frame as a bitmap image until all the frames have been made.

When you have made all the frame images, you will assemble them in an animation program, adjust the timing of the frames and export the finished animation as a GIF file.

The Advantage of This Technique

The technique used in this tutorial is one of the best ways to create animations. By using a drawing program to create the frames and by shaping each frame based on the previous one, you can achieve subtle changes in movement. As you will discover, this will make a very smooth animation. Also, vector graphics will render as smooth anti-aliased shapes when exported as bitmap images (more here on anti-aliasing).

So let's get started.

Click Here To Continue...


Previous   Home    Contact Mike   Related Sites    Next

Copyright © 1998-2016 Mike Doughty, All Rights Reserved Legal Notices
Page Last Revised: October 26, 2016
Privacy Policy