Design Atlas
Type
gallery
Verdict
Niche
Licence
Look only licence, not statednot-statedTeardowns are free to browse. No licence for the screen captures or annotations was stated at review; treat them as look-only references.
Agent channels
none
Pricing
free
Reviewed

← Atlas · Topics: ux-patterns, inspiration

UserOnboard ​

Type
gallery
Verdict
Niche
Licence
Look only licence, not statednot-statedTeardowns are free to browse. No licence for the screen captures or annotations was stated at review; treat them as look-only references.
Agent channels
none
Pricing
free
Reviewed

What it is ​

UserOnboard is a collection of annotated first-run and signup teardowns. Each case is presented as a sequence of captured product screens with short overlay notes, a progress track and previous/next controls.

When to open it ​

  • When studying how a product stages its first-run experience across several screens.
  • When comparing signup, account setup and early value-discovery patterns as a visual sequence.
  • When reviewing the composition of an onboarding screen: what takes focus, what is dimmed, and how an annotation points to a decision.

Most useful ​

  • Open How Zapier Activates Users and use the arrow controls to move through the annotated screen sequence. The visible sample uses a blue wash over the captured page and a compact centered callout to mark the current step; the progress line makes the sequence length legible.
  • The teardown index is the route to other products and flows. Compare screens across cases rather than treating one flow as a universal pattern.
  • The site also has a patterns index; use it to jump from a specific screen sequence to a named onboarding pattern.

Using it with agents ​

No llms.txt, MCP, API or CLI was found. An agent can read the article pages, but the value here is the screen sequence: open the case in a browser and inspect its slides directly.

Watch out for ​

  • The Zapier teardown inspected at review is dated July 2024. Screens can differ from the current product, so use the case to study visual sequencing rather than to document today's interface.
  • This is a small, selectively maintained reference collection; the latest cases and coverage vary.
  • No reuse licence was stated for screen captures or annotations. Link to the case rather than copying its images into a product or design system.

Reusable ideas ​

  • Keep the captured screen dominant and place the explanation in a separate, high-contrast callout.
  • Show progress and provide direct previous/next controls when teaching a multi-step flow.
  • Dim the background to connect an annotation to one decision without cropping away its page context.

Laws of UX, Good UI