Skip to content

A memory (concentration) game - Done for Udacity Front-End Nanodegree (2018).

License

Notifications You must be signed in to change notification settings

dimikara/Memory-Game

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

42 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Memory Game Project

Table of Contents

Instructions

  • How The Game Works

The game board consists of sixteen virtual cards arranged in a grid. The deck is made up of eight different pairs of cards, each with different symbols on one side. The cards are arranged randomly on the grid with the symbol face down. The gameplay rules are very simple: flip over two hidden cards at a time to locate the ones that match!

Each turn:

The player flips one card over to reveal its underlying symbol.

The player then turns over a second card, trying to find the corresponding card with the same symbol.

If the cards match, both cards stay flipped over. If the cards do not match, both cards are flipped face down.

The game ends once all cards have been correctly matched.

The goal of the game is to match all the cards in the least moves & time possible.

  • Rating

0 - 15 moves : Three stars

16 - 23 moves : Two stars

24+ : One star

To read the instructions in the game, press the "How to play" button.

You can play the game here: https://dimikara.github.io/Memory-Game/.


Technologies

The game is built with HTML, CSS, & Javascript.

I also used Sweetalert2 for the popup that appears in the end of the game.


Screenshots

  • The game on PC

Screenshot1

  • The instructions that appear when pressing "How to Play" button

Screenshot2

  • The game on mobile

Screenshot3

  • The end modal

Screenshot4


Credits

  • The webinar with Yahya Elharony during FEND Study Jam was pretty helpful for me to understand the dynamics & structure of the game. I was able to build the base and then move up from there.

  • For more info on Sweetalert2 & how it is used, see: https://sweetalert2.github.io/

  • Font: Mina

  • Icons: Font Awesome Icons


License

MIT License.

Copyright (c) 2018 Dimitra Karamperi