Backdrop Cues for Scenes — Scratch L2

The finished showcase: press space to switch from day to night and the cat's walk, shimmer and pulse all kick in for the new scene. Save it as a .sb3 and share it — your first complete Scratch animation.

Learning Goals 3 min

By the end of this lesson you will be able to:

Recognise the backdrop-switch hat when backdrop switches to [Night v] in the Events palette, and explain that it runs on a sprite (or the Stage) only when the named backdrop becomes active.
Combine switch backdrop to [Night v] on the Stage with multiple when backdrop switches to [Night v] hats on different sprites — one cause, many effects.
Use switch backdrop to [next backdrop v] to cycle through scenes, and read backdrop number (or backdrop name) as a reporter to check which scene is on.

Warm-Up — too many broadcasts 7 min

In SCR-L02-20 you met broadcast [message v]. That's one way to tell every sprite "something happened, react now". But there's another way that's already built into Scratch — and you may not have noticed.

Look at this script Daniel built for a sunrise scene. The Stage has two backdrops, Day and Night:


when flag clicked
switch backdrop to [Day v]
broadcast [day-time v]
wait (3) seconds
switch backdrop to [Night v]
broadcast [night-time v]

Daniel's Stage script. The broadcast fires right after each backdrop switch — so other sprites can react.

This works! Every sprite that needs to do something at night listens for when I receive [night-time v]. But there's a tiny duplication problem. Can you spot it?

Reveal the answer

Daniel has to say the same thing twice: switch the backdrop, and broadcast a matching message. If he ever changes the backdrop without also broadcasting (or vice versa), the sprites get out of sync with the scene. Two sources of truth instead of one. Today's lesson removes the broadcast entirely — Scratch has a hat that automatically fires when the backdrop changes. One source of truth: the backdrop itself.

For the rest of today, the backdrop is the cue. No more parallel broadcast messages. The Stage becomes the director, and every sprite watches for its cue.

New Concept — backdrops as scene cues 15 min

Open Events. You've used the yellow hats: when-flag-clicked, when-key-pressed, when-this-sprite-clicked, when-I-receive. Today's hat looks a lot like that last one, but with a different dropdown:


when backdrop switches to [Night v]

The backdrop-switch hat. The dropdown shows every backdrop currently loaded on the Stage.

How it fires

This hat sits on top of a script (on any sprite, or on the Stage itself). It runs once, automatically, the moment the Stage's current backdrop becomes the one named in the dropdown. It does not fire when you click the flag — only when a backdrop change actually happens after the project is running.

Who can switch the backdrop?

Three ways the backdrop can change while the project runs:

A script (on any sprite or the Stage) uses switch backdrop to [Night v].
A script uses switch backdrop to [next backdrop v] or switch backdrop to [previous backdrop v] — cycling through.
A script uses switch backdrop to [random backdrop v].

However the switch happens, every when backdrop switches to [Night v] hat across the whole project that matches the new backdrop fires at the same moment. One cause, many effects.

Why this is better than broadcasting

You could do the same thing with broadcasts — manually broadcast "night-time" every time you switch to the Night backdrop. But:

One source of truth. The backdrop is what determines the scene. With backdrop-switch hats, you can't accidentally have the visuals say "Night" while the code thinks it's still "Day".
Less duplication. No need to write both a switch backdrop and a matching broadcast every time.
Self-documenting. A sprite with a script that says "when backdrop switches to Night, hide me" is instantly understandable. A sprite that hides on a "night-time" broadcast forces you to find where that broadcast came from.

The Stage as a state machine

Think of each backdrop as a different scene in your project: Title, Forest, BossFight, GameOver. The currently-active backdrop is which scene you're in. The Stage acts like a tiny state machine — it can be in exactly one state (backdrop) at a time, and every sprite reacts based on which state is currently active.

Reading the current backdrop

Sometimes you don't want to react when it changes — you want to ask what the current backdrop is right now. Looks has two reporters:


backdrop number
backdrop name

Two reporter blocks. Number is 1, 2, 3, … in the order backdrops appear in the Stage backdrop list. Name is the text label.

Tick the checkbox next to either reporter to see it monitor live on the Stage. Or use it in a condition: if <(backdrop name) = [Night]> then ….

