First-Run Onboarding
Guide new users to the action that makes your app click.
What it adds
A first-run experience that gets a brand-new user to their first meaningful outcome.
What your agent is told to do
4
What your agent is told to do
4-
1
Identify the single action that makes this product valuable — the moment a user 'gets it'. Everything in onboarding serves that one moment.
-
2
Build a short checklist of the steps leading there. Three to five items, no more.
-
3
Track completion per user, server-side, so it survives a device change.
-
4
Make it dismissible and restartable from settings. Never trap a user inside onboarding.
Edge cases it handles
4
Edge cases it handles
4- A returning user with existing data must never see first-run onboarding — check their actual state, not just a flag.
- A step completed elsewhere in the app must tick automatically.
- An invited teammate joining an established workspace needs different onboarding to a founder starting from zero.
- Onboarding must not block the app. The user can always skip.
Definition of done
7
Definition of done
7- A new user is guided to the core action.
- Steps complete automatically when done anywhere in the app.
- Progress persists across devices and sessions.
- It is dismissible and restartable.
- Users with existing data never see first-run onboarding.
- The feature matches the existing design system.
- No existing functionality is broken.
Related features
Welcome Screen
Welcome Screen
Make the first ten seconds count.
What it does
A short welcome moment that orients a new user and hands them one clear next action.
How it works
- 1 Show it once, on first sign-in, and never again.
- 2 Say what the product does and give exactly one primary action. Do not list features.
- 3 Collect at most what you genuinely need to personalize the experience — every field costs you signups.
Copy the prompt
No account needed
Add this feature to my app:
https://addthisfeature.com/x/welcome-screen
Sample Data
Sample Data
Never show a new user an empty product.
What it does
Realistic demo data so a new account has something to look at and play with.
How it works
- 1 Generate sample records that look like real usage, not 'Test 1, Test 2'. The point is to show the product working.
- 2 Mark sample records clearly so nobody mistakes them for their own data.
- 3 Give the user a one-click way to remove all of it.
Copy the prompt
No account needed
Add this feature to my app:
https://addthisfeature.com/x/sample-data
Guided Product Tour
Guided Product Tour
Walk new users through the interface without a video.
What it does
A short, skippable tour that highlights the parts of the UI that matter.
How it works
- 1 Keep it to 3–5 stops. A long tour gets skipped, and a skipped tour teaches nothing.
- 2 Anchor each stop to a real element, and highlight it by dimming everything else.
- 3 Let the user leave at any point, and remember that they did.
Copy the prompt
No account needed
Add this feature to my app:
https://addthisfeature.com/x/guided-product-tour
How it works
-
1
Copy the link
Grab the Markdown instruction URL for this feature.
-
2
Give it to your AI
Paste it into Claude Code, Cursor, v0, Lovable — whatever you build with.
-
3
It inspects, then implements
Your agent reads your existing app first, then adds the feature to fit it.
Works with your stack
These instructions are written to adapt. They tell the agent to detect your framework, match your existing design system, and reuse what you already have — rather than assuming a particular stack.
Need it tighter than that? Customize the feature and tell it exactly what you're running.