Add onboarding checklist to guide new users through first subscription setup #191
Description
Description
New users who sign up to SYNCRO face an empty dashboard with no guidance. The app has powerful features (email scanning, blockchain logging, reminders) but no onboarding flow to introduce them. High-value features go undiscovered and new users churn before experiencing SYNCRO's value.
Feature Scope
Onboarding Checklist Component
A dismissable sidebar/panel shown to new users until all steps are complete:
Getting started with SYNCRO
━━━━━━━━━━━━━━━━━━━━━━━━━━
[✓] Create your account
[ ] Add your first subscription →
[ ] Set up renewal reminders →
[ ] Connect an email account → (optional)
[ ] Enable push notifications → (optional)
[ ] Invite a team member → (optional)
3 of 6 complete ████░░ 50%
Step Completion Tracking
ALTER TABLE profiles ADD COLUMN onboarding_completed_steps TEXT[] DEFAULT '{}';
ALTER TABLE profiles ADD COLUMN onboarding_dismissed BOOLEAN DEFAULT FALSE;Onboarding Steps
Step 1: Add first subscription (required)
Deep links to the subscription form when clicked. Marked complete when first subscription is saved.
Step 2: Set up reminders (required)
Prompt to verify notification email and set reminder windows. Complete when first reminder is scheduled.
Step 3: Connect email account (optional)
Explains email scanning feature. Links to Gmail/Outlook OAuth flow.
Step 4: Enable push notifications (optional)
Prompts browser notification permission request. Complete when permission granted.
Step 5: Install mobile app (optional)
PWA install prompt — add SYNCRO to home screen.
Empty State
Before step 1 is complete, dashboard shows an illustrated empty state (not a blank table):
[Illustration of subscriptions]
No subscriptions yet
Add your first subscription to start tracking
your recurring expenses and never miss a renewal.
[+ Add Subscription] [Import from CSV]
Welcome Email
Send a welcome email after signup with:
- 3 key features explained
- Link to add first subscription
- Link to documentation
Acceptance Criteria
- Onboarding checklist shown to new users on first login
- Step completion auto-detected (not manual check)
- User can dismiss checklist (confirmation dialog)
- Empty state shown when no subscriptions exist
- Welcome email sent after signup
- Checklist hidden for users who completed all steps