Cycling with "next backdrop"

If you have backdrops Scene1, Scene2, Scene3 and you do switch backdrop to [next backdrop v] repeatedly, the Stage rotates through them in order, then wraps back to the first. Combine that with a when [space v] key pressed and you have a "press space for next scene" slideshow in two blocks.

Common mistakes

Putting switch backdrop to on a sprite when it should be on the Stage. The switch works from anywhere — but conceptually, the Stage is the director. Putting scene-changing code on the Stage makes it easier to find later.
Backdrop name typo. The hat dropdown only shows backdrops that exist. If you rename a backdrop, every hat that mentioned it goes blank and stops working. Re-pick from the dropdown.
Expecting the hat to fire at flag click. It doesn't. Even if the project starts on the Night backdrop, the hat only fires on actual switches. If you need a sprite to set up its Night look at the start, put that under when ⚑ clicked as well as when backdrop switches to [Night v].
Forgetting that the hat is on a sprite, not in some "global" place. Each sprite has its own copy. If you want three sprites to react to Night, all three sprites need their own when backdrop switches to [Night v] hat.
Switching the backdrop inside a forever loop with no wait. Scratch will rapid-fire backdrop switches at 30 per second and your project becomes a strobe light. Use wait (1) seconds between switches.

Worked Example — the moon at night, then assemble the showcase 14 min

First a tiny day-and-night scene to learn the cue. Press space to flip between Day and Night. A moon appears only on Night, a sun only on Day. Then we wire the same cue into our showcase cat. Seven steps, then the assembly.

Stage plan. The Stage is the director (it switches backdrops); the sun, moon and showcase cat each react to the cue. The cat's walk, shimmer and pulse all start when the scene changes.

Step 1 — Set up two backdrops

New project. Click the Stage thumbnail (bottom-right). Click Backdrops tab. Add two backdrops from the library: Blue Sky (we'll call it Day) and Stars (we'll call it Night). Right-click each in the list to rename them to Day and Night exactly.

Step 2 — Add the sun and moon sprites

Delete the cat. Add the Sun sprite from the library. Add the Star sprite (we'll pretend it's the moon — or upload a moon image if you have one). Position them both somewhere visible.

Step 3 — Stage: the scene-flipper

Click the Stage. From Events: when [space v] key pressed. Underneath, from Looks: switch backdrop to [next backdrop v]. That's the whole Stage script — two blocks.

Step 4 — Set the starting backdrop

Still on the Stage, add a second hat: when ⚑ clicked. Underneath: switch backdrop to [Day v]. So every run starts in Day.

Step 5 — Sun sprite reacts

Click the Sun sprite. Add two hats:

when backdrop switches to [Day v] + show.
when backdrop switches to [Night v] + hide.

Also add when ⚑ clicked + show — because the backdrop-switch hat doesn't fire on the first flag click, the Sun needs its own "I start visible" script.

Step 6 — Moon (Star) sprite reacts

Click the Star sprite. Add the mirror:

when backdrop switches to [Night v] + show.
when backdrop switches to [Day v] + hide.
when ⚑ clicked + hide.

Step 7 — Test it

Click the flag. You see Day backdrop, Sun visible, Moon hidden. Press space. Stage flips to Night, the Sun's Night-hat fires and it hides, the Moon's Night-hat fires and it shows. Press space again. Everything flips back. One key, two sprites reacting independently, no broadcasts written by you.

The full assembled stacks


when flag clicked
switch backdrop to [Day v]

when [space v] key pressed
switch backdrop to [next backdrop v]

Stage scripts. Four blocks total. The Stage is the director — it changes the scene, nothing else.


when flag clicked
show

when backdrop switches to [Day v]
show

when backdrop switches to [Night v]
hide

Sun sprite scripts. Six blocks. Reacts to scenes, doesn't decide them.


when flag clicked
hide

when backdrop switches to [Night v]
show

when backdrop switches to [Day v]
hide

Moon (Star) sprite scripts. Six blocks. Mirror of the Sun.

