There are three screens in the core game structure. While it may seem simple, you will find that there are many creative and engaging things you can do in your customized design.
Welcome Screen The welcome screen can simply welcome the visitor to the game and give some background on your game. It will display a start button to take the visitor to the first question. You can optionally include some basic metrics about the game, like how many questions await them.
Question Screen The question screen is the most important screen. In that it not only presents the trivia questions to the visitor, but also will display feedback on correct and incorrect answers. The question screen can also include running data; like a score, progress, or timer.
Thank You Screen The thank you screen will gracefully inform the visitor that they have finished the game. This screen can provide additional data, like how well they played the game, and provide a button to play it again.
The code template is built with HTML/CSS/Javascript. The custom question database can be directly included as a Javascript object array or created in a connected Google Sheet. Creating the database in a Google Sheet is most convenient and much easier to edit.
This tutorial simply builds the code template step by step to help you understand how it works. Go to 1. Screens as Containers.