CBSE 2026 results are out, Mukul scored a perfect 100/100 in Computer ScienceSee all toppers →

KwickAcademy Course Topics · 5 min · free

Creating animation with keyframes

5 min1 KwickClipsFull text belowFree
Next lesson →Kajal Ma'am (MCA), teaching since 2004Remembered in this browser

Animate a ball in Synfig: keyframes vs waypoints, animation mode, the Keyframes panel, a bouncing ball, keyframe lock and rendering. Turn on animation mode (red border), move time first, then change the pose; Synfig tweens the rest.

Follows the syllabus of: GSEB Std 11 Computer Studies

On screen in this lesson

Keyframes and waypoints

Keyframe: important moment for the whole scene
Waypoint: one setting's value at one moment
Waypoints appear when you change things
Keyframes group many changes together

Animation mode

Normal mode: change applies to all time
Animation mode: change saved at this time
Button at the bottom right of the canvas
Red border means animation mode is on

Keyframes panel buttons

ButtonWhat it does
Add (+)New keyframe now
Remove (-)Delete keyframe
DuplicateCopy to this time
DescriptionName a keyframe

What you can animate

ParameterAnimation
Origin or centreMove
RadiusGrow or shrink
AngleRotate
ColourChange colour
AmountFade in or out

Pause and predict

Left at 0 s, right at 2 s
Where is the ball at 1 s?
Answer: about halfway across
Synfig tweened it for you

Lock past and future keyframes

New changes can affect other keyframes
Keyframe lock button near the canvas bottom
Lock past and future to protect poses
Unlock only when you want changes to spread

Quick answers

Ball at left at 0 s and right at 2 s. Where at 1 s?

About halfway across.

Your change applied to all time. Why?

Animation mode was off.

KwickClips from this lesson

Short clips, one idea each. Good for revision the night before.

The full lesson, in text

Hello students, welcome to Kwickprep. Why does your ball jump suddenly instead of moving smoothly? Usually, animation mode was off, or the keyframes were wrong. Today we will make a ball move across the screen in Synfig using keyframes, step by step.

First, two terms. A keyframe marks an important moment in time for the whole animation, like frame 24. A waypoint is a small mark that saves the value of one setting, like position or colour, at one moment. Synfig creates waypoints automatically when you change something in animation mode. Keyframes help you manage many waypoints together.

Animation mode is the most important switch. In normal mode, any change you make stays the same for the whole video. In animation mode, a change is saved only at the current time, as a waypoint. You turn it on with the animation mode button at the bottom right of the canvas. When it is on, the canvas gets a red border.

Here are the steps. Draw a circle with the Circle tool, in normal mode. Turn on animation mode, so the canvas shows a red border. Keep the time at zero, and add a keyframe in the Keyframes panel. Move the time slider to 2 seconds, and drag the ball to the right. Play the animation to watch the ball move.

The Keyframes panel lists all keyframes with their time. The plus button adds a keyframe at the current time. The minus button removes the selected keyframe. The duplicate button copies a keyframe to the current time. You can also type a description for each keyframe, like ball lands.

Almost any setting in the Params panel can change over time. Change the origin or centre to move an object. Change the radius to make a circle grow or shrink. Change the angle to rotate it. Change the colour to fade from one colour to another. Change the amount, which is the opacity, to fade an object in or out.

Now, three keyframes for a bounce. At zero seconds, the ball is high at the top. At one second, move the ball down so it touches the ground. At two seconds, move the ball back to the top. Synfig tweens both halves, so the ball falls and rises again.

Pause and predict. A ball is at the left at 0 seconds and at the right at 2 seconds. Where is it at 1 second? With even, linear motion, it is exactly halfway across. With Synfig's default smooth setting it is also near the middle, because 1 second is the midpoint in time. The computer found this position, and you never drew it.

Here is a trap. When you add a new change, Synfig may also add waypoints to keep your other keyframes from changing. This is controlled by the keyframe lock button near the bottom of the canvas. Locking past and future keyframes protects the poses you already set. Unlock them only when you want a change to spread.

Let us fix the common mistakes. If the change applies to the whole video, animation mode was off, so undo and turn it on. If the ball does not move, you changed it at the same time as the first keyframe, so move the time slider first. If a waypoint went wrong, select it in the Timetrack and delete it.

When the animation is ready, render it into a video. Click File, then Render. Choose the file name and the target, such as GIF or a video format. Click Render, and Synfig creates the file. Open the file to check it plays correctly.

Let us revise what we learned today. A keyframe marks an important moment, and a waypoint saves one value. Turn on animation mode, and look for the red border. Set a pose, move the time, then change the pose. Synfig tweens the frames in between. Lock past and future keyframes to protect your poses. Try making a bouncing ball with three keyframes.

Courses that teach this

CourseUnit
GSEB Std 11 Computer StudiesCreating Animation Using Synfig

Voice-over in this lesson is AI-generated. The script is written and checked by Kajal Ma'am. Boards can revise a syllabus mid-year, so confirm anything you plan around against the official board circular. Keep your passwords, OTPs and ID numbers to yourself — we never ask for them. To reach Kajal Ma'am, use the WhatsApp button; sharing your number there is how we call you back.

Free to watch, no sign-up. Live classes with Kajal Ma'am are the paid course; these lessons stay free either way.

Want a plan that actually fits your board dates?

Ask Kajal Ma'am directly, 20+ years teaching computer science. Free demo class first, no payment.

Talk to Kajal Ma'am on WhatsApp

Or see the Class 12 Computer Science course →

Studying outside India?

We coach CBSE, IGCSE & international students across the globe, one-to-one, in your local time zone.

Visit International →