Onboarding That Converts

User onboarding is the most critical part of your mobile app. It's the only feature 100% of your users will see. If it fails, your amazing features don't matter.

The Goal of Onboarding

It's NOT to teach users how to use the app (UI should be intuitive). It IS to sell the value proposition and get them to the "Aha!" moment.

1. The "Value First" Rule

Don't talk about "Features". Talk about "Benefits".

• ❌ Bad: "We have a calendar integration."
• ✅ Good: "Never miss a meeting again."

2. Keep it Short (The 3-Slide Rule)

Every extra tap acts as a filter that drops users.

1. Slide 1: The Core Value Proposition (The "Hook").
2. Slide 2: How it works (The "Mechanism").
3. Slide 3: The Call to Action (The "Payoff").

3. Ask for Permissions in Context

Don't blast the user with "Allow Notifications?" "Allow Location?" "Allow Camera?" immediately on launch. Ask when needed.

• User taps "Enable Reminders" -> Then show the OS permission dialog.
• This dramatically increases opt-in rates.

4. The Power of Motion

Static images are boring. Use Lottie animations or React Native Reanimated keyframes to make the onboarding feel alive.

• The boilerplate includes LottieView for high-performance vector animations.
• Use subtle entry animations for text to guide the eye.

5. Implementation in This Boilerplate

We use a high-performance, smooth slider component located at src/features/onboarding/screens/OnboardingScreen.tsx.

Key Features

• Persistence: We save hasSeenOnboarding in Redux Persist (MMKV) so it never shows twice.
• Skip Logic: A prominent "Skip" button for power users.
• Auth Redirect: Automatically sends users to the Auth flow or Main Tabs based on authentication status.

Customizing the Steps

Go to src/features/onboarding/constants/slides.ts:

export const ONBOARDING_SLIDES = [
  {
    id: '1',
    title: 'Welcome to App',
    description: 'The best app for X',
    animation: require('@/assets/animations/welcome.json'),
  },
  // ...
];

Summary Checklist

• 3 slides max
• Focus on benefits, not features
• Ask for permissions contextually
• Add a "Skip" button