Flow Analysis shows you the actual path users take through your product—not the ideal path, the real one. If you need to understand where users drop off or what sequences lead to conversion, you need to instrument events properly first. Without the right event tracking setup, Flow Analysis becomes guesswork.
Track Events with Consistent Naming
Flow Analysis chains together event sequences. If your events are named inconsistently or lack context, your flow will show gaps and false branches.
Step 1: Initialize the Mixpanel SDK and start tracking
Install the Mixpanel JavaScript library and initialize it with your project token. Call mixpanel.track() whenever a significant user action happens—form submissions, button clicks, page views, feature usage.
import mixpanel from 'mixpanel-browser';
mixpanel.init('YOUR_PROJECT_TOKEN');
// Track a simple event
mixpanel.track('Signup Form Submitted');
// Track with properties for context
mixpanel.track('Feature Used', {
'feature_name': 'Dashboard Export',
'export_format': 'csv'
});Step 2: Use consistent event names across your app
Event names should be readable and consistent—Button Clicked is too generic, Sign Up Button Clicked is better. If the same action happens in different contexts (mobile vs web, old flow vs new flow), use the same event name with properties to distinguish them, not different event names.
// Good: same event, different context via properties
mixpanel.track('Signup Started', {
'platform': 'mobile',
'referrer': 'email'
});
mixpanel.track('Signup Started', {
'platform': 'web',
'referrer': 'organic'
});
// Bad: creates separate branches in Flow Analysis
// mixpanel.track('Mobile Signup Started');
// mixpanel.track('Web Signup Started');Step 3: Identify users before tracking
Call mixpanel.identify() with a unique user ID before tracking events. This connects all events to one user, which Flow Analysis needs to build journeys. Without identification, each browser session looks like a different person.
// After login/signup, identify the user
function handleLoginSuccess(userId) {
mixpanel.identify(userId);
mixpanel.people.set({
'email': userEmail,
'signup_date': new Date().toISOString()
});
// Now track authenticated user actions
mixpanel.track('Dashboard Viewed');
}Create and Configure Your Flow in Mixpanel
Once events are being tracked consistently, you can build flows in the Mixpanel UI to visualize user journeys.
Step 1: Open Flows and create a new flow
In the Mixpanel dashboard, go to Data > Flows. Click Create Flow. Choose the time window you want to analyze (last 7 days, last 30 days, or custom). This is where you'll define the sequence of events that matter to your business.
Step 2: Define your flow steps
Set your Entry Event (where the journey starts), Intermediate Steps (actions users take next), and Exit Event (where the journey ends, like conversion or churn). Flow Analysis will show the percentage of users who complete each step and where they drop off.
// Example flow sequence tracked in code:
// Entry: User lands on pricing page
mixpanel.track('Pricing Page Viewed');
// Intermediate: User explores plans
mixpanel.track('Plan Selected', { 'plan': 'Pro' });
// Intermediate: User starts signup
mixpanel.track('Signup Form Opened');
// Exit: User completes signup (success) or bounces (drop-off)
mixpanel.track('Signup Completed', { 'plan': 'Pro' });
// or
mixpanel.track('Signup Form Abandoned', { 'step': 'payment' });Step 3: Add filters and breakdowns
Use Filters to narrow flows by user segment ("only paid users") or properties ("only desktop traffic"). Use Breakdowns to split results by a property like Country or Platform and see which segments convert better. This reveals where optimization efforts matter most.
Read the Flow and Act on Insights
Once your flow is live, look for drop-off points and unexpected branches.
Step 1: Identify where users drop off
The flow visualization shows drop-off rates at each step. If 30% of users enter but only 10% reach your exit event, examine the middle steps. Are users bouncing between two events? Leaving the app? Use the Detailed View to sample user sessions and see exactly what's happening.
Step 2: Compare flows over time and by variant
Create the same flow for different date ranges (this week vs. last week, or before/after a feature launch). Use the comparison to see if changes to your product or UI improved or worsened drop-off rates.
// Track feature flags or experiment variants as event properties
mixpanel.track('Signup Form Opened', {
'experiment': 'checkout_redesign',
'variant': 'control'
});
mixpanel.track('Signup Completed', {
'experiment': 'checkout_redesign',
'variant': 'control'
});
// Now filter flows by variant in the UI to compare resultsCommon Pitfalls
- Tracking events with inconsistent names ("SignUp", "Sign Up", "signup") creates separate branches and makes flows unreadable. Pick a convention and stick to it.
- Not calling
mixpanel.identify()before tracking events means you'll see a sea of anonymous users, and Flow Analysis can't connect actions to real user journeys. - Tracking events with no properties makes it hard to filter flows later. Always include context like feature_name, platform, or plan type.
- Forgetting to track exit events (churn, abandonment, errors) means your flow stops before the real story—you'll miss where users actually left.
Wrapping Up
You now have event tracking in place, flows configured, and a way to see where users actually get stuck. The next step is to run experiments on the drop-off points and revalidate in Flow Analysis. If you want to track and optimize these flows automatically across tools, Product Analyst can help.