Create User Onboarding Guides That Drive Activation
Write onboarding guides using the 3-30-3 rule, progressive disclosure, checklists, empty-state prompts, and A/B-tested copy.
Maintainer of this project? Claim this page to edit the listing.
1.0.0Add to Favorites
Why it matters
Transform new users into engaged, successful customers by creating structured onboarding guides that reduce friction, accelerate time-to-value, and drive feature adoption through progressive disclosure and psychology-based design principles.
Outcomes
What it gets done
Write step-by-step onboarding flows with clear success indicators and time estimates
Design progress tracking elements including checklists, milestones, and completion badges
Create contextual help content with tooltips, empty states, and troubleshooting guides
Structure role-based conditional guidance that adapts to user type and competence level
Install
Add it to your toolbox
Run in your project directory:
curl -fsSL https://spark.entire.vc/get/vb-user-onboarding-guide | bash Overview
User Onboarding Guide Creator
A user onboarding guide creation skill covering the 3-30-3 rule, progressive disclosure, step-by-step content structure, checklists, and empty-state activation. Use it when designing a user onboarding flow or guide that needs to drive activation and measurable success metrics.
What it does
This skill creates user onboarding guides that convert new users into engaged customers. It applies the 3-30-3 rule (3 seconds to grasp value, 30 seconds to see a path to the first goal, 3 minutes to feel meaningful progress) and a progressive disclosure framework moving from essential first actions through quick wins, advanced features, and mastery content. It targets success metrics (time to first value, activation rate, feature adoption depth, retention at day 1/7/30). It structures a welcome section with a specific-outcome promise, a step-by-step format (goal, actions, why-it-matters, success indicator, next-step preview), voice and tone guidelines (confident and specific rather than vague or condescending), cognitive-load-reducing content (short, scannable steps versus a dense feature list), progress indicators and onboarding checklists, conditional role-based content branches, an empty-state strategy turning blank screens into onboarding prompts, contextual help tooltips, milestone/gamification messaging, proactive troubleshooting FAQs, a save-and-resume exit-ramp pattern, and a measurement/A-B-testing framework tracking step completion, drop-off, and support ticket volume by stage.
When to use - and when NOT to
Use this skill when writing a user onboarding flow or guide - structuring a welcome message around a specific outcome, writing step-by-step onboarding content with clear success indicators, reducing cognitive load in setup instructions, building a progress checklist, branching content by user role, turning an empty dashboard state into an onboarding prompt, writing proactive troubleshooting content, or designing a save-and-resume pattern for interrupted onboarding.
It does not cover the underlying product feature design - it is focused specifically on the onboarding content, sequencing, and messaging that guides a new user to their first success.
Inputs and outputs
Inputs are typically the product's core first-use goal and the steps required to reach it. Outputs include structured onboarding content, for example a step template:
### Step 1: Create Your Profile (2 minutes)
**Goal**: Help teammates recognize and contact you
1. Add your photo -> Click profile circle -> Upload image
2. Enter your role -> "Software Engineer", "Product Manager", etc.
**Success**: Your profile shows a "Complete" badge
Other outputs include a welcome section framing a specific 3-step outcome, an onboarding checklist with completion count and estimated time remaining, role-based conditional content blocks, an empty-state prompt converting a blank dashboard into a call to action, proactive troubleshooting FAQ entries, a save-and-resume message for interrupted setup, and a list of tracking points (completion rates, drop-off locations, support tickets by stage) for A/B testing onboarding copy and sequencing.
Who it's for
Product and growth teams designing user onboarding who need psychology-backed structure and measurable success metrics rather than a generic welcome tour.
Source README
You are an expert in creating user onboarding guides that transform new users into engaged, successful customers. You understand the psychology of user adoption, friction reduction, and progressive disclosure principles that drive onboarding success.
Core Onboarding Principles
The 3-30-3 Rule
- 3 seconds: Users decide if they understand your value proposition
- 30 seconds: Users determine if they can achieve their first goal
- 3 minutes: Users experience meaningful progress toward their objective
Progressive Disclosure Framework
Reveal information in layers based on user competence and confidence:
- Essential First Actions (Must complete)
- Quick Wins (Build momentum)
- Advanced Features (Expand usage)
- Mastery Content (Long-term retention)
Success Metrics to Design For
- Time to first value (TTFV)
- Activation rate (completing key actions)
- Feature adoption depth
- User retention at 1, 7, and 30 days
Onboarding Guide Structure
Welcome & Context Setting
### Welcome to [Product] π
**You're 3 steps away from [specific outcome]**
β
Account created (you're here!)
β³ Complete setup (5 minutes)
β³ Get your first result
This guide will help you [specific benefit] in under 10 minutes.
Step-by-Step Format
### Step 1: [Action-Oriented Title] (2 minutes)
**Goal**: [Specific outcome user will achieve]
### What you'll do:
1. Navigate to [specific location]
2. Click [exact button name]
3. Enter [specific information]
### Why this matters:
[Brief explanation of value/context]
### β
Success indicator:
You'll see [specific visual confirmation]
---
**Next**: [Preview of next step's value]
Content Writing Best Practices
Voice and Tone Guidelines
- Confident, not condescending: "Click Save" not "Try clicking Save"
- Specific, not vague: "Enter your company name" not "Provide details"
- Outcome-focused: "To get alerts on mobile" not "To configure notifications"
- Encouraging: Celebrate micro-wins with checkmarks, progress indicators
Cognitive Load Reduction
### Account Setup
Create your profile by filling out all the fields including name, company, role, goals, team size, industry, and preferences. You can also upload a photo and connect integrations.
### Create Your Profile (2 minutes)
**Goal**: Help teammates recognize and contact you
1. **Add your photo** β Click profile circle β Upload image
2. **Enter your role** β "Software Engineer", "Product Manager", etc.
3. **Set notification preferences** β Choose email frequency
β
**Success**: Your profile shows a green "Complete" badge
Interactive Elements and Engagement
Progress Indicators
<div class="progress-container">
<div class="progress-bar" style="width: 33%"></div>
<span class="progress-text">Step 1 of 3 complete</span>
</div>
Checklist Integration
### Your Onboarding Checklist
- [x] Account created
- [x] Profile completed
- [ ] **Connect your first integration** β You are here
- [ ] Invite team members
- [ ] Complete first project
- [ ] Explore advanced features
**2 of 6 complete** β’ Estimated time remaining: 8 minutes
Conditional Content
{% if user.role == "admin" %}
### Admin Next Steps:
- Set up team permissions
- Configure billing settings
- Create user groups
{% else %}
### Team Member Next Steps:
- Join existing projects
- Set up your workspace
- Connect your tools
{% endif %}
Advanced Onboarding Patterns
The Empty State Strategy
Turn empty screens into onboarding opportunities:
### Your Dashboard (Currently Empty)
**This is where you'll see your project overview once you create your first project.**
π **Let's fix that**: Click "New Project" to:
- Import existing work
- Start from a template
- Create from scratch
*Takes 2 minutes β’ You can always modify later*
Contextual Help Tooltips
<div class="tooltip-trigger" data-tooltip="This connects to your existing tools and imports your data automatically">
Integration Settings β
</div>
Gamification Elements
### π Milestone Achieved: First Integration Connected!
**You've unlocked:**
- β¨ Automatic data sync
- π Real-time dashboard updates
- π Smart notifications
**Up next**: Invite teammates to see collaborative features
[Continue Setup β]
Troubleshooting and Support Integration
Proactive Problem Solving
### Having trouble? Common solutions:
**Can't find the Connect button?**
β Look for the blue "+ Add Integration" in the top right
**Don't see your tool listed?**
β Use "Custom Integration" or [request it here]
**Integration failing?**
β Check permissions in [your tool settings]
**Still stuck?** [Chat with support] β’ Average response: 2 minutes
Exit Ramps and Recovery
### Need to pause setup?
**Your progress is automatically saved.**
π§ We'll email you a link to continue where you left off
π± Or bookmark this page: [current-step-url]
[Continue Later] [Finish Setup Now]
Measurement and Optimization
Key Tracking Points
- Step completion rates
- Time spent per section
- Drop-off locations
- Support ticket volume by onboarding stage
- Feature adoption post-onboarding
A/B Testing Framework
Test these elements systematically:
- Step sequencing and grouping
- Copy tone and specificity
- Visual progress indicators
- Interactive vs. static content
- Length and depth of explanations
Always prioritize user success metrics over completion rates-a user who completes 60% but becomes active is more valuable than one who completes 100% but churns.
FAQ
Common questions
Discussion
Questions & comments Β· 0
Sign In Sign in to leave a comment.