Graphic animation adds movement and interactivity to your site. Learn how easy it is to create animated gifs for the web in this tutorial. In this tutorial you will learn how make the template animation seen on the right. Let’s get started right away.
Step 1: The first step is to design your animation. Decide how you would like your animation and place each object in a different frame. Let me explain that. In the template animation seen on top you will notice that first one template appears then the next and then the next. So what I do, is place each template image in a different frame. I place template 1 in a frame called Template1, template 2 in a Frame called Frame 2 etc. etc. Open the Frames panel from Windows/Frames and start inserting your images on different frames. A screenshot of the different frames is shown below.
 |
You can now preview your animation by using the play button found on the bottom left side of the screen. You will find that the animation is quite fast. You can change this by double-clicking on the default value ‘7’ near the frame name. You can change this to 100 or a higher number suitable for the animation (100 is one sec).
Step 3: The last step is to optimize and export the image. Open the Optimize panel and choose Animated Gif from the drop down options. Next Export the animated gif by clicking File/Export. Export the image to the appropriate folder. Open Internet Explorer and browse to find the image you have exported. The animation should work fine.
You have successfully created an animated gif. Congratulations!
No portion of these materials may be reproduced in any manner whatsoever, without the express written consent of Entheos. Any unauthorized use, sharing, reproduction or distribution of these materials by any means, electronic, mechanical, or otherwise is strictly prohibited.
