Feature announcement / Product tour
The in-product introduction of something new, which must inform without hijacking the session.
Help & Support · 8 checks · 17 resources
Before you ship
8- 01Targeted to users the feature is relevant to — not broadcast to every account regardless of plan or role
- 02Dismissible at every step — with the dismissal remembered across devices and sessions
- 03Anchored to the real UI element it describes — a positioned tooltip or spotlight, not a floating modal describing something offscreen
- 04Step count bounded and visible — three to five steps at most, with progress shown
- 05One clear action per step — try it now, read more, or skip
- 06Never blocks the user's original intent — deferred if the user is mid-task in a form or editor
- 07Re-openable on demand — findable later from a help or 'what's new' menu once dismissed
- 08Links to the changelog entry and documentation for the same feature
Resources that help you build this
17- HyperFrames · Apache-2.0 framework that renders HTML compositions to deterministic MP4, built for agents
- Kibo UI · shadcn registry of 41 complex components: Gantt, Kanban, editor, sandbox, cropper
- Open Design · Local-first desktop app that turns a coding agent into a design engine
- remocn · 282 Remotion components for product-demo video, installed by the shadcn CLI
- Rive · Vector animation editor whose State Machine files run natively in app runtimes
- HyperFrames Docs & Catalog · 515-page HyperFrames manual with a 375-block motion catalog and an llms.txt index
- Kibo UI · shadcn registry of 41 hard components shadcn/ui does not ship, plus 28 blocks
- posts.design · Hand-picked wall of launch and announcement graphics from X, updated daily
- React Joyride · Guided product tours for React, v3 with a hook API
- Watermelon UI · MIT shadcn registry: 131 animated components, 187 page blocks, 30 base primitives
- Coachmark · Unstyled React primitive for product tours, built on Base UI Popover
- Guizang PPT Skill · Agent skill for single-file HTML decks in editorial or Swiss style, plus social covers
- Really Good Emails · 19,000+ curated marketing emails, browsable by category, plus a builder
- Soft Club UI · 118 Radix-based React components in a late-90s dark-glass aesthetic
- Tailark · shadcn registry of marketing-site blocks, illustrations and brand logo SVGs
- Notra · Turns merged PRs and closed Linear issues into changelogs and launch posts
- React Spotlight Tour · Tiny ref-based React tour overlay, unmaintained since 2021