Build a Simon Game feedback


Build a Simon Game

When I started to write the code, I wanted to publish on codepen. On CodePen all project are singe-file projet, or I don’t know how to publish modules on CodePen. I have write everything into one javascript file. I see already should be much better to separate the code minimum 3-4 different module. Also I don’t know how to upload files to CodePen. At least I changed CodePen to Github.
You can find and check the code here:


Live page

Please test the game, if you find any bugs I will fix them.

While I developed this project I learned a lot!
Many css animations… with several transitions…
… many-many-many DOM-manipulations.
I also used my previously developed getLocation() method (in local weather project). I needed modify nothing… Great! In the future I will strive to develop as many reusable classes as just possible.
I also continued develop my own AJAXCall() method. Now handle also POST method…
Only the error handling missing still…
And at least: I did not use any libraries. Everything are pure javascript!
I hope I am walking on the right way.

I did not follow strictly the user story because I did not want to build another circle- or square- or triangle-style Simon game.
I tried to realize my own ideas:

  • The menu a bit tricky: (click on…)
    Alien-mouth: change strict mode on/off
    Alien-eye: left: lower difficulty, right: raise: difficulty
    Alien-forehead: start game
    Info window on bottom: Click: open Hall of Fame
  • you can find 3 difficulty:
    • Simon
    • Super-human
    • Alien-intelligence
  • I made some animations with css
  • I also made a Hall of Fame where stored the records of players. I did not use database, instead I save the data to json files. Only the top 10 players saved (name with country, date and performed turn).
  • If you choose strict mode: on, then you can save your record.
  • Info and restart button: hidden on top by default. Hover over the top area to open it.
1 Like

@lendoo WOW!!! Super cool! Very creative!
Great idea that you took design desicions into your own hands. The alien/spaceship theme is cool.
Here are my opinions on how you can make improvements to your application.

  • Menu at the top should not be a hover effect. It would be nice if it faded in on page load.
  • The neon should not flicker so rapidly. I think it should fade in and out slowly using opacity: 0.5 to opacity
  • Have some kind of visual instructions on how to play the game would be nice. People need to know which keys to press or what to click on.
  • How do you exit the game?
  • Recommend removing the Star Wars intro. People would prefer to go directly into the game. That could be saved for the end of the game for those that make it to the last level.
  • Include a link to your Github or personal website so people can contact you to tell you what a great application you have made. You may get someone who wants to collaborate with you.
  • Not sure how the cow fits into the alien/spaceship theme.

Keep working on this and add it to your personal website.