TechnoTween Technokids PH 060920 PDF

A Senior Technology Project
Workbook
For Synfig Studio
Copyright © 1993 – 2020 TechnoKids Inc.

All Rights Reserved
Publisher
TechnoKids Inc.
TechnoAnimate is published by TechnoKids Inc.

TechnoKids is a trademark of TechnoKids Inc. © Copyright 1993 – 2017. All Rights Reserved.
This book may not be duplicated in whole or in part without the expressed written consent of the publisher,
except in the form of brief excerpts or quotations for the purposes of review. The information contained
herein is for the personal use of the reader and may not be incorporated in any other books, databases, or
any kind of software without written consent of the publisher. Making copies of this book or any portion for
any purpose other than your own is a violation of International copyright laws.
Limits of Liability and Disclaimer of Warranty

The author and publisher of this book have used their best efforts in preparing the book and the activities
contained in it. These efforts include the development, research, and testing of the theories and programs
to determine their effectiveness. The author and publisher make no warranty of any kind, expressed or
implied, with regard to these programs or the documentation contained in this book.
The author and publisher shall not be liable in the event of incidental or consequential damages in
connection with, or arising out of, the furnishing, performance, or use of the programs, associated
instructions, and/or claims of productivity gains.
Trademarks
Trademarked names appear throughout this book. Rather than list the names and entities that own
trademarks or insert a trademark symbol with each mention of the trademarked name, the publisher states
that it is using the names for editorial purposes only and to the benefit of the trademark owner, with no
intention of infringing upon that trademark.
2097 Bates Common

Burlington, ON Canada L7R 0A5
905-631-9112
905-631-9113
information@technokids.com
From the Publisher
TechnoKids Inc. develops and publishes computer curriculum that provides a project-based approach to
learning. Students integrate the use of Information and Communication Technology (ICT) to complete
innovative theme-related activities.
TechnoKids Computer Curriculum is available in four categories: Primary, Junior, Intermediate, and Senior.
Each category contains a set of projects designed to integrate a range of ICT skills into student learning
including word processing, programming, graphics, spreadsheets, desktop publishing, applied technology,
telecommunications, databases, operating systems, and multimedia.
Projects are thoroughly evaluated and tested by certified teachers to ensure they teach leading-edge ICT
skills and are developmentally appropriate for students. Each project comes complete with teacher
resource materials, such as handouts, activity sheets, evaluation forms, parent letters, extension activities,
and certificates.
TechnoKids Inc. projects enable teachers to help students become powerful technology users while
developing the problem-solving skills, self-confidence, and positive attitudes that will make them the social
and business leaders of tomorrow.
Our mission is to combine education and technology

to provide children with the core computing skills
that will best prepare them for the future.
ISBN: 978-1-55499-491-5
Released June 2020

TechnoTween Contents
Table of Contents
Session 1 – Out of this World
Assignment 1: What is Animation? ............................................................................................................................... 1
What is Animation? .................................................................................................................................................... 1

History of Animation ................................................................................................................................................... 1
Using Synfig Studio to Make Animations ................................................................................................................ 1
Watch an Animated Story Made Using Synfig Studio.......................................................................................... 2
Assignment 2: Introduction to Synfig ........................................................................................................................... 3
Open Synfig Studio ..................................................................................................................................................... 3
Label the Parts of the Synfig Window ..................................................................................................................... 3
Parts of the Synfig Window ....................................................................................................................................... 4
Parts of the Toolbox.................................................................................................................................................... 5
Get to Know the Tools ............................................................................................................................................... 5
About Layer Types ...................................................................................................................................................... 6
Draw a Line.................................................................................................................................................................. 7
Draw a Rectangle ...................................................................................................................................................... 8
Draw a Circle and an Oval ...................................................................................................................................... 9
Use the Transform Tool to Scale and Rotate ....................................................................................................... 10
Clear the Canvas ..................................................................................................................................................... 11
Draw Freehand using the Pencil, Brush, and Paint Brush Tools ........................................................................ 11
Edit Outline Width ..................................................................................................................................................... 14
Add Text ..................................................................................................................................................................... 15
What Do These Tools Do? ........................................................................................................................................ 16
Experiment with the Drawing Tools and then Exit Synfig ................................................................................... 17
Assignment 3: Working with Shapes .......................................................................................................................... 19
Open Synfig Studio ................................................................................................................................................... 19
Draw a Car and Group Together the Pieces ...................................................................................................... 19
Edit a Grouped Object ........................................................................................................................................... 21
Group all the Car Parts............................................................................................................................................ 21
Practice Drawing using Grouped Objects ........................................................................................................... 22
Assignment 4: About the Timetrack .......................................................................................................................... 25
About Animate Editing Mode ................................................................................................................................ 25
About the Timebar ................................................................................................................................................... 25
About the Frame Rate ............................................................................................................................................. 26
About Keyframes ...................................................................................................................................................... 26
About Layers ............................................................................................................................................................. 26
Assignment 5: Create Scene 1 – In a Land Far Far Away...................................................................................... 27
Draw the First Still Picture in Frame 0f: In a Land Far Far Away ........................................................................ 27
Draw the Second Still Picture in Frame 0f: There Lived an Alien ...................................................................... 28
Draw the Third Still Picture in Frame 0f: He Decided to Leave His Planet ....................................................... 29
Add Text to Describe the Story .............................................................................................................................. 29
Duplicate a Layer from the First Still Image.......................................................................................................... 29
Group the Third Still Picture ..................................................................................................................................... 29
Create a Static Animation ...................................................................................................................................... 30
What is the Problem?............................................................................................................................................... 31
Solve the Problem: Change the End Time ........................................................................................................... 32
Edit the Story .............................................................................................................................................................. 32
Save the Synfig Document and then Exit Synfig ................................................................................................. 32

Session 1 Review: About Animate.............................................................................................................................. 33
Session 1 Skill Review: Cartoon Challenge ............................................................................................................... 35
Teaching the skills of tomorrow… today!

Session 1 Extension Activity: Flip and Align Objects ................................................................................................ 37
Session 2 – On an Alien Planet
Assignment 6: What is a Motion Tween? .................................................................................................................. 41
What is a Motion Tween? ....................................................................................................................................... 41

Study the Motion Tweens ........................................................................................................................................ 42
Assignment 7: Create Scene 2 – The Planet ............................................................................................................ 43
Open Synfig ............................................................................................................................................................... 43
View Each Scene in the Story................................................................................................................................. 43
Copy the Group Layer for the Alien ..................................................................................................................... 44
Draw the Ground Using Motion Tween ................................................................................................................ 44
Move the Ground ..................................................................................................................................................... 45
Draw the Grass Using Motion Tween .................................................................................................................... 46
Make the Grass Grow .............................................................................................................................................. 46
Draw a Flower Blooming Using Motion Tween .................................................................................................... 47
Make the Flower Bloom ........................................................................................................................................... 48
Add Text ..................................................................................................................................................................... 49
Save the Synfig Document ..................................................................................................................................... 49
Assignment 8: Create Scene 3 – The Hover Craft ................................................................................................... 50
Open Synfig ............................................................................................................................................................... 50
Create the Hover Craft and then Animate the Object .................................................................................... 51
Add Words to Describe the Action on a New Layer ......................................................................................... 52
Open the Synfig Document and Display Scene 3 ............................................................................................. 52
Save the Synfig Document and Close the Program .......................................................................................... 52
Assignment 9: Create Scene 4 – Blast Off ................................................................................................................ 54

Open Synfig ............................................................................................................................................................... 54
Draw a Spaceship .................................................................................................................................................... 54
Animate the Ship Using a Motion Tween ............................................................................................................. 55

View the Animation ................................................................................................................................................. 56
Solve the Problem to Create a Background ....................................................................................................... 58
View the Canvas in Onion Skin View .................................................................................................................... 59
Add Words to Describe the Action ....................................................................................................................... 60
Save the Synfig Document ..................................................................................................................................... 60
Assignment 10: Create Scene 5 – In Outer Space.................................................................................................. 61
Open Synfig ............................................................................................................................................................... 61
Copy the Spaceship Group ................................................................................................................................... 61
Make the Spaceship Fly .......................................................................................................................................... 61
Create a Space Background................................................................................................................................. 62
Preview the Animation ............................................................................................................................................ 62
Assignment 11: (Optional) Motion Tween Animation Challenge ........................................................................ 63
Open Synfig Document and Display Scene 5 .................................................................................................... 63
Motion Tween Animation Challenge 1: Spinning Star ....................................................................................... 63
Motion Tween Animation Challenge 2: Flying Comet....................................................................................... 64
Session 2 Review: About Motion Tweens .................................................................................................................. 65
Session 2 Skill Review: Alien Ship ................................................................................................................................. 66

Session 3 – The Strange Planet
Assignment 12: What is a Shape Tween? ................................................................................................................. 70

Study Shape Tweens ................................................................................................................................................ 71
Assignment 13: Create Scene 6 - A Strange Moon ................................................................................................ 72
Open Synfig ............................................................................................................................................................... 72
Draw the Two Shapes of the Moon ....................................................................................................................... 72
View the Shape Tween ........................................................................................................................................... 73
Make Changes to the Final Shape ....................................................................................................................... 73
Solve the Problem to Have the Moon Return to its Initial Shape...................................................................... 73
Morph the Moon Repeatedly ............................................................................................................................... 74
Create a Background ............................................................................................................................................. 74
Test the Scene ........................................................................................................................................................... 75
Save the Synfig Document and then Close the Program ................................................................................ 75
Assignment 14: Create Scene 7 - Alien Friend ........................................................................................................ 76
Open Synfig ............................................................................................................................................................... 76
Create an Alien Friend ............................................................................................................................................ 76
Draw the Two Shapes of the Mouth ...................................................................................................................... 77
Create a Shape Tween to Morph the Mouth from One Shape into Another ............................................... 77
Have the Mouth Return to Its Initial Shape ........................................................................................................... 78
Morph the Mouth Repeatedly ............................................................................................................................... 78
Test the Scene ........................................................................................................................................................... 79
Save the Synfig Document and then Close the Program ................................................................................. 79
Assignment 15: (Optional) Shape Tween Animation Challenge ......................................................................... 80

Open the Synfig Document and Display Scene 7 ............................................................................................. 80
Shape Tween Animation Challenge 1: Morphing Sun ....................................................................................... 80
Motion Tween Animation Challenge 2: Shape Shifting Body Part................................................................... 81
Session 3 Review: About Shape Tweens ................................................................................................................... 92
Session 4 – Coming Home
Assignment 16: Create Scene 8 - Dance Party ....................................................................................................... 86
Open Synfig ............................................................................................................................................................... 86

Draw a Simple Shape Man ..................................................................................................................................... 86
Add Bones to the Shape Man................................................................................................................................ 87
Link the Shape Man to the Bones .......................................................................................................................... 88
Animate the Shape Man to Dance ...................................................................................................................... 88
Loop the Dancing Animation................................................................................................................................. 89
Edit the Grouped Shape Man................................................................................................................................ 89
Add Words to Describe the Action ..................................................................................................................... 89
Test the Scene ......................................................................................................................................................... 89
Save the Synfig Document and then Close the Program .............................................................................. 89
Assignment 17: Create Scene 8 - More Dancing ................................................................................................. 90
Open Synfig ............................................................................................................................................................. 90
Draw a Head, Body, Hip, Arm, Leg, Hand and Foot ........................................................................................ 90
Add Bones to the Robot ....................................................................................................................................... 91
Create Arm and Leg Bones .................................................................................................................................. 91
Link the Bones to the Robot .................................................................................................................................. 92
Animate the Robot ................................................................................................................................................ 92
Save the Synfig Document and then Close the Program .............................................................................. 92
Copy the Robot into Scene 8 .............................................................................................................................. 92

Complete the Scene ............................................................................................................................................. 92

Assignment 18: What is a Motion Path? ................................................................................................................. 93
What is a Motion Path? ......................................................................................................................................... 93
How do you Make a Motion Path? ..................................................................................................................... 93
Study Motion Path Animation .............................................................................................................................. 93
Assignment 19: Create Scene 9 - Blast Off from Planet....................................................................................... 94
Open Synfig ............................................................................................................................................................. 94
Create a Motion Path ........................................................................................................................................... 94
Make the Spaceship Fly Away ............................................................................................................................. 94
Preview the Animation .......................................................................................................................................... 95
Make Changes to the Spaceship ....................................................................................................................... 95
Create a Background ........................................................................................................................................... 95
Add Words to Describe the Action ..................................................................................................................... 95
Save the Animate Document and then Close the Program.......................................................................... 95
Assignment 20: Create Scene 10 - Land Back Home .......................................................................................... 96
Open Synfig ............................................................................................................................................................. 96
Make the Spaceship Fly Down ............................................................................................................................ 96
Preview the Animation ............................................................................................................................................ 96
Save the Synfig Document and then Close the Program............................................................................... 96
Assignment 21: Motion Path Animation Challenge ............................................................................................. 97
Open Synfig ............................................................................................................................................................. 97
Motion Path Animation Challenge 1: Rolling Rock .......................................................................................... 97
Motion Path Animation Challenge 2: Walking Alien ........................................................................................ 97
Save the Synfig Document and Close the Program ........................................................................................ 97
Session 4 Review: About Motion Paths ..................................................................................................................... 98
Session 4 Skill Review: Worm Creature .................................................................................................................... 100
Session 4 Extension Activity: Keyboard Shortcuts .................................................................................................. 102
Session 5 – Add Sound, Export the Movie
Assignment 22: Render Scenes ................................................................................................................................ 106
Open Synfig and View Scene 1 ........................................................................................................................... 106

Preview the Scene ................................................................................................................................................. 106
Render the Scene .................................................................................................................................................. 106
Watch the Video .................................................................................................................................................... 107
Render the Remaining Scenes ............................................................................................................................ 107
Share your Movie with Others .............................................................................................................................. 108
Out of This World Marking Sheet .............................................................................................................................. 109

Session 5 Review: Synfig Word Search .................................................................................................................... 111
Session 5 Skill Review: Who are You? ...................................................................................................................... 113
Session 6 – Make your own Movie
Assignment 23: Select an Idea ................................................................................................................................. 117
Idea: Make an Animated Scene ......................................................................................................................... 117

