Customer/Tenant Journeys

This document maps all user journeys for authenticated customers/tenants of the SCORM API, organized by user type.

Overview

User Types:

• Unknown Users: New customers with no activity yet
• SCORM API Users: Customers using SCORM package hosting
• xAPI Users: Customers sending xAPI statements
• SCORM Dispatch Users: Customers creating dispatch packages
• Mixed Users: Customers using multiple features

Entry Point: /dashboard (after authentication) Primary Goals: Manage SCORM packages, track learning, configure integrations, view analytics

Journey 1: New Customer First Login (Unknown Type)

Persona: New customer, just completed onboarding Task: Get started with the service Entry Point: /dashboard (first login) User Type: Unknown (no activity detected)

Path

graph TD
    A[Onboarding Success] --> B[Dashboard /dashboard]
    B --> C[User type: Unknown]
    C --> D[See Getting Started Guide]
    D --> E{Choose path}
    E -->|SCORM| F[Click 'SCORM Packages' widget]
    E -->|xAPI| G[Click 'xAPI Statements' widget]
    E -->|Dispatch| H[Click 'Dispatch Packages' widget]
    F --> I[Packages Page /dashboard/packages]
    G --> J[xAPI Page /dashboard/xapi]
    H --> K[Dispatch Page /dashboard/dispatch]
    I --> L[View API docs for upload]
    J --> M[View API docs for xAPI]
    K --> N[View dispatch creation guide]

Detailed Steps

1. Start: User completes onboarding, redirected to /dashboard
2. Dashboard Loads:
   • Welcome message displayed
   • User type badge: "Unknown" (or no badge)
   • Quick stats: Storage 0%, Packages 0
3. Getting Started Widget: Displays guide with three options:
   • SCORM Packages: "Upload SCORM 1.2 or 2004 packages"
   • xAPI Statements: "Send xAPI statements to track learning"
   • Dispatch Packages: "Create dispatch packages for third-party LMSs"
4. Action: Click on desired widget (e.g., "SCORM Packages")
5. Feature Page: Navigate to relevant page:
   • /dashboard/packages - Shows empty state with API docs link
   • /dashboard/xapi - Shows empty state with xAPI docs link
   • /dashboard/dispatch - Shows empty state with dispatch guide
6. Next Steps: User follows API documentation to start using the service

Buttons/Actions

• Widget cards (/dashboard - click to navigate)
• "View API Documentation" link (empty state pages)
• "Get Started" buttons (getting started guide)

Exit Point

Feature-specific pages (/dashboard/packages, /dashboard/xapi, /dashboard/dispatch)

Journey 2: SCORM API User Uploading First Package

Persona: SCORM API user (detected or self-selected) Task: Upload and manage SCORM packages Entry Point: /dashboard/packages User Type: SCORM API

Path

graph TD
    A[Dashboard /dashboard] --> B[Click 'SCORM Packages' widget]
    B --> C[Packages Page /dashboard/packages]
    C --> D{Has packages?}
    D -->|No| E[See empty state]
    D -->|Yes| F[View packages grid]
    E --> G[Click 'View API Documentation']
    G --> H[API Docs /api/docs]
    H --> I[Review upload endpoint]
    I --> J[Use API to upload package]
    J --> K[Refresh packages page]
    K --> F
    F --> L[Click package card]
    L --> M[Package Details /dashboard/packages/[id]]
    M --> N[View package info]
    N --> O[Click 'Launch' button]
    O --> P[Launch Session /api/v1/packages/[id]/launch]

Detailed Steps

1. Start: User on /dashboard
2. Action: Click "SCORM Packages" widget (or navigate to /dashboard/packages)
3. Packages Page: /dashboard/packages loads
4. Empty State (if no packages):
   • Message: "No packages found"
   • Description: "Get started by uploading your first SCORM package via the API."
   • Action: Click "View API Documentation" button
   • Opens /api/docs in new tab
5. API Documentation: User reviews upload flow:
   • POST /api/v1/packages/upload-url → PUT to presigned URL → POST /api/v1/packages/process
   • Auth: API key via Authorization: Bearer or X-API-Key
   • Response after process: package metadata and launch-ready package id
6. Upload Package: User uses API (curl, Postman, or code) to upload SCORM package via the presigned flow
7. Refresh: User clicks "Refresh" button on packages page
8. Package Appears: Package card shows in grid:
   • Title, SCORM version badge, file size
   • Upload date, SCO count (if available)
   • "Launch" and "View Details" buttons
9. View Details: Click "View Details" → /dashboard/packages/[id]
10. Package Details: View full package information:
    • Metadata, versions, distribution settings
    • Launch URL, manifest URL
    • Session history
