Synfig

Synfig Studio is a vector-based 2d animation programme. It is used in production by the Morevna studio and many others.

Install Synfig Studio directly from the Synfig website.

1. Download the latest stable release of the “Generic Linux” build.
2. Untar the archive to a location in your path. For system-wide use, /opt is recommended. if you are the only person using your computer (or if you are the only one using Synfig), then ~/bin is a sensible choice.
3. Once the directory is unarchived, create a link to the executable binary for easier launching. This assumes ~/bin but if you are using opt, just adjust accordingly:

$ ln -s ~/bin/synfigstudio-*/synfigstudio ~/bin/synfigstudio

1. Copy the .desktop file to your system so that you can launch Synfig from the K Menu, but change the path to the executable to its actual location:

$ su -c "cp -v ~/bin/synfigstudio-*/share/applications /usr/share | sed -i 's_synfigstudio_/home/klaatu/bin/synfigstudio_' "''

1. Copy the icons and mimetypes to your system (they don't change between Synfig releases, so you don't have to worry about upgrade-ability):

$ su -c "cp -rv ~/bin/synfigstudio-*/share /usr"

Launch Synfig from the K Menu or from a terminal.

$ synfigstudio &

Technically, synfig is a backend application that renders animations and vectors, while Synfig Studio is the graphical application with which you actually use. Since using Synfig (the backend) is probably not how you intend to use this application, Slackermedia uses “Synfig” and “Synfig Studio” interchangeably when speaking about Synfig Studio.

If you're used to vector drawing or even pixel painting, the tools and windows of Synfig will appear to be self-explanatory. Don't let it fool you; Synfig is a big, complex, and powerful application. If you think you know how to use it based on previous drawing experience, try to forget everything you think you know, because Synfig deals with shapes in motion and as a result works very differently than the static images you might be used to creating.

In Synfig Studio, there are four main window panels:

• the tool window in which your animation and drawing tools are located
• the canvas upon which you draw
• a palette window for layers and navigation
• a timetrack where you can visualize the changes being made to your drawing over time

Do a quick and easy animation just to get familiar with the basic concepts of Synfig. As a first effort, animate a sunrise.

Click the Rectangle Tool in the Tools window. First, draw the sky; pick a colour for your landscape, probably blue would make sense but you're the artist so pick whatever you want. Synfig expects you to just know RGB or YUV values off the top of your head, but you can also use hex values if you're familiar with web design. Either way, I find that an application like KColorChooser is helpful; launch it, find a colour, and copy/paste the hex code.

Once you're happy with your colour choices, draw a rectangle to encompass the entire canvas. It should turn blue. If, upon seeing all that blue, you decide you didn't quite nail the shade that you wanted, you can change it using the Fill Tool from the Tools window.

Save your animation (such as it is) by clicking anywhere in the gray area around your canvas, or use the arrow located at the conjunction of the canvas rulers. You'll find the Save option in the File menu, as usual. From this point on, you can save with Ctrl s.

Now to draw the sun. Choose your colour, choose the Circle Tool, and draw a yellow circle on your canvas. Notice that when you drew the sky and the sun, new layers were added to your Layer Palette on the right side of your screen. Of course, as with any graphics program, the order of the layers matter; the topmost layer covers a lower layers. Since everything you draw gets its own layer, it's quite smart to name your layers as you go.

Single-click on a layer to name it.

Finally, draw a sloping landscape. Choose your colour and select the Bline Tool. The Bline tool, as you might guess, draws bezier curves: mathematically-calculated curved lines that are adjusted with handles located at each node of your shape. When drawing a Bline shape in Synfig, you must close the shape by bringing your mouse to a node and right-clicking on it to choose Loop Bline from the contextual menu. This closes the shape, filling it with your active Fill Colour, and adding it to your Layers Palette.

Once the landscape object exists, use the Transform tool from the Tools panel to bend its lines; click and drag the top of your landscape to give it a gentle slope.

