Mobile adaptation — New Work Order
The work order remains the record of truth, and the mobile version reorganizes that same information into a field-friendly structure. We use two headline tabs (Work Order / Actions) and place the supporting areas in a nav-list below the summary card so the technician sees the whole job at a glance and drills into the part they need.
Three states shown
- ① Empty. Only Order Type is required to make the record usable. The nav-list is dimmed until the type is chosen because its defaults (tasks, GL, templates) cascade from the type.
- ② Order Type lookup. A bottom-sheet picker presents the available order types in a quick mobile selection pattern. Two options (INST / MTNC) arrive pre-loaded; a search row is there for tenants with long type lists. Tap = select = sheet closes = type applied.
- ③ Populated. Hero shows map + summary + key pills + requester contact. The scope / delivery / billing nav-lists expose the supporting work-order areas in a compact mobile structure.
Design principles (additions on top of 02)
- One required field rule. Order Type unlocks the record. Everything else — including Service Location and Customer — can wait. The Save CTA is visibly disabled until that one field is set.
- Summary card first. Map + headline + three pills answers "what job is this?" in a single glance.
- Nav-list as tab menu. The list rows are navigation targets to the supporting work-order areas. Counts & one-line subtitles tell the tech whether to drill in before they do.
- Grouped nav, not a wall. Scope (Description / Tasks / Materials / Estimates) · Delivery (Tickets / Actuals / Activities) · Billing & back-office. Related things stay together; rare rows go last.
- Defaults stay grouped. "Defaults & GL" pairs two low-frequency areas into one row so the main technician path stays compact.
- Requester as a contact, not a form group. The hero's bottom row shows the requester avatar + name with call/email quick-actions. Phone & email stay one tap away without being printed as fields.
- Secondary CTA reflects workflow. "Save" alone is fine on state 3, but Save & create Work Ticket is the typical next step — so we surface it as a second docked button.
How we simplified usability on mobile
The three screenshots the user shared were useful reference points, but the goal here is not to compare apps. The goal is to remove the friction that those patterns tend to introduce on a phone:
Common actions stay surfaced. Instead of a long flat action list, the main path is always visible through two docked CTAs, while less-common actions move into a dedicated Actions tab ranked by frequency.
The summary answers "what job is this?" in one glance. The map, location, summary, and priority pills work as one hero block instead of repeating the same information in separate stacked sections.
Navigation uses one system, not two competing ones. Grouped nav rows replace the usual mix of tiles plus lists, and each row can show counts so the tech knows where action is needed before drilling in.
Actions tab (tab 2 — summary)
- Complete Order — primary tile, distinct color. Pre-flight checks: Actuals reconciled, tickets all closed.
- Prepare Invoice — builds invoice from Actuals; opens on review screen.
- Create Work Ticket — dispatches a new visit. Offered as secondary CTA on state 3 because it's the overwhelmingly common next step.
- Reschedule / Reassign / Send to customer / Cancel & reason — secondary actions, grouped and destructive last.
- Shortcut to scheduling board — opens the dispatcher view filtered to this WO's tickets.
Voice capture
The header 🎤 listens and routes. On this screen the parser prefers the visible capture block (Order Type, Summary, Location, Customer) and falls back into the nav-list drawers when the user names one explicitly (e.g. "add three hours of labour" → Actuals).
🎤"New maintenance work order for Adriaan House, HVAC not shutting down heating."
→ picks Order Type = MTNC, sets Summary = "HVAC Maintenance" (best-match), links Service Location = AL00026, opens Description with the verbatim note pre-filled.
🎤"Priority medium, severity moderate, expected next Tuesday."
→ sets the three importance pills on the hero; doesn't leave the screen.
🎤"Customer is Alfa Ava, billing to their main location."
→ fills Customer = AACUSTOMER, Location = MAIN.
🎤"Prepare the invoice."
→ switches to the Actions tab, highlights "Prepare Invoice" with a confirm prompt; never fires a workflow from voice without confirmation.
Jigx component mapping
jig.default +
component.form
Root screen and record state; the form instance becomes the Work Order after first save.
component.segmented-control
Two top-level tabs - Work Order and Actions - to keep the main navigation intentionally small.
component.location
Hero map band on the summary card; the pin resolves from Service Location and can open a fuller map view when needed.
component.section
Summary card · capture block · each nav-list group (Scope / Delivery / Billing).
component.entity-field (sheet lookup)
Order Type & Service Location & Customer — opens a bottom-sheet picker, not a sub-nav.
component.text-field
Summary (free text, voice-friendly).
component.list
Nav-list rows — each item navigates to a sub-jig for the respective desktop tab (Tasks, Materials, Tickets, etc.).
component.avatar
Requester contact row; call and email are exposed as row actions rather than separate fields.
component.custom-component
Used only where richer layout polish is justified, such as the docked CTA bar or a more expressive hero treatment, built from custom components like component.card, component.view, component.text, component.icon, and component.button.
Voice input integration
The header mic is a platform capability / integration layer, not a standalone Jigx component. It routes spoken input into the active fields and always confirms high-risk actions.
Open questions to validate
- Can a Work Order genuinely be saved with only Order Type, or does Acumatica need Customer + Location before the record is persistent?
- Which of the supporting work-order areas does a field tech actually visit most often? If Prepayments / Relations / GL Accounts have very low open rates, consider moving them into a single "More" drawer.
- Should "Save & create Work Ticket" be the default secondary CTA for all Order Types, or only for types whose default Work Task Template expects an immediate visit?
- Voice-triggered workflow actions (Complete / Invoice) — confirmation step only, or require a tap & hold on the tile? We're defaulting to confirmation.
- On the empty state, do we disable the nav-list entirely or show it enabled but read-only? Current wireframe disables for simplicity; a read-only "peek" might help onboarding.