11. Launch: Click "Launch" button → Opens session in new tab

Buttons/Actions

• "SCORM Packages" widget (/dashboard)
• "View API Documentation" button (empty state)
• "Upload via API" button (packages page header)
• "Refresh" button (packages page)
• "View Details" button (package card)
• "Launch" button (package card or details page)

Exit Point

/dashboard/packages/[id] (package details) or launched session

Journey 3: SCORM API User Launching Session

Persona: SCORM API user Task: Launch a SCORM learning session Entry Point: /dashboard/packages or /dashboard/packages/[id]

Path

graph TD
    A[Packages Page /dashboard/packages] --> B[Click 'Launch' on package]
    B --> C[API Launch /api/v1/packages/[id]/launch]
    C --> D[Session created]
    D --> E[Redirect to Player /player/[sessionId]]
    E --> F[SCORM Player loads]
    F --> G[Content in iframe]
    G --> H[Learner interacts]
    H --> I[CMI data synced]
    I --> J{Exit?}
    J -->|Yes| K[Click exit button]
    J -->|No| H
    K --> L[Session terminated]
    L --> M[Return to packages]

Detailed Steps

1. Start: User on packages page or package details
2. Action: Click "Launch" button on package card
3. API Call: Browser makes request to /api/v1/packages/[id]/launch
   • Requires authentication (Clerk session or API key)
   • Creates new session
   • Returns session data with sessionId
4. Redirect: Browser redirected to /player/[sessionId]?token=[launchToken]
5. Player Page: SCORM player loads:
   • Fetches session data
   • Initializes SCORM API bridge
   • Loads SCORM content in iframe
6. Content Interaction: Learner interacts with SCORM content
7. CMI Data Sync: SCORM API bridge syncs data to backend:
   • Progress, completion status, scores
   • Suspend data, session time
8. Exit: Learner clicks exit button or closes tab
9. Session Terminated: Final CMI data saved
10. Return: User returns to packages page to view updated session data

Buttons/Actions

• "Launch" button (package card or details page)
• Exit controls (SCORM player UI)
• Fullscreen toggle (player controls)

Exit Point

/dashboard/packages (after session completion)

Journey 4: xAPI User Sending Statements

Persona: xAPI user Task: Send xAPI statements and view analytics Entry Point: /dashboard/xapi User Type: xAPI

Path

graph TD
    A[Dashboard /dashboard] --> B[Click 'xAPI Statements' widget]
    B --> C[xAPI Page /dashboard/xapi]
    C --> D[View statements list]
    D --> E[Review stats]
    E --> F{Want to send?}
    F -->|Yes| G[Click 'View API Docs']
    F -->|No| H[Filter/search statements]
    G --> I[API Docs /api/docs]
    I --> J[Review xAPI endpoint]
    J --> K[Use API to send statement]
    K --> L[Refresh xAPI page]
    L --> D
    H --> M[View filtered results]

Detailed Steps

1. Start: User on /dashboard
2. Action: Click "xAPI Statements" widget
3. xAPI Page: /dashboard/xapi loads
4. Stats Display: View statistics:
   • Total statements
   • Unique verbs count
   • Unique activities count
5. Statements List: View recent statements:
   • Actor (learner)
   • Verb (action)
   • Object (activity)
   • Timestamp
   • Result (if available)
6. Filtering: Use filters:
   • Search by actor, verb, or activity
   • Filter by verb type
   • Filter by activity
7. Send Statements:
   • Click "View API Documentation" link
   • Review POST /api/v1/xapi/statements endpoint
   • Use API to send xAPI statements
8. Refresh: Click "Refresh" to see new statements

Buttons/Actions

• "xAPI Statements" widget (/dashboard)
• "View API Documentation" link (xAPI page)
• "Refresh" button (xAPI page)
• Search input (filter statements)
• Filter dropdowns (verb, activity)

Exit Point

/dashboard/xapi (continues viewing statements)

Journey 5: Dispatch User Creating Dispatch Package

Persona: SCORM Dispatch user Task: Create dispatch package for third-party LMS distribution Entry Point: /dashboard/dispatch User Type: SCORM Dispatch

Path

graph TD
    A[Dashboard /dashboard] --> B[Click 'SCORM Dispatch' widget]
    B --> C[Dispatch Page /dashboard/dispatch]
    C --> D{Has dispatches?}
    D -->|No| E[See empty state]
    D -->|Yes| F[View dispatches list]
    E --> G[Click 'Create Dispatch Package']
    F --> H[Click 'Create Dispatch Package' button]
    G --> I[Create Dispatch /dashboard/dispatch/create]
    H --> I
    I --> J[Select package]
    J --> K[Configure settings]
    K --> L[Set registration limit]
    L --> M[Set expiration]
    M --> N[Set allowed domains]
    N --> O[Click 'Create Dispatch']
    O --> P[Dispatch created]
    P --> Q[View dispatch details]
    Q --> R[Copy dispatch link]
    R --> S[Share with third-party LMS]

