4
Archetypes
4
Built · all TSX shipped ✅
20
Categories mapped
42
Providers covered
📋 Kickoff prompt for next session
Open Services on iPad. Tap each of these 4 providers and run the workflow end-to-end: 1. A HANDYMAN or PAINTER → quote workflow (scope → context → photos → submit → confirm) 2. A BABYSITTER or HOUSE-CLEANER → booking workflow (date → time → frequency → confirm) 3. The INTERIOR DESIGNER → discovery workflow (vision + budget → schedule call → confirm) 4. A YOGA INSTRUCTOR or PERSONAL TRAINER → class workflow (pick session → commitment → confirm) For each: is the language right? Does the founder-voice copy land? Is "Only on Nabe" sufficiently differentiated (verified-neighbor cue in quote, neighbor-friendly cancellation in class)? Approve, redesign, or tweak per archetype. Then we map any new categories to the 4 archetypes via the CATEGORY_ARCHETYPE map in src/types/services.ts and proceed to Phase 39 (Singles + Vault community-voice editorial).
🎯 The 4 archetypes
Q
Quote-based
Inquiry → custom quote → schedule
Pattern: Thumbtack / Angi / Houzz Pro. Customer describes the job, provider responds with a custom quote because the work isn't scoped from a price sheet.
Categories (7): handyman, painter, electrician, plumber, carpenter, mover, locksmith
CTA on profile: "Get a quote" · Steps: Scope + urgency → property type + "Only on Nabe" verified-neighbor cue → optional photos → submit → confirmation
File:
src/components/services/workflows/QuoteWorkflow.tsxB
Booking-based
Pick a slot, recurring or one-off
Pattern: Calendly / Cal.com / Mindbody. Customer picks an available slot directly — no quote needed because the work is scoped + priced (per-visit, per-hour, per-session).
Categories (6): house-cleaner, window-cleaner, babysitter, dog-walker, pet-sitter, massage-therapist
CTA on profile: "Book a time" · Steps: Date (14-day picker) → time of day → frequency (one-time / weekly / biweekly / monthly) + notes → confirmation
File:
src/components/services/workflows/BookingWorkflow.tsxD
Discovery-based
Brief → consult call → engage
Pattern: Houzz / Behance / Honeybook. High-trust services where the pro vets fit + writes a tailored proposal. No quote until both sides talk.
Categories (2): interior-designer, photographer
CTA on profile: "Start a project" · Steps: Vision brief + budget range + timeline → schedule discovery call (date + format: video/phone/in-person) → confirmation
File:
src/components/services/workflows/DiscoveryWorkflow.tsxC
Class/Session-based
Recurring scheduled sessions
Pattern: ClassPass / Mindbody. Provider runs a fixed recurring schedule. Customer picks a session + commitment frequency (drop-in / weekly / 4-pack / unlimited).
Categories (5): tutor, music-teacher, personal-trainer, pilates-instructor, yoga-instructor
CTA on profile: "Join a session" · Steps: Pick recurring session (category-specific options) → commitment (drop-in / weekly / 4-pack / unlimited) → confirmation
File:
src/components/services/workflows/ClassWorkflow.tsx🗺️ Category → archetype map (founder review)
Source of truth: CATEGORY_ARCHETYPE in src/types/services.ts. Tap any row in the live app to test the flow.
| Category | Archetype | CTA label | Reasoning |
|---|---|---|---|
| Handyman | Quote | "Get a quote" | Job scope varies; per-hour or per-job pricing depends on what they find |
| Painter | Quote | "Get a quote" | Room count, prep work, paint grade all change quote — site visit common |
| Electrician | Quote | "Get a quote" | Permit + complexity + materials variable; quote-first norm |
| Plumber | Quote | "Get a quote" | Emergency calls + scoped repairs both need photos to estimate |
| Carpenter | Quote | "Get a quote" | Built-ins, shelving — custom by definition |
| Mover | Quote | "Get a quote" | Volume + distance + stairs vary; quote first |
| Locksmith | Quote | "Get a quote" | Lockout vs rekey vs deadbolt install — different pricing |
| House Cleaner | Booking | "Book a time" | Square footage → flat rate; pick date directly |
| Window Cleaner | Booking | "Book a time" | Per-window or per-visit pricing standard |
| Babysitter | Booking | "Book a time" | Per-hour, ad-hoc slots — typical for neighborhood babysitting |
| Dog Walker | Booking | "Book a time" | Per-walk rates; recurring weekly common |
| Pet Sitter | Booking | "Book a time" | Per-visit / per-night flat rates |
| Massage Therapist | Booking | "Book a time" | 60/90 min sessions; price per-session |
| Interior Designer | Discovery | "Start a project" | High-trust; fit matters; pros vet client before quoting |
| Photographer | Discovery | "Start a project" | Editorial / portrait / wedding work — style fit matters; portfolio-led |
| Tutor | Class | "Join a session" | Recurring weekly; commitment-based |
| Music Teacher | Class | "Join a session" | Weekly lessons; same teacher relationship long-term |
| Personal Trainer | Class | "Join a session" | 1-on-1 or partner sessions; recurring is the norm |
| Pilates Instructor | Class | "Join a session" | Mat + reformer classes on a published schedule |
| Yoga Instructor | Class | "Join a session" | Vinyasa / power / slow flow on recurring schedule |
✅ Decisions locked
- D-01 — 4 archetypes, not 50 bespoke flows. Every category maps to one of: quote / booking / discovery / class. New categories added later (Phase 39+) just pick one of the four. We never have to build a 5th archetype unless we discover a workflow shape that doesn't fit any of these.
- D-02 — CATEGORY_ARCHETYPE is the single source of truth. Map lives in
src/types/services.ts. Mock data doesn't need a per-providerarchetypefield — primaryCategory implies it. If a category gets reassigned, one edit propagates everywhere. - D-03 — Sticky CTA bar swaps button label + icon by archetype, keeps Message as secondary. Quote = FileText + "Get a quote". Booking = Calendar + "Book a time". Discovery = Palette + "Start a project". Class = Repeat + "Join a session". Message button stays as the "I just want to chat" escape hatch on every provider.
- D-04 — "Only on Nabe" verified-neighbor cue embedded inside Quote + Discovery flows. Quote: violet-tinted callout on context step says "verified neighbors get prioritized over anonymous platform leads". Discovery: "How discovery works" callout sets expectation for the free 30-min call + tailored proposal. Differentiation visible at the moment of conversion.
- D-05 — Booking + Class workflows are friendly-cancel by default. Booking says nothing about cancellation (no penalty implied). Class explicit: "Cancel or change anytime up to 24h before each session — neighbor-vouched schedules are friendly, not punitive." Anti-ClassPass / anti-late-fee positioning.
- D-06 — Class workflow generates category-specific session options. Yoga shows Vinyasa / Power Flow / Slow Saturday. Pilates shows Mat / Reformer 101 / Long Slow Strength. Personal trainer shows 1-on-1 + partner. Hardcoded per
primaryCategoryinClassWorkflow.tsx— keeps mock data simple, demo-realistic per category. - D-07 — All workflow drawers nest INSIDE ServiceProviderDetail. One sticky CTA tap → workflow drawer opens above the provider detail. Closing returns to provider detail. Two-layer nesting matches Phase 36 WC Hub V2 pattern.
- D-08 — Workflows stay mock for the pitch. No real calendars, no real payment, no real submission. State resets when drawer closes. Demo-quality affordances only — the founder narrates "this is where the booking happens" not "the booking actually happens." Production wiring is a post-pitch concern.
⬜ Open questions for founder AM review
- Q1 — Voice/tone of workflow copy. Each workflow has 3-5 prose strings (e.g. "Anything Marco should know? Apartment #, allergies, gate code..."). Is the founder voice landing? Or is it too transactional in places? Tap any quote or booking flow and read the copy aloud.
- Q2 — Category-to-archetype assignments. Any of the 20 mappings wrong? E.g. should massage-therapist be Class instead of Booking (some therapists run recurring sessions)? Should photographer be Quote instead of Discovery (some events are quote-able)? Reassign in
CATEGORY_ARCHETYPEif so. - Q3 — "Only on Nabe" presence. Quote + Discovery have explicit cues. Booking + Class don't. Should they? Or is the verified-neighbor cue enough to land once per flow type?
- Q4 — Discovery flow scheduling options. Currently 6 date options for the consult call. Too many / too few? In-person option says "Coffee in the neighborhood" — should it specify a venue or stay generic?
- Q5 — Class workflow commitment pricing. "Save 10% / 25%" copy mentioned for 4-pack and unlimited — but pricing isn't shown numerically. Add concrete pricing or keep abstract for demo?
- Q6 — Quote flow photo upload. Currently mock-only (tapping the upload zone increments a counter). Should it look more real (file picker UI)? Or is the current "tap to add" enough?
- Q7 — Where to surface "first session free" on Class workflow. Currently buried in confirmation step. Should it surface on session-picker step to drive conversion?
- Q8 — Should agents (real-estate brokers) become a 5th archetype? Phase 21+23 already built a discovery-style hiring flow (NeedsForm → ServiceTiers → ContractPreview → SignatureCanvas). Whether to fold that into the 4-archetype framework or keep it standalone is a post-pitch design call.
🏗️ Architecture
src/types/services.ts
├── WorkflowArchetype = 'quote' | 'booking' | 'discovery' | 'class'
├── CATEGORY_ARCHETYPE: Record<ServiceCategoryId, WorkflowArchetype>
└── (unchanged) ServiceCategoryId, ServiceProvider, etc.
src/components/services/
├── ServicesContainer.tsx — grid of categories (unchanged)
├── ServiceCategoryListing.tsx — provider list per category (unchanged)
├── ServiceProviderDetail.tsx — UPDATED: picks archetype, renders archetype-specific CTA + workflow drawer
└── workflows/ — NEW directory
├── BookingWorkflow.tsx — 4-step booking flow (date → time → frequency → confirm)
├── QuoteWorkflow.tsx — 3-step quote flow (scope → context → photos → submit → confirm)
├── DiscoveryWorkflow.tsx — 3-step discovery flow (brief → consult schedule → confirm)
└── ClassWorkflow.tsx — 3-step class flow (session pick → commitment → confirm)
All 4 workflows share the same patterns: gradient hero header with provider avatar + step badge, step-aware sticky action bar with Back / Continue / final-state Done, summary rows on confirmation step, lucide icons throughout (no emoji glyphs per DESIGN_STANDARDS), warm gradient cards for "Only on Nabe" cues.
📜 Phase 38 commits
feat(38) archetype-aware workflow drawers for all 20 service categories (1617+ insertions, 4 new TSX files, 1 type + 1 component edit)