Idea: Make a Short Story ....................................................................................................................................... 117
Idea: Make a Greeting Card ............................................................................................................................... 118
Assignment 24: Create the Document ................................................................................................................... 119
Tips for Staying Organized..................................................................................................................................... 119
Tips for Saving Time................................................................................................................................................. 119
Drawing Tips............................................................................................................................................................. 119
Animation Tips ......................................................................................................................................................... 119

Assignment 25: Share the Movie with Others ........................................................................................................ 120

Complete the Checklist ........................................................................................................................................ 120
Share the Movie with your Friends ....................................................................................................................... 121
Open the Synfig Document ................................................................................................................................. 121
Render the Document as an AVI Movie ............................................................................................................ 121
Session 6 Review: Synfig Review .............................................................................................................................. 122

TechnoTween

Session 1
Out of this World
In this session, students are introduced to Synfig Studio. To begin, they view a
sample animation called "Out of this World" to gain an understanding of the
types of animation that can be created using the program. Afterwards, they
open Synfig to learn about the program environment. Once familiar with the
components, they practice drawing using the tools in the Toolbox. They then
learn how to manipulate images by scaling, skewing, and rotating. With these
skills mastered, they apply their knowledge of the drawing tools to create the
first scene in a space adventure.
Assignment 1: What is Animation?

Assignment 2: Introduction to Synfig
Assignment 3: Working with Shapes
Assignment 4: About the Timeline
Assignment 5: Create Scene 1 – In a Land Far Far Away
Session 1 Review: About Synfig

Session 1 Skill Review: Cartoon Challenge
Session 1 Extension Activity: Flip and Align Objects
TechnoTween Session 1
Assignment 1: What is Animation?

In this assignment you will learn about the history of animation as well as how the
computer has changed the way animators make cartoons.
What is Animation?
Animation is a series of drawings that show action. By changing the still image slightly, it
can be made to look like it is moving. This is done by rapidly showing the images in sequence. The human
eye sees the change in images as movement, not as separate pictures.
History of Animation
Although humans have been drawing cartoon pictures since the time of the cave dweller, the ability to
show movement did not occur until the 19th century. It was during this time that scientists created the
camera and projector. Artists were then able to use this technology to film a series of drawings that, when
shown rapidly, looked like they were moving.
In the beginning, artists would draw a picture by hand and film it. Then they would change the image and
film the new picture. These still images were strung together to create an animated picture. It would take a
very long time to make animations using this method.
It was not until the 1960’s that animation was made easier by using the computer. At first the technology
would allow artists to draw simple shapes and view the objects as if they were three-dimensional. Later, the
computer would allow the artist to draw a picture and then the software program would automatically
create the animation. Today, software programs have become very complex and can create life-like
animations that have realistic lighting and textures.
1. List some of the benefits you think there are to using the computer to create animations:
Using Synfig Studio to Make Animations
Synfig Studio is a program that can be used to create animations. It is an open-source 2D animation
software designed to make high quality animation with less people and fewer resources. The Animate
program has many features that make it easy to create animations:
 Pick your start and end point for an object, and then watch it move. Synfig fills the gaps
between frames in order to produce smooth, fluid animation. This means that you select the
start point and end point for the object and the program will automatically create all the still
images that come in between or "tween" the two objects.
 Morph an object from one form into another. This means that you draw the original image and the
transformed image. The program will then automatically create all the still images that come
between or "tween" the two pictures.
 Make many things animate at one time. Synfig creates layers for every object and each object
can have its own animation. This means that many movements can happen at the same time.
Copyright © TechnoKids Inc. 1

TechnoTween
 Make objects move realistically. Synfig lets you move an object along a spline. A spline is what
might be called a “path” in other programs. You can use this to make many fun animations such
as a plane doing a loop or a rabbit hopping.
 Add sound to make the animation more interesting. Synfig lets you add sound to an action or to
an entire scene. This is a great way to apply effects, sound track, or dialogue to an animated story.
Watch an Animated Story Made Using Synfig Studio
Synfig lets you create several types of animation. Watch the animated story Out of this World, which was
created using the Synfig Studio program. For each scene, notice the type of animation.
 Open the Synfig folder.
 Double click the Out of this World file to watch the animated story.
Scene 1 Scene 2 Scene 3 Scene 4 Scene 5

Static Animation Motion Tween Motion Tween Motion Tween Motion Tween
Scene 6 Scene 7 Scene 8 Scene 9 Scene 10

Classic Tween with Classic Tween with
Shape Tween Shape Tween Bone Tool
Motion Path
Motion Path
2. What did you like about the animation "Out of this World"?
3. What would you add to this story to make it even better?
 Close the file.
2 Copyright © TechnoKids Inc.

Assignment 2: Introduction to Synfig
In this assignment, you learn about the components of the Synfig Studio
environment. Read the description on the next page about the parts of the
Synfig window. Use this information to label each part.
Open Synfig Studio
 Open Synfig Studio.
Label the Parts of the Synfig Window
1. Label the parts of the Synfig window.
 Canvas  Layers  Tool Properties  Toolbox
 Menu Bar  Timetrack Parameters

TechnoTween
Parts of the Synfig Window
Part Description
Menu Bar A bar at the top of the window. It lists menu options including File, Edit, View,
Canvas, Toolbox, Layer, Plug-ins, Window, Help.
Canvas The canvas is the area in the center of the window with gray squares. It is
where Synfig animations are created.
Timetrack The Timetrack is typically at the bottom of the window. It has a gray Timebar that
can indicate and change the frame you are on and an area where symbols
called Waypoints appear.
Layers The Layers panel is to the right of the Timetrack. Whenever an object is created
it is given its own layer and that layer appears in the panel. Layers can be
arranged and grouped together to better keep track of the objects in the
document.
Toolbox The Toolbox is a panel that holds a collection of drawing tools used to create
and customize objects on the stage.
Tool Properties A panel that displays options for the selected tool.
Parameters The Parameters panel is typically found to the left of the Timetrack and will
display the properties of a selected object.

Parts of the Toolbox
Before you can start making objects move, you need to know to
draw objects. As you experiment with the tools in the Toolbox, you
will notice how different they are from other programs. It will take
a bit of getting used to but learning how to use the tools is both
necessary and worth it.
2. The Toolbox includes everything you need to create, select, or edit graphics on the Canvas. It is
not divided in any particular way though tools with similar functions are closer together.
Get to Know the Tools
The tools in the Tools panel are "sticky". In most programs, the tools are "stuck" in the same spot. This
makes them easy to find.
Answer the questions to help you learn the location of the tools.
1. Find the Circle Tool. List another tool with a similar function.
2. Find the Scale Tool. List another tool with a similar function.

TechnoTween
About Layer Types
In Synfig, tools that create objects have in their Tool Properties, different Layer Types. Synfig creates
Layers for each distinct object and different objects fall under different Layer Types. A tool can create
multiple Layer Types at once, but at least one layer type must be selected at any given time.
Shape Layer:
 The Shape Tools (Circle, Rectangle, Polygon, and Star) all have a Layer Type dedicated to creating
an object of the tool’s assigned geometry.
 Shape layers are very limited in how they can be edited as they’re only meant to calculate for a
single shape.
Region Layer:
 The Region Layer describes a fills in a shape designated by the tool it’s created with.
 They look identical to shape layers when created using the shape tools.
 Region layers can be edited in more ways than shape layers.
Outline Layers:
 Outline Layers create a stroke around the shape designated by the tool it’s created with.
 Brush Width, which can be found in the Tool Properties, determines the initial thickness of the
stroke.
 The width of an outline layer can be changed after it has been made.
Advanced Outline Layers:

 The Advanced Outline Layer is, for the most part, similar to an outline layer.
 It has more options for adjusting its width and other properties.

Draw a Line
 Click to select the Spline tool.
 Look at the Tool Properties panel. Notice how it now offers a series of Spline tool options.
Draw a Line with Outline Layer
 Under Layer Type find and select Create a Outline Layer.

ON
Make sure it is the ONLY ONE selected!
 Now click on two different places on the Canvas.
 Click Make Spline in the Tool Properties.
 Click the Transform Tool , then click the line or click outline layer in the Layers panel to select it.
 Click and drag a selection box over a vertex then click and drag the vertex to move it.
 Click and drag on a vertex without using a selection box first to pull a tangent handle and cause the line
to curve.
 Click on the outline layer in the Layers panel and then click Delete Layer to delete the line.

TechnoTween
Draw a Rectangle
 Click the Rectangle Tool.
Draw a Shape with Two Layer Types
 Under Layer Type find and select Create Rectangle Layer and Create a Outline Layer.
Make sure those are the ONLY ONES selected!
 Now click and drag the cursor across the Canvas to draw a rectangle in a blank area.
 Click the Transform Tool.
 Click the outline.
 Drag a selection box over the vertices of the outline and click and drag them.
Notice how the outline changes but the rectangle stays the same.
 Click the rectangle.
 Click and drag the green dots that appear.

Notice how the outline doesn't change

Draw a Circle and an Oval
 Click the Circle Tool.
 Under Layer Type find and select Create Region Layer and Create a Outline Layer.
Make sure those are the ONLY ONES selected!
 Click the Palette Editor and choose a new Fill Color.


 Now click and drag across the canvas to draw a circle in a blank area.


 Click on either the outline or the filled area.


 Click on the right vertex, then click and drag to the right.
Notice how the filled area changes along with the outline.

 Click and drag on the other vertices to change the circle into an oval.
TIP: When you press and hold the SHIFT

key while dragging a vertex, it limits its
movement to either the X or Y axis.

TechnoTween
Use the Transform Tool to Scale and Rotate
Synfig lets you scale and rotate

objects. Try it!
 Click on the oval to select it on the Canvas.
 Press Ctrl + A to select all the handles.


 Hold the Alt key, then click and drag on one of the selected handles to scale the object. Hold Shift while
scaling to constrain the object’s proportions.
 Hold the Ctrl key, then click and drag on one of the selected handles to rotate the object.
Edit the Color of the Stroke and Fill of a Shape
Sometimes you may forget to pick an outline or fill color before you begin to draw.
Other times, you may change your mind and decide you no longer like the way
the shape looks. It is easy to change the stroke and outline color.
 Click on a blank space on the Canvas to deselect any objects.
Change the Outline Color
 Select the layer of the outline in the Layers panel.
 Click the rectangle next to the Color parameter in the Parameters Panel.
 Choose a color from the color wheel.
Change the Fill Color
 Select the layer of the filled shape in the Layers panel.
 Click the rectangle next to the Color parameter in the Parameters Panel.
 Choose a color from the color wheel.

Clear the Canvas
The canvas is full with all of the objects you

have drawn. It is time to clear it.
 Press Ctrl + Shift + A to select all the layers in the Layers panel.
Selecting an object’s layer will select the object on the canvas
 Click Delete Layer.
Draw Freehand using the Pencil, Brush, and Paint Brush Tools
You are now going to experiment with the Sketch, Brush and Draw tools.
The Brush tool has similar properties to the shape tools including Layer
Types. The Sketch and Brush tool, however are very different.
Draw with the Sketch Tool
 Click the Sketch Tool.
 Look at the Tool Properties panel. It doesn't have any of the options the shape tools did.



 Outline Color will affect the appearance of lines created with the Sketch Tool.
 Use the tool to draw a smiley face and give them spiked hair.
Notice how no layers are created when drawing with this tool.


 Uncheck the Show Sketch option or click Clear Sketch to remove the drawing
from the canvas.

TechnoTween
Draw with the Brush
 Click the Brush Tool.
 Look at the Tool Properties panel. It has different options for the kind of brushes the tool will use when
drawing as well as an eraser.
 Outline Color will affect the appearance of lines created with the Sketch Too.
 Use the tool to draw a worm.

Notice how the layer created is neither an outline, region or shape. And
adding more strokes to the drawing simply increases the area covered by
the layer.
 Click the brush image layer in the Layers panel.

Draw with the Draw Tool
 Click the Draw Tool.
 Look at the Tool Properties panel. It has Layer Types like the shape tools, as well as, other options that
change the appearance of the lines it creates.
 Under Layer Type find and select Create a Outline Layer.

Make sure it is the ONLY ONE selected!
 Increase the Brush Size to see the outline more clearly.


 Increase the Smoothness to make smoother outlines with fewer vertices.
 Click and drag on the stage to draw with the Draw Tool.
 Click Fill Last Stroke to fill in the outline.
 Click on the vertices or drag a selection box over multiple vertices and use the Transform Tool to scale
and rotate them.
 Use the Draw tool to draw an alien landscape.

TechnoTween
Edit Outline Width
 Draw curvy line.

 Select the Outline.
 Click the Width Tool.
 Click and drag along the outline to increase width.
 Hold Ctrl while dragging to decrease width.
TIP: The width tool is for fine-

tuning the width of a line. To
 Click the Transform Tool. heavily edit the width better to
use the Transform Tool.
 Click Toggle Width Handles then click Toggle Vertex Handles and
Toggle Tangent Handles .
 Hold Ctrl and click two width handles in the middle of the line.
 Click on one of the width handles and drag the mouse towards the left or downward to reduce the
width to 0.
Notice how it appears like the outline has a gap.
 Click Toggle Width Handles then click Toggle Vertex Handles and Toggle Tangent Handles again.

 Select the Outline.


Add Text
You are now going to add your name to the Stage using the Text
Tool. You will notice that it is very similar to most paint programs.
 Click on the Text Tool.
 Look at the Tool Properties panel. You can change the Width, Height and Font Family of the text. You
can also check or uncheck the Multiline Text box depending on the length of your text.
 Click on the canvas and a dialog box will appear.

 In the dialog box, write Student Name.
 Your Text will appear near the space of the canvas you clicked on.
Your text will have the same color as your current Fill Color. This can be changed by clicking on the
Color parameter in the Parameters tab.

 Click and drag on the green position handle to move the text.
 Click and drag the vertex handle to change the text's vertical and horizontal width.

