Skip to main content

Phase 1: Foundation Platform

Timeline: Weeks 1-6 Status: Initial Development

Core Goal​

Build basic client submission system and admin management interface with manual processing workflow.

Client Features​

Public Landing Page​

  • Voice gallery with audio previews
  • No login required for browsing
  • Pricing and service information
  • Clear call-to-action

Authentication System​

  • Email/password registration
  • Email verification flow
  • Login/logout functionality
  • Invitation-only access control

Request Submission​

  • Text input (max 1000 characters)
  • Voice selection from gallery
  • Website/social media fields
  • Description for context
  • Auto-generated slug (based on request ID)

Client Dashboard: "My Requests"​

  • View all submitted requests
  • Status tracking (pending → processing → completed)
  • Request details display
  • In-app audio playback for completed requests
  • Shareable playback link (/play/{slug})
  • Email notifications on status changes

Public Playback Page (/play/{slug})​

  • Audio playback via shareable link
  • No login required
  • Mobile-responsive audio player
  • Basic controls (play/pause, volume, seek)
  • Accessible to anyone with the link

Admin Features​

Admin Authentication​

  • Separate admin login system
  • Role-based access control
  • Independent from client auth

Admin Dashboard​

  • Overview statistics
  • Recent activity feed
  • Pending requests queue

Request Management​

  • List all requests with filters
  • View detailed information
  • Manual status updates via buttons (pending → processing → completed)
  • Audio file upload
  • Automatic playback link generation (/play/{slug})

Core Workflows​

Client Request Flow​

Admin Processing Flow​

Acceptance Criteria​

F1.1 - Public Landing Page​

User Story: As a visitor, I want to explore MicDots without creating an account.

Acceptance Criteria:

  • AC1.1.1: Given I visit landing page, when page loads, then I see value proposition within 3 seconds
  • AC1.1.2: Given I scroll down, when I reach voice gallery, then I see minimum 5 voice samples
  • AC1.1.3: Given I click play on sample, when audio loads, then playback starts within 2 seconds without login
  • AC1.1.4: Given audio is playing, when I click pause, then audio stops immediately
  • AC1.1.5: Given I'm on mobile, when I view page, then no horizontal scrolling required
  • AC1.1.6: Given I use screen reader, when I navigate, then all content has proper headings and alt text
  • AC1.1.7: Given I click registration, when form loads, then I see invitation code requirement
  • AC1.1.8: Given I lack invitation code, when I view registration, then I see request access instructions

F1.2 - Client Registration & Authentication​

User Story: As a potential client, I want to create account with invitation code.

Acceptance Criteria:

  • AC1.2.1: Given valid invitation code, when I enter it, then form expands to show email/password fields
  • AC1.2.2: Given invalid invitation code, when I submit, then I see specific error message
  • AC1.2.3: Given valid credentials, when I submit, then account created and verification email sent within 5 minutes
  • AC1.2.4: Given weak password, when I submit, then I see specific password requirements
  • AC1.2.5: Given duplicate email, when I submit, then I see "email already exists" error
  • AC1.2.6: Given I click verification link, when link loads, then account activated and redirected to login
  • AC1.2.7: Given activated account, when I enter correct credentials, then logged in and redirected to dashboard
  • AC1.2.8: Given wrong credentials, when I login, then I see "invalid credentials" message
  • AC1.2.9: Given I'm logged in, when I close browser and return, then session persists for 30 days
  • AC1.2.10: Given password reset request, when I submit email, then reset link sent within 2 minutes

F1.3 - Request Submission​

User Story: As logged-in client, I want to submit voice request with necessary details.

Acceptance Criteria:

  • AC1.3.1: Given I'm logged in, when I access submission form, then I see all required fields: text, voice selection
  • AC1.3.2: Given text over 1000 chars, when I type, then counter turns red and submit disabled
  • AC1.3.3: Given text under 1000 chars, when I type, then counter shows remaining and submit enabled
  • AC1.3.4: Given no voice selected, when I submit, then I see validation error on voice field
  • AC1.3.5: Given valid website URL, when I submit, then URL validated and stored
  • AC1.3.6: Given invalid website URL, when I submit, then I see URL format error
  • AC1.3.7: Given all required fields valid, when I submit, then success message shown and email sent within 5 minutes
  • AC1.3.8: Given request submitted, when I check dashboard, then request shows "pending" status with auto-generated slug
  • AC1.3.9: Given slug generation, when request created, then slug based on request ID (e.g., /r/abc123)
  • AC1.3.10: Given form in progress, when I navigate away, then browser warns about unsaved changes
  • AC1.3.11: Given I click save draft, when I save, then form data preserved for later

F1.4 - Client Dashboard​

User Story: As client, I want to view all requests and track progress.

Acceptance Criteria:

  • AC1.4.1: Given I'm logged in, when I access dashboard, then requests shown in reverse chronological order
  • AC1.4.2: Given no requests, when I view dashboard, then empty state with "Create first request" CTA
  • AC1.4.3: Given I have requests, when I view list, then each shows: text preview (100 chars), voice, status, date, actions
  • AC1.4.4: Given I click request, when details open, then I see: full text, voice, fields, status history, timeline
  • AC1.4.5: Given pending request, when admin updates to "processing", then email sent within 10 minutes
  • AC1.4.6: Given processing request, when admin completes, then status "completed" and email with link sent
  • AC1.4.7: Given completed request, when I view details, then in-app audio player, shareable link, and slug visible
  • AC1.4.8: Given completed request, when I click play, then audio plays within 2 seconds in dashboard
  • AC1.4.9: Given audio playing, when I click pause, then audio stops immediately
  • AC1.4.10: Given I filter by status, when I select status, then only matching requests shown
  • AC1.4.11: Given I search, when I enter text, then results filter by matching content
  • AC1.4.12: Given mobile view, when I scroll, then key information visible and accessible

F1.5 - Public Playback Page (/play/{slug})​

User Story: As anyone with a playback link, I want to listen to audio without logging in.

Acceptance Criteria:

  • AC1.5.1: Given I have playback link, when I visit /play/{slug}, then audio player loads within 3 seconds without login
  • AC1.5.2: Given playback page loads, when I click play, then audio starts within 2 seconds
  • AC1.5.3: Given audio is playing, when I click pause, then audio stops immediately
  • AC1.5.4: Given I want to seek, when I drag progress bar, then audio jumps to specific time
  • AC1.5.5: Given I adjust volume, when I change slider, then volume updates and preference saved
  • AC1.5.6: Given invalid slug, when I access /play/invalid, then friendly 404 page with link to homepage
  • AC1.5.7: Given mobile device, when I access playback page, then controls are touch-friendly
  • AC1.5.8: Given screen reader, when I navigate page, then all controls properly labeled
  • AC1.5.9: Given slow connection, when page loads, then audio buffers and partial playback available
  • AC1.5.10: Given audio completes, when playback ends, then replay button appears

F1.6 - Admin Authentication​

User Story: As admin, I want secure access to admin panel.

Acceptance Criteria:

  • AC1.6.1: Given I navigate to /admin, when page loads, then I see separate admin login form
  • AC1.6.2: Given admin credentials, when I submit, then authenticated and redirected to dashboard
  • AC1.6.3: Given wrong credentials, when I submit, then security-focused error without revealing if email exists
  • AC1.6.4: Given no authentication, when I access admin URL, then redirected to admin login
  • AC1.6.5: Given logged as client, when I access admin URLs, then "access denied" message
  • AC1.6.6: Given inactive for 2 hours, when I perform action, then must re-authenticate
  • AC1.6.7: Given I logout, when I try admin actions, then session cleared and access denied

F1.7 - Admin Dashboard​

User Story: As admin, I want overview of system activity to prioritize work.

Acceptance Criteria:

  • AC1.7.1: Given I'm admin, when dashboard loads, then I see: pending count, processing count, completed today, active clients
  • AC1.7.2: Given pending requests exist, when I view dashboard, then "Pending Queue" shows requests by submission date
  • AC1.7.3: Given I view queue, when I see request, then I see: client name, text preview (50 chars), voice, timestamp, priority
  • AC1.7.4: Given I scroll dashboard, when I view activity, then chronological feed of recent changes shown
  • AC1.7.5: Given I need stats, when I view metrics, then completion rate for last 30 days displayed
  • AC1.7.6: Given dashboard loads, when I wait, then all data appears within 3 seconds
  • AC1.7.7: Given mobile admin view, when I view dashboard, then key metrics and urgent items prioritized

