You will find the AnimFrames tool under the Image menu <image>/AnimFrames. As the name indicates, AnimFrames works with image frames. A frame is an ordinary Gimp image saved with a special extension. When you make an ordinary GIF animation you create a multi-layered image, where the object that you want to animate moves a little bit for every new layer. If you want to use more than one animation object, you have to put all of the objects in the same layer. (If you want to know more about ordinary Gimp animations read Chapter 20) This makes it hard to create advanced animations like in an animated film. If you want to work with several objects which can move independently of each other, the ordinary Gimp animation "tools" do not suffice. AnimFrames overcomes this problem in a wonderful way. Instead of using a single multi-layered image, AnimFrames works with several images, where each image can have several layers with different objects in them. This makes every object independent of the other animation objects (just like in a cartoon frame where several people move around independently, because each character was painted on a separate plastic sheet).
AnimFrames is built up of frames. The first thing you have to determine when you create an animation is the size of the background image. When you've made up your mind, you continue like you always do in Gimp: File -> New. To turn your image into a frame you must save it. Choose Save as and save it as animationname_0001.xcf (the special extension is _0001.xcf). Now it's time to create the Frames. Choose AnimFrames/Duplicate Frame. This brings up a dialog asking you to specify how many duplicates you want, or how may frames you want for your animation (the slide only goes as far as to 50 frames, but you can easily change that by typing an optional number of frames in the field). The format must be XCF, but if you are low on disk space, you can choose a compressed XCF by adding .gz or .bz to the end of the frame name. To make this work, you must of course have either gzip or bzip2 installed on your system. Don't worry about saving, all frames are stored on disk immediately without explicit save. The same happens when you work with other tools in AnimFrames, so only save when you exit AnimFrames.
We have now created a few basic frames, say for example 10 frames. We are in frame number 1 (name_0001.xcf.) First we must make something clear, you must never open two frames in Gimp at the same time! If your animation is called My_anim, make sure you don't open My_anim_0001.xcf and My_anim_0002.xcf at the same time. If you let this happen, things can get really bad and in the worst scenario destroy your animation and crash Gimp! This is not a good idea, so we suggest you use the special menu commands for navigating the frames instead. You can navigate in the following ways:
Goto First which will bring you to frame My_anim_0001.xcf Goto Next -> My_anim_0002.xcf Goto Prev -> My_anim_0001.xcf Goto last -> My_anim_0010.xcf, and you can also try The author of the plug-in suggests that you assign hotkeys to the "Goto" commands, because you will move around a lot in your frames. You can choose any keybindings you like, but here are a few suggestions:
Goto First Ctrl-Alt-1 Goto Prev Alt-1 Goto Next Alt-2 Goto Any Alt-3 Goto Last Ctrl-Alt-2
Read more about keybindings in chapter 2.
Or how to make a Move Path. The main tool in AnimFrames is the Move Path tool. This tool allows you to move your animation object along a specified path. You need at least two things to make an animation:
The animation object must be of the same type as the frame. You can't mix indexed images with RGB images, but an RGB and an RGB Alpha will work just fine. The frame and the object layer don't need to be of the same size.
To make the animation object, create a new transparent image and paint a simple object in the centre of the image - a big, red dot for example. Open the first frame (My_anim_0001.xcf.), select the Move Path option in the AnimFrames menu, and the Move Path window will appear. This window is where you control the animation sequence. This simple example will help you get a basic understanding of how Move Path works. Later in this chapter, we'll return for a more profound description of the "Move Path" window.
SourceImage/Layer menu to your animation object. Set the Handle menu to Center, the Stepmode menu to Loop and the Mode menu to Normal. Mouse-click somewhere in the preview window, press the Next Point button and click somewhere else in the preview window. Start Frame to your first frame and the End Frame to your last frame, leave the Layerstack and Preview Frame as they are and press OK. You have now created your first animation. The red dot will now move from the first click-point to the second, and it will use ten frames to complete the movement. In order to view the animation, you must select Frames Flatten and include all of your frames in the Frame Range dialog. The second step is to make your frames turn into a multi-layered image. Do this by selecting Frames to Image and choose all your frames. Now you can watch your animation with the Animation Playback filter. If you want to save it as a GIF animation, you will have to index your image first. We suggest that you stick to RGB during the whole animation process, and don't convert to Indexed until you're done. At the time of this writing you can only save your animations as GIF:s, but it's probably only a matter of time before other animation formats will be supported by Gimp.
There are nearly no limits to what you can achieve with AnimFrame, but some animations are harder to make than others. To create certain effects, you may have to edit frames by hand; for example if you want to rotate an object at the same time as it moves. We've made an animation demo where you can see a few examples of what AnimFrames is capable of; like paning the background, making an aftertext that rolls over the frame, a perspective intro text, moving objects away from you and towards you, setting different speeds to objects, etc. Later in this chapter you'll find a gallery with a description of how the demo animation was created.
The Move Path window is the heart of Anim Frame, so let's have a closer look at what it can do and what the parameter settings mean. The dialog is divided into three different parts; Source Select, Move Path Preview and a bottom part where you set some slides and buttons.
![Extracted pic [1]](Animation-image-1.jpeg)
The SourceImage/Layer This menu is where you select animation object, i.e the layer or image where your animation object is. You can only open AnimFrames/Move Path from a Frame image, so you must keep a frame image (just one!) open as well as one or more object images.
Here you set the color/brightness relation between the imported layer/image and the rest of the layers in the frame. You can read more about modes in chapter 16.
The Handle determines which part of the imported image/layer should be used as point of departure for the move path. We will discuss handles more in detail when we come to Points a bit further down the text.
Determines the nature of the animation. Loop creates a continuous animation from the first control point to the last. Loop reverse does the same but goes the other way around; from the end point to the first control point. (Once and Once reverse is currently the same as Loop, but that will change with the development of this plug-in). Ping Pong makes your animation go to the first point -> last point -> back to the position after first point -> position before last point and so on. None cancels the animation. We recommend that you stick to Loop and Loop reverse, and control the output by animating different sequences separately, or by exchanging frames.
Here's where the actual setting of the animation takes place. By placing a number of control points along a certain track, you create a linear moving path for the object. Note that the path and the points are invisible. You can only see them by stepping your way forwards or backwards with the Next Point/Prev Point buttons.
By default, two control points are placed in the upper left corner. The animation object will move from the first to the second control point over the frames you set by the slides Start Frame and End Frame. You can add more controls points by pressing the Add Point button. As the animation object's move path is determined by the control points, you will have to use a lot of control points to create a circular path. The maximum number of control points are 256, but that should be quite sufficient.
To start adding/changing control points, click in the preview window to set the first control point. Then press Next Point to set the second control point. If you want to adjust the position of the first control point, simply press Previous Point (the status of the point controls will now change from 2 to 1, e.g X[2] to X[1] so you know what control point that you are dealing with).
If you want to add a control point, press the Next Point button to arrive at the last control point (in this case number 2), press Add Point and click at the place where you want to put it. Note that you can't add a control point to adjust the path between two existing points, you can only add to the prolong the path. Also remember to be sure to stand at the last control point when you add a new point, otherwise it will be quite hard to follow the path you're creating.
A very nice option is the possibility to save and import control points. This makes it possible to let different objects use the same move path (you can also save your favorite move path for later use).
You can create a very exact moving path by using the control point position commands; X and Y. It's normally better to create a path with the mouse in the preview window, but the values here give you the necessary numerical information about every point's position.
Note that the position cross is not restricted to the area inside the preview. Dragging it outside of the preview window will for example enable you to pane the background. The handle mentioned in the earlier paragraph is for locking a certain corner or the midpoint of the import layer/image to the move path. If you select top left handle, the control point will stick to the top left corner of the import layer, forcing the layer's position to the bottom right side of the control point.
The Width and Height controls allows you to you resize the layer/image at a certain control point, This is of course ideal for zooming.
Opacity controls transparency of the object image. You can for example use this control to fade in and out of images. As you see, with these controls you can achieve many of the common effects you've seen in ordinary movies.
These slidebars control where and how the import layer should be placed in your frame. The Start Frame and End Frame sliders determine which frames the image/layer (with the current move path) should be imported to. The Preview Frame slider controls which frame you'll see when you press the update preview button. Note that this only works for the first and last control point. This tool is for viewing the beginning and end of an animation sequence
The Layerstack slidebar controls in which position the imported layer/image will be placed in relation to the other layers in the Frame. In order to understand this you must think of the layers as a stack of cards. If the layerstack is set to zero, then the layer will end up on top of all other layers (cards). If the layerstack is set to 1, then the layer "card" will be inserted between the first and second layer "card" etc.
Besides the preview in the move path tool, there is no preview which lets you see your move while it's under production (it would be to slow to load and unload images from disk, especially if there are a lot of layers). If you want a preview you can either step forward with Next Frame or copy all your frames to a new directory and create a multi-layer image.
There is no undo in AnimFrame because all frames are saved immediately. A way around this is to always keep your layers in the frames. If you aren't satisfied with a certain frame layer sequence, then you can easily delete them all with the Frames Layer Delete command.
This command will bring up a dialog asking you to specify the frame range and position in the layer stack (see above). Be careful here, because when you press OK, there's no way back.
If you want to export your frames to different image formats, you can use the Frames Convert command. The drop down menu lets you select whether you want to keep the image type (RGB) or convert it to a different format (Gray, Indexed or RGB). This is a must because if you want to save your frames to GIF format, you have to convert it to Indexed first. The field beside the menu is for specifying image format by typing the suffix e.g.gif,.tiff,.jpeg etc. To decide what frames to convert, use the From Frame and To Frame slidebars. The last slide will flattens the frames before you save them. If you save them as GIF:s, there's no problem, since GIF handles layers. However, if you want to save them as TIF images, you have to flatten the images first, because tif doesn't support layers.
Exchange Frame is the tool to use if you want to rearrange your frames. The dialog will ask you what frame you want to swap the current frame with. For example. if you invoke the command from frame 3 and sets the slide to 5, then frame 3 will end up as frame 5, and frame 5 will end up as frame 3.
Frames Flatten and Frames to Image are the tool to use when your animation is finished and you want to save it as a GIF animation. In order to make a multi-layered image, you must first flatten all layers, and then convert them with Frames to Image. We recommend that you do this on a copy, and not the original frames (e.g cd "your frame directory" && mkdir framecopy && cp * framecopy in a terminal window). If you flatten the original frames, you'd better make sure that everything's OK, because once the frames are flattened there is no way to edit the frame layers.
As we've mentioned before, this tool is used for creating base frames in an animation. Note that if you are in a middle of an animation and want to duplicate a frame, the duplicate frames will be inserted after the original frame.
We have made a little animation to show you some of the things you can do with Anim Frame. The animation is 186 frames long.
The animation begins with a logo that moves toward you before it bounces back, stretches out and finally fades away. Those effects were quite easy to achieve:
We started by specifying a low value for Width and Height in the first point in the logo's move path, so that the logo would appear to move towards the camera.![Extracted pic [2]](Animation-image-2.jpeg)
The fade away/stretch effect was created by setting the opacity in the final point to 0%, the X scale to 200 and the Y scale to 0. ![Extracted pic [3]](Animation-image-3.jpeg)
The next phase in the animation was to fade over from the background in the bouncing logo scene to the space background in the next scene. This was done by placing the space background in the lowest layer in a series of 10 frames, then we made a move path with the blue logo background with 100% opacity in the first control point and 0% opacity in the final control point.![Extracted pic [4]](Animation-image-4.jpeg)
Then we amused ourselves by creating a paraphrase of the rolling perspective text in a movie we assume you've never heard of. (Don't read the text, it's quite meaningless) For the perspective effect we used an image which was higher than the frame, and then we skewed the text with the Transform/Perspective tool. The move path (center Handle) begins a bit below the actual frame, and the second and final point was placed a bit below the centre of the image. The final point also scaled down the import image to about a 1/3 of its original size. This made the text float away, just like in the movie. Afterwards, we adjusted the time each frame was shown to keep the text from accelerating as it moves away. ![Extracted pic [5]](Animation-image-5.jpeg)
The space scene displays an orbiting space craft or satellite. The space craft accelerates as it moves away from you and around the Earth. As background setting we used a large image of the Earth seen from space. The space part of the background was panned with the move tool, and the last stage in the scene was a pan and zoom down towards Earth. Then we added the space craft image with a move path from the right side of the "screen" to the left. As the space craft was moving along the path it was simultaneously scaled down. This created the acceleration effect, and the feeling than you move away from the space craft as it disappears beyond the horizon.![Extracted pic [6]](Animation-image-6.jpeg)
Now it's time for some propaganda in the Help us fight the evil $Empire fade out. This text was faded in the same fashion as the bouncing logo background, only in reverse direction. ![Extracted pic [7]](Animation-image-7.jpeg)
The final scene displays the production team behind this animation, and this book. The Frozenriver logo was made to circulate around the word "Production" and fade away at the same time. This was done by using "production" as a background. The logo was then made to move around the text in a five point move path, where the opacity was lowered for each point![Extracted pic [8]](Animation-image-8.jpeg)
.
This animation demo comes both in GIF and Anim Frame format, and can be downloaded from ftp.gimp.org/pub/gimp/manual.