System Maps

User Journey

How Baseline evolved from a simple prototype to a full platform. See how the user experience grew as we added authentication, tracking, and more structured test flows.

M3: First Prototype

The earliest version was much simpler. No login, no history tracking, no persistence. Just open a page, take a test with your camera, see your score, and it disappears when you close the browser.

flowchart TD
    USER["👤 User"]
    TEST["🎮 Take Test
Camera + Sensors"]
    SAVE["💾 Save Result
Browser session only"]
    SHOW["📊 See Score"]

    USER --> TEST
    TEST --> SAVE
    SAVE --> SHOW

    style USER fill:#ffffff,stroke:#0ea5e9,stroke-width:2px
    style TEST fill:#ffffff,stroke:#0ea5e9,stroke-width:2px
    style SAVE fill:#ffffff,stroke:#0ea5e9,stroke-width:2px
    style SHOW fill:#ffffff,stroke:#0ea5e9,stroke-width:2px

M3 was a prototype: no authentication, no database, no history. Results existed only for that browser session.

M6: Complete Platform

When you first visit Baseline, the app checks if you're logged in. If not, it takes you to sign up or sign in via email or GitHub. Once logged in, you can pick any of the three tests. Each test follows the same structure: instructions to learn what you'll do, practice mode to get comfortable, a readiness check before the real test, the actual test using your device's camera and microphone, and finally your results. You can always view your History to see all your past results and track progress.

flowchart TD
    START["🏠 Visit Baseline"]
    LOGIN_CHECK{"Logged
in?"}
    AUTH["🔐 Sign Up or
Sign In
Email or GitHub"]
    HOME["✅ Homepage
Pick a test or
view history"]
    PICK_TEST["🎯 Pick a Test
Reaction Time
Coordination
Fine Motor"]
    INSTRUCT["📖 Instructions"]
    PRACTICE["🎮 Practice Mode
No score"]
    READY["❓ Ready?"]
    TEST["🎬 Real Test
Camera + Mic"]
    RESULTS["📊 Your Results
Score & feedback"]
    HISTORY["📈 History
All past results"]
    BACK["Return to
Homepage"]

    START --> LOGIN_CHECK
    LOGIN_CHECK -->|No| AUTH
    LOGIN_CHECK -->|Yes| HOME
    AUTH --> HOME
    HOME --> PICK_TEST
    HOME --> HISTORY
    PICK_TEST --> INSTRUCT
    INSTRUCT --> PRACTICE
    PRACTICE --> READY
    READY -->|Go back| HOME
    READY -->|Ready| TEST
    TEST --> RESULTS
    RESULTS --> BACK
    BACK --> HOME
    HISTORY --> BACK

    style AUTH fill:#fee2e2,stroke:#dc2626,stroke-width:2px
    style TEST fill:#dbeafe,stroke:#0ea5e9,stroke-width:2px
    style RESULTS fill:#dcfce7,stroke:#16a34a,stroke-width:2px
    style START fill:#ffffff,stroke:#0ea5e9,stroke-width:2px
    style HOME fill:#ffffff,stroke:#0ea5e9,stroke-width:2px
    style PICK_TEST fill:#ffffff,stroke:#0ea5e9,stroke-width:2px
    style INSTRUCT fill:#ffffff,stroke:#0ea5e9,stroke-width:2px
    style PRACTICE fill:#ffffff,stroke:#0ea5e9,stroke-width:2px
    style READY fill:#fef3c7,stroke:#d97706,stroke-width:2px
    style HISTORY fill:#ffffff,stroke:#0ea5e9,stroke-width:2px
    style BACK fill:#ffffff,stroke:#0ea5e9,stroke-width:2px

M6 adds authentication, structured test flows, and persistent history tracking. Users who aren't logged in go through authentication first. Then they can pick any test and move through instructions, practice, readiness check, the real test, and results. They can always view their history or go back and pick another test.