How I Onboard New Users In 5 Simple Steps

When faced with the task of building my own onboarding flow for ProseBird I was pretty lost. Despite being onboarded to countless services throughout my life, I had never looked at it from the developer's perspective.

Rather than going in blind and wasting time on pointless iterations, I needed to first answer a crucial question: what do I want my onboarding to accomplish?

Initially, this seemed straightforward. My app doesn't require complex setup like identity verification or payment processing, I just needed additional information from users beyond the email they used to create their account.

Turns out that onboarding can be much more than simple data collection. A well-designed onboarding experience can attract new users, understand their needs, generate marketing insights, and even create an emotional connection between users and your product.

That's a lot to accomplish, and without a clear strategy it can get pretty overwhelming really fast. So I outlined four core objectives for my onboarding flow:

1. Personalize the user experience: Creating tailored interactions based on user identity, type, and intended use.

2. Generate product insights: Understanding user segments, expectations, and behaviors to guide development decisions.

3. Drive network growth: Leveraging existing users to expand the platform through collaboration.

4. Capture marketing intelligence: Tracking acquisition channels and attribution for strategic optimization.

Design Approach

When researching onboarding patterns, I found two main presentation styles: modal overlays and dedicated pages.

Modal-based onboarding presents the flow as an overlay while showing glimpses of the dashboard behind it. This approach suggests the onboarding is just a brief step before reaching the main experience. Dedicated page onboarding, on the other hand, gives the process full attention and encourages users to invest more time in completing it thoughtfully.

Neither approach is inherently better, the differences aren't massive, and most users probably don't consciously notice the distinction. Initially, I chose the modal approach because it felt simpler. However, after adding the steps, controls, copy, header, and images, the modal felt too cramped. This was a good sign to migrate to a dedicated page, allowing the layout to breathe a little.

A design pattern I knew I wanted to implement was the split view, commonly used in authentication and onboarding flows. Split views divide the screen into two sections, typically content on one side and a form on the other.

I was drawn to this pattern partly because it's so prevalent (and when done well, looks professional), but I'll admit that fear of incorrectly handling whitespace in a single-column layout also played a part in my decision.

Ultimately, studying good and bad onboarding designs was helpful but I couldn't find complete flows to directly replicate. Most inspiration came from individual design patterns like the split view mentioned above.

This was expected since onboarding flows are inherently unique to each application's specific needs and user base. For that reason, I focused on matching my app's style, following established UX principles, and iterating until it felt cohesive and asthetically pleasing (spoiler: it took a lot of iterating).

Progress Indication

One often overlooked element I implemented was clear progression tracking. Users can see exactly which step they're on and how many remain, displayed as both a progress bar and step counter.

This addresses a fundamental psychological principle: people are more likely to complete tasks when they can visualize progress and see the end point. As a user I agree, and as a developer I think it looks nice. Moving on.

The Five Steps

With objectives and design decisions out of the way, I created the actual user journey. Here's each step in order of appearance and the reasoning behind them:

1. Basic Information

Unique user identifiers in ProseBird are email addresses. Users can invite others to edit and present scripts through email, even if invitees don't have accounts yet. Once invited, it would be awkward to refer to your teammates by their email address.

Rather than implementing traditional usernames or handles, I chose display names. This approach maintains email as the primary identifier while allowing more natural, personalized interactions between users during collaborative sessions.

This step also prompts users to upload a profile picture. If they choose not to, a dynamically colored fallback image displays their initials based on their display name. This ensures every user has a visual identity during collaboration, whether they upload a custom image or not.

The step remains simple and straightforward, allowing users to quickly progress while establishing their visual presence in the app.

2. User Type

This step collects valuable segmentation data to guide product development decisions.

I identified two primary user types:

• Students: From high school through college, needing concise and engaging presentation tools.

• Professionals: Including marketing experts, salespeople, professors, and business leaders who require reliable, high-quality presentation solutions.

Understanding the ratio between these segments is perhaps the most fundamental data point for prioritizing product improvements and feature development.

In addition to these two, a third user type called "Personal" was added to account for users who didn't fit the mold of the first two. Examples of Personal users include: hobbyists, content creators, community organizers, and more.

3. Intent

This step focuses on understanding what users expect ProseBird to help them accomplish.

By allowing users to select specific activities they'll use ProseBird for, they're indirectly communicating which features matter most to them. Combined with ongoing user feedback, this data provides powerful insights into how different user segments interact with the product.

An argument can be made that this is the most strategically important step in the onboarding process, as it directly informs product decisions.

4. Team Collaboration

Collaboration is core to ProseBird's value proposition. The ability to seamlessly coordinate multi-speaker presentations in real time is what sets it apart from boring old teleprompters.

With this in mind, users can inform whether they plan to work alone or with a team. For instance, a YouTuber will likely use the app solo, while college students might need to present group projects collaboratively.

The intention behind this step goes beyond gathering user insights. By allowing new users to provide their potential teammates' email addresses, it's effectively driving organic growth. Referenced individuals receive platform invitations, and having their contact information creates opportunities for future engagement regardless of whether they join immediately.

This step also establishes groundwork for a potential referral system, where successful referrers could share revenue from new paid users they bring to the platform.

5. Attribution Tracking

The fifth and final step asks users how they discovered ProseBird.

This step is standard practice in most SaaS products and serves purely marketing attribution purposes. Understanding which channels drive the highest-quality users helps optimize acquisition spending and strategy.