Onboard a new user
Most products lose people between "account created" and "did something useful". This is the stretch in between: the questions you have to ask, the checklist that shows progress, and what the app looks like when it is still empty.
Take all 6 at once
npx hoverlab add auth-signup-split setup-wizard onboarding-checklist empty-state-cta toast-stack notification-inboxOr through the shadcn CLI, with nothing installed first:
npx shadcn@latest add https://hoverlab5.netlify.app/r/path-onboarding.jsonThis path is a published registry item — one name that pulls in all 6 blocks. Or work down the list and copy each one from its page; the order is what matters, not how the files get there.
- 1
Where onboarding actually starts. Ask for the minimum here — every extra field is someone deciding not to bother.
- 2
The questions you genuinely need answered, one screen at a time. Split into steps because a single long form reads as work, and because a step someone abandons still leaves you the earlier answers.
- 3
What is left, visible and crossable. This is the piece that converts a signup into a habit — people finish lists that show how close they are to done.
- 4
What the app looks like before they have made anything. Treat this as a screen worth designing, not a gap: it is the most-seen view a new account has, and a blank panel reads as broken.
- 5
Confirmation that each action worked. Silence after a click is how people end up doing the same thing twice.
- 6
Where the nudges live once the checklist is gone. Optional on day one, and the reason day seven still has a reason to come back.
When you are done
Store the checklist state per account so it survives a refresh, then hide the whole flow once every item is done.