Today we are coding in MakeCode Arcade. You will plan a small arcade game, then build it step by step at your device: a player sprite you can move, a map with walls, and projectiles to dodge.
Before you open the editor, sketch a quick plan. Use short pseudo-code or a simple flow chart: what does the player do, what gets in the way, and what happens on a hit?
You will Predict what should happen, Run your code, Investigate when it does not, Modify and fix it, and Make the game your own as you go.
Keep this short. Devices on MakeCode Arcade, students logged in. On the board, model a tiny plan: player moves with arrows, border walls block, hit by a projectile loses a life. Optional predict: before anyone runs code, ask what they think will happen when the move block is added, or when a projectile overlaps the player. Do not open any earlier project; this part starts fresh. Then send pairs into the build.
MakeCode Arcade is a fun and easy-to-use tool that lets us create our own arcade games. It's like a digital playground where we can build and play games right in our web browser.
With MakeCode, we can use colourful blocks to build our games, just like Scratch.
If you have a small handheld gaming computer like the BrainPad or GameGo, you can even put the games you make onto it and play them anywhere!
Brief orientation only. Link MakeCode Arcade to tools students may already know (block editors, on-screen simulator). Stress that games run in the browser and can later go to a handheld if you have one. No coding yet.
Imagine the MakeCode Arcade code editor as a magical toolbox. It's a lot like the Microbit and Scratch editors you might have used before. Here's what it has:
Point out simulator, toolbox and code area on the board. Ask where they would watch the game run and where they would drag blocks. Keep it to one minute so time stays on the build.
Let's create our first project!
Go to the Arcade MakeCode website and create a new project. You can call your project anything you want!
Model creating a new project at arcade.makecode.com and naming it clearly (class style). Check every pair has a fresh empty project before the sprite step. Watch for students reopening an old tab by mistake.
When we add a sprite to an Arcade project, we add it by putting it into a variable. We normally use variables to store numbers and text but we can also put more complicated things in them like sprites!
Add the following code to your project.
let mySprite = sprites.create(img`
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
`, SpriteKind.Player)
This creates a variable called 'mySprite' and stores a sprite of kind Player in the variable. There are different types of sprites such as:
Model adding the sprite-create block and the idea that the sprite lives in a variable. Key question: why put the sprite in a variable if we want to move or change it later? Common bug: block left in the toolbox or not in the main programme path so nothing appears in the simulator.
You're previewing this lesson. Get full access to this lesson and hundreds more — each one ready to teach, with interactive activities, printable resources and pupil progress tracking built in.