Skip to content
A recreation of the original Simon game. HTML, CSS, Javascript, JQuery
CSS JavaScript HTML
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
screenshots
.gitignore
README.md
app.js
favicon.ico
index.html
package-lock.json
package.json
server.js
style.css

README.md

Retro Simon Game

Goal

To re-create the Simon memory game created by Milton Bradley in 1978. I tried to make the game feel as authentic as possible. I followed the style of the original game as closely as possible.

Technologies used:

HTML5
CSS3
Javascript
JQuery
Deployed with Surge

Description

I created this app at the end of the first quarter during the Full-Stack Web Development immersive at galvanize in Austin. I learned Javascript, HTML, CSS, and JQuery during the first quarter so that's all I had to work with on this project. I had one week to make this project. Simon is a memory game where the player is shown a pattern and they must play that pattern back in the right order to get a new pattern. The goal is to get as many patterns right as possible and build your streak. Once you get one wrong you have to start over.

Biggest Challenge

I had a problem with displaying the pattern properly. I was trying to loop through an array and toggle a class that lit up the correct color in the pattern. I was trying to use a for loop, but the iterations happened so quickly that all of the colors were just lighting up at the same time. I tried everything I could think of to delay the iterations in the for loop with no success. I eventually did some research and came up with a custom recursive solution that used setTimeouts to control the speed of the toggling and the incrementation through the array.

Final Design

App Screenshot

Click The Image Below to See a Video Walkthrough

Video

You can’t perform that action at this time.