TechnoTween
What Do These Tools Do?
The tools you have learned so far are the ones you will most likely use when you
are drawing. However, the Toolbox still has a few more tools. See if you can find
out what they do. Draw a flower using the tools you have just learned. Then
experiment with more Synfig tools to discover their function.
 Use your skills to draw a flower.
Step 1 Draw the center of the flower using the Circle tool:
a. Select the Circle Tool.

b. Select Create a Circle Layer and deselect other Layer Types.
c. Change Fill Color to yellow.
d. Draw a small circle.
e. Select the Transform Tool and click an empty space on the canvas to deselect the circle.
Step 2 Draw the petals of the flower using the Drawing tool:
a. Select the Draw Tool.

b. Select Create a Region Layer and Create a Outline Layer and deselect other Layer Types.
c. Change the Fill Color to white and the Outline color to black.
d. Draw petals.
e. Select the yellow circle in the Layers panel and click Raise Layer until it is above all the petal
layers.

3. Edit the objects using each the tools to discover their function.
a)
Scale Tool
b)
Rotate Tool
c)
Mirror Tool
d)
Fill Tool
e)
Cutout Tool
f)
Zoom Tool
TIP: Tools such as Scale, Rotate and Mirror work best when all of an object's vertex and tangent handles are selected. Press
Ctrl + A after selecting an object to select all its handles.
Experiment with the Drawing Tools and then Exit Synfig
Have some fun drawing with the tools in the Synfig

Toolbox. The more you practice the better you will
become at making objects in this program. When you are
done, exit the program.

TechnoTween

Assignment 3: Working with Shapes
In this assignment, you learn how to group and ungroup objects. Grouping is
when you combine separate objects to make a single item. This can happen
when you group the stroke (line) and fill of an object. It can also happen when
you take multiple objects on the canvas, and combine them all together.
Learn tips for drawing using grouped objects by following the instructions to
draw a simple car.
Open Synfig Studio
Draw a Car and Group Together the Pieces
Draw the Car Body and Tire
 Select the Rectangle Tool.
 Select Create a Region Layer and Create a Outline Layer and deselect all other Layer Types.

 Change the Fill Color to white and the Outline Color to red.
 Draw the body of the car using the Rectangle Tool.



 Click and drag on the upper right handle of the rectangle to pull on the tangent that will bend the top of
the rectangle.

 Hold Ctrl and Click the Region and the Outline Layer in the Layers panel and click Group Layer.

 Double click on the name of the group to change it. Rename the group to “Car Body”.

 Click on an empty spot on the canvas to deselect the rectangle.

 Click on the Circle Tool.


 Draw a tire.

 Group the Region and Outline of the tire and name the group “Car Tire 1”.

TechnoTween
Duplicate the Car Tire
It is easy to duplicate layers in Synfig Studio.
 Click on the Car Tire 1 group in the Layers panel.


 Click Duplicate Layer.

 Rename the duplicate group to Car Tire 2.


 Move the tire into position.
TIP: Hold Shift to keep the new tire aligned with the previous one while moving it.
Draw the Car Top

To move an object in front of or behind another object, move its layer above or below the other object's
layer in the Layers panel, respectively.
 Draw a rectangle to act as the top of the car.
 Move the Car Top into position.
 Hold Ctrl and Click the Region and the Outline Layer in the Layers panel and click Group Layer.
 Rename the group to Car Top.
 Move the Car Top group below the Car Body group in the Layers panel.

Edit a Grouped Object
To edit a grouped object, go inside the group and select the layer of the object. When creating objects in
Synfig, they are either placed at the very top when no object is selected, or directly above a selected
object/layer. So an object can be created inside of a group by selecting an object/layer in that group.

 Expand the Car Body group by clicking the arrow next to green folder icon.

 Click the top most layer in the group.

 Use the Rectangle Tool to draw a stripe across the car body.
Group All the Car Parts

To better control or animate the car as a whole, ALL the parts should be grouped together.

 Select all the car part groups in the Layers panel by holding Ctrl while clicking.

 Click Group Layer.
- The objects in the groups can still be edited by expanding the group they're in and clicking their layer.

TechnoTween
Practice Drawing Using Grouped Objects
It is a good idea to practice drawing objects using grouped shapes. There are
two drawing challenges. Clear the canvas. Now pick a drawing challenge. Try to
draw it using the tools in the Tools Panel.
Challenge One: Draw a Bear
1. Draw the head using the Circle tool:

b. Select Create a Region Layer and Create a Outline Layer and deselect all other Layer Types.
c. Scroll down the Tool Properties panel and increase the number of Spline Points to 6.
d. Select the Fill Color.
e. Draw the head of the bear.
f. Select the Transform Tool.

g. Click and drag on one of the vertex handles and bend the circle.
2. Draw the ears using the Circle Tool:
b. Draw an ear.
c. Select the layers of the ear and click Lower Layer until they are under the head's layers.
d. Click Duplicate Layer.
e. Select the Transform Tool.
f. Select the layers of the head and the layers of the ears and group them.
g. Name the group "Bear Head".
3. Draw the body using the Circle Tool:
b. Draw a large circle that will serve as the bear's body.
c. Select the Transform Tool.
d. Click and drag on one of the vertex handles and bend the circle.
e. Select the body's layers and group them.
f. Name the group "Bear Body".
g. Select the group and click Lower Layer to place the body behind the head group.
4. Draw the arms using the Draw Tool:

b. Select Create a Region Layer and Create a Outline Layer and
deselect all other Layer Types.
c. Draw an arm on one side of the bear's body.
d. Select the arm's layers and click Lower Layer until the arm is behind
the body.
e. Click Duplicate Layer.
f. Select the Mirror Tool.
g. Press Ctrl + A to select all of the arm’s handles.
h. Select Horizontal in the Tool Properties or hold Shift then click and drag on one of the handles to
flip the duplicate arm and drag it to the other side of the body.
i. Select the layers of both arms and group them.
j. Name the group "Bear Arms".

5. Draw the legs using the Draw tool:

b. Draw a leg on one side of the bear's body.
c. Select the leg's layers and click Lower Layer until the leg is behind
the body.
d. Click Duplicate Layer.
e. Select the Mirror Tool.
f. Press Ctrl + A to select all of the leg’s handles.
g. Select Horizontal in the Tool Properties or hold Shift, then click and
drag on one of the handles to flip the duplicate leg and drag it to
the other side of the body.
h. Select the layers of both legs and group them.
i. Name the group "Bear Legs".
6. Draw a face:
a. Expand the Bear Head group.
b. Click the top most layer in the group.
c. Select the Circle Tool.
d. Select Create a Circle Layer and deselect all other Layer Types.
e. Change the Fill Color.
f. Draw the bear's eyes.
g. Select the Draw Tool.
h. Select Create a Outline and deselect all other Layer Types.
i. Draw the nose and mouth.
7. Save the file.

a. Click the File menu. Select Save.
b. Locate student’s folder. Type bear in the File name box. Click Save.
Challenge Two: Draw a Chick
Can you draw a chick? Follow the instructions to

use the tools in the Toolbox.
1. Draw the head using the Circle Tool:

c. Draw the head of the chick.
2. Draw the beak using the Rectangle tool:
a. Select the Polygon Tool.

c. Click on the canvas to create a point using the Polygon Tool.
d. Create three points and click Make Polygon in the Tool Properties panel.
e. Select the layers of the head and the beak and group them.
f. Name the group "Chick Head".

TechnoTween
3. Draw the body using the Draw tool:

c. Draw the body of the chick.
d. Select the layers of the body and click Lower Layer until the body is
behind the head.
4. Draw the wings using the Circle Tool:
b. Draw a circle.
c. Select the Transform Tool.

d. Click and drag on the handles of the circle to stretch it into an oval that will serve as the chick's
wing.
e. Select the wing's layers and click Duplicate Layer.
f. Click Lower Layer until one wing is behind the chick's body.
g. Select the Transform Tool.
h. Move the wing into position where a portion of it can be seen from behind the body.
5. Draw the legs using the Draw tool:
b. Select Create a Outline Layer and deselect all other Layer Types.
c. Draw a leg.
d. Select the Layers of the leg and click Duplicate Layer.
e. Click Lower Layer to move the duplicate leg behind the body.
f. Select the Transform Tool.
g. Move the leg into position where a portion of it can be seen from behind the body.
6. Draw a face:
a. Expand the Chick Head group.
b. Click the top most layer in the group.
c. Select the Circle Tool.
d. Select Create a Circle Layer and deselect all other Layer Types.
e. Change the Fill Color.
f. Draw the chick's eyes.
7. Save the file.

a. Click the File menu. Select Save.
b. Locate student’s folder. Type chick in the File name box. Click Save.
Exit Synfig

Assignment 4: About the Timetrack

Over the next few sessions, you are going to apply your knowledge of the drawing tools
to make an animated space adventure, similar to the Out of this World sample you
watched in Assignment 1. Before you can start, you need to understand the Synfig
Timetrack. Read the information and answer the questions.
Open the Synfig Studio
About Animate Editing Mode
The secret to making animations using Synfig is its Animate Editing Mode. There is a green man icon to the
lower right of the canvas. Clicking it will change the icon and turn on Animate Editing mode. To create any
kind of animation in Synfig Studio Animate Editing Mode has to be turned on. Anytime a change is made to
an object's parameters in this mode, the change is recorded on the Timetrack and is represented by symbols
called Waypoints.
1. What appears around the Canvas window to indicate that Animate Editing Mode is active?
About the Timebar
At the top of the Timetrack panel is the Timebar. Clicking and dragging along the Timebar changes the
frame you are currently on and allows you to see the state of an object at a certain frame.
2. In the image above, what frame is currently on?

About the Frame Rate
A default Synfig document shows twenty-four frames per second (24.00 fps); this is called the frame rate.
24.00000 fps means in one second you will watch the animation from twenty-four frames. It is important to
understand frames per second, because this will help you set when an animation should start and stop. For
example, in this assignment you are going to add text. You will want to leave the words on the screen long
enough for a person to read. You will likely need at least 3 seconds for a person to read the words. At
twenty-four frames per second, the text would need to be on the screen for 72 frames.
3. If the frames per second is set to twenty-four (24. 00 fps), how many seconds will the
Animate document have played when it reaches frame number 48?
About Keyframes
A Keyframe allows the user to make Synfig remember the state of the animation at a certain frame and to
tell the program to take that frame into account when creating waypoints. The information of every
parameter of every layer is stored to be used later when creating a keyframe and each frame can only
have one keyframe. By default, Synfig places a keyframe at 0f when creating a document.
4. Which icon reperesents the tab for the Keyframe panel?
A. C.
B. D.
About Layers
Each layer, and therefore, each object can be animated independently. Since each object has its own
set of parameters, different waypoints at different frames might appear on the Timetrack depending on
how the objects are animated.
Exit Animate

Assignment 5: Create Scene 1 – In a Land Far Far Away

In this assignment you use static animation to make the first scene in a space adventure.
Static animation is when still pictures are shown in a sequence.
The scene will introduce the purpose of the story. It will contain pictures and the words "In a land far far
away there lived an alien that longed for adventure. He decided to leave his planet to explore the galaxy."
Follow the instructions to:
1. Change End Time to 144f.

2. At Frame 0f, add the words, “In a land far far away” and include a picture of space.
3. Create the first group of text and images and hide the group from view.
4. Add, “There lived an alien that longed for adventure”.
5. Below the words, draw an alien.
6. Group the parts of the alien and put that group in a second group with the new text. Hide this group
as well.
7. Add, “He decided to leave his planet in search of adventure”.
8. Copy a layer from the first group.
9. Change the amount (opacity) of each group at certain frames.
10. Change the interpolation of waypoints to make it seem each group is appearing one after the other.
11. Preview the animation. Solve the problem of why the last group does not appear for very long.
12. Edit the story by changing the End Time.
13. Save the Synfig document.
Open Synfig Studio
Change the End Time of the document to give the Timetrack more frames to accommodate the animation.

 In the Menu bar, click Canvas ► Properties.
 Click the Time tab and change End Time to 144f.
Draw the First Still Picture in Frame 0f: In a Land Far Far Away
Follow the instructions to create the first still picture in the scene.
 Use the Text Tool to add the text: In a land far far away.
 Use the tools in the Toolbox to draw a scene of outer space.
Hints:
 Draw a rectangle and then bend the top to

make it look like a planet at the bottom of the
stage.
 Click Layer from the Menu bar and then click
New Layer ► Geometry ► Solid Color. This will
create a layer of color that covers the whole
canvas. Bring it behind the text and other
objects to use it as a background.
 Group the text and planets to keep the Layers
panel organized.

TechnoTween
Draw the Second Still Picture in Frame 0f: There Lived an Alien
Follow the instructions to make the second still picture in the scene.
Hide the Previous Still Picture
You need to hide the group of the previous still image so it doesn’t obstruct
the work area while you are making the second still image.
 Uncheck the box next to the layer’s icon to hide the group
and everything inside it.
There Lived an Alien
 Use the Text Tool to add the text: There lived an alien
that longed for adventure.
 Use the tools in the Toolbox to draw an alien. Make sure it is filled with color.
Hints:
Draw shapes and then bend them to

create an alien.
Duplicate a shape to make arms or
legs quickly.
To flip a shape, select the Mirror Tool.
Check Flip Horizontal in the Tool
Properties or hold Shift.
Group the parts of the alien and put
that group in another group with the
text.
Check the Multiline Text option in the
Text Tool properties to make the words
appear on two lines.

TechnoTween
Draw the Third Still Picture in Frame 0f: He Decided to Leave His Planet
Follow the instructions to make the third still picture in the scene.
Hide the Previous Still Picture
You need to hide the group of the previous still image so it doesn’t obstruct
the work area while you are making the third still image.
 Uncheck the box next to the layer’s icon to hide the group
and everything inside it.
Add Text to Describe the Story
 Use the Text Tool to add the text: He decided to leave his planet to explore the galaxy. This is his
story.
Duplicate a Layer from the First Still Image
 Expand the group of the first still picture.


 Select the layer of the largest planet and click Duplicate Layer.

 Drag the duplicate layer out of the group and above the text layer for this still picture.
Group the Third Still Picture


 Group the text and the duplicate planet layer.

