Game title : Music Memory Matcher
Description: Match Images of Musicians to The Titles of Their Songs
There are 10 cards with 5 images of musicians to be matched to the remaining 5 cards with the titles of their songs.
User Story: As a player, I want to match 5 Musician's images to the title of their songs to score 10 points.
Pseudocode: Each successful match of a musician to his song will earn a score of 2 points with the aim of completing the 5 matches to earn 10 points.
Background Info:
- 10 cards
- Cards will display images of Musicians with cards with matching names
- Cards will have two faces.
- Upper face to have a symbol to differentiate cards with images from cards with titles of songs.
- The downfacing face to reveal images or titles of songs once clicked.
Screenshots: https://app.uizard.io/prototypes/JJAK8O6JoxUKxrPvwElJ/player
Technologies used:
- HTML
- CSS
- Javascript
Getting Started:
-
Link to the Game- https://odunlola.github.io/MemoryMatcher/
-
Instructions- There are 10 matching cards 5 cards are images of Musicians and the other 5 cards are titles of their songs. The player is to match the musicians images to the titles of their songs. The player clicks on a card and it flips over to reveal an image or a song title. The image cards are distinguished from the song cards card by symbols. This is continuously done until all ten cards are matched. For each match, the player scores 2 points. At the end of the game the player scores 10 points in total.
Next Steps: Planned Future Enhancements - To play a line of the song once its matches.
References: https://www.w3schools.com/jsref/prop_element_classlist.asp https://www.w3schools.com/jsref/met_element_removeeventlistener.asp https://www.w3schools.com/jsref/prop_html_innerhtml.asp Class lectures - tictactoes