onboarding-generator

Generates multi-step onboarding flows with persistence for iOS/macOS apps. Use when user wants to add onboarding, welcome screens, or first-launch experience.

149 stars

Best use case

onboarding-generator is best used when you need a repeatable AI agent workflow instead of a one-off prompt.

Generates multi-step onboarding flows with persistence for iOS/macOS apps. Use when user wants to add onboarding, welcome screens, or first-launch experience.

Teams using onboarding-generator should expect a more consistent output, faster repeated execution, less prompt rewriting.

When to use this skill

  • You want a reusable workflow that can be run more than once with consistent structure.

When not to use this skill

  • You only need a quick one-off answer and do not need a reusable workflow.
  • You cannot install or maintain the underlying files, dependencies, or repository context.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/onboarding-generator/SKILL.md --create-dirs "https://raw.githubusercontent.com/rshankras/claude-code-apple-skills/main/skills/generators/onboarding-generator/SKILL.md"

Manual Installation

  1. Download SKILL.md from GitHub
  2. Place it in .claude/skills/onboarding-generator/SKILL.md inside your project
  3. Restart your AI agent — it will auto-discover the skill

How onboarding-generator Compares

Feature / Agentonboarding-generatorStandard Approach
Platform SupportNot specifiedLimited / Varies
Context Awareness High Baseline
Installation ComplexityUnknownN/A

Frequently Asked Questions

What does this skill do?

Generates multi-step onboarding flows with persistence for iOS/macOS apps. Use when user wants to add onboarding, welcome screens, or first-launch experience.

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

SKILL.md Source

# Onboarding Generator

Generate a complete, customizable onboarding flow with persistence, animations, and accessibility support.

## When This Skill Activates

Use this skill when the user:
- Asks to "add onboarding" or "create onboarding"
- Mentions "welcome screens" or "first launch"
- Wants to "show intro on first launch"
- Asks about "onboarding flow" or "tutorial screens"

## Pre-Generation Checks

### 1. Project Context Detection
- [ ] Check for existing onboarding implementations
- [ ] Identify if SwiftUI or UIKit project
- [ ] Find App entry point location
- [ ] Check deployment target (TabView paging requires iOS 14+)

### 2. Conflict Detection
Search for existing onboarding:
```
Glob: **/*Onboarding*.swift, **/*Welcome*.swift
Grep: "hasCompletedOnboarding" or "isFirstLaunch"
```

If found, ask user:
- Replace existing onboarding?
- Keep existing, add new flow?

## Configuration Questions

Ask user via AskUserQuestion:

1. **Navigation style?**
   - Paged (horizontal swipe with dots)
   - Stepped (Next/Back buttons)

2. **Number of screens?**
   - 2-5 screens (recommend 3-4)

3. **Skip option?**
   - Allow skip button
   - Mandatory completion

4. **Presentation style?**
   - Full screen cover (modal)
   - Inline (embedded in view hierarchy)

5. **Include animations?**
   - Animated transitions
   - Static transitions

## Generation Process

### Step 1: Create Core Files

Generate these files:
1. `OnboardingView.swift` - Main container
2. `OnboardingPageView.swift` - Individual page template
3. `OnboardingPage.swift` - Page data model
4. `OnboardingStorage.swift` - Persistence
5. `OnboardingModifier.swift` - View modifier for easy integration

### Step 2: Customize Based on Configuration

**Paged Navigation:**
```swift
TabView(selection: $currentPage) {
    ForEach(pages) { page in
        OnboardingPageView(page: page)
            .tag(page.id)
    }
}
.tabViewStyle(.page(indexDisplayMode: .always))
```

**Stepped Navigation:**
```swift
VStack {
    OnboardingPageView(page: pages[currentPage])

    HStack {
        if currentPage > 0 {
            Button("Back") { currentPage -= 1 }
        }
        Spacer()
        Button(isLastPage ? "Get Started" : "Next") {
            if isLastPage {
                completeOnboarding()
            } else {
                currentPage += 1
            }
        }
    }
}
```

### Step 3: Determine File Location

Check project structure:
- If `Sources/` exists → `Sources/Onboarding/`
- If `App/` exists → `App/Onboarding/`
- Otherwise → `Onboarding/`

## Output Format

After generation, provide:

### Files Created
```
Sources/Onboarding/
├── OnboardingView.swift           # Main container
├── OnboardingPageView.swift       # Page template
├── OnboardingPage.swift           # Data model
├── OnboardingStorage.swift        # @AppStorage persistence
└── OnboardingModifier.swift       # .onboarding() modifier
```

### Integration Steps

