🎨 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!
Three ways to use the mouse
SCRATCH BLOCKS
-- Sprite follows mouse cursor -- forever go to [mouse-pointer] -- Click on a sprite -- when this sprite clicked say [Ouch! That tickles!] for (1) seconds -- Use mouse X and Y coordinates -- forever go to x: (mouse x) y: (0) ← follows mouse left/right only
💡
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!Virtual Pet — All Scripts Summary
SCRATCH BLOCKS
-- Script 1: Always follow mouse -- when 🚩 clicked forever point towards [mouse-pointer] -- Script 2: Feed (F key) -- when [f] key pressed switch costume to [happy] say [Yum! 😋] for (2) seconds switch costume to [normal] -- Script 3: Pet (click) -- when this sprite clicked play sound [meow] change size by (15) wait (0.2) seconds change size by (-15) -- Script 4: Dance (D key) -- when [d] key pressed repeat (8) turn ↻ (45) degrees wait (0.1) seconds
🌟
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!