A quiz-based game where you can score in pints of Guinness designed as a way for family and friends to have fun and connect online to celebrate St. Patricks Day.
View the live project here
View the repository in GitHub here
Table of contents generated with markdown-toc
- To provide a free quiz-based game that serves to;
- provide collaborative entertainment for the user
- record high scores to compare and compete with friends and family
- provide trivia based on facts about Ireland
- enable people to celebrate St Patrick's Day in a fun way from a distance
- As a Potential player of the game, I want to;
- Easily understand how to play the game with simple instructions.
- Access and play the game in a simple manner with feedback for my answers along the way.
- Compete with and compare to my friends by tracking scores through a leaderboard, on-page scoring or similar.
- To encourage as many users as possible to;
- Play & enjoy the game
- Share the results on social media.
- Responsive design for a primarily mobile use expected
- A fun way to score and play
- Easy to see high scores
-
Layout & Wireframes *Wireframe created on Figma
-
Colours
- A pallet based on colours associated with both Ireland and Guinness to give a St. Patrick’s Day vibe to the players! (key colours: Green, orange, white, black)
-
Icons
- Primary Icons should be based around the main theme of Guiness
-
Imagery
* -
Fonts
- Roboto Mono, Ribeye and PT Sans
-
Languages;
-
Libraries, Frameworks & Resources;
- jQuery
- GitHub is used to file the repository
- GitHub Pages was used to deploy the site
- GitPod was used for development and version control
- Figma was used to create wireframes and create colour scheme
- FontAwesome for the sound toggle icons
- Google Dev Tools has been invaluable for solving issues and bugs and testing responsiveness.
- Included in current deployment;
- Function to add the user name
- Quiz presented as multiple choice buttons
- Leaderboard displaying score ranking based on username
- Feedback on the quiz - if user selects correct answer their selection turns green, if incorrect then selection turns red and the correct answer shows as green
- Sound effects when user selects answer correctly/incorrectly
-
Development testing * *
* * -
Validation testing;
-
User Goal Testing;
This project is deployed on GitHub Pages using the following method;
- Log in to GitHub Pages and click on 'repositories'
- Find the correct repository (repository that you want to publish to pages.
- Go to settings from within the repository.
- Scroll quite far down the page to find the GitHub Pages section.
- Under source, there are three buttons select the branch button (at time of writing the first button of the three) and choose 'Master'.
- Once the page has refreshed (it can take a while) when you scroll back down you will see a green bar with a tick showing that your site is published.
To make a copy of the repository, which may be necessary if you wish to make changes without affecting the original using this method;
- Ensure you are logged in to GitHub
- The Fork button is on the top right of the page, above settings and below your github icon. Click on it to make a copy of the original.
Source for background photo;
- Nikola Jovanovic @danteov_seen on https://unsplash.com
Source for interesting facts about Ireland and St Patricks day;