The Problem

After analyzing the performance problem, I confirmed with my Subject Matter Expert (SME), that the new police officers had the knowledge, but lacked the skills required to navigate these tense situations successfully. I proposed a scenario-based eLearning experience where the new recruits could practice utilizing steps in the Force Continuum protocol to aid in de-escalating situations that they faced while on the job. The goal was to reduce the long term negative impacts of the problem by providing a risk-free environment to make choices and see consequences. This helped the learner connect their choices with the real-world consequences.

Question 3

I followed the ADDIE model as a guide to designing this project. I first met with my SME, an experienced police officer who guided me in creating an action map. The action map guided me in the development of the text-based storyboard. I then began designing visual mock-ups in Vyond for approval and developed a visual storyboard with programming notes.

I then created an interactive prototype in Articulate Storyline 360. After incorporating the feedback from my SME on my prototype, I developed the project in Storyline.

After the initial discussion of the problem and the proposed solution, I consulted with my SME, to determine actions that were being completed incorrectly by new recruits. With his direction, I created the action map. I was informed by my SME that the high priority actions most critical for new recruits was the application of force on each level of the Force Continuum. From there, the SME helped me identify the top three high-priority actions that would serve as the basis for this eLearning project:  when to perform de-escalation techniques, when to use force if the suspect becomes physically aggressive, and when to use a weapon if the suspect is armed and poses a clear and immediate danger. 

Once the action map was complete, I worked with my SME to get more information to create the text-based storyboard. This was a vital step in the process as it served as the blueprint for the overall design and development of the project. 

The storyboard was written so that each question was a high-priority action that the user had to practice. The story was written to immerse the user in a real-life situation that could occur on the job of a new recruit. Consequences for each question were shown when the user chose incorrectly. I continued to collaborate with my SME to ensure that the actions and consequences modeled real-life as closely as possible.

For guidance, I introduced a mentor character that assisted the user through the experience and provided information on-demand.  I also created a Deputy Badge Star Success Meter as a gaming component to help encourage the learner. A star would appear if the user chose the correct action. Getting three stars allowed the main character to earn his Deputy badge.

After receiving approval on the storyboard, I created a mood board and style guide in Figma to establish the visual direction for the project. The style guide informed the layout and design choices for the high-fidelity mockups. I selected colors that were drawn from the Vyond video assets—specifically the characters and backgrounds—to ensure visual cohesion across all media. I also chose fonts and a color palette that not only complemented the overall tone of the project but also reflected the look and feel of real-life police uniforms, enhancing realism and relevance.

After creating the style guide, I iterated on the wireframes to solidify the layout for each type of slide to be included in the prototype (Title Slide, Mentor Slide, Question Slide, etc.) Using Figma, I rapidly iterated through multiple versions of the visual mockups, refining layout, color schemes, and user interface elements to enhance clarity and engagement. I focused on integrating specific visual elements—such as icons, illustrations, and consistent typography—to bring the content to life and support key learning points. Throughout the process, I regularly referred back to the text-based storyboard to ensure that the visual design remained aligned with the intended learner experience and learning objectives. 

Once the visual mockups were finalized, I moved into prototyping the eLearning experience using Articulate Storyline 360. The interactive prototype included the title screen, scenario introduction, mentor introduction, and the first question’s correct and incorrect consequences. I focused on capturing the overall UX/UI through these slides to ensure the navigation felt intuitive and the experience remained immersive.

To enhance engagement, I implemented smooth fade transitions and crisp animations throughout each slide. I also prototyped a custom animation sequence utilizing multiple motion paths throughout the project. Many animations were synchronized with audio. Additionally, I introduced the first version of the “success meter”—a visual tool designed to reflect the consequences of learner choices in real time.

The prototype was shared with key stakeholders and members of the instructional design community to gather feedback on usability, flow, and visual design. Based on the feedback, I made minor refinements, including tightening transition timings in both Vyond and Storyline, and adding audio cues to the police cars and ambulances. With the core framework validated, I proceeded to full development.

Example of scene created in Vyond

Full Development

After collecting detailed feedback on the prototype and applying several thoughtful iterations, I moved forward with developing the full project. The final product consists of over 90 dynamic videos, originally designed in Vyond and seamlessly integrated into Articulate Storyline 360. Each scene was carefully crafted to deliver an engaging, immersive experience tailored for new police recruits.  

Custom Animations: Using Vyond allowed me to bring the story to life with expressive characters and visually engaging scenarios. The animation helps learners step into the shoes of a new recruit, experiencing day-to-day challenges and decision-making processes alongside the characters. This approach keeps engagement high and reinforces key learning objectives through continuous motion and visual storytelling.

Motion Paths: Motion paths were intentionally applied throughout to direct the learner's attention to critical details, and maintain narrative flow and tone. These guided movements contribute to a cinematic feel, enhancing the storytelling while ensuring that educational objectives are met.

Sound effects: Minimalist yet powerful, the sound design enhances emotional impact without overwhelming the learner. Key sound effects are placed at pivotal moments—whether it’s the siren of a police car, a radio dispatch, or an alarm—providing a subtle but effective layer of immersion.

Gamification- Success Meter: To enhance learner engagement and reinforce emotional awareness during interactions, I implemented a Success Meter as a form of light gamification. This feature visualizes the emotional intensity of the passenger's dialogue, giving learners real-time feedback on their decisions throughout the scenario. The Success Meter rises or falls based on the learner’s selected dialogue or actions during passenger interactions. As learners make effective choices, the meter increases, signaling successful de-escalation of the situation. Poor decisions cause the meter to decrease, heightening the tension and encouraging reflection on communication strategies. This mechanic not only contextualizes the emotional stakes but also ties directly into narrative progression—helping the officer earn their deputy badge by the end of the training. It adds a layer of motivation while supporting the core training objective: managing high-stress encounters with professionalism and empathy.

Results and Takeaways

I presented my project to Instructional Designers and aspiring ID’s and the project was well received. They felt that it was “engaging” and was “easy to follow”. The story itself flowed well, which allowed them to learn from the experience. This was my primary objective in creating this project. 

Storyboard challenges: The most difficult part of this project was developing the storyboard. As a visual learner, it was hard to imagine the story without seeing it, so I created a visual storyboard alongside the text-based one. While building scenes in Vyond, I added screenshots to the visual storyboard to help me visualize how everything would come together in Storyline. It was a lot of work, but it made the storytelling process more cohesive and clear.

Timing: Each video was first created in Vyond, then imported into Storyline. The biggest challenge was finding the right timing—aligning videos with textboxes, audio, and animations. I spent the most time adjusting and revising the timeline to ensure each scene flowed smoothly and worked as intended.

Incorporating Multiple Platforms: One significant challenge involved designing props, editing them, and integrating them across multiple platforms—specifically, Canva, Vyond, and Storyline. A key example is the Deputy Badge that appears at the end of the story. The badge was first created and edited in Canva, then exported into a Vyond scene. From there, the scene was brought into Articulate Storyline, where a Zoom Region was added to focus on the badge for a close-up view. This multi-step process required careful coordination between platforms to ensure a seamless final product.

Sound/Video resources: The sound effects added the dramatic tone I was aiming for. I sourced audio from Pixabay—like police sirens and feedback sounds—and edited them to fit the timeline. This process taught me a lot and inspired me to explore sound design further using tools like Captivate and Camtasia.

Appreciation for the ID Process: Instructional Design involves many steps and revisions. Experiencing the full development process firsthand showed me the value of patience, attention to detail, and thoughtful design. Despite the challenges, I truly enjoyed bringing this project to life.