Notice that when you drew the landscape, two new shapes got added to your Layers: the Bline Fill and the Bline outline. Synfig sees outlines and fills as separate objects (although by default they are linked together in pre-defined shapes like circles and rectangles).

Now to animate the action of the sun rising.

What is animation? Well, it's just movement of some pixels over some amount of time. So all we have to do in order to get movement in our scene is to tell Synfig where the sun should be in the first frame of our animation, and where it should be at the final frame, and Synfig will do the rest of the work. There is no tweening in Synfig (or rather, all tweening is automated in Synfig).

To make the sun the active layer, click on the icon in the sun layer in the Layers window (if you click the name of the sun layer, then Synfig thinks you want to rename the layer, so click the icon instead). Then click the Transform tool in the Tools panel.

Notice that the sun shape is highlighted in a peculiar way: it shows you the outline of the shape with a single node along the edge, and it has a second node in the center of the shape. The center node represents the location of the shape on the canvas. The node along the outline represents the span of the shape in space; that is, if you wanted to resize the sun, use the outside node. If you want, as you currently do, to move where the sun is located on the canvas, then click and drag the center node.

Drag the sun until it is hidden, or nearly hidden, behind the landscape shape. Once the sun is properly positioned, locate the Animation button: it's an icon of a green stick figure, in the lower right of the Canvas panel. When you click it, it creates a red border around your canvas so that you know that you are in Animation Mode; in this mode, anything you do is recorded by Synfig, so be careful!

