Simple Simon Game with HTML, CSS, and JavaScript

Have you ever played Simon Says — the classic memory game where you repeat sequences of lights and sounds? I have developed my own digital version using basic web development skills. In this blog post, I’ll walk you through how I built it with HTML, CSS, and JavaScript.

Project Overview

This Simon Game challenges users to memorize and repeat a sequence of button flashes. The game gets harder as the sequence grows with each level. If the user makes a mistake, the game ends and they can restart by pressing any key.

Github Link

https://github.com/jayalloyd/Simon-Game/

Game Logic with JavaScript

The app.js file is where all the interactivity lives. Here's what it does:

1. Game Start: Listens for a keypress to start the game.

2. Leveling Up: Adds a new color to the sequence each round.

3. User Interaction: Captures user clicks and checks them against the game sequence.

4. Game Over: If the user clicks the wrong button, the game ends and resets.

What I Learned

• DOM manipulation and event listeners

• Array comparisons and sequencing logic

• Game loops and reset states

Try It Yourself!

If you want to test your memory skills, clone or copy the code and try the game in your browser. It’s a great exercise in JavaScript interactivity, and you can always expand it with sound, better animations, or even mobile responsiveness!