14 DAY TRIAL // The presence of an animated image on a web page represents an attractive thing for your visitors. Animations for web usage can be realized using various software, depending of the animation type and, as a consequence, the file format will be different. For example, a static image can be included into an animation contained in a Flash, AVI or GIF file.
If you want to add motion to a static image using a GIF (Graphics Interchange Format) file, there are many options regarding the selection of an image processing software. GIMP (GNU Image Manipulation Program) is a program available for many operating systems and when you need to create simple or complex animations, it represents a good alternative, because it is free and provides many powerful features, comparable or identical with a commercial software.
First, you will need to install GIMP on your operating system and then GAP (GIMP Animation Package). For a simple example, we will consider the PNG image presented as screenshot in this article. After you save it on your computer, then you must open it with GIMP. On the layers window it will appear named as Background. Right-click on it, then select duplicate layer.
Then, return to the first layer (Background) and select from the main window menu: Tools - Transform Tools - Rotate. Specify the angle of rotation or move the slider such as the final value of image rotation angle to become 10 degrees and perform the rotation by clicking Rotate button. Right clicking again, on the same layer you must select the Remove Alpha Channel option.
The same set of operations must be performed in the case of the second layer with the mention that the rotation angle will be -10 degrees. Now you can preview the animation by selecting from the main window: Filters - Animation - Playback. If you want to save the animation, from the same menu, the Optimize (for GIF) option must be selected in order to reduce the image file size. You can implement the animation, as well as other image file type in any HTML document using the next code:
