Files
Krow-workspace/apps/demo plans/MILESTONE 3_DEMO_PLAN.md

321 lines
9.0 KiB
Markdown
Raw Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# KROW Workforce Platform — Feature Demo Plan for Milestone 3
**Version:** Milestone 3 (v3.0)
**Date:** February 2, 2026
**Audience:** Business Stakeholders, Customer Engineers, Sales Teams
**Duration:** 25-30 minutes
---
## 1⃣ Demo Overview
### Purpose
This demo showcases the progress of the milestone 3.
- **For Businesses (Client App):** One-time shift creation, worker management, real-time coverage tracking
- **For Workers (Staff App):** Easy access to available shifts, clock-in and profile management
- **Complete Workflow:** From shift posting and worker check-in and completion/
### Estimated Demo Duration
**25-30 minutes**
---
## 2⃣ Demo Environment Setup
### Required Test Accounts
**Client Account (Business User):**
- Email: `google_payment@gmail.com`
- Password: `Demo2026!`
- Client Name: "Google Payements"
**Staff Account (Worker):**
- Phone: `+1 (555) 123-4567`
- OTP Code: `123456` (demo mode)
- Name: "Alex Martinez"
### Prerequisites
1. ✅ Both apps installed on demo devices (or simulators)
2. ✅ Network connection stable
3. ✅ Seed data is ready to be populated
- the database should be empty.
- remove unnecessary users from the firebase authetication.
### Pre-Demo Data Seeding
Tracked in :
- https://github.com/Oloodi/krow-workforce/issues/345
- This should be easily populated and de-populated by the demonstrator to show the empty states in the apps.
- At the start the database should be empty.
---
## 3⃣ Demo Flows
### Demo 0: Show Empty Database
**Purpose:** Demonstrate the starting point before any data exists
**Action:** Show the empty database in Firebase console
---
### Demo 1: Register Business & Show Empty States (Client App)
**Purpose:** Show the client onboarding experience and empty states
**Steps:**
1. Open Client App → Tap "Create Account"
2. Enter business details (email, password, company name)
3. Complete sign up and navigate to home page
4. **Point out:** Empty dashboard, no orders, no workers, clean slate
---
### Demo 2: Register Staff & Show Empty States (Staff App)
**Purpose:** Show the worker onboarding experience and empty states
**Steps:**
1. Open Staff App → Tap "Sign Up"
2. Enter phone number and verify with OTP code
3. Complete profile setup wizard (skip detailed sections for speed)
4. Navigate to home page
5. **Point out:** Empty shifts list, no available work yet
---
> **🔄 PAUSE HERE:** Populate the database with seed data (run seeding script)
---
### Demo 3: Client Logs In with Existing Account
**Purpose:** Show the sign-in experience for returning users
**Screen:** Get Started → Sign In
**Steps:**
1. Restart Client App
2. Tap "Sign In" button
3. Enter credentials:
- Email: `google_payment@gmail.com`
- Password: `Demo2026!`
4. Tap "Sign In"
---
### Demo 4: Client Views Populated Dashboard
**Purpose:** Show how the client app displays active operations
**Steps:**
1. After signing in, observe the home screen
2. Navigate through populated sections:
- Home: Coverage stats, upcoming shifts
- Orders: Posted shifts with workers assigned
- Coverage: Real-time worker status
**What to Notice:**
- Coverage percentage for today's shifts
- Workers checked in vs. needed
- Late workers alerts
- Today's estimated labor cost
---
### Demo 5: Client Creates a New Hub
**Screen:** Hubs Tab → "Add Hub" button
**Steps:**
1. Navigate to Hubs tab in bottom navigation
2. Tap the "+" or "Add Hub" button
3. Fill in hub details:
- Hub name: "Downtown Convention Center"
- Address: Start typing and select from Google Places autocomplete
4. Tap "Create Hub"
5. See the new hub appear in the hubs list
---
> **EXPLAIN**: The main demo flow which is the order creation and acceptance flow.
> ```
>Client Posts Shift [O1]
>
>*Vendor Accepts the Shift (This Part is missing for now)* [O2]
>
>Worker Searches for a Shift [O3]
>
>Worker Applies [O4]
>
>Confirmation [O5]
>
>Worker Checks In [O6]
>
>Shift Completed [O7]
>```
---
### Demo 6: Client Creates New Order - [O1]
**Purpose:** Walk through the shift creation process
**Screen:** Orders Tab → "Post" button
**Action:** Create a new shift for upcoming event
**What to Fill:**
- Order name: "Spring Gala 2026"
- Date: [Select upcoming date]
- Location: [Select existing hub]
- Add position: Server, Count: 3, Hours: 5PM-11PM
---
### Demo 7: Client Views Order Details
**Purpose:** Show detailed shift information and worker assignments
**Screen:** Orders Tab → Tap on any order card
**Action:** Expand order to see full details
**What to Notice:**
- Event name and location
- Roles needed (e.g., "2 Servers")
- Clock in/out times
- Estimated cost
- Coverage percentage bar
---
### Demo 8: Staff Logs In with Existing Account
**Purpose:** Show the worker sign-in experience
**Screen:** Get Started → Sign In with Phone
**Steps:**
1. Restart the staff app.
2. Enter phone number: `5551234567`
3. Tap "Send Code"
4. Enter OTP: `123456`
---
### Demo 9: Staff Views Home Dashboard
**Purpose:** Show worker's personalized dashboard
**What to Notice:**
- Today's Shifts section (confirmed shifts for today)
- Tomorrow's Shifts section
---
### Demo 10: Staff Browses Available Shifts - [O3]
**Purpose:** Show how workers discover and view available work
**Screen:** Shifts → "Find Work"
**Action:** Browse the list of available shifts
**What to Notice:**
- List of shifts matching worker skills
- Hourly rate prominently displayed
- Role requirements (e.g., "Bartender - Spring Gala")
- Date, time, and duration
---
### Demo 11: Staff Applies for Shift - [O4]
**Purpose:** Show the application process from worker side
**Screen:** Shift Details → "Apply Now" button
**Steps:**
1. Tap on an available shift to view details
2. Review business name, location, pay, requirements
3. Tap "Book Shift"
4. See instant confirmation
---
### Demo 12: Staff Views Confirmed Shifts - [O5]
**Purpose:** Show worker's shift management interface
**Screen:** Shifts Tab → "My Shifts"
**Action:** Review calendar view of confirmed shifts
**What to Notice:**
- Week-by-week calendar navigation
- Color-coded status (Confirmed, Pending, Completed)
- Quick access to shift details and directions
---
### Demo 13: Client Monitors Coverage Dashboard - [O5]
**Purpose:** Show real-time worker tracking capabilities
**Screen:** Client App → Coverage Tab
**Action:** Navigate to Coverage, select today's date
**What to Notice:**
- Live worker status (Checked In, En Route, Late, Not Arrived)
- Color-coded status badges (green, yellow, red)
- Worker contact information
- Real-time updates as workers check in
---
### Demo 14: Staff Checks In to Shift (Day of Event) - [O6]
**Purpose:** Demonstrate the check-in process
**Screen:** Home or My Shifts → Shift Card → "Check In" button
**Action:** Simulate checking in to an active shift
**What to Notice:**
- Timestamp automatically recorded
- Status changes to "Checked In" with green indicator
---
### Demo 15: Client Sees Check-In Update - [O6]
**Purpose:** Show cross-app interaction and real-time updates
**Screen:** Client App → Coverage Tab
**Action:** Press the update button on the top right to refresh worker statuses
**What to Notice:**
- Status update
- Green "Checked In" badge appears
- Check-in time displayed
---
### Demo 16: Staff Checks Out of Shift - [O7]
**Purpose:** Demonstrate the check-out process and shift completion
**Screen:** Home or My Shifts → Shift Card → "Check Out" button
**What to Notice:**
- Check-out timestamp automatically recorded
- Status changes to "Completed"
- Total hours worked calculated automatically
- Shift moves from active to history
---
### Demo 17: Client Views Completed Shift in Coverage - [O7]
**Purpose:** Show how completed shifts appear in the client app
**Screen:** Client App → Coverage Tab
**Action:** Press the refresh button to update worker statuses
**What to Notice:**
- Worker status changes to "Completed"
- Check-out time displayed alongside check-in time
- Total hours worked visible
- Shift marked as complete in orders list
- Cost finalized based on actual hours
---
### Demo 18: Staff Profile Management
**Purpose:** Demonstrate worker profile features and compliance management
**Screen:** Staff App → Profile Tab
**Steps:**
1. Navigate to Profile tab in bottom navigation
2. Review profile sections:
- **Profile Info:** Name, photo, contact details, date of birth
- **Statistics:** Total shifts worked, average rating, reliability score
- **Bank Account:** Linked payment account for direct deposit
- **Certificates:** Food Handler, ServSafe, Background Check status
- **Documents:** ID verification, work authorization
- **Tax Forms:** W-9, I-9 compliance documents
- **Time Card:** Historical shift records with hours and earnings
---
## Things we need to handover to the customer
- Android apps of the client and staff.
- Demo accounts credentials:
- Client Account:
- Email: `legendary@krowd.com`
- Password: `Demo2026!`
- Staff Account:
- Phone: `+15557654321`
- OTP Code: `123456` (demo mode)