How to Apologize - Interactive Game-Based Scenario
Hey everyone!
We wanted to share a project that we presented this year at DevLearn's DemoFest.
Play through the scenario linked below for a safe space to practice apologizing. It walks you through an example situation to help you understand the impact of your words and actions. At the end, you’ll get tips for how to improve your approach constructively.
How to Apologize Landing Page
Some features of this project include:
User/Player Experience
-
- Choose your character: At the start of the scenario, learners get to select a character set. We chose a diverse range of individuals so that players are able to choose a couple that resonates with them.
- "Observation" and "Reflection" notifications: You receive notifications at each decision point. These optional video segments give the player more context/information about what is happening in the scene.
- Stress Meter: The stress meter goes up for every "wrong" answer and down for every "right" answer. When the stress bar maxes out, it blocks the "best" answer in the interaction. This is to mimic the real-world feeling of being stressed out and unable to think clearly.
To reduce your stress meter when it maxes out, you can watch an observation or reflection video clip to regain clarity and select the best answer. - Immediate Feedback: The partner character's body language and facial expressions are adaptive to how respond at each decision point. When you select a correct answer, they soften their face and open up, but when you select an incorrect answer they stiffen and close off.
- Customized summative feedback: At the end of the scenario, players are provided with feedback specific to their answers throughout the scenario. Feedback is presented using variables, so it is completely customized to an individuals unique answers.
- Choose your character: At the start of the scenario, learners get to select a character set. We chose a diverse range of individuals so that players are able to choose a couple that resonates with them.
Development:
-
- The scenario was developed in Storyline 360 and exported to HTML.
- We are hosting the project on a dedicated webpage using an iFrame, but it also lives on the client website
- We set up JavaScript tracking to keep track of user activity to inform the continual improvement of the learning experience
Media Production:
-
- Our in-house animation team developed the characters for this project, using a 2D animation style with detailed faces to showcase a range of emotions. We used simple 3D backgrounds (built in Blender) to focus attention on the characters.
- We used a professional sound engineer to create an emotive score for the experience.
- We used Storyline's built-in elements to build the user interface for choice screens, the notification bar, and the Stress Meter.
- Our in-house animation team developed the characters for this project, using a 2D animation style with detailed faces to showcase a range of emotions. We used simple 3D backgrounds (built in Blender) to focus attention on the characters.
Feel free to reach out with any questions!