Create a Static Animation
 Unhide the previous groups.
 Turn on Animate Editing Mode.
 Hold Ctrl and click the group of the second and third still picture.
 Double click the Value of Amount in the Parameters panel and change it to 0.00.
 Click the group of the first still picture.
 Click Current Time and enter 72f.
 Change the Value of the group's Amount to 0.00.
 Right click on the waypoint created at 72f then click In ► Constant.
 Click the group of the second still picture.
 Change its Amount to 1.00.
 Change its Amount back to 0.00.
 Click the group of the third still picture.
 Change its Amount to 1.00.
Turn off Animate Editing Mode.

What is the Problem?
 Watch your story by pressing Ctrl + P. Do you notice the problem?
Maybe you cannot tell because when the animation gets to 144f it stops. However,
there is a problem.
 To find the problem, click FIle from the Menu bar then click Preview.
Set the Quality to 1.00 and the FPS to 24 in the dialog box that opens.
 Toggle the Loop option and play the animation.
1. What is the problem?

 Click the Close button to exit the preview.

Solve the Problem: Change the End Time
The still picture at 144f only plays for one frame, which is not enough time to read the text or see the
drawings. To solve this problem, you need to change the End Time again. Remember it takes one second to
play twenty-four frames. How many seconds do you think you need to read the last bit of text? Setting the
End Time to 216f will give the viewer three seconds to read the words.
 Click Canvas ► Properties.
 Change the End Time to 216f.
 Watch the scene again. Click File ► Preview.
Edit the Story
You may find the words are on the screen too long or short. This can easily be fixed.
More Time is Needed to Read the Words

If you need more time to read the words, then you need to increase the End Time.
 Increase the End Time
 Select the still picture's group.


 Click and drag the waypoints of when a picture's Amount turns to 0 further down the Timetrack.
Make sure that the waypoints that cause one picture to disappear align with the waypoints that cause
another picture to appear.
Less Time is Needed to Read the Words

If you need less time to read the words, then you need to decrease the End Time.
 Click and drag the waypoints of when picture's Amount turns to 0 up the Timetrack.
Do this for all waypoints before decresing the End Time.
 Decrease the End Time.
Save the Synfig Document and then Exit Synfig
 From the File menu, select Save.
 Type the filename Scene 1 in the File name box.
 Click Save.
 From the File menu, select Quit.

Session 1 Review: About Animate

Label the parts of the Animate window.
 Canvas  Layers  Toolbox  Timetrack
/4
Match the tool to its function.
5. A. Draw freehand.
6. B. Move, rotate or scale a selected handle.
7. C. Flip an object.
8. D. Create a Spline.
9. E. Draw a circle.
/5

TechnoTween
Circle whether the statement is TRUE or FALSE.
10. A frame can have more than one keyframe. TRUE FALSE
11. Each frame on the Timetrack plays for one second. TRUE FALSE
12. You cannot animate without turning on Animate Editing Mode. TRUE FALSE
13. You can duplicate a group of layers . TRUE FALSE
/4
Match the term to its definition.
14. Frames per Second A. A symbol representing a change in an object’s parameter
15. Group B. The number of frames played per second
16. Waypoint C. To combine multiple layers under a different layer
/3
Answer the questions.
17. If the frames per second is set to twenty-four (24. 0 fps), how many seconds will the document
have played when it reaches frame number 120?
/1
18. What is the difference between the Sketch Tool and the Brush Tool?
/1
19. What is the benefit of grouping layers?
/2
TOTAL: /20

Session 1 Skill Review: Cartoon Challenge

Practice using the tools in the Tools Panel to make a cartoon creature.
1. Open Synfig Studio
2. Draw the head using the Circle tool:
a. Select the Circle Tool .

c. Select the Brush Size, Fill Color and Outline Color,
d. Draw the head of the cartoon character.
e. Select the Transform Tool .

f. Bend the circle by moving the handles.
g. Place the head in a group and name the group "Head".
3. Draw a face:
a. Expand the "Head" group and select the top layer.
b. Select the Draw Tool.

c. Select Create a Outline Layer and deselect all other Layer Types.
d. Select Brush Size and Outline Color.
e. Draw eyes, nose and mouth.
f. Use the Transform Tool as you need it.
g. Click the arrow next to the group layer's icon when you're finished to hide the layers inside the
group.
4. Draw the body using the Circle tool:

b. Select the Brush Size, Fill Color and Outline Color.
c. Draw the body of the cartoon character.
d. Select the Transform Tool.
e. Bend the circle by moving the handles.
f. Place the body in a group and name the group "Body".
g. Click Lower Layer and place the body behind the head.
5. Draw details on the body:

a. Expand the "Body" group and select the top layer.
c. Select or deselect the Create a Region Layer as you need it.
d. Select Brush Size, Fill Color and Outline Color.
e. Add details such as a colored belly or spots.
f. Use the Transform Tool as you need it.
g. Hide the layers of the group.

TechnoTween
6. Draw the arms using the Circle tool:

c. Draw an arm.
d. Place the arm in a group, name it "Arm 1" before adding details such as claws.
e. Use the Transform Tool as you need and to move the arm into position.
f. Hide the layers of the group.
7. Duplicate the arm:
a. Select the arm group.
b. Click Duplicate Layer.
c. Click Lower Layer and place the duplicate arm behind the body.
d. Use the Transform Tool to put the arm into position.
e. Rename the group "Arm 2"
8. Draw the legs using the Oval tool:

a. Click the Body layer.
c. Select Create a Region Layer and Create a Outline Layer and deselect all other Layer Types.
d. Draw a leg.
e. Place the leg in a group, name it "Leg 1" before adding details such as claws or wrinkles,
f. Use the Transform Tool as you need and to move the leg into position.
g. Hide the layers of the group.
9. Duplicate the leg:

a. Select the leg group.
b. b. Click Duplicate Layer.
c. c. Click Lower Layer and place the duplicate leg behind the body.
d. d. Use the Transform Tool to put the leg into position.
e. e. Rename the group "Leg 2".
10. Use your skills to add more details such as spikes, ears, or wings.
TIPS:
 Be creative! What would a creature from outer space look like?
11. Save the file as creature.
12. Exit Animate.

Session 1 Extension Activity: Flip and Align Objects

Below are the instructions for flipping objects horizontally and vertically, as well as aligning them on the
canvas. Try it!
How to Flip an Object
You may want to flip an object to have it face in the other direction. There are two ways to go about this.
Flipping a Non-Group Layer

To flip a non-group layer, you must select the layer/s and all of their handles. This can be done to layers inside
of a group but not the group itself.
1. Open the saved creature file.
2. Expand the groups of the creature’s body parts.
3. Hold Ctrl and click on the layers inside of the groups to select them.
4. When all layers have been selected, press Ctrl + A. to select their handles.
5. Select the Mirror Tool.
6. In the Tool Properties panel, select either Horizontal or Vertical.
7. Click and drag on one of the selected handles to flip the layers.
Holding Shift while dragging will flip the object in the way that isn't selected in the Tool Properties.
Flipping a Group Layer
1. Click the group layer to select it.
2. Hold Ctrl and click the green and yellow handles that appear when selecting a group layer.
3. Select the Mirror Tool.
4. In the Tool Properties panel, select either Horizontal or Vertical.
5. Click and drag on one of the selected handles to flip the layers.
To flip multiple group layers, they have to be placed under another group.

TechnoTween
How to Align Objects
You can align objects ins Synfig by using Guides and the Grid.
Aligning Using the Grid
1. Click View in the Menu bar.
2. Click both Show Grid and Snap to Grid to enable them.
3. Click a layer to select it.
4. Click and drag a handle near one of the lines of the grid to snap it and have it move along the lines.
To move the whole object either click and drag on the green position handle or press Ctrl + A after
selecting the layer.
Aligning Using Guides
1. Click View in the Menu bar.
2. Click Snap to Guide to enable it.
a. Show Guide should be enabled by default, click it if it is not.
3. Click one of the rulers in the Canvas window and drag the cursor towards the canvas to create a guide.
a. You can have multiple guides and a guide can be moved after it has been created. Click and
drag on the guide to move it elsewhere.
4. Click a layer to select it.
5. Click and drag a handle near one of the guides to snap it and have it move along the line.
6. DO NOT SAVE CHANGES. EXIT SYNFIG.

Session 2
Blast Off into Outer Space
In this session, students continue to create scenes for their animated space
adventure. This time they have their character blast off into space and fly the
ship across the galaxy using motion tweens. The fun begins when students learn
how to move an object across the stage and transform the image by changing
the scale and orientation. Once these skills are mastered, students animate the
ship flying across the sky. The session ends with students selecting an Animation
Challenge and creating it using a Motion Tween.
Assignment 6: What is a Motion Tween?

Assignment 7: Create Scene 2 – The Planet
Assignment 8: Create Scene 3 – The Hover Craft
Assignment 9: Create Scene 4 – Blast Off
Assignment 10: Create Scene 5 – In Outer Space
Assignment 11 (Optional): Create Scene 5 – In Outer
Space
Session 2 Review: About Motion Tweens

Session 2 Skill Review: Alien Ship
Assignment 6: What is a Motion Tween?

In this assignment, you learn about motion tween animation.
What is a Motion Tween?
One of the reasons the computer is used to create animations is because it is much easier than drawing
each object by hand. In the old days, each change in the object had to be drawn and then sequenced
together to show movement. However, today the software can do much of the work for the animator.
One way the computer helps animators is with a feature called tweening. Tweening is short for "in
between" and refers to filling in the frames between two frames so that an object displayed in the first
frame changes into the object displayed in second frame.
Tweening is a faster way to animate than using frame-by-frame animation. It allows frames to be spaced
very far apart in the Timetrack, and then the content in the frames between the Keyframes are
automatically created by the computer. A tween is what happens "between" frames. The content of the
tween frames is decided by Synfig but can still be edited and manipulated as needed.
A popular tween is a motion tween. A motion tween is a type of animation that moves an object from one
position to another over a period of time. When creating a motion tween, the starting position and size of
the object is set into a frame on the Timetrack. Then the ending position and size of the same object is set
into another frame on the Timetrack. Synfig then automatically creates the content between the two
frames to have the object MOVE from the start point to the end point.
A motion tween can move an object horizontally, vertically, or diagonally across the canvas. It is also a
great way to have objects rotate in a circular fashion clockwise or counterclockwise. This is because the
animation with a motion tween is very smooth.

TechnoTween
Study the Motion Tweens
You are going to watch the Out of this World sample. Several scenes use Motion Tweens. Answer the
questions about each scene.
 Open the Synfig folder. You may need to ask your teacher where this is located. Double click the Out
of this World document to watch the animated story.
The Alien
1. What different events occur in the animation?
The Hover Craft
2. How would you describe the animation of the hover craft in this scene?
 Close the file.

Assignment 7: Create Scene 2 – The Planet

In this assignment, you are going to continue to create an animated space adventure. You will add a new
scene to the space story you have already started.
1. View each scene in the story.

2. Copy the alien from the previous scene.
3. Animate the ground appearing using motion tween.
4. Animate grass growing using motion tween.
5. Animate a flower blooming using motion tween.
6. Add text to describe the scene.
Open Synfig
View Each Scene in the Story
 Scene 1 has not been deleted. It is still part of the animated story. You can easily switch from Scene 2
to Scene 1 and back again. Try it!
 Click File from the menu, then Open.
 Find the Synfig file for the first scene and open it.
This will add a tab in the window that can be clicked on to switch between documents.

TechnoTween
Copy the Group Layer for the Alien
In the previous session, you created an alien and placed it into a group. Synfig
lets you copy layers between documents. You are now going to copy the
alien from scene 1 to the empty document for scene 2.
 Expand the group for the second still picture in the Layers panel.
 Right click on the group for the alien and click Copy.
 Click the tab of the empty document.


 Click Edit from the file menu, then Paste.
Draw the Ground Using Motion Tween
You are going to have the ground gradually appear underneath the alien using
motion tween. Unlike the previous session, when you changed the amount of an
object/layer between frames, this time you will change the position.
 Right click the alien layer and click New Layer ► Geometry ► Solid Color.
With the Solid Color layer selected, click Lower Layer until it is under the alien layer.
 Select the Draw Tool.
 Select Create Region Layer and deselect all other Layer Types.
 Change the Fill Color to brown.
 Draw the ground under the feet of the alien.



 Click Lower Layer so that the alien’s layer is above the ground’s.
 Rename the layer Ground.
Move the Ground
 Click the ground layer to select it.
 Move down the Timetrack to 12f.


 Click the Keyframe tab.

 Click Add New Keyframe.


 Move back to 0f.


 Press Ctrl+A to select all of the handles of the ground.

 Select the Transform Tool.


 Click and drag the ground to the left and out of the canvas.
There is a keyframe on 0f by default so there is no need to click Add New
Keyframe.


















 Turn Off Animate Editing Mode.

TechnoTween
Draw the Grass Using Motion Tween
Follow the instructions to make the grass grow all at once.
 Change the Outline and Fill Color to green.
 Draw several blades of grass sticking out of the ground.
Draw the blades of grass as lines that are slightly curved. This will allow the region layer to fill a small
space and make them look more appealing.
 Group the blades of grass together and rename the group Grass.
 Click Lower Layer until the group is under the ground layer.
Make the Grass Grow


 Click the Keyframe tab, then Add New Keyframe.





 Click and drag on the green handle and move the grass downwards until it is out of the canvas.

 Right click the waypoint created at 0f and click Remove.

This waypoint is created because the previous keyframe at 0f remembers the position of the grass at
24f. Deleting it will make the keyframe remember the grass’ position at 12f instead.
This will keep the grass from moving into the scene before the ground does.

 Turn off Animate Editing Mode.

Draw a Flower Blooming Using Motion Tween
Follow the instructions to make the flower grow.
Draw the Stem




 Select Create a Outline Tool and deselect all other Layer Types.

 Change the Outline Color to Green.

 Draw the stem.

 Rename the layer Stem.
Draw the Center of the Flower
 Click the Circle Tool.


 Select Create Circle Layer and deselect all other Layer Types.

 Change the Fill Color to yellow.

 Draw the center of the flower.

 Rename the layer Center.