Detailed Steps

1. Start: User on /dashboard
2. Action: Click "SCORM Dispatch" widget (or navigate to /dashboard/dispatch)
3. Dispatch Page: /dashboard/dispatch loads
4. Empty State (if no dispatches):
   • Message: "No dispatch packages found"
   • Action: Click "Create Dispatch Package" button
5. Create Page: /dashboard/dispatch/create loads
6. Select Package: Choose SCORM package from dropdown
7. Configure Settings:
   • Dispatch Name: Enter name (optional)
   • Registration Limit: Set max registrations (optional)
   • Expiration Date: Set expiration (optional)
   • Allowed Domains: Add domains that can use dispatch (optional)
8. Action: Click "Create Dispatch" button
9. Dispatch Created: Success message shown
10. Dispatch Details: View dispatch information:
    • Dispatch token
    • Launch URL
    • Registration count
    • Status
11. Copy Link: Click "Copy" button to copy dispatch URL
12. Share: Share dispatch URL with third-party LMS

Buttons/Actions

• "SCORM Dispatch" widget (/dashboard)
• "Create Dispatch Package" button (dispatch page)
• "Create Dispatch" button (create form)
• "Copy" button (dispatch details)
• "Download ZIP" button (if available)
• "Revoke" button (to disable dispatch)

Exit Point

/dashboard/dispatch (with new dispatch created)

Journey 6: Customer Managing API Keys

Persona: Any customer type Task: Create and manage API keys for programmatic access Entry Point: /dashboard/api-keys

Path

graph TD
    A[Dashboard /dashboard] --> B[Click 'API Keys' widget]
    B --> C[API Keys Page /dashboard/api-keys]
    C --> D[View existing keys]
    D --> E{Need new key?}
    E -->|Yes| F[Click 'Create API Key']
    E -->|No| G[Manage existing keys]
    F --> H[Enter key name]
    H --> I[Select scopes]
    I --> J[Click 'Create']
    J --> K[Key displayed once]
    K --> L[Copy key]
    L --> M[Save securely]
    G --> N[Revoke key]
    G --> O[View key details]

Detailed Steps

1. Start: User on /dashboard
2. Action: Click "API Keys" widget (or navigate to /dashboard/api-keys)
3. API Keys Page: /dashboard/api-keys loads
4. View Keys: See list of existing API keys:
   • Key name
   • Scopes (read, write, admin)
   • Created date
   • Last used date
   • Expiration (if set)
5. Create New Key:
   • Click "Create API Key" button
   • Enter key name (e.g., "Production API Key")
   • Select scopes (read, write, admin)
   • Click "Create" button
6. Key Displayed: Key shown once (cannot be retrieved later)
   • Action: Click "Copy" button to copy key
   • Save key securely (password manager, secure storage)
7. Manage Keys:
   • Revoke: Click "Revoke" button to disable key
   • View Details: See usage statistics, last used time

Buttons/Actions

• "API Keys" widget (/dashboard)
• "Create API Key" button (API keys page)
• "Create" button (create form)
• "Copy" button (new key display)
• "Revoke" button (existing keys)
• "Show Secret" / "Hide Secret" toggle (if applicable)

Exit Point

/dashboard/api-keys (keys managed)

Journey 7: Customer Viewing Reports

Persona: Any customer type with learning activity Task: View learner progress and analytics Entry Point: /dashboard/reports

Path

graph TD
    A[Dashboard /dashboard] --> B[Click 'Reports' widget]
    B --> C[Reports Page /dashboard/reports]
    C --> D{Report type?}
    D -->|Learner Progress| E[Click 'Learner Progress']
    D -->|Custom| F[Click 'Custom Reports']
    E --> G[Learner Progress /dashboard/reports/learner-progress]
    F --> H[Custom Reports /dashboard/reports/custom]
    G --> I[View progress data]
    H --> J[Build custom report]
    J --> K[Select filters]
    K --> L[Choose visualization]
    L --> M[Generate report]
    M --> N[View results]

Detailed Steps

1. Start: User on /dashboard
2. Action: Click "Reports" widget
3. Reports Page: /dashboard/reports loads
4. Report Options: Two main report types:
   • Learner Progress: Pre-built progress reports
   • Custom Reports: Build custom reports with filters
