SaaS Onboarding Flow UI Architect

Product name: FlowPilot AI

Product type: Multi-tenant AI workflow automation SaaS

Target users: Operations managers Marketing operations teams Customer success teams Digital agencies Startup founders

Primary user roles: Workspace Owner Automation Builder Reviewer Team Member Executive Viewer

Primary user jobs: Create AI-powered workflows Connect business tools Run workflows Review generated outputs Approve high-risk actions Investigate failed runs Invite collaborators Monitor usage

Activation event: The user successfully runs the first workflow.

Activation outcome: The user reviews a useful AI-generated result and understands how future workflow runs will be managed.

Time-to-value target: During the first session when possible

Business model: 14-day free trial followed by monthly subscription

Trial length: 14 days, subject to verification

Pricing: Multiple subscription plans with usage-based limits

Signup method: Email and password Google sign-in Microsoft sign-in Enterprise SSO for eligible plans

Required account information: Name Email Password when applicable

Required workspace information: Workspace name Primary use case

Required integrations: At least one connected tool for real-data activation

Required data import: Optional CSV upload for selected workflows

Required permissions: Integration-specific permissions Workspace role permissions

Primary first action: Create and run the first AI workflow

Secondary first actions: Connect an integration Choose a template Review the workflow output Invite a reviewer

Available templates: Client reporting Lead qualification Support-ticket classification Content approval Customer feedback analysis Invoice review

Available sample data: Yes

Collaboration requirements: Optional during first-session activation Recommended after the first successful workflow

Upgrade triggers: Trial expiration Usage limit Premium integration Advanced approval controls Additional workspace members

Current onboarding problems: Signup completion is acceptable, but many users abandon during integration setup. Users frequently land on an empty workflow dashboard. The product tour contains nine passive tooltips. Users do not understand whether sample data is real. The activation checklist includes profile completion but does not include running a workflow. Upgrade prompts appear immediately after signup. Mobile users report that the integration modal is difficult to complete. Users who leave during setup often cannot identify where to resume.

Current analytics: Signup events Workspace-created event Integration-connected event Workflow-created event Workflow-run event Upgrade-click event

Frontend stack: Next.js React TypeScript Tailwind CSS

Design system: Custom system using shadcn/ui and Radix UI

Responsive targets: Wide desktop Desktop Tablet Mobile Portrait and landscape

Accessibility target: WCAG 2.2 AA implementation review

Localization: English initially Spanish and German planned Allow at least 30% text expansion

Need output: Activation strategy Complete onboarding flow Signup specification Welcome screen Role and goal personalization Workspace setup Integration setup Sample-data path Template selection First-action flow First success state Empty states Activation checklist Upgrade and trial messaging Resume and recovery Mobile behavior Accessibility Analytics event map Experiment roadmap Developer handoff Acceptance criteria QA checklist Risk assessment

Need variations: Fast-Value Sample Data Flow Real Integration Flow Enterprise Approval Flow

Special constraints: Do not invent activation metrics. Do not invent pricing or trial terms. Do not force teammate invitations. Clearly label sample data. Allow optional steps to be skipped. Preserve user work. Avoid upgrade pressure before first value.

=== SAAS ONBOARDING FLOW ARCHITECTURE ===

Product: FlowPilot AI

Product Type: Multi-tenant AI workflow automation SaaS

Primary Users: Operations managers, marketing operations teams, customer success teams, agencies, and startup founders.

Primary Activation Goal: Help a new user create, run, and review the result of the first AI workflow.

=== EXECUTIVE SUMMARY ===

The current onboarding delays product value by treating integration setup and interface explanation as prerequisites to understanding the product.

The recommended system should provide two valid activation paths:

Path A: Use clearly labeled sample data to create and run a workflow immediately.

Path B: Connect a verified business integration and run a workflow with real data.

The onboarding should no longer begin with a nine-step passive product tour. It should ask what the user wants to accomplish, recommend a relevant workflow template, provide a sample-data or integration choice, guide the first workflow run, and confirm the result.

Upgrade messaging should be delayed until the user understands the workflow or reaches a genuine plan limit.

=== ACTIVATION DEFINITION ===

Activation User: Workspace Owner or Automation Builder

Activation Job: Automate a repetitive business process

Activation Action: Create and run the first workflow

Activation Outcome: Review a successfully generated result and understand where future runs, failures, and approvals will appear

Time Window: First session when possible

Evidence Required:

• Workflow created
• Workflow run completed
• Output viewed
• Result acknowledged or reviewed

Do Not Use As Activation:

• Account created
• Workspace created
• Tour completed
• Profile completed
• Integration connected without a workflow run

=== ACTIVATION LEVELS ===

Setup Activation: Workspace created and primary goal selected

Behavioral Activation: First workflow created and run

Outcome Activation: Generated output viewed and understood

Collaborative Activation: Optional reviewer invited and first review completed

Primary Product Metric: Outcome activation

=== TIME-TO-VALUE STRATEGY ===

Immediate Value: Show a goal-based workflow recommendation.

First-Session Value: Create and run a workflow with sample or real data.

First-Day Value: Customize the workflow and save it for repeated use.

First-Week Value: Run the workflow again, review history, and invite a collaborator when relevant.

Dependencies:

• Template availability
• Integration availability
• Sample-data path
• AI processing
• Output review

Acceleration Methods:

• Goal-based template recommendation
• Sample data
• Prefilled workflow configuration
• Default approval settings
• Contextual guidance
• Deferred invitations
• Deferred optional preferences

=== USER SEGMENTS ===

Segment 1: Operations Manager

Primary Goal: Automate internal operational tasks

Recommended Templates: Invoice review Customer feedback analysis Approval workflow

First Action: Run an approval-oriented workflow

Segment 2: Marketing Operations

Primary Goal: Automate campaign and content workflows

Recommended Templates: Content approval Lead qualification Campaign report preparation

First Action: Run a content or lead workflow

Segment 3: Customer Success

Primary Goal: Organize and analyze customer information

Recommended Templates: Support-ticket classification Customer feedback analysis Account-risk summary

First Action: Run a customer-data workflow

Segment 4: Digital Agency

Primary Goal: Automate repeatable client work

Recommended Templates: Client reporting Content approval Lead qualification

First Action: Create a client-oriented workflow

=== PRIMARY FLOW MAP ===

1. Signup
2. Verification when required
3. Welcome
4. Primary goal selection
5. Workspace creation
6. Recommended template
7. Choose data path
8. Configure workflow
9. Run workflow
10. Review output
11. Confirm first success
12. Display activation checklist
13. Offer integration, customization, or collaboration as the next step
14. Introduce plan education only when relevant

=== REQUIRED AND OPTIONAL STEPS ===

Required:

• Account identity
• Workspace name
• Primary goal
• Template or blank workflow
• Data path
• First workflow run
• Output review

Optional:

• Job title
• Team size
• Additional preferences
• Multiple integrations
• Teammate invitations
• Notification settings
• Profile image
• Advanced workflow controls

=== SIGNUP SPECIFICATION ===

Heading: Create your FlowPilot workspace

Supporting Copy: Start with sample data or connect a business tool when you are ready.

Fields:

• Name
• Work email
• Password when email signup is used

Alternative Methods:

• Continue with Google
• Continue with Microsoft
• Enterprise SSO when eligible

Primary CTA: Create Workspace

Secondary Link: Sign In

Requirements:

• Persistent labels
• Password requirements shown before failure
• Password-manager support
• Paste support
• Duplicate-submission prevention
• Clear verification instructions
• Values preserved after error
• Verified trial information displayed clearly

Error Examples:

• This email already belongs to an account. Sign in or reset your password.
• We could not create the account. Your information has been preserved. Try again.

=== WELCOME SCREEN ===

Heading: Build your first AI workflow

Supporting Copy: Choose what you want to automate, start with a recommended template, and run your first workflow with sample or connected data.

Primary CTA: Choose My Goal

Secondary Action: Explore Without Setup

Estimated Time: Use only a verified estimate.

Progress: Step 1 of the required activation path

Mobile: Single-column layout with the primary action visible early.

=== GOAL SELECTION ===

Question: What do you want to automate first?

Options:

Client Reporting: Prepare recurring client-ready summaries.

Lead Qualification: Classify and prioritize incoming leads.

Support Classification: Organize incoming support requests.

Content Approval: Create and review content approval workflows.

Customer Feedback: Analyze feedback and identify themes.

Invoice Review: Extract and review invoice information.

Other: Start from a blank workflow.

Personalization Effect: The selected goal changes the recommended template, setup copy, sample data, checklist, dashboard guidance, and success state.

=== WORKSPACE SETUP ===

Required Field: Workspace Name

Optional Fields:

• Company name
• Team size

Helper Text: You can change the workspace name later.

Primary CTA: Create Workspace

Validation:

• Required name
• Supported character behavior
• Duplicate-name handling only when technically required
• Preserve values after failure

=== TEMPLATE SELECTION ===

Recommended Section: Best match for your goal

Secondary Sections:

