← Teacher guide

Your own game

An optional, open project. Students turn the pitch card and prototype from Will it work in Arcade? into a game of their own, in three milestones with goals only, then look ahead to tilemaps, animation and extensions.

Arcade advanced skills · Final challenge: Power-ups and your own game · about 120 minutes · Open the student lesson

Classroom resources

Load these into Waypoints Prepare: choose Load URL and paste the copied address, or download the file and import it. In Prepare, the worksheet's Teacher edition shows the answers; the student copy hides them.

Students will be able to

Timing

Predict and Run 10 min · Milestone 1 30 min · Milestone 2 25 min · Milestone 3 and playtest 40 min · Arcade's real tools 15 min (two or more lessons)

Before class

This lesson is optional and open: it is the high ceiling of the course. Students start from the pitch card and one-screen prototype they made in Will it work in Arcade? (genre, building blocks, the hard part and a workaround). There is no starter code and no new block; every milestone is a goal, not a recipe. Only Milestone 1 has a code check (sprites, an overlap event and something from Info, such as score or lives); the others are honest ticks after testing, because every game ends and polishes differently.

Scope is the main risk. Students aim for a big game and finish nothing. Hold the line: Milestone 1 must be playable before anything else is added, and Milestone 3 is one polish, not three. A small finished game beats a big unfinished one. If a pitch card is "not a good fit" for Arcade (3D, realistic physics, typing-heavy), steer back to its workaround from Will it work in Arcade?.

Playtesting is the habit to build: after each milestone someone else plays for one minute while the maker watches in silence and notes where they got stuck. Then the maker changes one thing. Budget two to four lessons for a full project; one lesson gets most students through Milestone 2.

Students' work is saved in this browser only. Copying from the Will it work in Arcade? playground (switch to JavaScript, select all, copy, paste) keeps the prototype; the editor's Download saves a file as a backup.

Running the lesson

  1. Predict and Run: Kai's prototype has a goal but no danger and no ending. Use it to name the three milestones before anyone builds.
  2. Before Milestone 1: each student reads their pitch card to a partner in 30 seconds. The partner asks: what is the player, the goal, the danger?
  3. Milestone 1: check that it is playable after 20 to 30 minutes. If a student is still drawing sprites, set a 5-minute art limit: rough art first, nice art last.
  4. Milestone 2: ask students to test both endings. Lives and countdowns end the game by themselves; a target score needs game over (true).
  5. Milestone 3: one polish only. Point students back to the lesson that taught it (Levels, Power-ups, Else and chasing, Gravity and jumping).
  6. Playtest: pairs swap seats. The player plays; the maker watches silently and writes down one thing. Swap back and fix it.
  7. Arcade's real tools: a teacher-led option. Tilemaps are the big one: a walled maze or a platform level with a scrolling camera is a good next project.

The hard part (on purpose)

Scoping their own game and playtesting early. Ask whether someone can play it yet, before more sprites are drawn.

When students get stuck

What you will seeA question to askThe fix
The student is still drawing sprites after 20 minutes.Can someone play your game yet?Use simple shapes for now; make the art nice after the game works.
Nothing happens when sprites touch.Which kinds are your sprites, and which kinds does each overlap event name?Make the kinds match the event, as in the Overlaps lesson.
A hit takes all the lives, or a coin scores again and again.What happens to the other sprite after the touch?Destroy it (or move it) inside the overlap event.
The game never ends.Which ending did you choose, and where does it happen?Set life (and lose lives in an overlap), start a countdown, or call game over when the target is reached.
The student wants to add everything at once.Which one change would make your game more fun for the player who just tested it?Add that one, test it, then decide on the next.

Answers to the checks

  1. Predict: This is Kai's prototype for a bee game. You collect 10 flowers. What happens?
    Nothing. The game has a player, a goal and a score, but no danger and no way to win or lose, so it never ends.
  2. Run: Which part of Kai's pitch card is still missing from the prototype?
    The danger (a chasing wasp) and an ending (winter)
    A prototype only tests the core idea. Kai's next milestones are a danger and a way to win and lose: the same milestones you will build.

Solutions

One possible solution for each task. Other correct programs are fine.

Build your game › Milestone 1: the core loop

The program as blocks
Show as code
let fish: Sprite = null
let seal: Sprite = null
sprites.onOverlap(SpriteKind.Player, SpriteKind.Food, function (sprite, otherSprite) {
    otherSprite.destroy()
    info.changeScoreBy(1)
})
sprites.onOverlap(SpriteKind.Player, SpriteKind.Enemy, function (sprite, otherSprite) {
    otherSprite.destroy()
    info.changeScoreBy(-3)
})
scene.setBackgroundColor(9)
let penguin = sprites.create(img`
    . f f .
    f 1 1 f
    f 1 1 f
    . 4 4 .
    `, SpriteKind.Player)