5. Learner Progress:
   • Click "Learner Progress" link
   • View completion rates, scores, time spent
   • Filter by package, learner, date range
6. Custom Reports:
   • Click "Custom Reports" link
   • Select data source (sessions, statements, packages)
   • Apply filters (date, package, learner, status)
   • Choose visualization (table, chart, export)
   • Click "Generate Report"
   • View results

Buttons/Actions

• "Reports" widget (/dashboard)
• "Learner Progress" link (reports page)
• "Custom Reports" link (reports page)
• Filter controls (date pickers, dropdowns)
• "Generate Report" button (custom reports)
• "Export" button (if available)

Exit Point

/dashboard/reports/learner-progress or /dashboard/reports/custom

Journey 8: Customer Configuring Webhooks

Persona: Any customer type Task: Set up webhooks for event notifications Entry Point: /dashboard/webhooks

Path

graph TD
    A[Dashboard /dashboard] --> B[Click 'Webhooks' widget]
    B --> C[Webhooks Page /dashboard/webhooks]
    C --> D[View existing webhooks]
    D --> E{Need new webhook?}
    E -->|Yes| F[Click 'Create Webhook']
    E -->|No| G[Manage existing]
    F --> H[Enter webhook URL]
    H --> I[Select event type]
    I --> J[Set secret optional]
    J --> K[Click 'Create']
    K --> L[Webhook created]
    G --> M[Test webhook]
    G --> N[Edit webhook]
    G --> O[Delete webhook]
    M --> P[View delivery logs]

Detailed Steps

1. Start: User on /dashboard
2. Action: Click "Webhooks" widget
3. Webhooks Page: /dashboard/webhooks loads
4. View Webhooks: See list of existing webhooks:
   • URL
   • Event type
   • Status (active/inactive)
   • Last delivery status
5. Create Webhook:
   • Click "Create Webhook" button
   • Enter webhook URL (must be HTTPS)
   • Select event type:
     • Package Processing Completed
     • Package Processing Failed
     • Session Created
     • Session Completed
     • Session Progress
   • Enter secret (optional, for signature verification)
   • Click "Create" button
6. Webhook Created: Webhook appears in list
7. Manage Webhooks:
   • Test: Click "Test" button to send test event
   • Edit: Click "Edit" to modify settings
   • Delete: Click "Delete" to remove webhook
   • View Deliveries: Click webhook to see delivery logs

Buttons/Actions

• "Webhooks" widget (/dashboard)
• "Create Webhook" button (webhooks page)
• "Create" button (create form)
• "Test" button (webhook card)
• "Edit" button (webhook card)
• "Delete" button (webhook card)
• "Show Secret" / "Hide Secret" toggle

Exit Point

/dashboard/webhooks (webhooks configured)

Journey 9: Customer Checking Usage/Quota

Persona: Any customer type Task: Monitor usage against plan limits Entry Point: /dashboard/usage

Path

graph TD
    A[Dashboard /dashboard] --> B[Click 'Usage' widget]
    B --> C[Usage Page /dashboard/usage]
    C --> D[View quota meters]
    D --> E[Storage usage]
    E --> F[Package count]
    F --> G[API requests]
    G --> H{Approaching limit?}
    H -->|Yes| I[View upgrade options]
    H -->|No| J[Continue using]
    I --> K[Click 'Upgrade Plan']
    K --> L[Billing Page /dashboard/billing]

Detailed Steps

1. Start: User on /dashboard
2. Action: Click "Usage" widget
3. Usage Page: /dashboard/usage loads
4. View Metrics: See usage statistics:
   • Storage: Used / Total (e.g., 15 GB / 100 GB)
   • Packages: Count / Limit (e.g., 45 / 200)
   • API Requests: Requests per minute, daily total
   • Sessions: Active sessions, total sessions
5. Quota Meters: Visual progress bars show usage percentage
6. Warnings: If approaching limits, warnings displayed
7. Upgrade: If needed, click "Upgrade Plan" to go to billing

Buttons/Actions

• "Usage" widget (/dashboard)
• "Upgrade Plan" button (if approaching limits)
• "Refresh" button (to update metrics)

Exit Point

/dashboard/usage (usage monitored) or /dashboard/billing (if upgrading)

Journey 10: Customer Managing Billing

Persona: Any customer type Task: Manage subscription and billing Entry Point: /dashboard/billing

Path

