Intermediate

40 mins

Teacher/Student led

Learning Goals

Learning Outcomes

+65 XP

What you need:
Chromebook/Laptop/PC
Wick Editor needs no account

Animate It, Part 2: Layers, Timing and Getting It Out

Students split their animation onto layers, change the frame rate, save an editable project and export a finished GIF.

Warning: Your screen size is quite small for viewing this. Rotate your device into landscape mode if you can.

1 Start
2 Why Layers, and What Frame Rate Does
3 Hands-on: Put It on Layers
4 Hands-on: Frame Rate, Save and Export
5 Make Sense

1 - Start ~3 mins

Illustration for Start Your bouncing ball plays, but everything is drawn on one layer and it exists only in this browser tab. Today you fix both.

If your animation is gone

Wick keeps nothing after the tab closes. Rebuild a short bounce — four or five frames is plenty for today's work — at wickeditor.com.

👇 Mark your steps as done as you complete them.

+5 XP

2 - Why Layers, and What Frame Rate Does ~5 mins

Layers are see-through sheets stacked on top of each other. Put the things that move on one and the things that stay put on another.

Layer	What goes on it	Why
Top	The ball	It changes every frame
Bottom	The background	Drawn once, never redrawn

Frame rate

Frames per second. Raise it and the movement smooths out — but you need more drawings to fill the same time. Lower it and you draw less, at the cost of smoothness.

👇 Mark your steps as done as you complete them.

+10 XP

3 - Hands-on: Put It on Layers ~12 mins

Separate the moving ball from a background that stays still.

+15 XP

4 - Hands-on: Frame Rate, Save and Export ~13 mins

Change the timing, keep the editable file, then produce something you can actually share.

File	What it is for
.wick	Your editable project. Only Wick opens it. Keep this.
Animated GIF	Loops by itself, no sound. Good for posting.
Video (.mp4)	Plays anywhere and carries sound if you added any.

+15 XP

5 - Make Sense ~5 mins

Two ideas worth keeping from today.

Separate what moves from what does not. That is what layers are for, in every tool you will meet, not just this one.
Keep the editable file AND the shareable one. They do different jobs.

Key point

A GIF is the finished thing. The .wick file is the thing you can change your mind about.

+10 XP

123learn · Online learning platform

Unlock the full learning experience

You're previewing this lesson. Get full access to this lesson and hundreds more — each one ready to teach, with interactive activities, printable resources and pupil progress tracking built in.

Hundreds of curriculum-aligned lessons

Interactive activities in every lesson

Printable resources & progress tracking

Get started

Copyright Notice
This lesson is copyright of Coding Ireland 2017 - 2025. Unauthorised use, copying or distribution is not allowed.