Lesson 6 of 7
Build Your First Game
Combine sprites, tilemaps, collectibles, and win/loss conditions into a working arcade game.
Learn it
Now it is time to assemble all the pieces into a real, playable arcade game!
First, we draw a tilemap for our level with solid walls. Next, we spawn our player and scatter sparkling gems to collect.
Finally, we add win and lose conditions: collecting all gems wins the game, but touching a wandering ghost causes game over!
Key terms
- Tilemap
- A grid of small square images used to build game levels and collision walls.
- Collision Event
- A code trigger that executes when two sprite hitboxes make contact.
- Win Condition
- The specific state required for the player to successfully finish a game.
- Game Over
- The state triggered when player lives reach zero or a fail condition is met.
Assembling the Arcade Game Step by Step
Follow this development sequence to build your first full arcade project.
- 1Build the Tilemap: Paint ground tiles and place solid wall tiles around the perimeter so players cannot escape.
- 2Place Player & Camera: Spawn the player sprite at tile (1,1) and instruct the camera to follow the sprite.
- 3Distribute Collectibles: Spawn gem sprites of SpriteKind.Food at random empty tile positions.
- 4Spawn Patrolling Enemies: Create enemy sprites that bounce off walls using velocity settings.
- 5Wire Win & Loss Triggers: Score points on gem overlap; deduct hearts or call game_over(False) on enemy contact.
Collect Gem Collision Logic
pythondef on_player_overlap_food(hero_sprite, gem_sprite):
gem_sprite.destroy(effects.confetti, 200)
info.change_score_by(10)
music.ba_ding.play()
if info.score() >= 50:
game.game_over(True)
sprites.on_overlap(SpriteKind.player, SpriteKind.food, on_player_overlap_food)When the player collides with food, the gem disappears with confetti, points are awarded, a sound plays, and winning conditions are checked.
Build it in MakeCode
Code along right here — the real Microsoft MakeCode editor is embedded below.
Live MakeCode studio
Full block/JavaScript/Python editor for 160×120 retro games.
This is the real Microsoft MakeCode editor running inside CodeQuest. Your project saves in the MakeCode editor itself — use Share or Download in MakeCode to keep or hand in your game. If your school network blocks embedded frames, hit New tab.
Try it
Identify whether each game development practice in MakeCode Arcade is real or fake.
You can use scene.camera_follow_sprite(hero) so the viewport scrolls with your character.
You must write 50,000 lines of binary machine code before drawing a single sprite.
info.change_life_by(-1) deducts one heart from the player's life meter.
MakeCode Arcade games can only be played on an actual arcade machine from 1985.
Challenge
Create a game rule where collecting a power-up star temporarily turns all enemies harmless for 5 seconds.
Pick whichever way suits you — every mode earns the same bonus XP.
Write at least 40 more characters to submit.
Mark your own work
Guided walkthrough — 0/5 clues revealed
- Clue 1 locked — reveal it only if you get stuck.
- Clue 2 locked — reveal it only if you get stuck.
- Clue 3 locked — reveal it only if you get stuck.
- Clue 4 locked — reveal it only if you get stuck.
- Clue 5 locked — reveal it only if you get stuck.
Each clue costs 5 XP (never below 23 XP). You'd earn 45 XP right now.
Extension: Add visual feedback like flashing colours to show the power-up is about to wear off.