Quiz progress nav

Purpose

Quiz and test progress nav allows a learner to navigate through questions quickly and shows which questions they answered correctly or incorrectly.

Example

Screenshot 2018 02 14 12 11 20
Screenshot 2018 02 14 12 11 54

Live Examples

Example of Progress quiz nav

Description


Elements

Assessment navigation consists of an introduction and summary items at either end, with any number of question items in the middle.

The current item, whether question, introduction or summary, is highlighted in pink, with other items blank and hovering to blue.

The responsive pattern is that three items are visible on a smaller screen at one time, so the current item is visible in the middle of a smaller screen, with one item either side also shown (view by shrinking your screen).

Quiz navigation follows the same pattern as test navigation, but without the introduction and summary steps.

The quiz navigation pattern somewhat differs from the usual FutureLearn past-future colour spectrum, as questions can be answered in any order, but once they are answered they are blue.

Step navigation within steps follows the same past-future pattern as the rest of the FutureLearn progress indicators, with steps in the past indicated with blue, current with pink and future with blank.