Draw the Petals


 Select Create Region Layer and deselect all other Layer Types.

 Change Fill Color to pink.

 Draw five petals.

 Rename the layers as Petal 1, Petal 2, etc. as you draw them.
Keep the petals smaller than the center of the flower.


 Select the petal layers and click Lower Layer to put the petals under the center layer.

 Group the Stem, Center and Petals, and rename the group Flower.

TechnoTween
Make the Flower Bloom
 While at 48f, click the Keyframe tab and click Add New Keyframe.
 Expand the flower group.
 Click one of the petals and press Ctrl + A.
 Move the petal into the center of the flower.
 Do the same for all petals.
 Click the Keyframe tab and click Add New Keyframe.
 Click the flower group to select it.
 Right click on the waypoint on 24f and select Remove (Number) Waypoints.
This functions like Remove but it is identifying multiple waypoints because multiple handles were used to
move the petals into the center. This is also why the exact number it identifies may be different for you.
 Click the green handle of the flower group and drag it downwards until the flower is out of the canvas.
 Right click the waypoint created at 12f and click Remove.

Add Text
 Select the Text Tool.
 Check Multiline Text.
 Change the horizontal and vertical size.
 Click on the canvas and in the dialog box type:
The alien looked around him.

Each day was the same. The grass grew and the flowers bloomed.
He wanted to see something different.
 Click Canvas from the menu bar, then properties.
 Under the Time tab, change the End Time to 72 and click OK.

 Watch your story by pressing Ctrl + P and/or selecting File from the menu bar and clicking Preview.
Save the Synfig Document
 From the File menu, select Save.
Exit Synfig

Assignment 8: Create Scene 3 – The Hover Craft

You are going to apply what you know to make a new scene that shows the alien driving in his hover craft.
You will use motion tween to show it going over the bumpy terrain.
Open Synfig
Create the Hover Craft and then Animate the Object
Draw the Planet Surface


 If the Fill Color is not already white, change it to white.
 From the Layer menu, click New Layer ► Geometry ► Solid Color.
Make sure that the Fill Color is set to white.

 Select the Draw Tool.


 Select Create a Region Layer and deselect all other Layer Types.

 Change Fill Color to dark red.

 Draw the surface of the planet.
Make the surface of the planet bumpy.

TechnoTween
Create the Hover Craft and then Animate the Object
Draw the Hover Craft




 Select Create a Region Layer and deselect all other Layer Types.

 Select Create a Outline Layer and Create a Region Layer and deselect all other Layer Types.

 Change the Outline and Fill Color.
 Draw rectangles that will form the hover craft.
Make the surface of the planet bumpy.
 Group the rectangles together, then name it Hover Craft.
Animate the Hover Craft
 Select the Transform Tool. 


 Click and drag on the green handle and move the hover craft to its starting position on the left side of
the canvas.

 Turn on Animate Editing Mode.

 Move down the Timetrack to 48f.

 Move the hover craft to the right side of the canvas.

 Click the Keyframe tab and click Add New Keyframe.

 Move back to 4f.

 Click and drag on the green handle and move the hover craft upwards slightly.

 Move to 8f and drag the hover craft downward slightly.

 Every 4 frames move the hover craft up or down as if it is driving over the bumpy terrain.

Add Words to Describe the Action on a New Layer


 Change the horizontal and vertical size of the

 Click on the canvas and in the dialog box type the words:
He got into his hover craft and drove to the launch pad.
Open the Synfig Document and Display Scene 3
 From the Canvas menu, click Properties then the Time tab and change the End Time to 48f.

 Click File from the menu bar.
Change the quality to 1.0 and FPS to 24.


 Watch the scene.
 Click the Close button to exit the preview window.
Save the Synfig Document and Close the Program
 From the File menu, click Save.


 From the File menu click Exit.

TechnoTween
Questions About Motion Tweens
1. What is a motion tween?
2. What is tweening?
3. What direction can a motion tween move an object?
Study Motion Tweens
You are going to watch the Out of this World sample. Two more scenes use Motion Tween animation.
Answer the questions about each scene.
 Open the Animate folder. You may need to ask your teacher where this is located.
 Double click the Out of this World document to watch the animated story.
Blast Off
4. How does the size of the Spaceship change?
5. What direction does the Spaceship fly?
In Outer Space
6. How does the size of the Spaceship change?
7. How are the stars moving?

Assignment 9: Create Scene 4 – Blast Off

In this assignment, you are going to continue creating your animated space
adventure. You will add a new scene of a spaceship blasting off. The movement
of the spaceship flying into space will be created using a motion tween.
1. Create a new document.

2. Draw a spaceship.
3. Animate the spaceship using a motion tween.
4. Draw the background.
5. Add text to describe the action.
Open Synfig
Draw a Spaceship
You are now going to draw a spaceship.


 Use the Transform Tool to turn the circle into more of an oval.

 Use the Draw Tool to add details to the spaceship to make it look more appealing.

 Arrange and group the different layers, then name the group Spaceship.

TechnoTween
Animate the Ship Using a Motion Tween
You want the spaceship to look like it is flying away from the planet. To do this you will place the ship near
the bottom of the canvas at the start point. You will then create a motion tween by turning on Animate
Editing Mode and positioning the ship at the top of the stage at the end point. You will then adjust the
path and size of the ship to make it look like it is flying.
Create a Motion Tween


 Position the spaceship near the bottom of the canvas on the left.



 Move the spaceship to the top right corner of the canvas.

 Click the Keyframe tab, and Add New Keyframe.

 Click and drag back and forth along the Timebar to see the spaceship fly.
Change the Flight Path



 Move the spaceship to the right side of the canvas.
A waypoint will be created in the Timetrack at 25f.

Resize the Spaceship
When the spaceship flies away it needs to be made smaller to look like it is getting farther away. You need
to move to the frame with the END POINT OF THE ACTION in the Timetrack before you edit the ship. This will
make certain you are not changing the content of the wrong frame.
 Move to 50f in the Timetrack.
Select the Transform Tool.
 Click the orange handle and drag it inwards, towards the green handle, to scale the spaceship down.
Change the End Position of the Object
 Move the ship to the center of the canvas.
View the Animation
 Move back to 0f. Watch the animation by pressing Ctrl + P.

TechnoTween
Make the Spaceship Blast Off


 Move to 50f and move the spaceship back to top right corner of the canvas.

 Click and drag on the blue handles to rotate the spaceship so that it is tilted upwards.

 Move back to 37f and move the spaceship to the left.
The spaceship follows a straight path from position to position. To give its path an arc and make the
animation look more appealing, move between the waypoints in the Timetrack and move the
spaceship up or down slightly.



Solve the Problem to Create a Background
You need a background that contains the ground and any other objects you want to put in the sky. When
you are just starting out learning Synfig Studio, it is a good idea to keep objects you have animated in their
own group. That way you can keep all the objects organized and you won't get confused. For this reason,
you are going to draw the background and put it in its own group. However, when you do this you may
find you have a problem. Can you solve it?
What is the Problem?
 Change Fill Color to what you want your sky to look like.
 Click New Layer, from the Layer menu, then Geometry ► Solid Color.
 Group the Solid Color Layer, then name it Background.
1. What is the problem?
Solve the Problem
Layers set the stacking order of objects. The bottom layer is the bottom of the canvas and the top layer is
at the top of the canvas. Since the spaceship group is on the bottom layer, the object you just drew is
hiding it from view. To solve the problem, you need to rearrange the layers.
 Click on the spaceship group to select it.
 Click Raise Layer.
 Expand the background group and click on the Solid Color layer to select it.
Selecting a layer inside the group will keep objects you create inside of it.
 Complete the background by drawing the ground and other details, like moons or planets in the sky.

TechnoTween
View the Canvas in Onion Skin View
Onion skin view lets you see objects on a layer as an outline or as a dimmed image. By dragging the
playhead past a keyframe you can see the position of an object at the last keyframe. Onion Skin View is a
great way to position other objects onto the stage.
 Click the spaceship group to select it.


 Click the onion icon near the top right of the canvas window.

 Move down the Timetrack past 0f. Notice how the ship is transparent and showing you where the ship
was at 0f.


 To view where the ship is at other frames in this view, move up or down the Timetrack to the desired
frame and click Add New Keyframe.

 When you are finished turn off the Onion Skin view by clicking the onion icon again.

Add Words to Describe the Action
 Check Multiline Text and change the horizontal and vertical size of the text.
 Click on the canvas, and in the dialog box type the words::
The alien got into his ship. He flew off into space in search of adventure.
 Select the Transform Tool and position the text as needed.
 Click Properties, from the Canvas menu and change the End Time to 50f.
 Play the animation.
HINTS: To fill an object with a gradient:

1. Select the Gradient Tool.
2. Pick a Layer Type depending on the
Save the Synfig Document kind of gradient you want.
3. Change the Fill and Outline Color.
4. Click and drag on the canvas to draw
 From the File menu, select Save. a gradient.
5. Click on the gradient layer so that it is
the only one selected.
6. Click on Blend Method in the
Exit Synfig Studio
Parameters tab and change it to
“Onto”.
7. Group the gradient and the layer/s you

want to apply it to.
- It will work on both Region and
Outline layers as long as the
gradient layer is above them.

Assignment 10: Create Scene 5 – In Outer Space

You are going to apply what you know to make a new scene that shows the alien
driving through space. Using a motion tween, you will make the spaceship fly across
the sky and become bigger.
Open Synfig
 Click Open, from the File menu.
 Find and select the previous scene.
Copy the Spaceship Group
 Click on the spaceship group from the previous scene to select it.
 Right click and select Copy.
 Click the tab of the new document, and click Paste in the Layers window.
Synfig will copy the waypoints, and therefore the animation, of the group as well but not the
keyframes.
 Right click on the waypoints in the Timetrack and click Remove.

Move up and down the Timetrack to make sure the spaceship is no longer animated.
Make the Spaceship Fly


 Move the ship to its starting position near the top left corner of the canvas.

 Resize the ship to make it smaller.



 Position the ship near the bottom right of the canvas and increase its size.


TechnoTween
Create a Space Background
 Click New Layer, from the Layer menu, then click Geometry ► Solid Color.
Change the Fill Color to change it to the color of space before creating the layer.
 Group the Solid Color Layer, then name it Background.
 Click Lower Layer to bring it below the spaceship group.
 Expand the group and add details such as moons and planets to complete the background.
 Change the horizontal and vertical size of the text.
 On the Words layer click on Frame 1.
 Click on the canvas, and in the dialog box type the words:
He voyaged far from his planet.
 Use the Transform Tool to adjust the position of the text as needed.
 Move the text layer below the spaceship group.
 Click Properties, from the Canvas menu and change the End Time to 48f.
Preview the Animation
 Click Preview, from the File menu.
 Set the Quality to 1.0 and FPS to 24.
 From the File menu, select Save and then select Quit.

Assignment 11: (Optional) Motion Tween Animation Challenge

You have learned how to animate objects using a motion tween. Below are two Animation Challenges.
Pick one and try it!
 Click Open Recent, from the File menu and open the document of Scene 5.
Motion Tween Animation Challenge 1: Spinning Star
In this challenge, you apply what you know to make a star turn.
Steps
1. Select the Star Tool.
2. Select Create a Star Layer and deselect all other Layer Types.
3. In the Tool Properties panel, change the number of Star Points to 5.
4. Change the Fill Color to what you want your star to look like.
5. Click and drag on the canvas to draw a star.
6. Turn on Animate Editing Mode.
7. Click on the Star in the Layers panel to select it.
8. Move down the Timetrack to 24f.
9. In the Parameters panel, find Angle and change the value to 360.
Remove the waypoint created at the keyframe at 48f.
10. Right click on the star layer and select New Layer ► Time ► Time Loop.
11. Group the star layer and the time loop layer together and bring the group below the spaceship layer.
12. Preview the animation. The star should continue to turn until the animation ends.
13. You can duplicate the group and move or resize the stars to make more, but make sure to turn off
Animation Editing Mode before you do.

TechnoTween
Motion Tween Animation Challenge 2: Flying Comet
In this challenge, you apply what you know to make a comet fly across the sky.
Steps
1. Use the Circle Tool to draw the main part of the comet.
2. Use the Draw Tool to draw the fiery tail of the comet.
3. Arrange and group the parts of the comet and rename the group Comet.
4. Decrease the size of the comet.
5. Position it near the top right corner, outside of the canvas.
8. Increase the size of the comet.
9. Position it near the bottom left corner, outside of the canvas.

Session 2 Review: About Motion Tweens
Match the term to its definition.
1. tweening A. a view that allows you to see an object’s position

at a previous keyframe
2. motion tween B. filling in of frames between two other frames
3. onion skin C. type of animation that moves an object from one

position to another over a period of time
/3
Circle whether the statement is TRUE or FALSE.
6. An object must be in a group for a motion tween to be applied to it. TRUE FALSE
7. Onion skin view shows objects as an outline. TRUE FALSE
8. A motion tween can be used to rotate objects. TRUE FALSE
9. Layers can be moved up or down by pressing the ENTER key. TRUE FALSE
/4
Answer the questions.
1. What are the advantages to using a motion tween?
/2
2. Why would you want to view the stage in onion skin view?
/1
TOTAL: /10

Session 2 Skill Review: Alien Ship

A motion tween can be used to MOVE objects from one location to another. Apply your knowledge to
create an alien ship.
1. Open Synfig.
2. Draw a spaceship using the drawing tools.
3. Arrange and group the parts of the ship.
4. Position the ship near the top right corner of the canvas.
Use the Transform Tool to resize the ship and make it look small.
7. Position the ship in the bottom left corner of the canvas.
8. Use the Transform Tool to resize the ship and make it look larger.
9. Create a keyframe at 24f.
10. Change the flight path of the ship by moving up the Timetrack and moving the ship in any of the
frames between 0f and 24f.
11. Change the End Time to 24f.
12. Save the file as alien ship and exit Synfig.

TechnoTween

