Haunted Math Challenge

Haunted Math Challenge — A spooky, fast-paced math survival game where solving equations keeps you alive! 🎃

Comment

🎃 Haunted Math Challenge

👻 Inspiration

The idea came from the Horror Hacks 2025 theme — to create something spooky, fun, and a little educational.
We wanted to turn math (something often seen as scary) into a literal horror survival experience.
Instead of ghosts chasing you, it’s your own math mistakes draining your life bar!
This mix of humor, challenge, and Halloween atmosphere became the perfect combination.

🧮 What it does

Haunted Math Challenge is a fast-paced web game where you survive by solving math problems.
Each correct answer increases your health, while wrong answers or skips drain it.
You have a limited time (30 or 60 seconds) to score as high as possible before your health runs out — or the timer ends with the haunting message:

“YOU DIED...”

The game includes:

  • Dynamic math problems 🎲
  • Real-time health bar 💚
  • Spooky flying pumpkins and bats 🎃🦇
  • Sound effects (heartbeat and scream) 🔊
  • A live scoreboard tracking the top 10 recent scores

🏗️ How we built it

We built the game using HTML, CSS, and JavaScript, keeping it simple and hackathon-friendly.

  • HTML: for structure and interactive elements (problem display, input, scoreboard).
  • CSS: for dark Halloween visuals, flying emoji animations, and responsive design.
  • JavaScript: for logic, math generation, scoring system, and event handling.
  • Audio & Animations: heartbeat sound when health is low, red flash on mistakes, and spooky “YOU DIED” flicker.

We used arrays to store and update the top 10 scores dynamically, replacing the oldest entries as new games finish.

💀 Challenges we ran into

  • Getting the health bar to update smoothly with CSS transitions.
  • Timing events so the game felt fast but fair.
  • Making the design responsive for both desktop and mobile.
  • Keeping performance stable while spawning animated bats and pumpkins.
  • Managing scoreboard logic without external libraries or back-end code.

🏆 Accomplishments that we're proud of

  • Built a complete game from scratch in a short hackathon timeframe.
  • Created an atmosphere that’s both fun and spooky.
  • Achieved smooth animations and sound feedback using only front-end code.
  • Implemented a working ranking system with live updates.
  • Designed a Halloween aesthetic that looks great even on mobile devices.

🧠 What we learned

  • How to balance visual feedback (sounds, colors, animations) to make gameplay more immersive.
  • Efficient DOM manipulation for fast game updates.
  • How to make a pure JavaScript project feel like a polished mini-game.
  • The importance of subtle design choices — flickering lights, heartbeat sounds, and health drops — for player emotion.

🔮 What's next for Haunted Math Challenge

  • Difficulty levels (easy, normal, hard — with multiplication, division, etc.).
  • Global leaderboard with Firebase or localStorage persistence.
  • Power-ups (e.g., “Ghost Shield” for temporary invulnerability).
  • Random lightning and thunder effects for extra drama ⚡
  • A mobile app version with touch-friendly UI and offline mode.
  • Adding an optional multiplayer mode where two players race to survive!

Haunted Math Challenge proves that learning can be scary — in the best way possible.
Solve fast, stay alive... and don’t let the ghosts of wrong answers get you. 👻

Built With

Share this project:

Updates