WDI PROJECT 1

Project Brief:

Render a game in the browser Switch turns between two players Design logic for winning & visually display which player won Include separate HTML / CSS / JavaScript files Stick with KISS (Keep It Simple Stupid) and DRY (Don't Repeat Yourself) principles Use Javascript or jQuery for DOM manipulation Deploy your game online, where the rest of the world can access it Use semantic markup for HTML and CSS (adhere to best practices)

Deliverables:

A working game, built by you, hosted somewhere on the internet A link to your hosted working game in the URL section of your Github repo A git repository hosted on Github, with a link to your hosted game, and frequent commits dating back to the very beginning of the project A readme.md file with explanations of the technologies used, the approach taken, installation instructions, unsolved problems, etc.

Experience

After two weeks of lessons on mark-up and code fundamentals I was really excited to be given a project which enabled me to test and consolidate my learning. I chose to make a memory game as it is the sort of game my mother often plays on her mobile. I also felt that the level of complexity would suit my level of confidence in writing Javascript at this stage of the course. My game is one where the computer generates a random sequence which flashes on the grid. The user then has to remember the order that the squares appeared and click the same pattern. If correct the score is increased and after 4 points the level goes up with a longer sequence presented. If the user gets the sequence wrong, the game ends.

Deployed version can be found here: I created a simple game with minimalist design in order to focus on the KISS and DRY principles we have been instructed to adopt when organising our mark-up and code files. I wanted to keep my code as easy to read as possible and implement best practice in layout and organisation from the outset.

The final browser version of the game looks like this: https://karafuru.herokuapp.com/

I then spent time writing a CSS media query to create a mobile version of the game. This was an important aspect for me as I really enjoy CSS styling but also because I felt it was more fun to play this game on my phone than clicking the squares on a web browser.

Features I would add if I had more time:

robust responsive design

music and sound effects

save top score