Session 3
The Strange Planet
In this session, students animate the adventures that happen on a strange
planet. Using shape tweens, they transform an oval into a rectangle to illustrate
the unusual moon in the sky. Afterwards they apply shape tweening to show an
alien life form talking. The session ends with students selecting an Animation
Challenge and creating it using a Shape Tween.
Assignment 12: What is a Shape Tween?

Assignment 13: Create Scene 6 – A Strange Moon
Assignment 14: Create Scene 7 – Alien Friend
Assignment 15: (Optional) Space Tween Animation Challenge
Session 3 Review: About Shape Tweens

Assignment 12: What is a Shape Tween?

In this assignment, you learn about shape tween animation.
What is a Shape Tween?
In Synfig, you use tweening to animate objects. Tweening is short for "in between" and refers to filling in
the frames between two other frames so that an object displayed in the first frame changes into the
object displayed in the second frame.
In the previous assignment you learned how to create a motion tween, a type of animation that moved
an object from one position to another over a period of time. This type of tweening can be used to make
a spaceship fly across the sky or stars spin.
A shape tween is a different type of animation. It transforms an object from one shape
into another over a period of time. By tweening shapes, you can create an effect
similar to morphing. A shape tween can not only change the shape of an object but it
can also be used to alter the size, opacity, color and location.
When creating a shape tween, the starting shape is set and later down the Timetrack the object is
transformed. Synfig then automatically creates the content of the frames between the two states of the
object to have the it morph from the start shape to the end shape.

TechnoTween
Study Shape Tweens
You are going to watch the Out of this World sample. Two scenes use Shape Tween animation. Answer the
questions about each scene.
 Open the Synfig folder. You may need to ask your teacher where this is located.
 Double click the Out of this World document to watch the animated story.
A Strange Moon
1. How does the moon in the sky change?
Alien Friend
2. How does the alien's mouth change?
 Close the file.

Assignment 13: Create Scene 6 – A Strange Moon

In this assignment, you are going to continue to create an animated space
adventure. You will add a new scene to the space story you have already started.
This scene will have the alien standing on the new planet with a shape shifting
moon in the sky. The morphing of the moon will be created using a shape tween.
1. Create a new document.
2. Draw a moon.
3. View the animation in onion skin view.
4. Change the shape of the moon to a diamond.
5. Duplicate the waypoint at the start to reverse the animation.
6. Group the moon with a Time Loop layer to make the animation repeat.
7. Add words to describe the action.
Open Synfig
Draw the Two Shapes of the Moon
You are now going to draw a moon.


 Select the Circle Tool and select Create a Region Layer as the only Layer Type.
 Change the Fill Color, then draw the first shape of the moon.
 Use the Transform Tool to click and drag on the handles of the circle to change its shape.
Use the Onion Skin View to see a dimmed image of the moon's first shape. Keep the moon's second
shape around the same size as the first one.

TechnoTween
View the Shape Tween
 Drag the cursor left and right along the Timebar to view how the moon morphs from one shape to
another.
Make Changes to the Final Shape
 Using the Transform Tool , right click on the orange handles and click Split Tangents.
The yellow handles, which are tangent handles, move together by default. Splitting the tangents allows
you to move them one at a time and gives you more ways to edit the shape of an object.
 Click and drag the handles to turn the second shape into a diamond.
Solve the Problem to have the Moon Return to its Initial Shape
The moon should change from a circle to a diamond and then back into a circle. You could
move down the Timetrack and turn the diamond back into a circle. However, there is a faster
way. Follow the instructions to duplicate the waypoint and reverse the action.


 Right click on the waypoint at 0f and select Duplicate.

Morph the Moon Repeatedly
You can have the moon morph repeatedly by grouping the moon layer with a Time Loop layer. Try it!
 Click on the moon layer to select it.
 Right click and select New Layer ► Time ► Time Loop.
 Group the Time Loop layer with the moon layer.
 Select the Time Loop layer and in the Parameters panel change the duration to 50f.
The End Time of the scene should be greater than the number of frames it takes to complete the
animation.
Create a Background
 Create a sky using a Solid Color layer.
 Bring it below the moon layer.
 Use the Draw Tool to create the landscape of an alien planet.
 Group the landscape and the sky together and rename the group Background.

 Copy the layers of the alien and the ship from the scenes that have them and paste them onto this
scene.
Click on the copied layers and remove any waypoints they might have.
 Position the alien and the ship above the background and decrease their size to show them landing
on the planet.

TechnoTween
 Using the Text Tool type the words:
The alien landed on a faraway planet. It was a strange place.



 If necessary, you may need to split the text into two lines. Check the Multiline option in the Tool
Properties panel when using the Text Tool and press Enter after when typing in the dialog box to put
text on a different line.
 Use the Transform Tool or go to the Parameters panel to change the size of the text, if needed.
Test the Scene
 From the Canvas menu, click Properties and change the End Time to 100f.

 From the File menu, select Preview.
 View the animation.

Click on the Loop icon to watch the moon morph continuously.
 Close the preview window.
Save the Synfig Document and then Close the Program
 From the File menu, select Save. Then select Quit.

Assignment 14: Create Scene 7 – Alien Friend

You are going to apply what you know to make a new scene that shows the alien
meeting a new friend. Using a motion tween, you will make the alien's mouth move to
look like it is talking.
Open Synfig
Create an Alien Friend
You are going to edit the alien you have in Scene 1 to create an alien friend. This friend will
be a different color than the one in the first scene and the mouth will move.
 Double
 Open Scene 1.
 Expand the group of the second still picture and copy the Alien group.
 Click on the tab of the new document and, in the Layers panel, click Paste Layer twice.
 Use the Transform Tool to position the two aliens next to each other.
 Change the name of one alien group to Alien Friend.
 Use the Fill Tool to change the color of the friend.
 Expand the alien friend's group to edit the outline and region layers, as well as add new details.
 Select the mouth of the alien friend and click Delete Layer.

TechnoTween
Draw the Two Shapes of the Mouth
 Select the top most layer in the alien friend's group.
 Use the Draw Tool to draw a mouth.
 Use the Transform Tool to adjust the mouth shape as needed.
 Rename the layer Mouth.
Create a Shape Tween to Morph the Mouth from One Shape into Another
 With the mouth layer selected, move down the Timetrack to 15f.
 Turn On Animate Editing Mode.


 Use the Transform Tool to change the mouth's shape to make it look like the alien friend is talking.

 Turn On Animate Editing Mode.
The second shape can eaither look more open or more closed depending on how you drew the first
shape.

Have the Mouth Return to its Initial Shape
The mouth should change back to its original shape.
 Right click the waypoint at 0f and select Duplicate.

If there is more than one waypoint, right click the one aligned to Vertices in the Parameters tab.
 Click Add New Keyframe.
Morph the Mouth Repeatedly
Just like the moon in the previous scene, you can have the mouth morph repeatedly by grouping it with a
Time Loop Layer. Try it!
 With the mouth layer selected, right click and select New Layer ► Time ► Time Loop.
 Group the Time Loop layer with the mouth layer.
 From the Canvas menu, click Properties and change the End Time to 60f.
Create a Background
Create a sky using a Solid Color layer.


Bring it below the alien friend layer.

Use the Draw Tool to create more landscape of the alien planet.

Group the landscape and the sky together and rename the group Background.

TechnoTween
 Use the Text Tool to type the words:
The alien met a new friend.


Test the Scene


Assignment 15: (Optional) Shape Tween Animation Challenge

You have learned how to animate objects using a shape tween. Below are two Animation Challenges.
 From the File menu, click Open or Open Recent and select the document for Scene 7.
Shape Tween Animation Challenge 1: Morphing Sun
In this challenge, you apply what you know to make a sun turn into a star.
1. Use the Circle Tool to draw a sun on the canvas.

a. Select Create a Region Layer and Create a Outline Layer. Deselect all other Layer Types.
b. Change the number of Spline Points to 10.
c. Group the region and outline layer, then name the group Sun.
4. Use the Transform Tool to transform the circle into a star.
a. Turn on Onion Skin to keep the original size and shape of the sun in view.
b. Right click on the orange handles and click Split Tangents.

6. Duplicate the waypoint at 0f to have the star morph back into a circle.
7. Preview the animation.

TechnoTween
Motion Tween Animation Challenge 2: Shape Shifting Body Part
In this challenge, apply what you know to make a body part such as a tail,
antenna, or claws change their shape on the alien friend.
1. Click New Layer at the bottom of the Layers area. Rename the layer Body Part.
2. Select the top most layer in the group.
3. Use the Draw Tool to draw a heart on the alien friend's chest.

6. Use the Transform Tool to morph the heart into a different shape.
8. Duplicate the waypoint at 0f.
9. Create a Time Loop layer and group it with the heart layer, then name it Heart.
a. Change the duration of the Time Loop layer to 30f in the Paramters panel.
 From the File menu, select Save. From the File menu, select Exit.

Session 3 Review: About Shape Tweens
Across
1. A type of tween that moves an object from one position to another over a period of time.
2. A type of tween that transforms an object from one shape into another over a period of time.
3. It allows the user to make Synfig remember the state of the animation at a certain frame and to tell
the program to take that frame into account when creating waypoints.
Down
4. A view that allows you to see the position of an object at a previous keyframe as a dimmed image.
5. A layer that repeats the animation of the object/layer it is grouped with.
6. The shortcut for playing the animation in the document is _____ + P
7. It Tweening is short for "in between" and refers to filling in the frames between two frames.

TechnoTween

Session 4
Coming Home
In this session, students create the final scenes in their space adventure. In these
scenes, the alien returns home. Using the Skeleton Layer, aliens are animated to
dance in one scene. In the remaining scenes, a motion path for the spaceship
is made to look like it is blasting off from the surface, and then it does a loop in
the sky before landing back on the home planet. The session ends with students
selecting an Animation Challenge and creating it using a Motion Path
Animation.
Assignment 16: Create Scene 8 – Dance Party

Assignment 17: Create Scene 8 – More Dancing
Assignment 18: What is a Motion Path?
Assignment 19: Create 9 – Blast Off from Planet
Assignment 20: Create 10 – Land Back Home
Assignment 21: (Optional) Motion Path Animation Challenge
Session 4 Review: About Motion Paths

Session 4 Skill Review: Worm Creature
Session 4 Extension Activity: Keyboard Shortcuts
Assignment 16: Create Scene 8 – Dance Party

In this assignment, you are introduced to the Skeleton Layer. The Skeleton layer allows
you to create bones, making it possible to generate an animated sequence by creating
a string of poses. Using the Skeleton layer can take a bit of skill to make objects move
realistically. Do not become frustrated; be patient and have fun!
1. Draw a simple shape man using the Circle, Rectangle and Spline tools.
2. Use a Skeleton layer to add bones onto the figure.
3. Link the parts of the simple shape man to the bones.
4. Set the starting pose of the figure.
5. Reposition the arms and legs to create a sequence of poses to make it look like the figure is dancing.
Open Synfig
Draw a Simple Shape Man
The shapes can be made using the Rectangle , Circle , or Spline tool. The Skeleton layer
can be used on grouped objects.
 Draw a simple shape man using Rectangle, Circle and Spline tools.
Keep Region layer selected so all shapes have fill.
 He should have the following body parts:
Head, Body, Upper Arms, Lower Arms, Hands, Thighs, Legs, Feet.
 Group and arrange the parts as they are created and rename them accordingly. You can Duplicate
and Mirror the arms and legs to keep them similar.
Draw shoulders, hips and a neck, and group them with the body.

TechnoTween
Add Bones to the Shape Man
The Skeleton layer allows you to add bones which can influence other layers. The most important decision
you need to make when adding bones is where to place the first bone. The first bone becomes the root
bone of the skeletal system. All the bones connect from this point. In the case of the shape man the first
bone is going to be at the body.
 Right click on the top most layer in the Layers panel and click New Layer ► Other ► Skeleton.
 Click and drag on the green handle of the bone that appears on the canvas and position it at the
top of the body just before the neck.
 Click and drag on the orange handle to extend the bone down towards the hips.
 Right click on any of the bone's handles and click Create Child Bone.

 Position the green handle of the new bone at the bottom part of the head, just before the neck, and
extend the bone to the top of the head.
 For the arms and legs, right click on a handle of the first bone and Create Child Bone.
 Position the green handle where the upper arm or thigh meets the shoulder or hip, respectively,
and position the orange handle of the bone just above the lower arm or leg.
 Right click on a handle of the previous bone and Create Child Bone.
 The green handle of the bone will be right after where the previous one stopped, so simply position the
orange handle just above the hand or foot.

 Repeat the last two steps to create bones for the hands and feet.

Link the Shape Man to the Bones
 Click the body layer in the Layers panel and Ctrl + click the Skeleton layer
 Ctrl + click the green handle of the group layer and the green handle of the first bone, then right click
the green handle of the bone and select Link to Bone.
Test if it works by moving the green handle to change the body's position or moving the blue handle to
rotate it.
 Click the head layer and Ctrl + click the Skeleton layer, then link the head group to the head bone.
When the body bone is moved or rotated both the body and head shapes should move since the
head bone is a "child" of the body bone
 Link the other body shapes to their respective bones.
Animate the Shape Man to Dance
Now that the shapes have been linked to their respective bones, you can animate the shape man by
animating the skeleton. When moving the “parent” of a bone, the “child” bone moves as well, making it
easier to animate.
 Using the Transform Tool , position and rotate the bones to put the shape man into a starting pose.
 With the Skeleton layer selected, change the pose to a different dance step.
 Move down the Timetrack to 32f, then duplicate the waypoint at 0f.
This is to make the animation loop so the shape man looks like they are dancing continuously.
 Click Add New Keyframe at 16f and 32f.


 Add more poses and steps between the keyframes to make the dance look more interesting.

 From the Canvas menu, click Properties and change the End Time to 96f.

TechnoTween
Loop the Dancing Animation
 Right click the Skeleton layer and click New Layer ► Time ► Time Loop.
 In the Paramters panel, change the Duration to 32f.
Move down the Timetrack past 32f to make sure the animation is looping.
 Click the Time Loop layer and Shift + Click the layer at the bottom of the Layers panel.

 Click Group Layer and name the group Dancing Man.
