Flows are multi-step, in-app experiences that guide users through your product. Use them to onboard new users, announce features, collect feedback, and drive adoption — all without writing code.

A Flow is made up of steps, and each step uses one of four pattern types: Modals, Slideouts, Tooltips, or Hotspots. Inside each step, you add components like text, images, buttons, videos, forms, and custom HTML to build the content your users see.

Also known as: product tours, walkthroughs, in-app guides, onboarding flows.

Click here for a live example of a Flow 👀 

When to use Flows

• Onboarding — walk new users through setup or key features step by step.
• Feature adoption — point users to a new feature with a Tooltip or announce it with a Modal.
• Feedback collection — add a survey form to a Slideout to gather responses in context.
• Announcements — use a Modal to share important updates when users log in.
• Conversion nudges — prompt trial users to upgrade at the right moment.

If you need a persistent, always-visible element instead of a guided sequence, consider Pins. For a resource center users can open on demand, see Launchpads. For task-based progress tracking, see Checklists.

Pattern types

Every step in a Flow uses one of four patterns. Choose based on how much attention you want to capture and whether the step needs to point to a specific element.

Modals

Full-attention, screen-level experiences. Modals appear in the center of the screen (or as a sidebar or full-screen takeover) with your app dimmed behind them. Use Modals at the start of a Flow to set context, deliver important announcements, or present rich content like images and videos.

Modals support three layout types:

• Standard — centered content with a dimmed backdrop.
• Sidebar — slides in from the side of the screen.
• Full screen — covers the entire viewport.

Slideouts

Smaller overlays that appear at the edge of the screen. Slideouts are less intrusive than Modals — users can still see parts of your app behind them. Use Slideouts for feature announcements, quick feedback prompts, or upgrade nudges where you don't need full-screen attention.

Tooltips

Pointers anchored to a specific element in your UI. Tooltips direct users through a sequence — "click here, then here." Use them for guided walkthroughs and step-by-step product tours. Each Tooltip attaches to an element using a CSS selector.

Tooltips progress in two ways:

• If the Tooltip has a Next step button, users click the button to advance.
• If the Tooltip has no button, users click the target element itself to advance.

Hotspots

Beacons anchored to elements in your UI. Unlike Tooltips, grouped Hotspots all appear on the page simultaneously, and users can expand them in any order. Use Hotspots for passive feature discovery — highlighting multiple areas of a page without forcing a specific sequence.

Hotspots in the same group display at the same time. All Hotspots in the group must be interacted with before the Flow moves to the next step group.

Step groups

Steps in a Flow are organized into step groups. A step group contains one or more steps of the same pattern type — for example, three Modals in a row, or two Tooltips pointing to related elements.

Step groups affect how your Flow behaves:

• Progress bars track progress within the step group, not across the entire Flow.
• "Previous step" buttons only navigate within the current step group. You can't go back to a previous group.
• Themes are applied per step group. You can use different themes in the same Flow by creating separate groups.
• Tooltips in a group must all be completed before the Flow advances to the next group.
• Hotspots in a group all display simultaneously. The group is complete once every Hotspot has been expanded.

When you add a step in the Builder, you choose whether to add it to the current group or start a new group. Steps within a group can be reordered but can't be moved between groups — to move a step to a different group, save it as a template, delete it, and re-add it to the target group.

Step completion tracking

Different pattern types track completion differently. This matters for targeting conditions and analytics:

"Show once" Flows that start with Tooltips or Hotspots keep appearing until the user interacts with all steps in the first group. The Flow isn't marked as "seen" until that first group is completed.

Flows can span multiple pages

A single Flow can guide users across different pages in your app. For example, you can start with a welcome Modal on the dashboard, then redirect to a settings page and show Tooltips on specific controls.

To build multi-page Flows, you add navigation steps between your content steps. See Build a Flow across pages for setup instructions.

Components

Components are the building blocks inside each step. Add them from the component menu in the Builder:

• Text — headings, paragraphs, and rich text. See Add text, images, and GIFs.
• Images and GIFs — upload visuals or paste a URL.
• Videos — embed from YouTube, Wistia, or other hosts. See Embed a video.
• Buttons — navigate users, trigger actions, or track events. See Add and configure buttons.
• Forms and surveys — collect structured responses. See Surveys and forms.
• Custom HTML — embed any HTML for advanced use cases. See Work with custom HTML.