Studying Pong & Breakout — why the 1970s still teach us

Learning Goals 3 min

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

1. Describe Pong (1972) and Breakout (1976) in your own words — what the player sees, what the player controls, what the goal is, and what makes each game feel fun.
2. Name the four Scratch ingredients every Breakout clone needs: a paddle that follows the mouse, a ball that bounces, a field of brick clones, and a score variable — and point to which earlier lesson taught each one.
3. Predict which existing Scratch blocks you will reach for first when the cluster F build starts — including set x to (), if on edge, bounce, create clone of (myself v), and touching (...)?.

Warm-Up — name that game 7 min

Cluster F is six lessons (L04-31 through L04-36) that end with a complete, playable Breakout you can share with your kakak or your cousin in KL. Before we start building, we need to read the games we are copying. Designers do this all the time — they study old games to understand why the design works.

Predict puzzle. Read this description and guess which arcade game it describes:

Two players. Each player controls a thin white rectangle on their side of a black screen. A white square bounces between them. If the square gets past your rectangle, the other player scores a point. First to 11 points wins. There is no story, no music, just one beep per bounce.

Now a harder one:

One player. You move a paddle left and right at the bottom of the screen. A ball bounces around above you. At the top of the screen there is a wall of coloured bricks. Every time the ball hits a brick, the brick disappears and you score points. Clear all the bricks and you win the level. Miss the ball and you lose a life.

New Concept — reading a game like a programmer 15 min

When you play a game for fun, you notice the colours and the music. When you study a game as a programmer, you have to look past that and ask three questions:

1. What objects are on the screen, and which ones move?
2. What does the player input do?
3. What rule changes the score, ends the game, or starts the next level?

Those three questions map almost one-to-one to Scratch: objects become sprites, input becomes hat blocks, and rules become if-then conditions inside a forever loop. Let us read Pong and Breakout that way.

Pong — three sprites, one rule

Pong has only three sprites: a left paddle, a right paddle, and a ball. The paddles move up and down based on player input. The ball moves on its own. The rule that ends a round is: did the ball pass the left or right edge?. That is it. A game so small it can fit on the back of a postcard.

when flag clicked
forever
  set y to (mouse y)
end
        

The ball is barely more code: a forever loop with move (...) steps and if on edge, bounce. We will rebuild this exact loop in L04-33 and make it smarter.

Breakout — four sprites and a swarm of clones

Breakout has the same three sprites as Pong — paddle, ball, and "wall" — except the wall is not one sprite, it is many. Around forty small brick sprites lined up in rows. Drawing forty separate sprites by hand would be painful. Scratch has a much better tool for this: create clone of (myself v). One brick sprite, forty clones, arranged in a grid by two nested loops. That is L04-32 — next lesson.

when flag clicked
go to x: (0) y: (-150)
forever
  set x to (mouse x)
end
        

The cluster F build map

Here is what the next six lessons will give you, in order:

• L04-31 (today) — Study the originals. No build yet. You finish today with notes, not a project file.
• L04-32 — Brick layout. Two nested loops + clones to draw the 5-by-8 wall.
• L04-33 — Paddle physics. The clever "where on the paddle did the ball hit?" angle trick.
• L04-34 — Power-ups. Lists store which power-ups exist, drop them from broken bricks.
• L04-35 — Score, lives, win condition. Variables and broadcasts wired together.
• L04-36 — Polish & share. Title screen, sounds, publish.

Worked Example — annotating Pong on paper 12 min

This is a meta-lesson, so today's "build" is in your notebook, not in Scratch. We are going to draw a one-page design map of Pong. Designers and programmers do this before they touch the keyboard — it stops you wasting an hour writing the wrong code.

Step 1 — Sketch the Stage

Open your notebook. Draw a rectangle the shape of the Scratch Stage. Mark the corners with the coordinates Scratch uses: top-left (-240, 180), bottom-right (240, -180).

Step 2 — Draw and label the sprites

Add three rectangles: a paddle on the left edge, a paddle on the right edge, and a small square in the middle for the ball. Label each one (Paddle-Left, Paddle-Right, Ball).

Step 3 — Note what moves and how

Next to each sprite, write in one sentence how it moves. For the left paddle: "follows the W and S keys up and down". For the right paddle: "follows the up and down arrow keys". For the ball: "moves a few steps every frame in whatever direction it last got hit".

Step 4 — Note the inputs

Underneath the Stage, list the inputs Pong needs: W, S, up arrow, down arrow, and the flag to start. That is it. No mouse, no space bar.

Step 5 — Note the rules

List the game's rules in plain English. There are only three of them: (a) if the ball touches a paddle, it bounces back. (b) if the ball touches the left edge, the right player scores. (c) if the ball touches the right edge, the left player scores. Write each rule on its own line.