graph TD
    A[Dashboard /dashboard] --> B[Click 'Billing' widget]
    B --> C[Billing Page /dashboard/billing]
    C --> D[View current plan]
    D --> E[View usage]
    E --> F{Want to change?}
    F -->|Upgrade| G[Click 'Upgrade Plan']
    F -->|Downgrade| H[Click 'Change Plan']
    F -->|Cancel| I[Click 'Cancel Subscription']
    G --> J[Select new plan]
    H --> J
    J --> K[Stripe Checkout]
    K --> L[Plan updated]
    I --> M[Confirm cancellation]
    M --> N[Subscription cancelled]

Detailed Steps

1. Start: User on /dashboard
2. Action: Click "Billing" widget
3. Billing Page: /dashboard/billing loads
4. Current Plan: View active subscription:
   • Plan name (Starter, Professional, Enterprise)
   • Monthly cost
   • Renewal date
   • Included features
5. Usage Summary: See current usage vs. plan limits
6. Manage Subscription:
   • Upgrade: Click "Upgrade Plan" → Select higher tier → Stripe checkout
   • Downgrade: Click "Change Plan" → Select lower tier → Confirm
   • Cancel: Click "Cancel Subscription" → Confirm cancellation
7. Payment Method: View and update payment method (Stripe)
8. Invoices: View billing history and download invoices

Buttons/Actions

• "Billing" widget (/dashboard)
• "Upgrade Plan" button (billing page)
• "Change Plan" button (billing page)
• "Cancel Subscription" button (billing page)
• "Update Payment Method" button (billing page)
• "Download Invoice" links (invoice history)

Exit Point

/dashboard/billing (billing managed)

Journey 11: Mixed User Navigating Features

Persona: Mixed user (using multiple features) Task: Switch between different feature areas Entry Point: /dashboard

Path

graph TD
    A[Dashboard /dashboard] --> B[User type: Mixed]
    B --> C[See multiple widgets]
    C --> D{Which feature?}
    D -->|SCORM| E[Click 'SCORM Packages']
    D -->|xAPI| F[Click 'xAPI Statements']
    D -->|Dispatch| G[Click 'Dispatch Packages']
    E --> H[Packages Page]
    F --> I[xAPI Page]
    G --> J[Dispatch Page]
    H --> K[Switch to another feature]
    I --> K
    J --> K
    K --> A

Detailed Steps

1. Start: User on /dashboard
2. User Type Badge: Shows "Mixed User"
3. Multiple Widgets: See widgets for all used features:
   • SCORM Packages
   • xAPI Statements
   • Dispatch Packages
4. Navigation: Click any widget to navigate to that feature
5. Feature Switching: Use navigation menu or dashboard to switch between features
6. Unified Experience: All features accessible from single dashboard

Buttons/Actions

• All feature widgets (/dashboard)
• Navigation menu (Dashboard dropdown)

Exit Point

Various feature pages (packages, xAPI, dispatch, reports, etc.)

Common Customer Navigation Patterns

Pattern 1: SCORM-First Workflow

1. Dashboard → Packages → Upload via API → Launch → View Reports
2. Time: 10-15 minutes per package
3. Path: /dashboard → /dashboard/packages → API upload → Launch → /dashboard/reports

Pattern 2: xAPI Analytics Workflow

1. Dashboard → xAPI → Send statements → View analytics → Reports
2. Time: 5-10 minutes
3. Path: /dashboard → /dashboard/xapi → API calls → /dashboard/reports

Pattern 3: Dispatch Distribution Workflow

1. Dashboard → Dispatch → Create dispatch → Share link → Monitor registrations
2. Time: 5 minutes per dispatch
3. Path: /dashboard → /dashboard/dispatch → Create → Share

Pattern 4: Configuration Workflow

1. Dashboard → API Keys → Webhooks → Credentials (all in one)
2. Time: 10-15 minutes
3. Path: /dashboard → /dashboard/api-keys → /dashboard/webhooks → /dashboard/credentials

Navigation Elements Available

Customer Navigation (Authenticated)

• Logo: Links to /dashboard
• Dashboard Dropdown:
  • Dashboard → /dashboard
  • My Learning → /learner/dashboard
  • Reports → /dashboard/reports
  • SCORM Dispatch → /dashboard/dispatch
  • API Keys → /dashboard/api-keys
  • Usage → /dashboard/usage
  • Webhooks → /dashboard/webhooks
  • Billing → /dashboard/billing
• Admin Dropdown (if admin): Admin-only links
• Docs Dropdown: Documentation links
• User Button: Profile, settings, sign out

Technical Notes

• All customer pages require authentication via requireCustomerAuth()
• User type detection happens automatically based on usage
• Dashboard widgets are dynamically shown based on user type
• API keys are required for programmatic access (not for UI)
• Webhooks require HTTPS URLs
• Billing handled by Stripe integration