CPR Training Website Prototype

Phase 1 — Recognition (Guided Cues)

Use “just-in-time” prompts to reduce stress and help beginners build the correct mental model.

Pulse Check Timer

10s

Compression Rate Target

100–120 bpm

Metronome-style guidance

Depth Target

2–2.4 in

5–6 cm

Guided Steps

Tip: In real CPR training, use certified guidance and manikins with feedback sensors. This prototype demonstrates interaction design logic.

On-screen Prompts (Examples)

Just-in-time cues

Hand placement overlay Metronome rhythm “No leaning” reminder Pulse ≤ 10 seconds

These cues lower cognitive load and stress while guiding correct sequence and technique.

Goal

Lower the learning curve and build an accurate mental model of CPR.

Website Screens (rough)

Screen: Guided Practice

• Checklist + overlays
• Timers + rhythm
• Correcting mistakes

Screen: Quick Review

• CAB anchor
• Common fails
• One-page summary

Phase 2 — Recall (No Cues + Branching)

Remove visible cues. Learners must order steps from memory. Random branching scenarios prevent rote memorization.

Scenario: —

Step Pool

Drag items into the “Your Order” list.

Drop here to return items

Your Order (Final Assessment)

Aim for correct sequence + logic under scenario.

Drop steps here

Branching examples: AED arrives / airway obstruction / gasping only. The goal is understanding, not just order.

Variation Tasks

Mini-prompts the website can inject to test real understanding.

Goal

Assess whether learners understand the logic of the sequence — not just the order.

Phase 3 — Peer Attempt & Observation

Observe a peer ordering the steps. Capture their memory strategies and where they get stuck. Convert findings into interface improvements.

Observation Sheet

Observation Item	Yes	No	Notes

Interface Optimization Recommendations

Use feedback to adjust progressive disclosure timing and add optional memory anchors (e.g., CAB, 30:2).

Goal

Translate real user behavior and memory strategies into actionable interface improvements that enhance learning outcomes.

Phase 1 — Recognition (Guided Cues)

Guided Steps

On-screen Prompts (Examples)

Goal

Website Screens (rough)

Phase 2 — Recall (No Cues + Branching)

Step Pool

Your Order (Final Assessment)

Variation Tasks

Goal

Phase 3 — Peer Attempt & Observation

Observation Sheet

Goal

Notes (copy/paste)