• Other templates
• Start from blank

Template Card:

• Name
• Use case
• Expected output
• Required data
• Preview
• Customization summary

Recommended Template: Support Ticket Classifier, based on the selected Customer Support goal

Primary CTA: Use This Template

Secondary Action: Preview Workflow

Integrity: Do not show fake popularity, unsupported setup times, or unverified performance claims.

=== DATA PATH CHOICE ===

Heading: Choose how to test your workflow

Option A: Use Sample Data

Description: Run the workflow with fictional example records. Sample data can be removed at any time.

Option B: Connect My Data

Description: Connect a supported business tool or upload an approved file.

Recommended Default: Do not preselect a path deceptively. Clearly explain both options.

=== SAMPLE DATA PATH ===

Label: Sample Workspace Data

Required Indicators:

• Visible Sample Data badge
• Fictional company and user names
• Remove Sample Data action
• Excluded from production analytics where appropriate
• No visual implication that the records are real customers

Success: Sample data loads and the workflow configuration becomes available.

=== INTEGRATION PATH ===

Heading: Connect a tool

Integration Card Example: Google Sheets

Purpose: Provide records for the selected workflow.

Permissions: Display verified permissions and data access.

Primary CTA: Connect Google Sheets

Secondary Action: Use Sample Data Instead

States:

• Available
• Connecting
• Permission Required
• Admin Approval Required
• Connected
• Failed
• Expired
• Disconnected

Error: We could not complete the connection. No workflow data was changed. Try again or use sample data.

=== FIRST-ACTION FLOW ===

Action: Run the first workflow

Prerequisites:

• Template selected
• Data path available
• Required configuration complete

Interface: Review screen showing:

• Workflow name
• Input source
• Processing steps
• Output destination
• Approval setting
• Run button

Primary CTA: Run Workflow

Secondary Action: Edit Setup

Loading:

• Display current processing state
• Prevent duplicate runs
• Keep the workflow available
• Announce meaningful progress
• Provide safe cancellation only when supported

Failure:

• Explain the failed stage
• Preserve configuration
• Preserve source data
• Provide retry
• Provide troubleshooting
• Offer sample data when relevant

=== FIRST SUCCESS STATE ===

Heading: Your first workflow completed

Supporting Copy: Review the generated result, then decide whether to keep, edit, or rerun the workflow.

Primary CTA: Review Output

Secondary Actions:

• Edit Workflow
• Run Again
• View Run History

Value Explanation: The workflow processed the selected data and created a reviewable result.

Do Not: Show an upgrade modal before the user can inspect the result.

=== FIRST-USE EMPTY STATE ===

Page: Workflow Dashboard

Heading: Create your first automated workflow

Description: Start with a recommended template, use sample data, or connect a supported tool.

Primary CTA: Choose a Template

Secondary Actions:

• Start Blank
• Use Sample Data
• Connect a Tool

Visual: Simple workflow diagram or relevant product screenshot.

Avoid: Blank dashboard, decorative illustration without guidance, or generic Create button.

=== ACTIVATION CHECKLIST ===

Checklist Goal: Complete the first meaningful workflow and prepare the workspace for continued use.

Tasks:

1. Select Your Goal Completion Event: goal_selected

Required: Yes

2. Create Your Workspace Completion Event: workspace_created

Required: Yes

3. Choose a Template Completion Event: template_selected

Required: Yes

4. Add Sample or Connected Data Completion Event: sample_data_enabled or integration_completed

Required: Yes

5. Run Your First Workflow Completion Event: first_action_completed

Required: Yes

6. Review the Result Completion Event: activation_achieved

Required: Yes

7. Invite a Reviewer Completion Event: invitation_sent

Required: No

Progress Logic: Required activation tasks determine the primary completion state. Optional collaboration does not prevent activation.

Post-Completion: Replace the onboarding checklist with a suggested next-action panel.

=== UPGRADE ARCHITECTURE ===

Do Not Show: Immediate full-screen upgrade prompt after signup

Valid Triggers:

• Verified trial end approaches
• Usage limit is reached
• Premium integration is selected
• Advanced approval control is selected
• Additional member limit is reached

Contextual Prompt Example:

Heading: This integration is available on the verified eligible plan.

Body: Explain the capability, current plan, verified price, billing terms, and what happens without upgrading.

Primary CTA: View Plans

Secondary Action: Choose Another Integration

Requirements:

• Preserve workflow setup
• Explain recurring billing
• Do not create fake urgency
• Do not preselect a paid plan deceptively

=== TRIAL MESSAGING ===

Display Verified Information:

