Thanks to visit codestin.com
Credit goes to github.com

Skip to content

HaroonAlnhdi/Quiz-Game

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

40 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Quiz Game

Date: 10/7/2024

By: Haroon Ali Alnhdi


Description

Quiz games are interactive games designed to test and enhance a player's knowledge on various topics through a series of questions. These games can be played individually or in groups, and they often feature multiple-choice questions.

drawing

User Stories

  1. The user should be able to see a landing page when I arrive at the website to know I'm in the right place.
  2. The user must be able to see the "start game" button.
  3. The user should be able to see one question at a time with multiple answer options.
  4. The user must be able to select an answer for each question.
  5. The user should be able to see feedback after selecting.
  6. The user should be able to proceed to the next question.
  7. The user should be able to view the total score.
  8. The user should be able to view time of the questions.

How To Play

  1. Start a Quiz: Click start quiz.
  2. Read the Question: Carefully read the displayed question.
  3. Choose an Answer: Click on the option that you think is correct.
  4. Submit Your Answer: Click the "Next" button to submit your answer and move to the next question.
  5. View Results: At the end of the quiz, view your score, time taken, and correct/incorrect answers.
  6. Play Again: To play the game again.

Technologies Used

  • HTML
  • CSS
  • JavaScript
  • GitHub

Getting Started

The project itself was deployed and can be viewed here.

Screenshots

Project layout

drawing

This image shows the overall layout of the project, highlighting the structure and user interface elements.

Colors

drawing

This image displays the color scheme used throughout the quiz game, demonstrating the visual design and aesthetic.

Home Page

drawing

The home page of the quiz game, where users can start the quiz and access other features.

Question Page

drawing

An example of a question page, showing a single question with multiple answer options for the user to choose from.

Display Result

drawing

The results page, where users can see their final score, time taken, and a summary of correct/incorrect answers.

Future Updates

  • Get questions from API

  • Implement different difficulty levels (easy, medium, hard)

  • Add a timer for each question and deduct points for slow responses

  • Include multimedia questions (images, audio, video)

  • Add more diverse question categories

  • Integrate social media sharing to post scores

  • Added message hiding after 1 second.

  • Display final result without hiding the message.

  • Updated UI for better user experience.


Credits

Javascript Reference: JS Search
Colors: Coolors.com
HTML elements reference: developer.mozilla

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published