Edit the Grouped Shape Man
 Use the Transform Tool to resize, skew and rotate the shape man.
 Change the color of the shape man by adding a Solid Color layer above the top most body part in the
group and changing its Blend Method in the Parameters panel to Straight Onto.
 Duplicate the group to create more dancing shape men.
Resize the dancing shape men as needed so they all fit in the scene.
Create a Background
 Create a Solid Color Layer outside of the group for the sky.
 Use the Draw Tool to create an alien landscape.
 Group the sky and the alien landscape and name the group Background.
 Move the background to the bottom of the Layers panel.
The new friend had a party for the alien. There was lots of
dancing.
Test the Scene


TechnoTween
Assignment 17: Create Scene 8 – More Dancing

In this assignment, you continue to create animated sequences with the Skeleton
layer.
Open Synfig
Draw a Head, Body, Hip, Arm, Leg, Hand, and Foot
1. Draw the head:
a. Select the Rectangle Tool .

b. Select Create a Region Layer and Create a Outline Layer. Deselect all other Layer Types.
c. Draw a rectangle for the robot's head.
d. Use the Circle Tool to draw the robot's eyes and use the Draw Tool to draw the robot's mouth.
e. Group the eyes, mouth and head, and name the group Head.
2. Draw the body:

a. Use the Rectangle Tool to draw the robot's body.
b. Use the circle tool to draw a neck for the robot.
c. Use your skills to add details to the body to make it look more appealing.
d. Group the body, neck and other details together and name the group Body.
3. Draw the arms:

a. Use the Rectangle Tool to draw the arm segments and the hands.
b. Use the Circle Tool to draw joints between the arm segments and the previous body part.
I.E. Shoulder between upper arm and body, elbow between lower arm and upper arm, wrist
between hand and lower arm.
c. Group the upper arm segment with the shoulder joint, the lower arm segment with the elbow
joint, and the hand with the wrist joint.
d. Duplicate and Mirror the groups to create a second arm.
e. Rename all groups accordingly.
4. Draw the legs:

a. Use the Rectangle Tool to draw the leg segments and the feet .
b. Use the Circle Tool to draw joints between the leg segments and the previous body part.
I.E. Hip between thigh and body, knee between leg and thigh, ankle between foot and leg
c. Group the thigh segment with the hip joint, the leg segment with the knee joint, and the foot with
the ankle joint.
d. Duplicate and Mirror the groups to create a second leg.
e. Rename all groups accordingly.

Add Bones to the Robot
You need to add bones to the robot. The first bone will be in the center of the body just below the neck
joint to form a spine.
 Right click on the top-most layer in the Layer Panel and click New Layer ► Other ► Skeleton.
 Use the Transform Tool to position the green handle of the bone just below the neck joint.
 Position the orange handle above the hip joints.
 Right click on any of the spine's handles and click Create Child Bone.
Do this five times, one for the head, two for the upper arms and two for the thighs.
 Position the green handle of the child bones in the middle of the joints that connect to the body.

 Position their orange handles such that the bone ends before the joint of the next body part.
Move the spine. All of its child bones should change position along with it.
Create Arm and Leg Bones
 Right click on a handle of one of the upper arm or thigh bones and click Create Child Bone to make a
bone for the lower arm or leg.
 Position the green handle of the lower arm bone at the elbow or knewe and position the orange handle
such that the bone stops before the wrist or ankle.
 Right click on a handle of the lower arm or leg and click Create Child Bone to make a bone for the hand
or foot.
 Position the green handle of the hand or foot bone at the wrist and position the orange handle such that
the bone stops before the end of the hand or foot.
Do the same thing to create bones for the other arm or leg.

TechnoTween
Link the Bones to the Robot
 Click the group layer of a body part in the Layers panel and Ctrl + click the Skeleton layer.
 Ctrl + click the green handle of the body part and the green handle of the bone created for it.
 Right click the green handle and click Link to Bone.

Test the link by moving the green and blue handles of the bone and seeing if the body part it should be
linked to is also moving.
 Do this for all body parts.
Animate the Robot
 Using the Transform Tool position the robot into a starting pose.
 Make the robot dance.

Make sure the last pose of the animation is the same as the first.
 Right click the Skeleton layer and click New Layer ► Time ► Time Loop.
 Change the duration to match the duration of the animation.
Copy the Robot into Scene 8
 Group the Time Loop, Skeleton and body part layers, then name the group Robot.
 Click Copy Layer in the Layers panel.
 Open Scene 8.
 Click Paste Layer in the Layers panel.
Complete the Scene
 Copy the alien and the alien friend from the previous scene into scene 8.

Assignment 18: What is a Motion Path?

In this assignment, you learn about motion path animation.
What is a Motion Path?
When you create animation sometimes you want the object to move freely around the stage. To create
this type of animation you need to use motion path animation. Motion path animation is a type of
animation in which objects follow a drawn path on a spline layer.
A motion path can be drawn in any pattern on the stage. For example, it can be a
shape, such as a circle, or just a squiggly line. The freedom to create any type of
path helps to create realistic movements. For example, you can have a person run
along on a curvy walkway, a plane fly a loop, or a ball move in an arch pattern
when thrown.
How do you Make a Motion Path?
In Synfig, a motion path is created by drawing a spline, then the position (green) handle of an object/layer
is linked to the spline, making it so that the layer can only move along the path.
Study Motion Path Animation
Watch the Out of this World sample. Two scenes use Motion Path animation. Answer the questions about
each scene.
 Open the Animate folder. You may need to ask your teacher where this is located. Double click the
Out of this World document to watch the animated story.
Blast off from Planet Land Back Home

How does the spaceship How does the
move? spaceship move?

Assignment 19: Create Scene 9 – Blast Off from Planet

In this assignment, you are going to continue to create an animated space adventure.
You will add a new scene to the space story you have already started. In this scene the
alien will fly away in his spaceship. The movement of the spaceship will be created
using a motion path.
1. Draw a motion path.

2. Copy the ship from a previous scene.
3. Center the position handle of the ship group.
4. Link the ship to the spline.
5. Adjust the size and rotation of the ship and notice how the animation changes.
6. Draw the background.
7. Add words to describe the action.
Open Synfig
Create a Motion Path
 Select the Spline Tool .


 Select Create a Outline Layer and deselect all other Layer Types.

 Change the Brush Size to 1pt.

 Draw a curving path onto the canvas.
Click and drag when creating a point to make the spline curve.
 Click Make Spline in the Tool Properties panel to finish the spline.
Make the Spaceship Fly Away
You are going to make the spaceship follow the spline you just created.
Place the Spaceship onto the Motion Path
 Copy and paste the spaceship from Scene 6 into the document.

 Remove any waypoints the spaceship's group layer has.

 Select and expand the group layer.

 Right click the group layer and click Select All Child Layers.

 Press Ctrl+A to select the child layers' handles.

 Click and drag one of the orange handles to move the ship, such that the green handle of the group
layer is at the center of the ship.

TechnoTween
 Click the group layer, then click the green handle.
 Ctrl+click the Spline layer.
 Right click on the dashed line that runs along the spline and click Link to Spline.
 Use the Transform Tool to test if the spaceship can only move along the spline.
Ctrl+click the spline layer to deselect it if you haven't already.
Use Motion Tween to Make the Spaceship Fly
 Position the spaceship at one end of the spline.
 Position the spaceship at the other end of the Spline.
 In the Canvas menu, click Properties and change the End Time to 72f.
 From the File menu, click Preview.
 Change the Quality to 1.0 and the FPS to 24.
 Click Preview.
Make Changes to the Spaceship
You can still change the size of the spaceship to make it look like it is really flying away into the sky.
 Select the spaceship group.
 With Animate Editing Mode on, move to 72f and click and drag the orange handle to decrease the
size of the ship at the end of the animation.
Create a Background
 Select the spline layer.
 Right click and select New Layer ► Geometry ► Solid Color to create the sky for the background.
 Use the Draw Tool to create an alien landscape.
 Group the sky and landscape together, then name the group Background.

The alien started to miss his home. He jumped into his spaceship and flew back to his planet.
TechnoTween

Assignment 20: Create Scene 10 – Land Back Home

Apply what you know to make a new scene that shows the spaceship landing back on
the home planet. Using a motion path, you will make the ship to a loop in the sky.
Open Synfig
Make the Spaceship Fly Down
You are going to add a spline layer. On the spline layer will be the path the spaceship will follow on its
way down.
 Use the Spline Tool to draw a path, going from the upper left part of the canvas to the lower right,
with a loop in the middle.
 Copy the spaceship from a previous scene and paste it into the Layers panel.
Remove any waypoints from the Timetrack that the group has.
 Position the green handle of the group in the center of the spaceship.
 Move down to 60f and animate the spaceship flying down and landing.
 Change the Amount of the spline layer to 0.
Create a Background
 Create a Solid Color layer for the sky and use the Draw Tool to create the ground.
 Group the ground and sky together, then name the group Background.

The alien landed on his planet. He was happy to be home.
 Change the Quality to 1.0 and the FPS to 24.
 Click Preview.

TechnoTween
Assignment 21: Motion Path Animation Challenge

You have learned how to animate objects using a motion path. Below are two Animation Challenges.
Open Synfig
 Open the last scene you were working on, in this case Scene 10.
Motion Path Animation Challenge 1: Rolling Rock
In this challenge, you are going to make a rock creature roll along the ground.
1. Use the Spline Tool to draw a wavy line that has tiny loops that move along the ground.
2. Use the Draw Tool to draw a rock with a face.
a. Group the layers that make up the rock, then name the group Rock.
3. Position the green handle of the group in the center of the rock.
4. Link the rock to the spline.
5. Move down the Timetrack to 50f and animate the rock rolling from one side of the scene to the other.
Motion Path Animation Challenge 2: Walking Alien
In this challenge, apply what you know to make the alien walk away from his ship. You want the action to
start happening AFTER the spaceship has landed.
1. Use the Spline Tool to draw a wavy line from the ship's last position to the other side of the scene.
2. Copy the alien from another scene.
a. Remove any waypoints from the Timetrack that the group has.
3. Position the group below the spaceship in the Layers panel.

4. Position the alien behind the spaceship.
5. Link the alien to the spline.
6. Move down the Timetrack to 60f and Add New Keyframe.

7. Move down to 120f and animate the alien walking from the ship to the other side of the scene.
8. Make the alien invisible until the ship lands.
a. Move to 0f.
b. In the Parameters panel, change the Amount of the alien group to 0.
c. Right click on the waypoint at 0f and click Out ► Constant.
The alien shouldn't be in the scene until the ship has landed.

Session 4 Review: About Motion Paths

Circle the correct answer.
1. What is motion path animation?

a. A type of animation that has an object follow a path on a spline layer.
b. A type of animation that has an object move across the stage vertically.
c. A type of animation that uses either shape or motion tweens.
2. What type of tween is used when making a motion path?

a. Shape tween
b. Motion tween
c. None of the above.
3. How do you create a motion path?

a. Draw a path using the Draw Tool.
b. Draw a path using the Spline Tool.
c. Draw a path using the Brush Tool.
4. To have an object follow a motion path you must:

a. Link the position handle to the spline.
b. Link a vertex handle to the spline.
c. Link a tangent handle to the spline.
5. To have an object change its angle while it follows the path:

a. Use the Transform Tool to move the rotation handle of the object.
b. Use the Transform Tool to move the tangent handle of the spline.
c. Use the Transform Tool to scale the object.
6. You would like to animate a butterfly fluttering. What is the best type of animation to use?
a. Shape tween
b. Motion tween with a Motion Path
c. None of the above.
/6
7. Why would you want to use a motion path?
/1
TOTAL: /7

TechnoTween

Session 4 Skill Review: Worm Creature

A motion path can be used to have an object move freely around the stage. Apply your knowledge to
create a worm creature that slithers along the ground.
1. Open Synfig.
2. Draw a worm creature, group the layers, and name the group Worm.
3. Use the Spline Tool to draw a path going from one end of the canvas to the other.
a. Draw the path, such that the worm will look like it is slithering when it follows it.
4. Position the green handle of the worm group at the center of the worm's body.
5. Link the green position handle of the worm group to the spline.
6. Position the worm on one end of the motion path.
8. Turn on Animate Editing Mode and animate the worm slithering from one end to the other.
9. In the Parameters panel, change the Amount of the spline to 0.
10. Preview the scene.
11. Make adjustments to the creature’s rotation as needed.

12. Save the document as Worm.

TechnoTween

Session 4 Extension Activity: Keyboard Shortcuts

The Animate program has keyboard shortcuts you can use to select a tool or program function quickly.
Try it!
Selecting Tools in the Toolbox
Alt + A Transform Tool Alt + P Polygon Tool
Alt + S Scale Tool Alt + G Gradient Tool
Alt + T Rotate Tool Alt + G Spline Tool
Alt + M Mirror Tool Alt + D Draw Tool
Alt + R Rectangle Tool Alt + K Sketch Tool
Alt + Q Star Tool Alt + Z Zoom Tool
Alt + X Text Tool
File Options
Save Ctrl + S Preview F11

Render F9
Edit Options
Cut Ctrl + X Paste Ctrl + V

Copy Ctrl + C
Undo Ctrl + Z
View Options
Play Ctrl + P Zoom Out Ctrl + -

Pause Escape Best Fit Ctrl + Shift + Z
Zoom In Ctrl + =

TechnoTween

Session 5
Render the Scenes
In this session, students complete their movie. To start, the scenes are rendered
into movie files so they can be watched outside of Synfig Studio. Afterwards,
the scenes are reviewed using a checklist to ensure it is finished. Upon
completion, the scenes are shared with others.
Assignment 22: Render Scenes
Session 5 Review: Animate Word Search

Session 5 Skill Review: Who are You?
Session 5 Extension Activity: Render as a Video
Assignment 22: Render Scenes

Sound can be added to the Timeline. Follow the instructions to add background music to
each scene.
Open Synfig and View Scene 1
 Open Synfig.
 From the File menu, click Open, find and click Scene 1.
Preview the Scene
 Make adjustments and edit the scene before rendering.
