← Back

Math Maze

Learning game · Kids (7–9) · HTML/CSS/JS
Math Maze — preview of the maze game

Math Maze is a playful browser-based learning game for children (ages 7–9). The player navigates a maze from a top-down view, but each move requires solving a simple math problem (addition and subtraction). The game turns practice into progression: solve → move → explore → reach the 🏁 finish tile.

Learning through play Maze navigation Math practice Vanilla JS
Play Math Maze → View code on GitHub →

Note: This is a small educational game prototype. The math questions are intentionally simple and designed to support practice through repetition and progression.

Concept & intent

The project explores how small game mechanics can support learning: instead of drilling tasks, the game uses the maze as motivation. Each correct answer unlocks a move, creating a gentle reward loop where progress depends on understanding — not speed.

How the interaction communicates the idea

  • Move = earned: you can only move after answering correctly.
  • Short questions: quick mental math keeps focus on play.
  • Clear goal: the 🏁 finish tile signals completion immediately.
  • Feedback: sound + confetti celebrates success and supports motivation.

My role

  • Concept and game design (rules, level logic, difficulty)
  • UI/UX (onboarding, avatar picker, feedback flow)
  • Implementation (maze renderer, movement, modal logic)
  • Visual design (colors, tiles, finish line)
  • Testing and iteration (movement bugs, readability, responsiveness)

Reflection

A key focus was clarity: kids need immediate understanding of who they are, what to do, and what “winning” looks like. I iterated on onboarding, visuals, and feedback to make the interaction easy to grasp while still feeling playful.

Building the game also highlighted how small interface decisions (tile size, contrast, modal layout, feedback timing) have a big impact on usability — especially for younger audiences.