Creating a CPR in Veterinary Medicine Scenario in H5P

Creating a CPR in Veterinary Medicine Scenario in H5P

February 19, 2023 Off By JR

Through the end of 2022 I had the privilege of working with Jen Loewen on a branching scenario about CPR in veterinary medicine. This was a really cool project and a perfect example of an approach to instructional design that started with design & prototyping and used iterative feedback to dial in the design and development.

Jen was generally interested in scenario-based learning and tools that would help students learn, in this case, process learning. This specific scenario idea was born from a curricular change where some of her students would know the decision algorithm and others would not. This led to creating a learning and reinforcement tool students could access at any time. We collaborated through some independent work and also through synchronous design sessions to make revisions, discuss key points about the scenario and approaches, and refine the H5P activity.

Having worked on numerous scenarios with instructors, one thing that often comes up early on is shifting our mindset from a testing mindset to a decision-based mindset. What does that mean exactly? Well, in many higher education contexts we might find ourselves in front of students, and to determine whether they can recall a concept, we will ask directly. Something like, “what does this ECG indicate about the patient’s status?” The shift to decision-based questions looks more like “what do you do next?” implying, “given what you currently know, what decision do you make?”

It can seem subtle, but it is a big difference. It’s a bit like the shift from knowledge assessment to performance assessment. You can demonstrate understanding by making the correct decision (or a correct one). There are plenty of times the inverse is not really true. I might be able to tell you what the ECG means, but when it comes to applying that knowledge to make a decision, I make the wrong choice.

With this change in mind, we set forth to lay out the scenario. I’ve mentioned plenty of times before that I lean heavily on ideas and processes proposed by Christy Tucker (bookmark her blog!) Many IDs trying to create scenarios for the first time jump to their regular storyboarding approach (e.g. in Word). That can become cumbersome to manage, so instead, we used Twine. Twine allowed us to see a scenario map, easily connect and revise decision points, and track changes to the scenario. The first thing we did, following Christy’s advice, is to build the ideal path first. This provided a skeleton for us to build off of and not get hung up on how many decisions and the effect each individual decision would have. This approach breaks down the work quite nicely. We didn’t even put in the other decision items; we just used placeholders such as bad decision, and neutral decision.

Once we got to consider other options at each decision point, that brings up another design consideration. Some scenarios are simply punishing, sending you back to the beginning anytime you make a choice that isn’t right. For this particular scenario, I posed the question, “would this decision be fatal or irreversible if selected?” This resulted in only a few places where our patient, Lucky, wouldn’t be so lucky. This reduces the learner’s stress and is similar to real-world decision-making.

A screenshot of the authoring interface in H5P. On the left are component menus and on the right is a map of the branching scenario.

Scenario Map in H5P

After building out the branches, we faced the challenge of incorporating feedback. Cathy Moore writes about making the learner think rather than being an omniscient voice from the sky screaming “correct” or “incorrect” at every chance. We adopted this approach in a couple of ways. First, after a choice is made, some description of the outcome is shown to the learner. This is absent of the correct/incorrect language. We had another feedback too at our disposal as well, other characters. Early in the writing process, Jen introduced two other characters to bring in the crash cart, just like what might happen at the clinic. This allowed us to make these characters more active in the scenario. There are moments when the learner can direct another character to perform a task. With regard to feedback, if you ask a character to do something, they can speak back to you. This allowed us to put up slight guide rails just like if you were working with others to save your patient.

A feedback box saying that Joe intubates Lucky.

Telling a character to perform a task, and that is a correct decision.


A feedback box indicating Joe accepts the task, but also provides feedback from Joe that this might not be the correct decision. An image of Joe in an explaining pose is on the left.

A character doing the a task, but reminding the user of the priorities.

Most of the feedback in the scenario is what Clark & Mayer (2012) would describe as intrinsic feedback. There are some instances where we built in more instructional feedback to point learners to relevant resources or remind them of things.

Jen took the prototypes we developed to some of her students and asked them to try it out. Two pieces of feedback we incorporated were a tutorial screen and animations. Because of the way H5P makes use, of course, presentations to present content, some students skipped over some details or hesitated on where to click. At the beginning of the scenario, the first option you encounter is whether you want the tutorial or not. I borrowed this from video games I play where I get really, really annoyed if I know how to play, and I’m forced into going through a tutorial n-times.


A screenshot of a select menu, one option to view the tutorial and the other to skip it.

Choosing to view or skip the tutorial.


A tutorial screen with four sections. An introduction, followed by three steps indicating to view content, proceed, and make a choice.

One slide interface tutorial.

The other feedback had to do with the ECGs. We started with static images, but over one weekend, I was pondering how I could animate them as I thought that might be better. Sure enough, the students said they’d prefer those to be animate. While H5P does not have an animation option, years ago, I figured out you could drop in animated GIFs. We went with that approach so they would play automatically and loop. If we had used video, students would have had to click play which we didn’t really like the idea of.

A animation of an ECG with three pulses, then flat lining.

This is a screen capture GIF so it looks a little rougher than the real product.

A final thought on how it was deployed in its pilot phase. While it can be used for individual study, Jen brought it to her lab and had students work through the scenario in small groups. Following the activity, they had a whole class debrief where they could talk about the scenario and the decisions they made. They found it so interesting how each group made slightly different observations and decisions, and from what I heard, it was a positive and rich discussion. There are so many ways this scenario can be used going forward, it’s a really exciting one, and I’m so happy I could complete it before changing roles at the end of 2022.