I was inspired to build this demo for this eLearning community challenge.  The task was to build a unique format for multiple-choice questions. Click here to try this demo for yourself.

Having recently studied Spanish while traveling in Ecuador and Peru, I decided to make a Spanish vocabulary quiz. In real life, you need to be able to name objects in the context of a full environment, not just as isolated questions. Therefore, I wanted users to answer by clicking on objects in realistic scenes they might encounter in real life.

First, I built the “click to answer” interactions. I tried to build them that they could be replicated quickly for each slide.  Though requiring more effort than standard multiple-choice slides, the process is not complicated, and could be scaled up efficiently for larger project.

I soon discovered users could easily get stuck on a word, and might resort to clicking randomly to find the answer. This is frustrating and pedagogically ineffective. I solved this problem by adding a vocabulary tab that can be accessed at any time. If the user guesses incorrectly three times in a row, the system now prompts the user to open the vocab tab, instead of continuing to just guess.

Many eLearning quizzes end with a simple results slide. I designed this differently too, by showing a variety of performance statistics. Furthermore, I added written feedback that adapts to their stats, resulting in 15 different possible messages. The text adapts to 3 numeric variables: questions skipped, questions answered correctly on the first click, and times they opened the glossary. This gives the results slide a more personal and encouraging voice.