minesweeper-game

A minimalist, MUJI-style browser-based Minesweeper game created for DTC 477: Advanced Web Design. This project # MUJI-Inspired Minesweeper

A minimalist, MUJI-style browser-based Minesweeper game created for DTC 477: Advanced Web Design. This project combines canvas rendering, responsive design, sound integration, and both mouse + keyboard interaction in a refined, single-file web app.

---

🧠 Project Summary

This game replicates the classic Minesweeper experience, designed with accessibility and aesthetic minimalism in mind. Users can click or use keyboard controls to play, with sound effects and optional background music for immersion.

---

🚀 Features

• 💣 10×10 grid with 10 randomly placed mines
• 🖱️ Mouse controls: left-click to reveal, right-click to flag
• 🎮 Keyboard navigation:
  • Arrow keys to move
  • Enter to reveal
  • F to flag
• 📱 Mobile support with long-press for flagging
• 🎵 Soundtrack toggle + responsive audio FX
• ⏱️ Timer display + animated game over / victory state
• 🧊 Aesthetic: MUJI-inspired textures, soft palette, and blurred overlays

---

💡 Tech Stack

• HTML5
• CSS3 (custom design system)
• JavaScript (Canvas API, event handling)
• Audio integration via <audio> elements

---

🧠 AI Support Notes

I used ChatGPT to brainstorm:

• Visual design layout and MUJI theming
• Sound layering + mobile UX
• Canvas scaling and game loop logic
• Toggleable keyboard mode and flag interaction

---

📎 Credits

Sound & image sources listed within the code attribution section.

Created by Zoe Thompson | DTC 477 | Washington State University Vancouver