This is a work in progress and will be updated as the project continues along.
- The starting screen should have a button that users can click to start the quiz.
- Users should be prompted through a series of at least 5 multiple choice questions that they can answer.
- Users should be asked questions 1 after the other.
- Users should only be prompted with 1 question at a time.
- Users should not be able to skip questions.
- Users should also be able to see which question they're on (for instance, "7 out of 10" and their current score ("5 correct, 2 incorrect").
- Upon submitting an answer, users should:
- receive textual feedback about their answer. If they were incorrect, they should be told the correct answer.
- be moved onto the next question (or interact with an element to move on).
- Users should be shown their overall score at the end of the quiz. In other words, how many questions they got right out of the total questions asked.
- Users should be able to start a new quiz.
- Render answer choices in a
<form>. - Use semantic HTML, along with CSS and jQuery.
- Follow a11y best practices.
- Refer back to the checkpoints on accessibility and forms for help.
- Use responsive design.
- Be fully usable by keyboard (which will be easy enough if you start with a form).
- Gather content for your app. That means typing up the questions you'll ask and gathering any images or icons you'll need.
- Think about the user experiences outlined above and how your design must make them possible.
- Design your app using HTML wireframes, which are HTML- (and minimal CSS-) only versions of the different screens in your app.
-
"What value would be returned with the following statement?"
-
"What is the value of ourObj.name after this executes?"
-
"What is the total width of this item with standard box-sizing?"
-
"How can we alter the following variable?"
-
"What is the value of index 7 in this array?"