• Trial length
• Trial start
• Trial end
• Included features
• Limits
• Payment requirements
• Conversion behavior
• Cancellation conditions
• Data retention
• Post-trial access

Recommended Placement:

• Signup
• Account area
• Relevant plan-limit state
• Approaching-end reminder
• Pricing page

=== RESUME AND RECOVERY ===

Resume Card: Continue Setting Up FlowPilot

Content:

• Last completed step
• Current next step
• Remaining required tasks
• Resume CTA
• Dismiss option when appropriate

Progress Preservation:

• Save completed steps
• Save selected goal
• Save workspace
• Save selected template
• Preserve valid integration state
• Preserve draft workflow configuration

Expired Session: After sign-in, return the user to the saved onboarding step.

Changed Permission: Explain the change and offer a valid alternate path.

=== MOBILE ONBOARDING ===

Layout: One primary task per screen

Form Behavior:

• Full-width fields
• Persistent labels
• Mobile-appropriate input types
• Focused fields remain visible above the keyboard
• Error messages remain visible
• Entered values remain preserved

Progress: Compact text-based progress with accessible current-step information

Tours: Use contextual inline guidance instead of complex anchored tooltip sequences.

Integrations: Open in a scrollable full-width drawer or dedicated screen.

Sticky Actions:

• Respect safe areas
• Do not cover fields or errors
• Adapt while the virtual keyboard is active

=== ACCESSIBILITY REQUIREMENTS ===

• Semantic heading hierarchy
• Persistent labels
• Accessible control names
• Keyboard-operable flow
• Visible focus
• Logical focus order
• Accessible progress information
• Programmatic form relationships
• Error summary for complex forms
• Errors linked to fields
• Modal and drawer focus management
• Loading and success announcements
• Reduced-motion support
• Sufficient contrast
• Non-color status indicators
• Browser zoom and reflow
• Adequate touch targets
• Mobile keyboard support
• Drag-and-drop alternatives
• Session-timeout warnings

=== ANALYTICS EVENT MAP ===

Event: signup_completed

Purpose: Measure successful account creation.

Event: goal_selected

Properties:

• goal_id
• device_type
• acquisition_source

Event: template_selected

Properties:

• template_id
• goal_id
• data_path

Event: sample_data_enabled

Properties:

• template_id
• goal_id

Event: integration_completed

Properties:

• integration_type
• goal_id
• template_id

Event: first_action_started

Properties:

• workflow_type
• data_path
• device_type

Event: first_action_completed

Properties:

• workflow_type
• data_path
• processing_result

Event: activation_achieved

Properties:

• workflow_type
• data_path
• time_to_activation_bucket

Privacy: Do not include names, emails, imported records, private file names, output content, credentials, tokens, or sensitive account information.

=== EXPERIMENT ROADMAP ===

Experiment 1: Sample Data Versus Integration-First

Observation: Users abandon during integration setup.

Hypothesis: Offering sample data before integration will improve first-session activation.

Control: Integration required before workflow creation

Variation: Sample data or integration choice

Primary Metric: Outcome activation rate

Guardrails: Integration completion Second-session return Support contact rate

Experiment 2: Goal-Based Template Recommendation

Hypothesis: Recommending one relevant template after goal selection will reduce time to first action.

Control: Full template library

Variation: One recommended template plus alternatives

Primary Metric: Time to first workflow run

Experiment 3: Contextual Guidance Versus Passive Tour

Hypothesis: Contextual guidance during workflow creation will improve first-action completion compared with a nine-step passive tour.

Primary Metric: First-action completion rate

Guardrail: Tour dismissal and error rate

Experiment 4: Upgrade Timing

Hypothesis: Delaying upgrade messaging until after first value will improve activation without reducing qualified plan interest.

Primary Metric: Activation rate

Guardrail: Qualified pricing-page visits

=== DEVELOPER HANDOFF ===

Required Components:

• SignupForm
• VerificationState
• WelcomeScreen
• GoalSelector
• WorkspaceSetup
• TemplateSelector
• DataPathSelector
• IntegrationCard
• SampleDataCard
• WorkflowReview
• WorkflowRunStatus
• FirstSuccessState
• ActivationChecklist
• ResumeCard
• UpgradePrompt
• TrialStatus
• MobileProgress
• ErrorSummary

Required Data:

• User
• Workspace
• Role
• Goal
• Template
• Integration
• Permission
• Workflow Draft
• Run
• Output
• Checklist Progress
• Trial
• Plan
• Invitation

Implementation Rules:

