Picture of a phone on a white table

Gamified eLearning

This concept project was created to gamify study materials for the Amazon Web Services (AWS) Cloud Practitioner certification exam. Inspired by the style of the AWS website and badging system, this eLearning experience uses custom code (xAPI and JavaScript) to collect and track user performance data. Note: I am not affiliated with AWS and the featured badge in this eLearning project is fictitious. Correct answers are B, A, C for the quiz.

  • Audience: Amazon Web Services users
  • Responsibilities: Storyboard, Visual Design, eLearning Development, xAPI & JavaScript Implementation, Data Analysis
  • Tools Used: Articulate Storyline, Adobe Illustrator, Twine, Visual Studio Code, Veracity Learning LRS (Learning Record Store)

    Overview

    To keep motivated and engaged during my study sessions for the AWS Certified Cloud Practitioner exam, I created gamified eLearning experiences to reinforce my learning and sharpen my eLearning development skills. This project is a short demo to highlight how I plan, design, and develop gamified eLearning. I imagined an interactive quiz with a reward system and the opportunity to earn a badge. Taking technical, text-based information and bringing it to life in a gamified format is a great strategy for making learning more meaningful and engaging for learners of all ages and ability levels.

    Process

    This was a quick project that was fun to create with several animations, variables, triggers, and layers using Articulate Storyline software. Within a few hours, I had a storyboard and interactive prototype to share with my professional network. After a week of testing and gathering feedback, I improved my design by adding custom graphics and custom code that allows me to collect user performance data. Below you will see a brief summary of each step I took with this concept project.

    Storyboard 

    To ensure a satisfying user experience, I carefully mapped out goals and outlined the text, visuals, and programming details for each screen using a text-based storyboard. Although the plan changed slightly during the testing phase, having this document was important in making sure I was effective in the development process by “working backwards” and keeping the end user in mind from the start.
    AWS storyboard pic 3

    The first entry on the storyboard

     

    Mapping Out the Branching Scenario

    Branching scenarios in eLearning present an effective way to give learners multiple answer choices, let them make decisions, and give them corresponding consequences. These scenarios can be trickier to plan out and execute as they are not linear, but doing so can add a lot of value to the learning experience and make the user data you collect more meaningful to your organization. Below is a screenshot from the Twine software I used to map out the route users would take from the title screen all the way to the end of the quiz; the result is a unique score for each user based on their individual answer choices.

    Tracking branching scenario choices with Twine software 


    Interactive Prototype

    After carefully planning what each screen would look like and how they would connect, I developed an interactive prototype in Articulate Storyline to test the quiz’s functionality and to get feedback on the visual design. I shared it with my professional network of instructional designers and eLearning developers who suggested that I add custom code and graphic design elements. Below is a screenshot of one section of triggers that I added to customize this project; these triggers make the quiz interactive and ensure that users end on the correct results screen based on their answer choices.

    Triggers for the Question 3 results screen


    Full Development

    In response to the feedback I received about my interactive prototype, I upgraded my design by creating a badge that I designed in Adobe Illustrator. I also added custom code (xAPI and JavaScript) that connects the quiz to a Learning Record Store where I can collect and analyze user performance data. This portion of the project is currently being tested and a summary will be posted here upon completion. Please check back!

    Want to see more?

    My next project features a self-paced training that improves the decision-making skills of humane society volunteers.