Render the Scene
 From the File menu, click Render.
 In Filename, choose the destination of the file and the filename.
 Change the file extension from .png to .avi.
 In Target, click the dropdown menu and select ffmpeg.
 Click Parameters…
 Change the Available Video Codecss to MPEG-4 part 2 (XviD/DivX).
 Change the Video Bit Rate to 2500.


TechnoTween
Watch the Video
 Locate the video and open the file.
 View the video and look for problem areas.
Render the Remaining Scenes
 Open the scene in Synfig.
 Preview and edit it as needed.
 Render the scene with the same settings as the first one.
Render the videos to the same folder.

Do you have time to read the words?
If not, you need to ADD frames to the Timetrack:
1. Click Canvas ► Properties ► and increase the End Time.
Does the scene display itself for too long?
If it does, you need to REMOVE frames:
1. Click Canvas ► Properties ► and increase the End Time.

TechnoTween
Share your Movie with Others
Show your movie to others. Have each person write one thing they really liked about your space adventure
in the space below.
Exit Synfig

Out of This World Marking Sheet

Content
Scene 1: Three static images introduce the story.
Scene 2: A motion tween animates the ground, grass, and flower.
Scene 3: A motion tween is used to illustrate a hovercraft.
Scene 4: A motion tween animates a space ship that reduces in size as it flies away.
Scene 5: A motion tween animates a space ship flying through space that increases.
Scene 6: A shape tween animates a moon that morphs from a circle to a diamond.
Scene 7: A shape tween animates the mouth of an alien friend.
Scene 8: The bone tool animates dancing aliens and a dancing robot.
Scene 9: A motion path animates the spaceship leaving the alien planet.
Scene 10: A motion path animates the spaceship landing back home. /20
Technical Elements
Graphic elements in each scene are well designed. /10
Text is correct and easy to read in each scene. /10
Animation in each scene has realistic movements that are suitable to the purpose. /10
Animation in each scene is well sequenced. /10

The animation of graphic elements plays at a suitable speed and the text is visible for an
/10
appropriate amount of time.
Originality
Design elements are creative and original. /10
TOTAL /80

TechnoTween

Session 5 Review: Synfig Word Search

Find the words. They can be across, down, diagonal, or backwards.
IMPORT RENDER PREVIEW HANDLE LAYER

WAYPOINT AMOUNT PARAMETERS SYNFIG TWEEN
MOVIE DOCUMENT FRAME TIMETRACK PANEL
D O C U M E N T H W M I P S
S J U O I M P O R T F F V W
M O V I E C H K P S V R L A
Z R L P R E V I E W F A H Y
E E A K M O Q T W Y S M X P
S N Y T W E E N G R J E L O
Y D E P A R A M E T E R S I
N E R X B D G P P A N E L N
F R O T F D H A N D L E S T
I E A M O U N T T I C W A L
G X B E T I M E T R A C K H

TechnoTween

Session 5 Skill Review: Who are You?

Follow the instructions to have your name transform into a picture that tells
about you. You will use a SHAPE TWEEN.
1. Open Synfig.
2. Draw an object that tells something about you, such as your interests, hobbies, or likes.
a. Split the object into parts.

b. The number of parts should be equal to the number of letters in your name.

4. Click Add New Keyframe, then move back to 0f.
6. Use the Transform Tool to move and edit the parts of the object into letters of your name.
a. Right click on the parts and click either Insert or Remove Items to add or remove handles that
will help you edit the part.
b. Right click on the orange handles and click Split Tangents to make corners.
8. Save the document as me.
9. Render the document as a movie.


Session 6
Make your Own Movie
In this session, students apply their knowledge to make their own movie. To start,
they select an idea from a list of suggestions. The movie can be an animated
scene, short story, or electronic greeting card. Once students have made a
decision, they use Synfig Studio to create the production, using the hints and
tips provided as a guide. When the movie is complete, it is reviewed using a
checklist, and problem areas are corrected. Once the movie is free from errors, it
is exported as a movie file and shared with others.
Assignment 23: Select an Idea

Assignment 24: Create the Action
Assignment 25: Share the Movie with Others
Session 6 Review: Animate Review

Assignment 22: Select an Idea

You are going to make your own movie using Synfig Studio. It can be about a topic of your choice.
However, it must contain the following:
 simple drawings
 animation: motion tween, shape tween, or motion path
Idea: Make an Animated Scene
The movie should be kept simple to make the task more doable. For example, you could just make an
animated scene. Below is a list of ideas. To see a sample of each scene, look inside the Movie folder
located in the Synfig folder.
Balloon Bye-Bye: A cartoon pump fills a balloon with air using motion tweens. The
balloon gets bigger and bigger. The balloon floats away using a motion path.
To the Moon or Bust: A rocket launches off into the sky using a motion path. A time
loop layer is used to make the rocket flames.
Monkey Eating: A monkey is eating a banana. He moves the banana towards his
mouth using a motion tween and takes a bite using a shape tween. When he does,
the banana gets smaller.
Flat Tire: A car drives down the street using a motion tween. It hits a pot hole and
gets a flat tire.

TechnoTween
Idea: Make a Short Story
If time permits, you can make a simple story, much like the space adventure. Some story ideas include:
 I am Fabulous: Create a simple story that tells about you, such as your likes, personality, or interests.
The story could have the following structure: scene 1, the words "I am Fabulous" are animated using
motion tween animation; scene 2, the words "I like " morph into the actual object; and scene 3,
words describing you are animated using motion paths.
 For Sale: Create an advertisement to sell an item such as food, clothing, or a toy. The story could
have the following structure: scene 1, the character is shown facing a problem; scene 2, the
character is given the product; and scene 3, the character is happy and his problem is solved.
 Out of this World: Create a simple story that has an alien land on earth to get food because it is
"out of this world". For example, scene 1, the alien lands on earth near a restaurant; scene 2, the
alien goes into the restaurant; scene 3, the alien eats the food and then says "This is out of this
world!"; and scene 4, the alien flies away.
Idea: Make a Greeting Card
Synfig can be used to create electronic greetings for friends and family members. You can make a card
to wish someone a happy birthday, good luck, or a good holiday. To see a sample card, look inside the
Movie folder located in the Synfig folder. Below are some ideas for making a card:
 Friendship: A smiling flower gets bigger on the screen. The words, "Our friendship makes me smile"
appear.
 I Love You: A cartoon character appears on the screen such as a dog, teddy bear, or cat.
Animated hearts dance around. The words "I love you" appear on the screen.
Happy Birthday: The candles on a birthday cake flicker using a time loop layer. The
words appear "May all your wishes come true". Then the words "Happy Birthday"
animate across the screen using a motion tween.
Are you looking for more ideas? You can visit the following e-card web sites:
www.123greetings.com
www.bluemountain.com
www.greetingcards.com
What are you going to make your movie about?

Assignment 23: Create the Document

Apply your knowledge to create the action for your movie. Below are some hints and tips
for using the program.
Tips for Staying Organized
 Rename the layers: Group the layers that make up an object, then give that group a meaningful
name. That way you will know what objects are in it.
Tips for Saving Time
 Save often: Save the document whenever you finish doing something important, such as drawing
or animating an object. Use Save As to create a backup of the document before pasting objects
or groups of objects from other douments.
 Duplicate waypoints: Once a waypoint has been created, you can duplicate it to animate the
object returning to the position it is in at that particular waypoint.
 Use a time loop layer: When creating an animation that you want to repeat continuously, use a
Time Loop layer to save time animating or even duplicating waypoints.
Drawing Tips
 Use onion skin view: Use the onion skin view to help position objects in the correct location on the
canvas.
 Use a Solid Color layer for the background: Solid Color layers fill the whole canvas but have no
handles with which they can be manipulated, making them ideal for use as part of the
background.
Animation Tips
 Always make sure that Animate Editing Mode is turned ON before you move or transform the object
you want to animate.
Static Animation: Use to display still pictures shown in sequence to tell a story.
 You can use the Constant interpolation to make sure the parameter of an object, such as Amount,
doesn’t change until the next waypoint.
Motion Tween: Use to move an object across the canvas or in a circle.
 A motion tween is Synfig Studio’s primary form of animation.
 You can bend the motion path of a motion tween to create realistic movement.
Shape Tween: Use to transform an object from one shape to another.

 Add keyframes and use Onion Skin view to see the previous shape of an object.
 Split Tangents to create shapes with corners and Merge Tangents to create rounder shapes.
Motion Path: Use to make an object move freely around the stage.
 The path the object will follow is drawn using the Spline Tool.
 The drawn path can have an Amount of 0 or be placed under a Solid Color layer in the Layers panel.

Assignment 24: Share the Movie with Others
You need to get your movie ready for viewing. Use the
checklist as a guide.
Afterwards, have your teacher or a friend look at your

movie to give you suggestions on how to make it even
better!
Complete the Checklist

Content
The events in the movie are logically sequenced.
The action is told using well drawn characters or objects.
The words explain the action in the story and are easy to read.
The words are spelled correctly.
Animation
The animation clearly illustrates the action in the story.
The animation is well-selected for the purpose.
There is a variety of animation to add interest to the story.
There is enough time to read the words.
There is enough time to view the action.
Originality and Creativity
The movie holds viewer interest.
The content of the movie is unique.

TechnoTween
Share the Movie with your Friends
Follow the instructions to export the

document as an AVI Movie.
Show the movie to others. Have them write

down one thing they really like about your
animated movie.
Open the Synfig Document
 Open the document in Synfig Studio.
Render the Document as an AVI Movie
 From the File menu, click Render.
 In Filename, choose the destination of the file and the filename.
 Change the file extension from .png to .avi.
 In Target, click the dropdown menu and select ffmpeg.
 Click Parameters…
 Change the Available Video Codecss to MPEG-4 part 2 (XviD/DivX).
 Change the Video Bit Rate to 2500.
Exit Synfig

Session 6 Review: Synfig Review

1. Label the parts of the Synfig window.
 Keyframe/Parameters  Canvas  Layers Panel  Toolbox
 Menu Bar  Tool Properties Panel  Timetrack
/7
2. Fill in the blanks.
a) To draw a box on the stage, you would use the tool.
b) The area where objects are added to the movie is called the .
c) To create an oval from a circle you must use the tool.
d) Whenever you create an object it appears in the panel.
e) To view the state of an object at a previous keyframe, use the view.
f) To record changes made to objects on the Timetrack you must turn on .
g) You can use to make Synfig remember the state of the animation at a certain frame.
h) In Synfig every object has its own layer. To keep the Layers panel organized, use .
i) In motion path animation, the of the object to be animated is linked to the

spline.
j) A is created on the Timetrack when a change is made to an object in

Animate Editing Mode.
/10

TechnoTween
3. Match the tool to its function.
A. view the stage in onion skin view

a)
B. duplicate a layer
b)
C. select, rotate, or scale an object

c)
D. flip an object
d)
E. add text to the stage

e)
F. create a spline
f)
G. group several layers

g)
H. draw freehand
h)
I. turn Animate Editing mode on

i)
J. change the fill color

j)
/10
4. For each type of animation describe when you would use it to animate an object.
Motion Tween
Shape Tween
/2
TOTAL: /30

TechnoTween Technokids PH 060920 PDF

Uploaded by

Copyright:

Available Formats

You might also like

TechnoTween Technokids PH 060920 PDF

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

TechnoTween Technokids PH 060920 PDF

Uploaded by

Copyright:

Available Formats

A Senior Technology Project

Copyright © 1993 – 2020 TechnoKids Inc.

TechnoAnimate is published by TechnoKids Inc.

Limits of Liability and Disclaimer of Warranty

2097 Bates Common

Our mission is to combine education and technology

Released June 2020

Assignment 1: What is Animation? ............................................................................................................................... 1

What is Animation? .................................................................................................................................................... 1

Save the Synfig Document and then Exit Synfig ................................................................................................. 32

Teaching the skills of tomorrow… today!

Session 1 Extension Activity: Flip and Align Objects ................................................................................................ 37

Session 2 – On an Alien Planet

Assignment 6: What is a Motion Tween? .................................................................................................................. 41

What is a Motion Tween? ....................................................................................................................................... 41

Assignment 9: Create Scene 4 – Blast Off ................................................................................................................ 54

Animate the Ship Using a Motion Tween ............................................................................................................. 55

Teaching the skills of tomorrow… today!

Session 3 – The Strange Planet

Assignment 12: What is a Shape Tween? ................................................................................................................. 70

Assignment 15: (Optional) Shape Tween Animation Challenge ......................................................................... 80

Session 4 – Coming Home

Assignment 16: Create Scene 8 - Dance Party ....................................................................................................... 86

Open Synfig ............................................................................................................................................................... 86

Teaching the skills of tomorrow… today!

Complete the Scene ............................................................................................................................................. 92

Session 5 – Add Sound, Export the Movie

Assignment 22: Render Scenes ................................................................................................................................ 106

Open Synfig and View Scene 1 ........................................................................................................................... 106

Out of This World Marking Sheet .............................................................................................................................. 109

Session 6 – Make your own Movie

Assignment 23: Select an Idea ................................................................................................................................. 117

Idea: Make an Animated Scene ......................................................................................................................... 117

Teaching the skills of tomorrow… today!

Assignment 25: Share the Movie with Others ........................................................................................................ 120

Teaching the skills of tomorrow… today!

Teaching the skills of tomorrow… today!

Assignment 1: What is Animation?

Session 1 Review: About Synfig

Assignment 1: What is Animation?

Using Synfig Studio to Make Animations

Copyright © TechnoKids Inc. 1

Watch an Animated Story Made Using Synfig Studio

 Open the Synfig folder.

Scene 1 Scene 2 Scene 3 Scene 4 Scene 5

Scene 6 Scene 7 Scene 8 Scene 9 Scene 10

3. What would you add to this story to make it even better?

 Close the file.

2 Copyright © TechnoKids Inc.

Assignment 2: Introduction to Synfig

Open Synfig Studio

 Open Synfig Studio.

Label the Parts of the Synfig Window

1. Label the parts of the Synfig window.

 Canvas  Layers  Tool Properties  Toolbox

 Menu Bar  Timetrack Parameters

Copyright © TechnoKids Inc. 3

Parts of the Synfig Window