SynapticLab · Instructional design rationale

Every Second Counts

0 s without CPR

A first-person CPR and AED rescue built in Articulate Storyline 360. The learner is the bystander in a crowded food court, and the obstacle is not missing knowledge: it is hesitation. This page explains each design decision and the research behind it.

Audience: Adult lay people
Format: Branching simulation
Length: 15 to 20 min, replayable
Tool: Storyline 360 + JavaScript
Standards: WCAG 2.1 AA · SCORM · xAPI
Status: Rescue 1 of 3

Scene 37, “Analysing”. The AED is reading the heart rhythm and a bystander reaches for the victim's hand. The learner has seconds to decide.

The problem

People know CPR exists. They freeze anyway.

Out-of-hospital cardiac arrest is common in Canada, and survival depends on the people who happen to be there. Bystanders often hesitate: they wait for someone more qualified, fear doing harm, or worry about legal consequences.

60,000out-of-hospital cardiac arrests in Canada each year

1 in 10people survive a cardiac arrest outside hospital

13%bystander AED use in public places

Source: Heart & Stroke Foundation of Canada, 2024.

The design bet

Train the decision to act, not only the technique.

A short e-learning module cannot teach the feel of a 5 cm compression; a hands-on course does that. What it can do is rehearse the moments where people stop: the first seconds after a collapse, the gasp that looks like breathing, the AED nobody dares to open. The module is built around those moments.

Classic research on the bystander effect shows that the more witnesses there are, the less likely any one of them is to help (Darley & Latané, 1968). Willingness to act also depends on perceived self-efficacy (Bandura, 1977). The module targets both: it makes the learner the one who moves first, and it answers each doubt with a fact the learner can rely on.

Learning objectives

Six observable outcomes, each measured in the simulation

Objectives 1 to 5 follow the chain of survival. Objective 6 targets hesitation directly.

#	The learner can…	Practised in	Measured by
1	Recognize cardiac arrest: no response and no normal breathing, or only gasps	Agonal breathing decision, warm-up	Knowledge check Q1, Q2
2	Get help by assigning specific tasks to specific people	“What do you shout?”	Q3
3	Follow the 9-1-1 dispatcher on speakerphone, starting with a precise address	Address decision, thought freeze	Q4
4	Place the hands and keep a rate of 100 to 120 compressions per minute	Hand placement, rhythm simulation	Q5
5	Use an AED: pads, keep everyone clear, shock, resume compressions	Pad placement, analysis, shock, resume	Q6, Q7
6	Name their own doubts and choose to act anyway	Four thought freezes, confidence check	Q8, confidence before and after

Pedagogical choices

What the learner experiences, and why

The overall structure follows Merrill's first principles of instruction: a real problem first, then activation, demonstration, application and integration (Merrill, 2002).