**Option 1: View Modifier (Recommended)**
```swift
@main
struct MyApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
                .onboarding()  // Automatically shows on first launch
        }
    }
}
```

**Option 2: Manual Control**
```swift
@main
struct MyApp: App {
    @AppStorage("hasCompletedOnboarding") private var hasCompletedOnboarding = false

    var body: some Scene {
        WindowGroup {
            ContentView()
                .fullScreenCover(isPresented: .constant(!hasCompletedOnboarding)) {
                    OnboardingView()
                }
        }
    }
}
```

### Customization

**Add Your Content:**
```swift
// In OnboardingStorage.swift or OnboardingView.swift
static let pages: [OnboardingPage] = [
    OnboardingPage(
        title: "Welcome",
        description: "Your app description here",
        imageName: "hand.wave",  // SF Symbol or asset name
        accentColor: .blue
    ),
    // Add more pages...
]
```

### Testing Instructions
1. Delete app from simulator (to reset UserDefaults)
2. Run app - onboarding should appear
3. Complete onboarding
4. Relaunch app - onboarding should NOT appear
5. Reset via Settings or delete app to test again

### Debug/Testing Reset
```swift
// Add to Settings or debug menu
Button("Reset Onboarding") {
    UserDefaults.standard.removeObject(forKey: "hasCompletedOnboarding")
}
```

## References

- **onboarding-patterns.md** - Best practices and design patterns
- **templates/** - All template files

Related Skills

characterization-test-generator

149
from rshankras/claude-code-apple-skills

Generates tests that capture current behavior of existing code before refactoring. Use when you need a safety net before AI-assisted refactoring or modifying legacy code.

prd-generator

149
from rshankras/claude-code-apple-skills

Generates comprehensive Product Requirements Document from product plan. Creates PRD.md with features, user stories, acceptance criteria, and success metrics. Use when creating product requirements.

idea-generator

149
from rshankras/claude-code-apple-skills

Brainstorm and rank iOS/macOS app ideas tailored to developer skills. Use when user says "what should I build", "give me app ideas", "I don't know what to build", "brainstorm app ideas", or "help me find an app idea".

widget-generator

149
from rshankras/claude-code-apple-skills

Generate WidgetKit widgets for iOS/macOS home screen and lock screen with timeline providers, interactive elements, and App Intent configuration. Use when adding widgets to an app.

tipkit-generator

149
from rshankras/claude-code-apple-skills

Generate TipKit infrastructure with inline/popover tips, rules, display frequency, and testing utilities. Use when adding contextual tips or feature discovery to an iOS/macOS app.

test-generator

149
from rshankras/claude-code-apple-skills

Generate test templates for unit tests, integration tests, and UI tests using Swift Testing and XCTest. Use when adding tests to iOS/macOS apps.

paywall-generator

149
from rshankras/claude-code-apple-skills

Generates StoreKit 2 subscription paywall with modern SwiftUI views. Use when user wants to add subscriptions, paywall, or in-app purchases.

live-activity-generator

149
from rshankras/claude-code-apple-skills

Generate ActivityKit Live Activity infrastructure with Dynamic Island layouts, Lock Screen presentation, and push-to-update support. Use when adding Live Activities to an iOS app.

app-icon-generator

149
from rshankras/claude-code-apple-skills

Generates app icons programmatically using CoreGraphics following Apple HIG. Use when user wants to create, generate, or design an app icon for macOS or iOS.

accessibility-generator

149
from rshankras/claude-code-apple-skills

Generate accessibility infrastructure for VoiceOver, Dynamic Type, and accessibility features. Use when improving app accessibility, adding accessibility labels and hints, or auditing compliance.

generators

149
from rshankras/claude-code-apple-skills

Code generator skills that produce production-ready Swift code for common app components. Use when user wants to add logging, analytics, onboarding, review prompts, networking, authentication, paywalls, settings, persistence, error monitoring, CI/CD pipelines, localization, push notifications, deep linking, testing, accessibility, widgets, feature flags, app icons, image caching, pagination, HTTP caching, share cards, social export, subscription lifecycle, referral systems, watermarks, streak tracking, milestone celebrations, what's new screens, lapsed user re-engagement, usage insights, variable rewards, consent flows, account deletion, permission priming, force updates, state restoration, debug menus, offline queues, feedback forms, announcement banners, quick win sessions, Spotlight indexing, App Clips, screenshot automation, background processing, app extensions, or data export.

watchOS

149
from rshankras/claude-code-apple-skills

watchOS development guidance including SwiftUI for Watch, Watch Connectivity, complications, and watch-specific UI patterns. Use for watchOS code review, best practices, or Watch app development.