What needs to be finished first
A central concept idea or usage scenario is selected for visualization (for example "order with Apple Pay in 30 seconds").
A concrete persona or user profile is defined so storyboard scenes emerge from that perspective.
What needs to be ready before start
Storyboard template with 6-12 frames (A4 or digital); markers, pens, stickies for annotations; for digital setup tool such as Miro, FigJam, Sketchbook or PowerPoint with frame layout.
One storyteller who provides scenario (often product or service designer); 1-7 sketchers (all skill levels); one note-taker for assumptions per frame.
Scenario description; persona profile; existing wireframes or prototypes (if available); identified testable assumptions; purpose (concept pitch, user-test preparation, service design).
30-90 min
Template with 8-12 fields. Persona card at top, scenario sentence below. Agree pen convention (stick figures for actors, speech bubbles for dialog, arrows for movement). Sketches, no finished designs.
The one question this method answers
How does the persona experience the scenario frame by frame, and which assumptions about context, behavior and expectations become visible?
Marker: Phase
| Step | Duration | Action | Hint |
|---|---|---|---|
1Phase 1: Invoke scenario and persona | 5-10 min | Formulate scenario in one sentence ("Lisa, solo tax advisor, wants to submit VAT pre-return via app at quarter end"). Briefly recap persona profile. | If scenario stays abstract ("user does task X"), storyboard becomes arbitrary. Concrete situation with time, place, trigger. |
2Phase 2: Identify key scenes | 10-15 min | Which 6-10 key moments structure scenario? One frame placeholder per scene: trigger, context, action, reaction, transition. Fix order. | Not every UI click is a frame. Frames are turning points or new contexts. 6-12 frames are enough for narrative arc. |
3Phase 3: Sketch frames | 20-40 min | Per frame: persona in context (place, device, situation), action or reaction. Stick figures, simple shapes, speech bubbles. No finished UI, only visual sketch. | Drawing UI detail slows down and loses narrative arc. Storyboard is story, not pixel design. |
4Phase 4: Add annotations | 10-15 min | Short text per frame: what happens, what persona thinks/feels. Name assumptions explicitly ("Assumption: Lisa has internet under quarter-end stress"). Transitions between frames as small arrows with trigger. | Assumption list becomes the most important follow-up artifact. Per frame at least one verified assumption or clearly marked to validate. |
5Phase 5: Flow check and iteration | 10-15 min | Have someone read storyboard as whole. Does flow stall? Are frames missing? Are transitions plausible? If gaps: add or merge two frames. | An outsider unfamiliar with storyboard should understand story. If much explanation is needed, storyboard is not self-explanatory. |
What comes out at the end
Storyboard as image or scan with 6-12 frames, each with annotation (what happens, what persona thinks/feels), persona card, scenario sentence and list of identified testable assumptions with owner and validation plan.
One storyboard file per concept with date and scenario title. On iterations after user test or stakeholder feedback, create new version and keep old as reference. Track assumption validation status across versions.
Compact agenda template for method sequences with timebox, purpose, and output.
Goal: ... Participants: ... Duration: ...
| Time | Method | Purpose | Output |
|---|---|---|---|
| 00:00 | Check-in | Set focus | Shared start |
| 00:10 | How Might We | Ideation questions | HMW list |
| 00:35 | Brainwriting | Generate ideas | Idea pool |
| 01:10 | Dot Voting | Prepare selection | Prioritized ideas |
| 01:30 | Storyboarding | Make the concept tangible | Storyboard |
Decision, owner, next test.
Concrete filled scenario, fictional example
Concrete filled scenario, fictional example
Persona: Lisa, solo tax advisor, 65 clients, under quarter-end time pressure
Scenario: "Quarter-end Sunday, 22:00. Lisa has 3 VAT pre-returns ahead. Wants to finish with our app in 5 min per client."
Frame 1: Lisa at desk, laptop open, coffee, wall clock shows 22:05
Frame 2: App home screen with "3 pending VAT pre-returns" as notification
Frame 3: Click first pre-return, goes to client overview
Frame 4: Review screen: 23 receipts, totals, notes on 2 anomalies
Frame 5: One-click "Send to ELSTER" with confirmation dialog
Frame 6: Success screen with ELSTER confirmation number, "Pre-return 1 of 3 done"
Frame 7: Lisa repeats for client 2 and 3, each in 4-5 min
Frame 8: Wall clock shows 22:23, all 3 pre-returns done, Lisa closes laptop
Recognize symptoms and steer against them
Frames are wireframes with buttons and text, narrative arc gets lost.
Deliberately omit wireframe detail. Sketches are enough. Focus on persona, context, action, not UI components.
20+ frames for one scenario, story loses pace.
Condense to 6-12 frames. One turning point or context change per frame. UI detail comes later, not here.
Sketches without text, without assumption marking. Story unclear, learning effect missing.
Short text per frame mandatory. Assumptions explicit. Storyboard without annotation is comic, not discovery tool.
Frames show generic user without context, story is abstract.
Persona card visible. First frame shows persona in context (place, situation, trigger). Persona name in annotations.
Storyboard interpreted as evidence ("this will work"), although assumptions unconfirmed.
Name assumptions explicitly and mark as "to validate". Storyboard is hypothesis, not truth. Test backlog mandatory.
Done signals checkable in under a minute
Go to the profile for purpose, similar methods, and sources or continue to the next method in the catalog.