• Preserve onboarding state.
• Keep required and optional steps explicit.
• Do not mark tasks complete without a valid event.
• Preserve configuration after errors.
• Do not block access with optional invitations.
• Keep sample data visibly labeled.
• Keep upgrade behavior transparent.
• Avoid duplicate analytics events.
• Support keyboard and mobile interaction.

=== IMPLEMENTATION SEQUENCE ===

1. Confirm the activation definition.
2. Confirm user roles and goals.
3. Confirm required account and workspace data.
4. Implement signup and verification.
5. Implement welcome and goal selection.
6. Implement workspace setup.
7. Implement template recommendation.
8. Implement sample-data and integration paths.
9. Implement the first workflow flow.
10. Implement loading, failure, and success.
11. Implement activation checklist.
12. Implement resume and recovery.
13. Implement trial and upgrade states.
14. Implement mobile behavior.
15. Implement accessibility.
16. Add analytics.
17. Complete QA.
18. Launch prioritized experiments.

=== ACCEPTANCE CRITERIA ===

Goal Personalization:

Given a new user selects Customer Support Automation, when onboarding continues, then the recommended templates, example data, first action, checklist tasks, and success state align with customer-support workflows.

Optional Integration:

Given the user cannot connect an integration, when the data-path choice appears, then the user can select clearly labeled sample data and continue toward activation.

Progress Integrity:

Given the user completes only optional profile information, when checklist progress updates, then required activation progress does not increase unless a defined activation task is completed.

Resume:

Given the user leaves after selecting a template, when the user returns, then the selected goal, workspace, template, and valid configuration remain available and the user can continue from the correct step.

Mobile Keyboard:

Given a mobile user focuses the final field on a setup screen, when the virtual keyboard appears, then the field, error message, and primary action remain reachable without being covered by sticky controls.

Upgrade Integrity:

Given the user has not reached a verified plan limit, when onboarding is in progress, then the product does not block activation with an unnecessary upgrade prompt.

=== QA CHECKLIST ===

Activation:

• Verify activation event.
• Verify outcome evidence.
• Verify checklist completion.
• Verify sample-data activation.
• Verify integration activation.

Signup:

• Verify all authentication methods.
• Verify error recovery.
• Verify password managers.
• Verify verification.
• Verify trial copy.

Setup:

• Verify required and optional fields.
• Verify data persistence.
• Verify goal personalization.
• Verify template recommendation.

Integrations:

• Verify permissions.
• Verify failure.
• Verify retry.
• Verify alternate path.
• Verify expired connection.

Workflow:

• Verify loading.
• Verify duplicate prevention.
• Verify failure recovery.
• Verify output access.
• Verify first success.

Responsive:

• Verify desktop.
• Verify tablet.
• Verify mobile.
• Verify landscape.
• Verify virtual keyboard.
• Verify short-height screens.

Accessibility:

• Verify labels.
• Verify keyboard.
• Verify focus.
• Verify errors.
• Verify announcements.
• Verify progress semantics.
• Verify zoom and reflow.
• Verify reduced motion.

Analytics:

• Verify event triggers.
• Verify event order.
• Verify no duplicates.
• Verify privacy.
• Verify segmentation properties.

=== RISKS ===

Risk: Activation remains defined too narrowly.

Mitigation: Validate whether output review predicts long-term value better than workflow completion alone.

Risk: Sample data improves onboarding metrics but not real-data adoption.

Mitigation: Track sample-data activation separately from connected-data activation and guide the next integration step.

Risk: Integration permissions cause abandonment.

Mitigation: Explain permissions, offer sample data, preserve progress, and support administrator approval.

Risk: Upgrade prompts interrupt activation.

Mitigation: Use verified contextual triggers and preserve the user's work.

Risk: Checklist completion becomes a vanity metric.

Mitigation: Base required tasks on validated activation behavior.

=== KNOWN LIMITATIONS ===

• Product capabilities and integration behavior require verification.
• Trial and pricing terms require verification.
• Analytics must be implemented and validated.
• Accessibility requires implementation testing.
• Browser and mobile behavior require live testing.
• Experiment conclusions require sufficient data.
• Activation does not guarantee retention or paid conversion.
• The architecture does not guarantee revenue growth or reduced churn.

=== FINAL INTEGRITY NOTE ===

All trial conditions, pricing, limits, permissions, integrations, security statements, product capabilities, upgrade terms, data-use explanations, and activation claims must be verified before publication.

The onboarding architecture is designed to improve clarity, guidance, and activation readiness. It does not guarantee retention, trial-to-paid conversion, feature adoption, revenue, or reduced churn.