Movie Quiz is a website designed to let users test their knowledge of the cinematic universe. When the users finishes the quiz, they will be presented with a total score in order to compare the results with their friends.
The goal was to create a simple, easy to use quiz game for users that want to test their movie knowledge. Whether that's about music composers, directors or the actual content within them.
The quiz is targeted at the broader movie interested audience.
- As a user I want the quiz to be easy to navigate.
- As a user I want clear feedback on my performance.
- As a user I want to be challenged.
- Simple design with few choises across all devices.
- A flow of information that is clear and easy to understand.
- Satisfactory feedback on user inputs.
Since the quiz is quite simple in it's design, I felt like there was room for a more relaxed font style. Therefore I decided to use 'Slackey' for the logo. To not exaggerate this I decided to use 'Peralta' for my headings as this comes across as a slightly tuned down version of 'Slackey'.
Along with the nature of the fonts I decided to take a more colorful approach on the back & foreground-colors. To give contrast to the bright orange buttons and white headings I chose a darker blue for the contents background while the body consists of a lighter beige color in order to keep the lighthearted feel that the quiz is aimed to represent.
- Game background: #012133
- Buttons: #ff6600
- Heading text: #fff
- Body Background: #eee8aa
The header is simple and only consists of a logo to represent the quiz.
The start page contains a button on which you can start the actual quiz.
The Q/A page shows the question in the heading above and questions grouped in two options per line.
After completion of the quiz the results page will display the users score in comparison to the maximum score. Here, the user will also be able to replay the quiz through the "Play Again" button.
- Possible future features would include a bigger and more random selection of questions making it so the game becomes different each time you play.
- Adding a scoreboard to be able to compare yourself to other users.
- HTML
- CSS
- Javascript
- Sweet Alerts 2
I asked my girlfriend to try the quiz out on her Iphone 5 and give me feedback on it and the user experience seemed overall positive.
Testing the application had me try the different screen sizes using the dev tools chrome extension aswell as using different browsers. Responsiveness is present on all screen sizes.
- No knows bugs
- In github repository, go to settings
- Select master branch as source location.
- Press the provided link
- Site is accessible via Movie Quiz
- Credit to my girlfriend for helping with testing of the quiz.