onboarding-flows

Onboarding Flows

Why Onboarding Matters

Goal: Get users to "aha moment" as quickly as possible

Without Good Onboarding

User signs up → Confused → Abandons → Never returns

With Good Onboarding

User signs up → Guided setup → Achieves first success → Becomes active user

---

Onboarding Goals

1. Show Value Quickly

Don't: 10-step setup before user sees product
Do: Show core value in first 30 seconds

2. Reduce Time to First Success

Measure: Time from signup to first "aha moment"
Goal: Minimize this time

3. Build Habit

Get user to complete key action 3 times in first week

---

Types of Onboarding

Welcome Tour

Step 1: "Welcome to [Product]!"
Step 2: "This is your dashboard"
Step 3: "Create your first project here"

Progressive Disclosure

Show features as user needs them
Don't overwhelm with everything at once

Empty State Onboarding

"No projects yet"
"Create your first project to get started"
[Create Project]

Checklist Onboarding

Getting Started:
☐ Create your profile
☐ Invite team members
☐ Create your first project
☑ Complete setup

---

Onboarding Flow Structure

1. Welcome Screen

"Welcome to [Product]!"

"[Product] helps you [core value proposition]"

[Get Started]

2. Account Setup (Minimal)

"Create your account"

Email: ___________
Password: ___________

[Create Account]

Already have an account? [Log in]

3. Personalization (Optional)

"Tell us about yourself"

What's your role?
○ Designer
○ Developer
○ Product Manager
○ Other

[Continue]

4. Quick Wins

"Let's create your first project"

Project name: ___________

[Create Project]

5. Success State

"You're all set! 🎉"

"Your project is ready. Start adding tasks."

[Go to Dashboard]

---

Writing Onboarding Copy

Welcome Message

Bad:  "Welcome to our platform"
Good: "Welcome to Acme! Let's get you set up."

Bad:  "Please complete the following steps"
Good: "We'll have you up and running in 2 minutes"

Progress Indicators

"Step 1 of 3"
"Almost there! One more step"
"You're 50% done"

Instructions

Bad:  "Enter your information below"
Good: "Tell us a bit about yourself so we can personalize your experience"

Bad:  "Click next to continue"
Good: "Ready? Let's create your first project"

Success Messages

"Great! Your account is ready"
"Perfect! You've created your first project"
"You're all set! Start exploring"

---

Onboarding Best Practices

1. Keep It Short

Bad:  10 steps
Good: 3-5 steps maximum

2. Show Progress

"Step 2 of 4"
Progress bar: ▓▓▓▓░░░░ 50%

3. Allow Skipping

