🎨 Phase 2 · Animation Skills
🟡 Intermediate
MODULE 08
Interactive Animation
Your progress in Phase 2100%
🎯 What you'll learn: How to make Scratch projects react to keyboard presses and mouse movements. You'll learn Event blocks for keys and mouse, and build a Virtual Pet Toy that responds when you press keys, click, or move the mouse!
Section 1
Event Blocks — Triggers for Your Code
In Scratch, Events are things that happen — a key press, a mouse click, the flag being clicked. Event blocks are yellow and they trigger code to run when something happens. Every script must start with an event block!
🎹
User Input
Press a key, click the mouse, move the mouse
⚡
Event Block Fires
The matching "when key pressed" or "when clicked" block triggers
🤖
Code Runs
All blocks beneath the event block execute!
when [space] key pressed
Runs code when a specific key is pressed. Click "space" to choose any key — arrows, letters, numbers, or space!
when this sprite clicked
Runs code when the player clicks directly on this sprite with the mouse. Great for buttons!
when 🚩 clicked
Runs code when the green flag is clicked. This is how you start your project — the most common event!
when backdrop switches to [...]
Triggers when the stage backdrop changes. Use with broadcast for multi-scene stories!
Section 2
Keyboard Controls — Two Methods
There are two ways to detect key presses in Scratch. Choose based on what you need!
COMMON KEYS YOU CAN DETECT IN SCRATCH
Esc
1
2
3
4
5
Tab
Q
W
E
R
T
Caps
A
S
D
F
⬅
⬆
⬇
➡
SPACE
Highlighted keys are most commonly used in Scratch games and animations
Method 1 — Event Hat Block
when [right arrow] key pressed change x by (10)
✅ Simple — each key gets its own script
✅ Great for single key actions
⚠️ Can't detect multiple keys at once
✅ Great for single key actions
⚠️ Can't detect multiple keys at once
Method 2 — If + Key Pressed block
forever if <key [right arrow] pressed?> then change x by (10)
✅ Can check multiple keys simultaneously
✅ Great for smooth movement in games
✅ More precise control
✅ Great for smooth movement in games
✅ More precise control
Section 3
Mouse Interaction
The mouse is another powerful way for users to interact with your Scratch projects. You can detect clicks, track mouse position, and have sprites follow the mouse!
forever
go to mouse-pointer
🖱️ Way 1: The sprite sticks to your mouse and follows it everywhere!
when this sprite clicked
say Ouch! That tickles! for 1 seconds
👆 Way 2: The sprite reacts when you click on it!
forever
go to x: mouse x y: 0
↔️ Way 3: The sprite copies only the mouse's left-right position — great for paddle games!
💡
Mouse X and Mouse Y reporter blocks
In the Motion category, there are reporter blocks called "mouse x" and "mouse y" — these return the current position of the mouse. You can plug them into any block that takes a number!
Section 4
Build: Virtual Pet Toy 🐾
Let's build a virtual pet that responds to your keyboard and mouse! Press different keys to feed, play with, and make it dance!
1
Set up your pet
Choose a cute animal sprite — Cat, Dog, or Penguin! Set the stage backdrop to something homey. Add costumes that show different emotions (happy, sleeping, eating).
2
Follow the mouse
First script:
when 🚩 clicked → forever → point towards [mouse-pointer]. This makes the pet always look at where your mouse is!3
Feed it (press F)
New script:
when [f] key pressed → switch costume to happy → say [Yum! Thank you! 😋] for 2 seconds → switch back to normal costume.4
Pet it (click)
New script:
when this sprite clicked → play sound "meow" → change size by 15 → wait 0.2 secs → change size by -15. A little bounce when clicked!5
Dance (press D)
New script:
when [d] key pressed → repeat 8 → turn 45 degrees → wait 0.1 secs. The pet does a little spin!6
Sleep (press S)
New script:
when [s] key pressed → switch to sleeping costume → say [Zzz...] for 2 seconds → switch back. Your pet takes a nap!
🐱
Pet
All four scripts go on the same pet sprite
when 🚩 clicked
forever
point towards mouse-pointer
👀 Script 1: "The pet always turns to look at your mouse — like it's watching you!"
when f key pressed
switch costume to happy
say Yum! 😋 for 2 seconds
switch costume to normal
🍎 Script 2 — Feed: "Press the F key to feed your pet — it smiles and says yum!"
when this sprite clicked
start sound meow
change size by 15
wait 0.2 seconds
change size by -15
🐾 Script 3 — Pet it: "Click your pet and it meows and does a happy little bounce!"
when d key pressed
repeat 8
turn ↻ 45 degrees
wait 0.1 seconds
🕺 Script 4 — Dance: "Press D and your pet spins around in a full dance twirl!"
🌟
Add more interactions!
Try adding: H key → hide the pet, Space → jump, B key → bark/meow sound, Arrow keys → walk around. The more interactions, the more fun the virtual toy!
🎨
Phase 2 Complete!
You've mastered Animation Skills! Motion, loops, drawing with the pen, and making sprites react to keyboard and mouse. You're well on your way to building real games!
✅ Motion Master
✅ Loop Expert
✅ Pen Artist
✅ Interactive Coder
🎮 Next up: Phase 3 — Game Development — build real games with scores, variables, and winning conditions!
🧩 Knowledge Check — Lesson 8
5 questions on interactive Scratch. Final quiz of Phase 2!
1. What colour are Event blocks in Scratch?
2. What block makes a sprite follow the mouse cursor?
3. What is the advantage of Method 2 (Forever + if key pressed) over Method 1 (event hat block) for keyboard input?
4. What does "when this sprite clicked" do?
5. In Scratch, can one sprite have MULTIPLE "when key pressed" scripts for different keys?
Phase 2 Final Challenge
Interactive animation · Intermediate Level
Challenge: Magic Wand Drawing App! ✨🖊️
Build a drawing app where the mouse draws on the stage and keyboard changes the brush!
Requirements:
1. The sprite follows the mouse and draws with Pen when you hold Space
2. Press C to clear the canvas (erase all)
3. Press R for red pen, G for green, B for blue, W for white
4. Press 1 for thin pen (size 1), 5 for medium (size 5), 9 for thick (size 9)
5. The sprite should be hidden so you only see the drawing, not the cursor sprite
Build a drawing app where the mouse draws on the stage and keyboard changes the brush!
Requirements:
1. The sprite follows the mouse and draws with Pen when you hold Space
2. Press C to clear the canvas (erase all)
3. Press R for red pen, G for green, B for blue, W for white
4. Press 1 for thin pen (size 1), 5 for medium (size 5), 9 for thick (size 9)
5. The sprite should be hidden so you only see the drawing, not the cursor sprite
💡 Show hints if you're stuck
- Main loop: forever → go to mouse-pointer → if key (space) pressed then pen down else pen up
- Clear: when [c] key pressed → erase all
- Colour: when [r] key pressed → set pen color to [red]
- Hide sprite: at start, add "hide" so only the drawing is visible
- Add the Pen extension first from the Extensions menu!
Finished this lesson?
Mark it complete to track your progress.
Module 08 of 16Phase 2 Complete!