The business app.
The native phone app for the people who run the business — the owner, the office manager, and the techs in the field. It is the one-handed companion to the web Dashboard: the AI captures leads and books jobs 24/7; this app is where the team keeps up with it on the move. (The separate customer app is for clients — this is not that.) Every screen reuses our foundations — metric cards, tables/lists, calendar, pills, buttons & actions, the bottom tab bar, toasts & modals — adapted to native mobile patterns and rendered in ~390px phone frames so they can be verified like a real device.
1 · Auth — Splash, Login & Biometric quick-login
First launch shows the branded splash + sign-in. On a returning device the app offers Face ID / fingerprint so staff get back to their day in one tap.
Your business,
handled.
Sign in to see what the AI booked while you were out.
Reuses the auth form fields, password show/hide toggle, and primary button. PRD: single point of contact — the owner and team log into the same managed system.
Welcome back,
Jordan.
Use Face ID to jump straight in.
Quick-login hint (Face ID / fingerprint). Falls back to password. Touch targets ≥44px; the whole biometric row is one big tap target.
2 · Home — Mobile dashboard (today-focused)
The phone-first version of the web Dashboard. Opens to today: a KPI snapshot, the things that need you (new leads, gaps to fill), and today’s appointments. Owner/Admin see revenue & recovery KPIs; staff (Member) get a focused “my day” view.
Good morning, Jordan
The AI handled 6 inquiries overnight.
KPI snapshot → PRD outcome metrics (Revenue / Leads / Missed-recovered / Bookings). “Needs you” surfaces new leads (AI responder) + gap detection (nightly prep). Reuses Metric Cards, bottom Tab Bar, status colors.
Hi, Sam
You have 4 jobs today.
Member view: only their assignments & no revenue/recovery KPIs, no team or billing.
Staff (Member) get a reduced tab bar (no Leads/Customers), an availability quick-toggle, “my jobs” only, and no money metrics — respecting the Owner/Admin/Member model from Settings · Team.
Good morning, Jordan
The FAB opens a bottom-sheet of quick actions (new appointment, block time, add customer, share link). Reuses sheet pattern + icon menu rows. Block-time satisfies the “quick add / block-time” calendar requirement.
3 · Calendar / Schedule — Day, Agenda & Week
On a phone the working view is the day agenda (per our Scheduling Calendar mobile rule). A day-strip jumps between days; Week is a horizontally-scrolling time grid. Tap a block to open the appointment; the FAB adds a job or blocks time.
Reuses the segmented Day/Week toggle (icon-only on phone), status colors (booked/pending/no-show), and an inline open-slot row tied to gap-detection. Open slots are tappable to fill.
Directly reuses the Scheduling Calendar Week time-grid, appointment blocks, and current-time line — scrolls horizontally with min-width columns at phone size (the documented mobile behavior).
4 · Appointment detail — full booking + quick actions
Everything about one job: customer, service, time, status, assignee, notes — plus one-tap field actions (call, text, directions) and management actions (reschedule, mark complete, no-show, cancel). Reuses badges, the assignee picker, and the icon-menu for destructive actions.
Quick-action row = field needs (call / text / directions / Add photos — capture is available any time, not only at completion). Status + AI-booked tag + appointment ID per PRD step 6. Assignee picker reuses Team. Mark complete fires the “Add photos of this job?” prompt (4.3); cancel opens a destructive confirm (4.2). Job-photo capture flow continues at Job Photos.
Maria will be texted that her 9:00 AM HVAC tune-up was cancelled. The slot reopens for booking.
Destructive confirm as a bottom sheet (mobile-native equivalent of our destructive modal). Reuses the danger modal icon, checkbox, and .btn--danger. Recovery path: “Keep it”.
Great work shows. Snap a quick before/after — it goes to your Work Gallery to publish later. Takes 20 seconds.
The capture trigger: marking a job complete fires this bottom sheet (reuses the sheet + success modal icon, like our toasts/modals-as-sheets pattern). “Add photos” opens the capture screen (5 in Job Photos); “Not this time” dismisses. Both Owner and Member see this.
4b · Job photos — before/after capture (feeds the Work Gallery)
The capture source for the Work Gallery → public Showcase → reviews/brand system. Any servicer (Owner OR Member/field staff) shoots before/after photos on their phone; the set auto-tags to the appointment’s service + customer and lands in the gallery draft tray — nothing goes public until the owner approves & publishes. Reuses the real .ba-slider, draft-thumb tiles, sheet, and screen-foot.
Camera viewfinder mock: take photo (72px shutter) or choose from library, with the active slot (Before) pilled at top and a Before/After vs Single mode toggle (single = verticals like a haircut). Empty state — nothing shot yet. All controls ≥44px, shutter is thumb-friendly.
One photo taken: the Before slot now shows the thumbnail with a check + a retake affordance (rotate-ccw); the active slot advances to After. The viewfinder coaches “shoot the after from the same angle.”
Drag to preview the before/after slider customers will see
Both shots captured: previewed with the real .ba-slider component (the same one on the Showcase & Work Gallery) so the servicer sees exactly what customers will. Retake either shot. This is literally what the owner pairs in the gallery.
Single-photo path (e.g. a haircut, a finished detail) uses the slider’s .ba-slider--single variant — same component, one image, no handle. Marked “Photo,” not “After.”
The set auto-associates with the appointment’s service + customer (shown read-only, lock icon) + an optional one-line caption. Submit → the gallery draft tray (not auto-public). Staff see the “manager will review” note (owner sees a curate-now variant, 4b.6).
Added to gallery
Your before/after for HVAC tune-up was sent. Your manager will review & publish it to the Showcase.
Submitted confirmation (staff): “Added to gallery” with the pair preview + the explicit “your manager will review/publish” message. Reaffirms the role split. “Add more” loops back to capture.
Added to your gallery
Saved to the gallery draft tray, tagged HVAC tune-up. Publish it to your Showcase whenever you’re ready.
Owner variant: same draft-tray destination, but the owner gets a direct “Curate & publish” link to the web Work Gallery. Both roles capture; only Owner/Admin publish.
5 · Leads / Inbox — AI-captured inbound & convert to booking
The heart of the PRD: every inbound across SMS, web form, social DM, and phone, captured and qualified by the AI responder. Channel icons distinguish source; tap to see the AI conversation, then qualify, assign, or convert to a booking. (Hidden from Member by default.)
Channel icons (SMS / web / DM / phone) + AI-handled tags directly map the PRD’s cross-channel AI responder. Unread rows highlighted; filter chips reuse choice pills. Each row → lead detail.
Shows the AI conversation (chat bubbles), the gathered job details, and the conversion path: Convert to booking (primary), Qualify, Assign, Reply. Ties directly to PRD “AI conversation → qualify → gather details → book.”
6 · Customers — list & profile (history, LTV, contact)
The repeat-client value the PRD calls out for personal-services verticals. Search the book of business; open a profile for history, lifetime value, and one-tap call/text. (Hidden from Member by default.)
Reuses Search (with clear), Team avatars (color variants), alphabetical dividers, and status pills (“Repeat”). Add-customer in the bar.
Lifetime value, job count, no-show count (reuses cust-stats), call/text/book quick actions, and full history (reuses agenda rows + status badges). Supports the PRD repeat-client / reactivation model.
7 · Notifications — in-app alerts center
The in-app feed that mirrors our notification emails & push: new booking, assigned-to-you, cancellation, gap-to-fill, and the nightly/weekly digest. Grouped by time, unread-marked, each tapping through to the relevant screen.
Each alert type maps to our notification emails (new booking, assigned, cancellation, gap, nightly prep, weekly digest). Type-colored icon tiles, unread dots + highlight, “mark all read,” date groups, deep-link tap-through.
8 · Team — roster & assignments (Owner/Admin) vs “My assignments” (staff)
Owner/Admin manage the roster, roles, and who’s on what. Staff (Member) only ever see their assignments — no roster, no role controls. Reuses Team avatars, role pills, and the assignee picker.
Owner: billing + team + everything. Admin: bookings/calendar/leads/team, no billing. Member: their assignments only.
Reuses Team roster avatars, role pills (Owner/Admin/Member/Invited), and seat count. Invite + role management are Owner/Admin only. Tapping a member shows their day & lets you reassign.
Member role: no roster, no roles, no reassigning others — just their own jobs, with completion state. Enforces the reduced staff permission set from Settings · Team.
9 · Settings / Account — mobile list & mobile-specific toggles
A mobile settings list that links out to the deeper web settings (profile, business profile, services, availability, channels) plus the two genuinely mobile-specific controls: the availability quick-toggle and notification preferences. Member sees a reduced list (no team, no billing).
AI Revenue Engine · v1.0 (build 240)
Grouped settings list (reuses set-list rows + toggle). Deep links to the existing web settings pages; doesn’t rebuild them. Mobile-specific: availability quick-toggle up top, notification prefs (9.2). Sign out as a danger row. Member would not see Team or Subscription.
Mirrors the notification emails — owners pick which alerts also reach their phone.
Per-type push toggles (reuse the iOS-style toggle), mapped 1:1 to the alerts feed & notification emails, plus quiet hours. The key mobile-specific control the brief calls out.
10 · Empty / First-run states
What a brand-new owner sees the first time they open the app, and the empty states for the key tabs before any activity exists. Every empty state points to the next best action — usually sharing the booking link so the AI can start working.
Welcome, Jordan
Your booking system is live.
No bookings yet
Put your booking link & QR where customers see you. Every scan books a job 24/7.
Mirrors the web Dashboard first-run: empty KPI cards + a share-your-link hero (booking link + copy + decals CTA). Drives the PRD on-ramp (every scan = a captured lead).
No leads yet
When someone texts, DMs, or fills out your form, the AI answers and the lead shows up here.
Share your booking link Check your channelsEmpty Leads explains what the channel does + gives two next actions (share link, check channels). Reuses the in-screen empty pattern.
Nothing booked today
A clear day. Share your link to fill it, or add a job manually.
Share booking linkEmpty day keeps the day-strip visible (so you can jump elsewhere) and offers fill / add actions. Reuses the empty pattern with a neutral icon.
How it maps · PRD & foundations
PRD coverage: Service 1 Booking — Calendar, Appointment detail, Leads→convert, appointment ID. Service 2 Calendar Prep — gap-detection callouts, nightly-prep & weekly-digest notifications. AI Lead Capture — Leads inbox across SMS/web/DM/phone with the AI conversation thread + AI-handled tags. Owner alerts — Notifications center + push prefs. Repeat-client / LTV — Customer profile. SEO & share — booking-link share entry points. Brand / trust system — Job-photo capture (4b) is the capture source feeding the Work Gallery draft tray → public Showcase → reviews.
Job-photo capture (4b): triggered by “Mark complete” (an “Add photos?” sheet) or the Appointment’s “Add photos” action any time. Camera viewfinder with Before/After (or Single) slots + retake; previews with the shared .ba-slider; auto-tags the service + customer; submits to the gallery draft tray (.draft-tray on settings-gallery.html) — never auto-public. Both Owner and Member capture; only Owner/Admin curate & publish (staff see “your manager will review/publish”).
Foundations reused: App Shell (.app container query) · bottom Tab Bar & .appbar--mobile · Metric Cards (incl. empty) · Tables → mobile list rows · Scheduling Calendar (Week grid, blocks, now-line) + Calendar agenda · status Badges / Pills / choice chips · Buttons & Actions (+ icon buttons, action rows) · Search · Team avatars + role pills + assignee picker · Toasts & Modals (as bottom sheets) · forms / toggles.
Roles: Owner/Admin get the full 5-tab app (Home/Calendar/Leads/Customers/Settings) with revenue & recovery KPIs, Team management, billing. Member (staff) get a reduced 4-tab app (My day/Schedule/Alerts/Settings) — only their assignments, an availability quick-toggle, no money metrics, no roster, no billing.