20.4 Compositing and Creating Frames

Now it’s time to place our animation on its proper place on the canvas and distribute the frames across layers. Remove the tweening once again and place the second keyframe right over the first. (Note that the dancer’s right foot coincides in both keyframes because it rests on the floor.) Select both overlapping figures and place them onto the canvas, scaling them if necessary and taking into account whatever other elements you plan to add (such as a text heading). Finally, interpolate the bodies and the heads again—right in place:

Interpolating in place

Figure 20-5. Interpolating in place

The next task to do in Inkscape is a bit boring (it may be automated in future versions). You need to ungroup the group of the interpolation paths and manually place each one on its layer from 002 to 005, with the keyframes occupying layers 001 and 006. Then, duplicate the frames in the reverse order: Frames 005 to 001 go into the range 007 to 011, to make the dancer smoothly return into the original position.

Use and to move the selected objects one layer up/down, and watch the status bar that tells you in which layer your selected objects are. Alternatively, you can cut () an object, switch to the destination layer, and paste it in place (). Finally, make sure all the layers you’ve used are visible, and save the SVG file.