controller.moveSprite(penguin)
penguin.setStayInScreen(true)
game.onUpdateInterval(1000, function () {
    fish = sprites.create(img`
        . 4 4 . 4
        4 4 4 4 .
        . 4 4 . 4
        `, SpriteKind.Food)
    fish.setPosition(randint(10, 150), randint(10, 110))
})
game.onUpdateInterval(3000, function () {
    seal = sprites.create(img`
        . c c c .
        c f c c c
        c c c c c
        `, SpriteKind.Enemy)
    seal.setPosition(160, randint(10, 110))
    seal.vx = -40
    seal.setFlag(SpriteFlag.AutoDestroy, true)
})

Build your game › Milestone 2: win and lose

The program as blocks
Show as code
let fish: Sprite = null
let seal: Sprite = null
sprites.onOverlap(SpriteKind.Player, SpriteKind.Food, function (sprite, otherSprite) {
    otherSprite.destroy()
    info.changeScoreBy(1)
    if (info.score() == 20) {
        game.gameOver(true)
    }
})
sprites.onOverlap(SpriteKind.Player, SpriteKind.Enemy, function (sprite, otherSprite) {
    otherSprite.destroy()
    info.changeLifeBy(-1)
})
scene.setBackgroundColor(9)
let penguin = sprites.create(img`
    . f f .
    f 1 1 f
    f 1 1 f
    . 4 4 .
    `, SpriteKind.Player)
controller.moveSprite(penguin)
penguin.setStayInScreen(true)
info.setLife(3)
info.startCountdown(60)
game.onUpdateInterval(1000, function () {
    fish = sprites.create(img`
        . 4 4 . 4
        4 4 4 4 .
        . 4 4 . 4
        `, SpriteKind.Food)
    fish.setPosition(randint(10, 150), randint(10, 110))
})
game.onUpdateInterval(3000, function () {
    seal = sprites.create(img`
        . c c c .
        c f c c c
        c c c c c
        `, SpriteKind.Enemy)
    seal.setPosition(160, randint(10, 110))
    seal.vx = -40
    seal.setFlag(SpriteFlag.AutoDestroy, true)
})

Build your game › Milestone 3: one polish

The program as blocks
Show as code
let fish: Sprite = null
let seal: Sprite = null
sprites.onOverlap(SpriteKind.Player, SpriteKind.Food, function (sprite, otherSprite) {
    otherSprite.destroy()
    info.changeScoreBy(1)
    if (info.score() == 20) {
        game.gameOver(true)
    }
})
sprites.onOverlap(SpriteKind.Player, SpriteKind.Enemy, function (sprite, otherSprite) {
    otherSprite.destroy()
    info.changeLifeBy(-1)
})
scene.setBackgroundColor(9)
let penguin = sprites.create(img`
    . f f .
    f 1 1 f
    f 1 1 f
    . 4 4 .
    `, SpriteKind.Player)
controller.moveSprite(penguin)
penguin.setStayInScreen(true)
info.setLife(3)
info.startCountdown(60)
let orca = sprites.create(img`
    f f f f . f
    f 1 f f f f
    f f f f . f
    `, SpriteKind.Enemy)
orca.setPosition(150, 110)
orca.follow(penguin, 25)
game.onUpdateInterval(1000, function () {
    fish = sprites.create(img`
        . 4 4 . 4
        4 4 4 4 .
        . 4 4 . 4
        `, SpriteKind.Food)
    fish.setPosition(randint(10, 150), randint(10, 110))
})
game.onUpdateInterval(3000, function () {
    seal = sprites.create(img`
        . c c c .
        c f c c c
        c c c c c
        `, SpriteKind.Enemy)
    seal.setPosition(160, randint(10, 110))
    seal.vx = -40
    seal.setFlag(SpriteFlag.AutoDestroy, true)
})

Stretch and support

Stretch: Start a second, bigger project with tilemaps: a maze with walls, or a platformer whose camera follows the player across a level wider than the screen.

Support: A working Milestone 1 is a good result. Offer Space dodger (end of Arcade Foundations) or the Power-ups game as a base: change the sprites, the kinds and one rule to make it a new game.

Exit ticket

What did you change after someone else played your game, and why?

Any change tied to what the player did, for example: they kept losing straight away, so I slowed the enemies down.

What each step is for

Where it leads

This ends Arcade advanced skills. The Game Maker Guide skillmap (arcade.makecode.com/skillmaps) is the next step for students building their own games. Class ideas: an arcade afternoon where everyone plays everyone's games and leaves one sticky note of praise and one of advice; a short design diary (pitch, what changed after playtesting, what you would add next). Students who want more can explore tilemaps and animation, or move to games in text code later.