Screen 01
Caption — what this screen does, in one line.
quip care
Service design for quip's connected oral-care platform — patients and providers.
02 · Mosaic, with parallax
A whole product surface, in one glance.
Nine screens stacked in a soft three-column mosaic. Each tile drifts at its own speed as you scroll, so the page feels alive without leaving the page.
01 · Scroll-snap rail
A guided tour, one screen at a time.
Screen 02
Caption — the second beat of the flow.
Screen 03
Caption — the third moment worth slowing down on.
Screen 04
Caption — a key state, ideally the one users miss.
Screen 05
Caption — the close. What the user feels at the end.
03 · Sticky-pin cross-fade
A phone that holds while the story moves.
-
Step 01
First narrative beat.
A paragraph of placeholder copy describing the first state. Three or four sentences works best — enough to give the phone something to hold against, not enough to crowd it.
-
Step 02
Second beat — the turn.
The middle moment. Show a decision, a transition, or the part of the flow most users misread. Pair with a screen that shows the change clearly.
-
Step 03
Third beat — the payoff.
What the user gets. The frame should feel like resolution; the copy should name the moment plainly without overselling it.
-
Step 04
Fourth beat — the close.
An optional fourth step for flows with a quiet, confirming ending. Keep symmetric with the screens — four steps, four images.
12 · Before / after
Two states, one frame.
Drag the divider to compare. Use for rebrands, dark/light modes, screen redesigns — anywhere a single before/after frame is more eloquent than two stacked images.
00x
Headline metric — replace with a number that matters
0.0/5
Secondary metric — rating, score, or qualitative measure
00%
Tertiary metric — lift, retention, or growth percentage
Vimeo for iOS
Mobile inbox and playback for Vimeo's iOS app — designed for makers, not viewers.
Daily Harvest
Editorial and product calibrated for the moment a customer opens the box.