Choice	What the learner experiences	Why: evidence
Scenario-based, first person	No lecture. The learner kneels next to the victim and makes every decision, seen from their own eyes.	Scenario-based e-learning builds judgment by placing decisions in a realistic context (Clark, 2013). Clark, 2013
Cold open	The module starts with the collapse, not a title or a menu. The title appears only after the first choice.	A problem-centred start activates prior knowledge and gives every later screen a purpose. Merrill, 2002
Consequences on a clock	Hesitations add seconds to a “seconds without CPR” counter. Nothing is simply marked wrong.	Intrinsic feedback, the consequence shown in the scenario itself, is a core feature of scenario-based learning. The values are teaching costs, not clinical data. Clark, 2013
The thought freeze	At four critical moments, the scene freezes in black and white and a doubt appears: “What if I hurt him?”, “Can I get sued?”. The learner answers it to continue.	Perceived self-efficacy predicts whether people act. Heart & Stroke's 2025 guidelines ask training to address barriers to bystander CPR. Bandura, 1977; Heart & Stroke, 2025
Warm-up before the rescue	Three ungraded questions during a pause, before the learner goes back in.	Attempting to answer before learning improves later retention, even when the first attempt fails. Richland, Kornell & Kao, 2009
No external narrator	Every voice belongs to the scene: the dispatcher on speaker, the AED, panicked bystanders, Sam the paramedic.	Conversational, human-sounding narration supports learning (personalization and voice principles). It also mirrors real dispatcher-assisted CPR. Mayer, 2021; Heart & Stroke, 2025
Explanatory feedback	Every decision leads to a short explanation of why, with its source on screen.	Feedback that explains the task and the strategy is more effective than right or wrong alone. Hattie & Timperley, 2007; Shute, 2008
Rhythm practice with live feedback	The learner presses a button or the space bar for 30 compressions while a gauge shows too slow, on target, too fast.	Heart & Stroke recommends feedback devices in lay rescuer CPR training. Immediate feedback on a specific skill supports deliberate practice. Heart & Stroke, 2025; Ericsson et al., 1993
Replay	The debrief shows the seconds lost and invites the learner to replay the rescue.	Repeated retrieval strengthens long-term retention more than rereading. Roediger & Karpicke, 2006
Light game elements	A clock, a debrief and a replay, without points or badges.	Heart & Stroke's 2025 guidelines consider gamified elements reasonable in resuscitation training (stated for health care professionals). Heart & Stroke, 2025
One decision per screen	Short situations, one question, three options. No decorative images.	Segmenting, signalling and coherence reduce extraneous cognitive load. Sweller, 1988; Mayer, 2021
Application-based assessment	The final check uses new situations (a coworker, a store, a colleague's doubt), never details recalled from the story.	Testing in new contexts checks transfer, not memory of the scenario. Roediger & Karpicke, 2006
A woman victim in Rescue 2 (planned)	The second rescue puts the learner in front of a female colleague, including pad placement with a bra moved aside.	Women are less likely than men to receive bystander CPR in public. The 2025 guidelines ask training to address this barrier. Blewer et al., 2018; Heart & Stroke, 2025

Experience architecture

Seven acts on one clock

Each rescue follows the same structure, so the learner can focus on the decisions instead of the interface. The two highlighted acts carry the signature interactions.

Cold openThe collapse, the crowd, the first doubt
CheckTap, shout, recognize agonal breathing
CallAssign tasks, give a precise address
CompressionsHands placement, rhythm simulation
AEDPads, analysis, shock, resume
HandoverSam the paramedic takes over
DebriefSeconds lost, confidence, replay

The module never says whether the victim survives. It shows what the learner's decisions gained or lost in time, which is what a bystander controls.

Signature moment

The freeze

When a doubt appears, the same image drains to black and white and the clock stops. Colour returns only when the learner answers. The visual change marks the shift from acting to thinking, without any extra text.

Colour illustration: a man lies on a food court floor with AED pads on his chest, a bystander in a red jacket kneels beside him and onlookers stand in the background. — The scene, in action.

The same illustration in black and white. — The same scene, frozen by a doubt.

Accessibility

The target is WCAG 2.1 level AA. Each signature interaction has an equivalent path.

WCAG criterion	Risk in this module	Design answer
2.1.1 Keyboard	A 30-compression rhythm task	Space bar input, plus a listening version: choose the right tempo among three audio rhythms
2.2.1 Timing adjustable	Time pressure	The clock is simulated: no action is ever limited in real time
1.2.2 Captions	Six character voices and sound effects	Captions on every voice, including sound descriptions such as [Loud, irregular gasps]
1.4.1 Use of colour	Rhythm gauge and the freeze	Text always states the state: Too slow, On target, Too fast
1.4.3 Contrast	Text over illustrations	A dark band behind all scene text; every text colour above 4.5:1
2.3.1 Flashes	The shock	No flash: the shock is conveyed by sound and a short message

Visual identity

One urgent colour, everything else quiet

The palette is dark and muted, so the single saturated orange always means the same thing: something needs action now. Contrast ratios are measured against the background each colour is used on.

#0B1220

NightScene background, bottom bandWhite text 18.7:1

#C2410C

Urgency orangeButtons, AED, clock borderWhite text 5.2:1

#FDBA74

Signal orangeLabels and thoughts on darkOn Night 11.1:1

#1F2937

SlateOption buttons, feedback panelsWhite text 14.7:1

#A8A29E

StoneSecondary text, sourcesOn Night 7.4:1

#F3F4F6

PaperPractice and debrief screensInk #111827 17.7:1 on white

Element	Choice	Reason
Typefaces	Arial bold for titles, Calibri for body text	System fonts available in Storyline and on every learner's computer; clear at small sizes
Illustration	“Modern Illustrated” style, generated with one shared style prompt; fictional people; no blood or distress close-ups	Shows a medical emergency without graphic realism, and stays consistent from one scene to the next
Composition	Key action in the upper 55% of each image; top-right corner kept free	The text band covers the lower part and the clock sits top right
Two worlds	Dark screens for the rescue, light screens for practice and debrief	The learner always knows whether they are inside the story or stepping back from it
Interface	Storyline player hidden; navigation inside the scene	Nothing on screen that does not belong to the situation

Measurement

What a client could track

LMS (SCORM 1.2): completion and score from an 8-question knowledge check, passing score 80%.
xAPI: each doubt answered, rhythm accuracy (compressions on target, average rate), AED errors, seconds lost and confidence before and after.
Critical errors are tracked separately: touching the person during the AED analysis or shock.

Clinical accuracy and limits

What this module does not do

Clinical content follows Canadian sources: the Heart & Stroke 2025 guidelines, HealthLinkBC and the Canadian Red Cross. Legal content summarizes Ontario's Good Samaritan Act, 2001 and Chase McEachern Act, 2007, and is not legal advice. Places and characters are fictional.

This module raises awareness and rehearses decisions. It does not replace a certified, hands-on CPR course, and it says so on screen. Before any client release, the content is reviewed by a certified CPR instructor.

References

Sources

Bandura, A. (1977). Self-efficacy: Toward a unifying theory of behavioral change. Psychological Review, 84(2), 191-215.
Blewer, A. L., et al. (2018). Gender disparities among adult recipients of bystander cardiopulmonary resuscitation in the public. Circulation: Cardiovascular Quality and Outcomes, 11(8), e004710.
Clark, R. C. (2013). Scenario-based e-learning: Evidence-based guidelines for online workforce learning. Pfeiffer.
Darley, J. M., & Latané, B. (1968). Bystander intervention in emergencies: Diffusion of responsibility. Journal of Personality and Social Psychology, 8(4), 377-383.
Ericsson, K. A., Krampe, R. T., & Tesch-Römer, C. (1993). The role of deliberate practice in the acquisition of expert performance. Psychological Review, 100(3), 363-406.
Hattie, J., & Timperley, H. (2007). The power of feedback. Review of Educational Research, 77(1), 81-112.
Heart & Stroke Foundation of Canada (2024). More cardiac arrests are occurring and few survive.
Heart & Stroke Foundation of Canada (2025). 2025 Guidelines Highlights: CPR and Emergency Cardiovascular Care.
HealthLinkBC. CPR Basics. Government of British Columbia.
Mayer, R. E. (2021). Multimedia learning (3rd ed.). Cambridge University Press.
Merrill, M. D. (2002). First principles of instruction. Educational Technology Research and Development, 50(3), 43-59.
Richland, L. E., Kornell, N., & Kao, L. S. (2009). The pretesting effect: Do unsuccessful retrieval attempts enhance learning? Journal of Experimental Psychology: Applied, 15(3), 243-257.
Roediger, H. L., & Karpicke, J. D. (2006). Test-enhanced learning: Taking memory tests improves long-term retention. Psychological Science, 17(3), 249-255.
Shute, V. J. (2008). Focus on formative feedback. Review of Educational Research, 78(1), 153-189.
Sweller, J. (1988). Cognitive load during problem solving: Effects on learning. Cognitive Science, 12(2), 257-285.
W3C (2018). Web Content Accessibility Guidelines (WCAG) 2.1.