What you just built: a tiny scene system. The Stage holds the "what scene are we in?" state. Each sprite has its own opinion about what to do in each scene. To add a third scene — say Dawn — you add the backdrop, plus one hat per sprite. The architecture scales cleanly.

Assemble the showcase — the cat reacts to the scene

Now open your Costume Showcase project. Add a Day and a Night backdrop to the Stage. Give the Stage the same two scripts as above. Then give the cat three reaction scripts — one per piece of the show — all triggered by the backdrop cue.


when backdrop switches to [Day v]
go to x: (-200) y: (0)
point in direction (90)
set rotation style [left-right v]
forever
  move (8) steps
  if on edge, bounce
  next costume
  wait (0.1) seconds
end

Cat script 1 — the walk. Starts the instant the Day scene begins.


when backdrop switches to [Night v]
clear graphic effects
forever
  change [color v] effect by (5)
  wait (0.1) seconds
end

Cat script 2 — the shimmer. The cat glows with shifting colour once night falls.


when flag clicked
set size to (100) %
forever
  change size by (8)
  wait (0.2) seconds
  change size by (-8)
  wait (0.2) seconds
end

Cat script 3 — the breathing pulse. Runs the whole time, in every scene.

Click the flag — the cat breathes. Press space to reach Day — it walks. Press space to reach Night — it shimmers too. One backdrop change, the whole show responds. That is the finished Costume Animation Showcase.

Try It Yourself — three scene drills 15 min

🟢 Easy