F1.8 - Admin Request Management​

User Story: As admin, I want to view, process, and manage all client requests.

Acceptance Criteria:

  • AC1.8.1: Given I click "All Requests", when page loads, then paginated list with filtering shown
  • AC1.8.2: Given I filter by status, when I select status, then only matching requests displayed
  • AC1.8.3: Given I search, when I enter query, then results match client name, text, or ID
  • AC1.8.4: Given I click request, when details open, then I see: all data, status, history, contact info
  • AC1.8.5: Given I view pending request, when I click "Set to Processing" button, then status changes to "processing" and client email sent within 10 minutes
  • AC1.8.6: Given processing status set, when timestamp recorded, then request ready for external audio processing
  • AC1.8.7: Given "processing" status, when I view request, then upload area accepts .mp3/.wav up to 50MB
  • AC1.8.8: Given I upload audio, when complete, then file stored and playback link /play/{slug} generated automatically
  • AC1.8.9: Given upload successful, when I save, then status "completed", client notified with playback link
  • AC1.8.10: Given I view request, when I add notes, then internal admin notes saved (client can't see)
  • AC1.8.11: Given I view request, when I send message, then client sees message in dashboard
  • AC1.8.12: Given request error, when I mark "needs revision", then client receives email with requirements

F1.9 - Email Notifications​

User Story: As user, I want timely email notifications to stay informed.

Acceptance Criteria:

  • AC1.9.1: Given I submit request, when successful, then confirmation email within 5 minutes with details and tracking number
  • AC1.9.2: Given admin updates status, when status changes, then email within 10 minutes with new status and timeline
  • AC1.9.3: Given request completed, when admin uploads audio, then completion email within 15 minutes with /play/{slug} playback link
  • AC1.9.4: Given I'm admin, when new request submitted, then notification email within 5 minutes (if enabled)
  • AC1.9.5: Given email bounce, when detected, then admin alerted and alternative contact attempted
  • AC1.9.6: Given I update preferences, when I disable notifications, then non-essential notifications stopped
  • AC1.9.7: Given email has links, when I click, then directed to correct page with proper authentication
  • AC1.9.8: Given email sent, when I receive it, then consistent MicDots branding and clear CTAs

Technical Requirements​

Frontend​

  • Responsive web application
  • Mobile-first design
  • Form validation
  • HTML5 audio player
  • File upload interface

Backend​

  • User authentication API
  • Request management endpoints
  • File storage integration
  • Email notification service

Database Schema​

  • Users table (clients + admins)
  • Requests table
  • Voice gallery table
  • Audio files metadata

External Services​

  • Email service (SMTP/SendGrid)
  • File storage (AWS S3)
  • CDN for media delivery

Limitations (Phase 1)​

Phase 1 Constraints
  • ❌ No credit/payment system
  • ❌ No QR code generation (comes in Phase 2)
  • ❌ Manual admin processing only
  • ❌ No voice actor marketplace
  • ❌ No social sharing features (comes in Phase 2)

Success Criteria​

Functionality​

  • ✅ Client can register and login
  • ✅ Client can submit requests
  • ✅ Admin can process requests
  • ✅ Email notifications work
  • ✅ File upload successful
  • ✅ Audio playback works in dashboard
  • ✅ Slug auto-generated correctly
  • ✅ Public playback page /play/{slug} works without login

Performance​

  • Page load < 3 seconds
  • Form submission < 1 second
  • Email delivery < 5 minutes

User Experience​

  • Intuitive navigation
  • Clear status indicators
  • Helpful error messages

Deliverables​

  1. Client Portal

    • Landing page
    • Registration/login
    • Request submission form
    • Dashboard with audio player

  2. Admin Backoffice

    • Admin login
    • Request queue
    • Processing interface
    • File upload

  3. Public Playback Page

    • /play/{slug} endpoint
    • Audio player (no login required)
    • Mobile-responsive design

  4. Email Templates

    • Welcome email
    • Request confirmation
    • Status updates
    • Completion notification with playback link

  5. Documentation

    • User guide
    • Admin manual
    • API documentation

Next Phase​

➡️ Phase 2: QR Codes & Audio Playback