Now that you are in Animation Mode, you need to record the position of the sun. Grab onto the center node of the sun with your transform tool, and “jiggle it” (believe it or not, that's a technical term). To “jiggle”, all you need to do is move the sun a pixel or two; this registers with Synfig that the sun's attributes should be recorded and if you look down at your Timetrack window, you'll see a big diamond has appeared at frame 0, meaning that everything (color, size, position) has been recorded.

By default, we have 5 seconds to work with, and there are 24 frames in a second. If 24 frames are 1 second, if we had the sun high in the sky at frame 23 or so, then we'd have an animation of an unnaturally fast sunrise. Probably a 3 second duration would be a lot better, so click in the Timetrack along the top so that your blue marker line sits roughly at the 3 second mark

You have moved Synfig forward in time, so now you must move the sun in space. Drag the sun using the transform tool and the sun's center node, into the sky. Notice that the Timetrack window again adds a big keyframe diamond at the position of your blue marker, meaning that every attribute of your sun has once again been recorded.

And just like that, you've created an animation. Toggle out of animation mode and play your cartoon with the play button under the canvas. Don't worry about the quality; this is real- time rendering that is meant only to give you a rough idea of timing and positioning.

To get a full quality render of your animation, choose Render from the File menu. This brings up the Render dialogue window. By default, Synfig wants to render your animation out as a series of PNG files, because that's how professional animators work. If you would rather have a movie file, change the filename to sunrise.ogv, change the Target to ffmpeg, and click the Parameters button to choose what kind of movie file you'd like to end up with. For now, use the Theora codec with a bitrate of 15000.

Change the Quality setting to 8. Leave everything else as it is for now; the current settings will render a stand-definition Ogg Theora file.

When the file is finished rendering, you'll see a “File rendered successfully” note in the lower left corner of your Canvas window.

Now that you know how to draw in Synfig, try creating a character. An appropriate choice in this context might be a rooster, which typically crow at dawn. If you are drawing a rooster, try thinking of it in movable parts: of course it would have feet, a body, wings, a neck, head, and beak. Each part should be given its own layer, which can be encapsulated together.

It might help to think of this process in terms of paper-cutout animation or puppetry, in which each body part is its own distinct object connected to everything else by joints.

Encapsulation is a method that Synfig Studio uses to ensure that certain elements move together. More importantly, the order of layers within groups actually influences how each body part moves, because the movement of a lower layer will inherit the movement of a higher layer. For instance, if you are drawing a beak on a rooster's head, then you'd obviously want the beak to move along with the head no matter what. If you drew a farmer, then you'd want his hands to move along with his forearms, which in turn should move with his upper arm.

This is called “rigging”, which is a fancy term for, essentially, defining the skeleton and muscle structure of an animated character. For some users, the fact that Synfig Studio uses this method of movement places it a head above (so to speak) other animation packages, which require the animator to select each individual part of a character to make sure that everything stays together.

To encapsulate layers together, control-click on the layers in the Layer panel that you want to encapsulate. Right-click on any one of the selected layers and choose Group Layer from the contextual menu. These layers are now bound together and grouped into an Inline Canvas (or simply Group), meaning that the movement and transformations that occur with- in the encapsulation will not affect anything outside. Notice that as a group, there is a new transformation node, located in the center of the canvas area rather than at the center of the character you have drawn.

Once you have grouped layers, you can move the capsules themselves or layers in and out of the capsules. You can move capsules into capsules, or layer into capsules. The dragging and dropping can get tricky, just know that when a layer is inside of a capsule, it gets indented a little to show that it's encapsulated. It doesn't get indented a whole lot, but if you look for it, you'll see it; there are also placeholder lines that appear as you drag a layer or capsule around, so you'll get a feel for where things are getting dropped.

If your rooster has an arm with an anthropomorphic elbow wrist, as animated birds often do. If I want to animate this arm to raise up to the sky when my rooster crows, I need to rig the arm.

Rigging is done in cascading order of influence, using special layers called Transformation Layers.

An encapsulated layer group containing the line and the fill of the upper wing, plus another encapsulated layer group called wingLower, will govern the entire wing of the animated rooster. Such a layer group should, logically, be inside of an even larger group called, for instance, rooster. It makes sense if you think of it in traditional outline form: rooster, body, wingUpper, line & fill, wingLower, line & fill, feet.

In order to rotate wingUpper (and all layers under it, until the end of its encapsulation), add a Rotate Layer at the top of the wingUpper capsule. Add a rotate layer by right click- ing on the layer you want to add the rotate above, and select New Layer ­→ Transform ­­→ Rotate. Once you've added a Rotate layer, click on one and look to your canvas. You'll notice that new nodes have appeared; this time, there are two: a blue and a green. The green is the pivot point and the blue is your handle. Imagine attaching a stick to your elbow or knee; the part touching your joint would be green, and the part that allowed you to adjust its position would be blue.

Click and drag with your Transform tool the green node and place it at the “joint” of the body part you are animating. Once positioned, you can use the Rotate tool from the tools window to rotate that body part. You will notice that any layer underneath this rotate layer rotates right along with it; if you've rigged it correctly, you'll have the elbow moving along with the shoulder, but the elbow is able to move independently as well.

Animating rigged body parts is exactly the same as animating something like the sun earlier in this tutorial; position your time marker at some frame number, enter Animation Mode, jiggle the body part to establish its starting position, and then place your time marker further into the future and move the body part to its end position.

Cartoons and sound effects were practically made for each other, so it warrants some discussion here. Synfig Studio is an animation program, not a video editor, so there's no way to bring sound directly into Synfig, but Synfig is JACK-aware, meaning that you can activate JACK and open a JACK audio player and scrub through your animation with an in-sync soundtrack.

If you need to lipsync actual dialogue and not just sound effects, you might find Yolo useful for generating mouth positions according to phonemes and frame counts.

When you render out your synfig animation, it really is best to render it to a series of PNG images. Most video editors will let your import a folder of PNGs and will even group them together as if though they were video files. This keeps your animations frame-accurate, and your video and sound will sync perfectly. Kdenlive and Blender are well-equipped to help you concatenate animated scenes together.

There are several official training series produced by the mainainers of Synfig. They are not free, but well worth the money. Purchase and view the training material at Udemy.com or synfig.org.