Step 6 — Match rules to Scratch blocks

Next to each rule, write the Scratch block(s) you would use. Rule (a) needs touching (Paddle-Left v)? inside if <> then. Rules (b) and (c) need touching [edge v]? combined with checking x position.

Step 7 — Spot the holes

Look at your map. What is missing? Pong has no scoreboard you noted. Add it. Pong has a beep when the ball hits — add a note "play sound when bounce". Designers always do one final "what did I forget?" pass before they start coding.

Step 8 — Now repeat for Breakout

Flip the page and do the same exercise for Breakout. Same structure: sprites, movement, inputs, rules, blocks. You should end up with a slightly longer list — Breakout has a brick wall and a score and lives, but the shape of the design map is identical.

The skeleton stack we will fill in next lesson

when flag clicked
hide
delete all of [bricks v]
set [score v] to (0)
set [lives v] to (3)
broadcast (build-wall v)
broadcast (release-ball v)
        

What you just did: you reverse-engineered two of the most famous games in history into a small list of sprites, inputs, and rules. That list is the spec for the build. Five lessons from now, when you are deep inside the brick-collision code and confused, you will come back to this notebook page to remember what you are trying to build.

Try It Yourself — three study drills 15 min

when flag clicked
go to x: (0) y: (-150)
forever
  set x to (mouse x)
end
        

when flag clicked
go to x: (0) y: (0)
point in direction (45)
forever
  move (4) steps
  if on edge, bounce
end
        

when flag clicked
go to x: (0) y: (0)
point in direction (135)
forever
  move (4) steps
  if on edge, bounce
  if <touching (Paddle v) ?> then
    point in direction (-45)
  end
end
        

Mini-Challenge — Mei's design map 5 min

"Spot the missing rule"

Mei from your class is building a Pong-style game. She has drawn this design map in her notebook:

Sprites: Paddle-Left, Paddle-Right, Ball.
Inputs: W/S for left, ↑/↓ for right.
Rules: (1) ball moves forever. (2) ball bounces off top and bottom edges. (3) ball bounces off paddles. (4) if ball touches left edge, right player scores. (5) if ball touches right edge, left player scores.

She starts building in Scratch and immediately runs into a problem. The ball gets scored, the score goes up — and then nothing happens. The ball is gone. The next round never starts. What is missing from her map?

when I receive (reset-ball v)
go to x: (0) y: (0)
wait (1) seconds
point in direction (pick random (45) to (135))
        

Recap 3 min

You met cluster F — Arcade-Classic Recreation — by reading Pong (1972) and Breakout (1976) the way a programmer reads them. Both games reduce to a short list of sprites, inputs, and rules. Pong has three sprites and three rules; Breakout adds a wall of clones and a small scoreboard. The next five lessons turn that list into a working game. Today you drew the map; from L04-32 onwards you build to it.

Arcade classic

An early commercial video game (roughly 1972 to 1985) whose mechanics are so distilled they are still copied today. Pong, Breakout, Pac-Man, Space Invaders, Asteroids.

Design map

A one-page sketch — drawn before any code is written — listing a game's sprites, inputs, and rules. The contract between the designer's brain and the programmer's keyboard.

Mechanic

One specific rule of interaction in a game. "Ball bounces off paddle" is a mechanic. "Brick disappears when hit" is another. A genre is usually one or two memorable mechanics in a trench coat.

Clone

A runtime copy of a sprite, created by create clone of (myself v). Breakout needs about forty clones for the brick wall. We meet clones properly next lesson.

Spec

Short for specification. The written-down list of what a program must do before you start coding. Your design map is a spec.

Homework 2 min

The Two-Page Game Study. Pick any two arcade or mobile games you already play. They can be old (Tetris, Snake) or new (Subway Surfers, Among Us). Do the L04-31 design-map exercise on one page each.

1. Sketch the playing area in your notebook.
2. List the sprites or objects you can see on screen.
3. Write what moves and how.
4. Write the player inputs (taps, swipes, keys).
5. Write the game's rules in plain English — at least four rules per game.
6. For each rule, write the Scratch block(s) you would use to build it. If you do not know a block, write ? — that is a research note for later.

Save the notebook pages or take photos. Bring them next class.

Bring back next class:

• Your two design maps (notebook pages or photos).
• Your answer to: "Which of your two games has more rules? Did the simpler game feel less fun, or just easier to describe?"
• One question mark (?) — a rule you could not yet match to a Scratch block. We will answer it during the cluster.

Heads up for next class: SCR-L04-32 opens Scratch and builds the 5-by-8 brick wall using two nested repeat loops and create clone of (myself v). Forty bricks, one sprite. Bring your design map for Breakout — we will follow it.