Goal: Add a third backdrop called Sunset (use Beach Sunset from the library) to the worked-example project. The Sun should also show on Sunset (so it's visible on Day and Sunset, hidden on Night).


when backdrop switches to [Day v]
show

when backdrop switches to [Sunset v]
show

when backdrop switches to [Night v]
hide

Add to the Sun sprite. One new hat per new scene the Sun cares about.

Think: You didn't have to change any Stage code — the switch backdrop to [next backdrop v] automatically picks up the new backdrop in the rotation. The Sun just needed to opt in to the new scene.

🟡 Medium

Goal: Build a "comic book" project. Stage has four backdrops: Panel1, Panel2, Panel3, Panel4. The Cat sprite says something different in each panel using say [text] for () seconds.


when [space v] key pressed
switch backdrop to [next backdrop v]

when backdrop switches to [Panel1 v]
say [Welcome to KL!] for (2) seconds

when backdrop switches to [Panel2 v]
say [Want some teh tarik?] for (2) seconds

when backdrop switches to [Panel3 v]
say [Mmm, kuih lapis.] for (2) seconds

when backdrop switches to [Panel4 v]
say [See you next time!] for (2) seconds

Stage flips panels on space. Cat reacts to each panel. The hat on the Stage handles cycling; the four hats on the Cat handle dialogue.

Think: Notice the Cat doesn't know how the backdrop changes — only that it did. If you later replaced the space-key with a button click on a "Next" sprite, the Cat's dialogue scripts would not need to change at all. That's the power of one cause, many effects.

🔴 Stretch

Goal: A simple boss intro. Three backdrops: Entrance, Warning, BossFight. The boss sprite (use the Giga sprite from the library) appears only on BossFight, and pulses with the size effect from last lesson. The Stage progresses through scenes automatically with a 2-second wait between each.


when flag clicked
switch backdrop to [Entrance v]
wait (2) seconds
switch backdrop to [Warning v]
wait (2) seconds
switch backdrop to [BossFight v]

Stage script. Automatic 2-second scene progression. Drop it on the Stage.


when flag clicked
hide
set size to (100) %

when backdrop switches to [BossFight v]
show
forever
  change size by (5)
  wait (0.1) seconds
  change size by (-5)
  wait (0.1) seconds
end

Boss sprite script. Hidden by default, shows + starts pulsing the moment the boss-fight scene begins.

Think: The forever only starts running when the backdrop-switch hat fires. Before that, the script doesn't exist as far as Scratch is concerned. That's why the boss isn't using CPU until its scene begins.

Mini-Challenge — the moon that won't go away 5 min

"Priya's stubborn moon"

Priya built a Day/Night project just like the worked example. She has a Moon sprite. She gave it this script:


when backdrop switches to [Night v]
show

when flag clicked
show

Priya's Moon. When she presses space the first time (Day to Night), the moon shows. When she presses space again (Night to Day), the moon stays visible.

The moon is hanging in the daytime sky like a bug. What did Priya forget, and what's the fix?

Reveal one valid solution

Priya told the moon what to do when night arrives. She did not tell it what to do when day arrives. Without a matching when backdrop switches to [Day v] + hide, the moon just stays however it was last set — visible. Also, the when ⚑ clicked + show is wrong — the moon should hide at flag click, because the project starts in Day.


when flag clicked
hide

when backdrop switches to [Night v]
show

when backdrop switches to [Day v]
hide

Three tiny scripts, one per scene-related event. Every scene that matters needs an opinion from every sprite that cares. If a sprite is silent about a scene, it keeps whatever state it had last.

Recap 3 min

The Stage's backdrop is more than a picture — it's a scene cue. Any script anywhere can use switch backdrop to [Night v] (or next backdrop) to change the scene, and the hat when backdrop switches to [Night v] lets sprites react automatically. One cause, many effects. The Stage becomes a tiny state machine: the project is in exactly one scene at a time, and each sprite has its own opinion about how to behave per scene. This pattern replaces a tangle of manual broadcasts with something self-documenting and scalable.

✅ SHIPPED — CHECKPOINT 5 / 5Your Costume Animation Showcase is complete! The cat walks, shimmers and breathes, all triggered by the scene. Time to ship it:
• Save the file: File → Save to your computer to keep a .sb3 copy of Costume Showcase.
• Share it: with a free scratch.mit.edu account, click Share to get a project link you can send to friends and family.
• Under 13? Ask a parent or guardian — Scratch accounts for under-13s need a grown-up's email at sign-up. No account? The .sb3 file works perfectly offline and can be emailed.

Backdrop: An image on the Stage. Each project can have many, listed under the Backdrops tab. Only one is active (showing) at a time.
Backdrop-switch hat: The block when backdrop switches to [Night v]. Sits on any sprite or the Stage. Runs once, automatically, the moment the named backdrop becomes the current one. Does not fire at flag click.
Scene: A high-level "what's happening right now" state of a project — title screen, gameplay, boss fight, ending. In Scratch, scenes are usually represented by backdrops.
State machine: A system that can be in exactly one state at a time and changes between states based on events. Scratch's Stage, with its backdrop list, is a simple state machine. Most games are big state machines underneath.
Next backdrop: The dropdown option switch backdrop to [next backdrop v]. Cycles to the next backdrop in the Stage's backdrop list, wrapping back to the first after the last.
Backdrop number / name: Two Looks reporter blocks that tell you which backdrop is currently active. Use them in conditions or display them as Stage monitors.

Homework 2 min

A Tiny Three-Scene Story. Build a project with three backdrops representing a short Malaysian-flavour story: Morning, Pasar, and Home. Pick any backdrops that fit — feel free to upload your own or pick the closest library backdrops (Hill, Bench With View, Bedroom1, etc.).

Stage: when ⚑ clicked + switch backdrop to [Morning v]. Then add when [space v] key pressed + switch backdrop to [next backdrop v].
A "Cat" sprite that says something different in each scene using three when backdrop switches to [...] hats: "Good morning!" on Morning, "Apa khabar, makcik!" on Pasar, "Time to rest." on Home.
A second sprite (anything — Star, Apple, your own drawing) that only appears in one of the three scenes. Hide on flag click, show on its scene's hat, hide on the other two scenes' hats.
Use backdrop name as a Stage monitor (tick its checkbox) so you can see which scene is active while testing.

Save as HW-L2-30-Three-Scene-Story.sb3. Hit the flag, then press space twice to walk through all three scenes. The Cat should speak in each, and your second sprite should appear only in its assigned scene.

Bring back next class:

The .sb3 file.
Your answer to: "Imagine you wanted to add a 4th scene called Night. Exactly how many new hats would you need to add, and on which sprites? You don't have to build it — just list them."

Heads up for next class: SCR-L02-31 meets multiple variables — building a real game with both lives and score tracked at the same time. You'll combine variables with the conditionals and effects from this week's lessons to make a sprite that flashes when you lose a life.