Case Study Section
A customer story band with an invented company mark, problem, approach and result columns, three metrics that count up, a pull quote and a full-story link.
Preview
Customer story
How Pebble halved synthesis time across forty studies
- 01 Problem
Notes everywhere
Interview notes lived in five apps and three drives. Synthesis meant a week of copy and paste before any thinking started.
- 02 Approach
One notebook per study
Every study got a shared notebook with templates for interviews, quotes and themes, plus boards to sort evidence together.
- 03 Result
Findings in days
Teams now move from last interview to first readout in three days, and old studies are searchable instead of lost.
We stopped hunting for notes and started arguing about what they mean. That is the whole job.
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| company | { name, facts?, tone? } | — | Invented company: name, facts line and mark colour. |
| title | ReactNode | — | Story headline. |
| problem | { title?, text } | — | Problem column. |
| approach | { title?, text } | — | Approach column. |
| result | { title?, text } | — | Result column. |
| metrics | CaseStudyMetric[] | — | Up to three metrics { value, label, from?, prefix?, suffix?, format? } that count up in view. |
| quote | { text, name, role?, initials } | — | Pull quote. |
| href | string | — | Full story link. |
| linkLabel | string | "Read the full story" | Link text. |
| eyebrow | ReactNode | "Customer story" | Label above the headline. |
| headingLevel | 2 | 3 | 2 | Heading level of the headline. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.