User onboarding for
Next.js apps
Flows integrates with Next.js, works client-side, and lets your team iterate on onboarding without code changes.
Trusted by leading engineering, product, and design teams
How Flows powers Next.js user onboarding
Flows integrates into any Next.js setup. Build onboarding tours, checklists, and tooltips that trigger on first login, specific routes, or user actions.
Product tours.
Guide users step-by-step through your product with tooltips, modals, and hints that feel native to your app.
Embeddable components.
Embed interactive content directly inside your app layout: checklists, empty states, and contextual guides without floating overlays.
Custom components.
Use your own design system and component library to build adoption experiences that match your product's look and feel exactly.
Localization.
Deliver workflow content in any language to reach a global user base.
User targeting.
Target specific users or segments with AND/OR logic to show the right experience to the right person.
Analytics.
Track workflow performance with built-in analytics. Measure completion rates, drop-off, and engagement across all your adoption experiences.
Designed for unlimited customizability
Flows is designed to be a “Headless product adoption platform”. We’ll focus on user state problems, so you can focus on your own product.
Frequently asked questions
Add FlowsProvider to your root layout and pass user identity after authentication. Flows evaluates targeting rules client-side and triggers the right onboarding workflow automatically, with no custom logic needed in your pages or components. The Next.js installation guide walks you through the setup process with code examples.
Yes. Flows detects client-side navigation and evaluates route-based trigger conditions automatically. You can set up onboarding steps that activate only when a user visits a specific page, without any route-specific code.
No. You can pass Flows a Next.js Link component to use for any onboarding steps that link to other pages in your app. This ensures smooth client-side navigation without full page reloads.
Pass user metadata (like createdAt or a hasCompletedOnboarding flag) to the Flows SDK. Target new users with onboarding workflows and exclude returning users, all configured in the Flows dashboard, not in your codebase. See the guide on targeting only new users.
Flows loads asynchronously and only activates workflows for users who match targeting rules. For most users in a session, there is zero overhead. The SDK is small and doesn't block rendering.
Yes. Once the Flows SDK is integrated, non-developers can create, edit, and publish onboarding workflows from the Flows dashboard. No code changes or redeployments needed. Iterate on onboarding as fast as you can think of the change.
Build better Next.js user onboarding today
Integrate once and let your team iterate on onboarding without touching code. Flows works natively with Next.js App Router.