[Skip for now]
[I'll do this later]

4. Provide Context

"Why we need this:"
"We use your email to send order updates"

5. Celebrate Wins

"🎉 You did it!"
"Great job! Your first project is live"

---

Onboarding Patterns

Blank Slate

[Illustration of empty state]

"No projects yet"

"Projects help you organize your work. Create your first one to get started."

[Create Your First Project]

Tooltips

[Highlight button]
"Click here to create a new project"

[Next] [Skip Tour]

Modal Walkthrough

[Modal overlay]
"This is your dashboard"
"Here you'll see all your projects and recent activity"

[Next] [Skip] [1 of 5]

Checklist

Getting Started (2/5 complete)
☑ Create account
☑ Set up profile
☐ Invite team members
☐ Create first project
☐ Complete first task

Video Tutorial

"Watch a quick 2-minute intro"
[▶ Play Video]

[Skip and explore on my own]

---

Personalization

Ask About Role

"What's your role?"
○ Designer
○ Developer
○ Product Manager
○ Marketing
○ Other

[Continue]

Ask About Goals

"What do you want to accomplish?"
☐ Manage projects
☐ Track time
☐ Collaborate with team
☐ Generate reports

[Continue]

Ask About Team Size

"How big is your team?"
○ Just me
○ 2-10 people
○ 11-50 people
○ 50+ people

[Continue]

---

Activation Metrics

Track Key Actions

- Account created
- Profile completed
- First project created
- First task added
- First team member invited
- First report generated

Measure Time to Value

Time from signup to:
- First project created
- First task completed
- First collaboration

Monitor Drop-off

Where do users abandon?
- Step 1: 100 users
- Step 2: 80 users (20% drop-off)
- Step 3: 60 users (25% drop-off)
- Completed: 50 users (17% drop-off)

---

Email Onboarding

Welcome Email

Subject: Welcome to [Product]! 🎉

Hi [Name],

Thanks for signing up! We're excited to have you.

Here's what to do next:
1. Complete your profile
2. Create your first project
3. Invite your team

Need help? Reply to this email.

[Get Started]

Activation Email (Day 2)

Subject: Quick question about [Product]

Hi [Name],

I noticed you haven't created a project yet. Is there anything I can help with?

Here's a quick guide to get started: [Link]

[Create Your First Project]

Tips Email (Day 7)

Subject: 3 tips to get the most out of [Product]

Hi [Name],

Here are 3 things most users find helpful:

1. Use templates to save time
2. Invite your team for collaboration
3. Set up integrations with your tools

[Learn More]

---

In-App Messaging

Contextual Tips

[User hovers over button]
Tooltip: "Create a new project here"

Hotspots

[Pulsing dot on feature]
"New! Try our AI assistant"
[Learn More] [Dismiss]

Banners

"👋 Welcome! Complete your profile to get personalized recommendations"
[Complete Profile] [Dismiss]

---

Onboarding for Different User Types

New Users

Full onboarding flow
Show all features
Provide tutorials

Returning Users

Skip basic setup
Highlight what's new
Quick refresher

Power Users

Skip onboarding
Provide advanced tips
Keyboard shortcuts

---

Testing Onboarding

A/B Test

Test A: 5-step onboarding
Test B: 3-step onboarding

Measure:
- Completion rate
- Time to complete
- Activation rate

User Testing

Ask users:
- Was onboarding clear?
- Did you understand what to do?
- What was confusing?
- What would you change?

Analytics

Track:
- Drop-off by step
- Time per step
- Completion rate
- Activation rate

---

Common Mistakes

❌ Too Long

10+ steps before user sees value

❌ Too Much Information

Explaining every feature upfront

❌ Forced Linear Flow

Can't skip steps
Can't go back

❌ No Progress Indicator

User doesn't know how many steps left

❌ No Value Shown

Setup without showing what they'll get

---

Onboarding Checklist

☐ Shows value quickly (< 30 seconds)
☐ Minimal steps (3-5 max)
☐ Progress indicator shown
☐ Can skip steps
☐ Personalized to user
☐ Celebrates wins
☐ Provides help/support
☐ Tested with users
☐ Tracked with analytics
☐ Optimized based on data

---

Examples

Slack

1. Create workspace
2. Invite team members
3. Create first channel
4. Send first message

Quick, focused on core action (messaging)

Duolingo

1. Choose language
2. Set daily goal
3. Take placement test
4. Start first lesson

Personalized, shows value immediately

Notion

1. Choose template
2. Customize workspace
3. Invite team

Flexible, lets users explore

---

Summary

Onboarding Goal: Get users to "aha moment" quickly

Structure:

1. Welcome
2. Minimal setup
3. Personalization (optional)
4. Quick win
5. Success state

Best Practices:

• Keep it short (3-5 steps)
• Show progress
• Allow skipping
• Provide context
• Celebrate wins

Types:

• Welcome tour
• Progressive disclosure
• Empty state
• Checklist
• Video tutorial

Measure:

• Completion rate
• Time to value
• Activation rate
• Drop-off points

Avoid:

• Too long
• Too much info
• Forced flow
• No progress indicator
• No value shown