UX Case Study · Field Sales Mobile App
Field Survey App
Outlet Screens Redesign
Redesigned the outlet management screens for a field sales execution app — solving action discovery problems that forced reps to rely on undiscoverable swipe gestures, buried CTAs, and ambiguous tap targets. Result: 38% faster per-outlet task time and ~$1.3M in annual productivity value.
Interactive prototype made in FIGMA MAKE(AI) for Outlet List and Route flows
01 — Context
The Challenge
A leading consumer goods company deployed a field sales execution app to manage daily outlet visits — called "calls" — across a 500-person field force. Each rep visits an average of 15 outlets per day, recording survey data, capturing compliance photos, and filing call results.
The outlet screens had accumulated critical action-discovery problems over time. The primary CTA to start a survey was buried inside a detail screen. Cancel was only accessible via a swipe gesture that most reps never discovered. The route date selector was a single dropdown. The result: reps were memorising workarounds instead of using the interface intuitively — and key actions like cancel evidence were being skipped entirely.
Ambiguous tap target on outlet card — tapping the outlet name/first line navigated to the detail page. Reps expected it to start a survey. There was no visible Start button on the list itself.
Cancel only via hidden swipe gesture — swiping left on an outlet card revealed a cross (✕) button. In usability testing, 6 of 8 reps never found this unprompted. Many thought cancellation wasn't possible from the list.
Route date selector was a dropdown — tapping a dropdown to select a date on the routes screen gave no preview of what each date contained. Reps had no way to see which dates had pending or completed visits before selecting.
No status visibility on the list — outlet cards showed name and address but no call status. Reps could not tell at a glance which outlets were pending, active, completed, or cancelled without tapping into each one.
No directions access from outlet list — reps had to exit the app, open maps manually, and re-enter the address. No navigation shortcut existed anywhere in the outlet workflow.
Last visit results buried in detail screen — viewing previous call results required: tap outlet card → navigate to detail → scroll to history section. A 3-step journey for a frequently needed reference.
02 — Research
Field Observation & User Interviews
We conducted a 3-day field observation ride-along with 6 reps across two regions, followed by 8 remote interviews with a mix of new hires (<3 months) and experienced reps (2+ years). App event logs covering 30 days of usage data from 120 active reps were also analysed.
I always tap into the outlet just to hit Start. I didn't know you could do it any other way.
— Field Rep, 2+ years tenure
I had no idea I could swipe to cancel. I've been going into the outlet and looking for a button in there.
— Field Rep, 1 year tenure
The date dropdown on routes tells me nothing. I pick a date and then find out I've already done everything on it.
— Regional Sales Lead
I open Google Maps separately every time I need directions. I assumed the app just didn't have that.
— Field Rep, <3 months tenure
📊 Log data finding: 72% of "Start call" sessions began with the rep navigating into the outlet detail screen first — confirming that the detail screen was being used as a pass-through, not as an informational stop. The average session showed 2.1 unnecessary taps before reaching the survey start point.
03 — Research
Baseline Usability Testing
Unmoderated usability test with 8 active field reps on the existing design, covering 6 core tasks. We measured time-on-task, tap count, and error frequency.
| Task | Ease Rating | Avg Time | Avg Taps | Error Rate |
|---|---|---|---|---|
| Start a survey call for an outlet | Moderate | 28s | 5 | 12% |
| Cancel a call (via list) | Fail | Could not find | — | 75% |
| Cancel a call with reason + photo (full flow) | Fail | 3m 10s | 14 | 68% |
| Navigate to outlet using in-app directions | Fail | N/A — not found | — | 100% |
| Identify completed vs. pending outlets at a glance | Fail | 1m 48s | 11 | 82% |
| Check which dates on routes have pending visits | Fail | 2m 05s | 9 | 88% |
The cancel call via swipe had a 75% failure rate at the discovery stage alone — reps simply could not find the action. The route date dropdown failure was equally high (88%) because the dropdown gave zero preview of visit status per date, forcing reps to try each date trial-and-error. And in-app directions had a 100% failure rate — the feature did not exist at all.
04 — Existing Design
Before: The Existing Screens
The original outlet list presented cards with outlet name, address, and trade channel. Tapping the first line (outlet name) opened the outlet detail page — which reps mistook for a Start Survey action. The only way to cancel was a swipe-left gesture. The routes date selector was a dropdown with no status context per date.
Left: Outlet list — no visible Start button, tapping the card name opens the detail page (ambiguous). Centre: Start Call lives inside the detail screen — two unnecessary taps per visit. Right: Swipe-left reveals a cancel (✕) icon — 75% of reps never found this gesture.
Left: The old cancel call screen — no required reason field, single optional image only. Evidence was never enforced. Right: Notes modal (1000 char limit shown), opened via a separate Edit button — disconnected from the cancel flow.
Interaction Discovery Problems — Before
05 — Design Decisions
What We Changed & Why
Every change was anchored to a specific discovery failure observed in research. The core design principle: every action a rep needs should be visible without swiping, scrolling, or navigating away.
The original design used the outlet card itself as a navigation element — tapping it opened the detail page. This created a fundamental affordance mismatch: reps expected tapping an outlet to begin a survey, not reveal information. The Start Call button only appeared once inside the detail screen.
Decision: We split the two distinct user intents into explicit, separate controls. A prominent Start → button (or "Continue →" when a call is in progress) was placed directly on each outlet card — zero navigation required to begin a survey. Alongside the outlet name, a small ⓘ icon opens the outlet detail page for reps who genuinely need to review information before visiting. The card tap area was removed as a navigation trigger entirely.
This also eliminated the "accidental detail page open" pattern observed when reps reached for the Start button and missed. Log data 30 days post-launch showed a 61% reduction in "detail page opened but closed in under 4 seconds" sessions — confirming the old pattern was almost entirely accidental navigation.
The original cancel path required swiping left on an outlet card to reveal a ✕ button — a pattern borrowed from consumer messaging apps. In a B2B field tool used under time pressure and often with gloves, this gesture was unreliable, inconsistent, and entirely invisible to 75% of reps in testing. "Last Results" wasn't accessible from the list at all.
Decision: A visible ⋯ (more options) button was added to each outlet card. Tapping it reveals a contextual menu with two options: Last Result — to view the previous visit's data without entering the full detail screen — and Cancel — to initiate the cancel call flow. Both actions are now always visible to any rep, on any device, without knowing any gestures.
The swipe-to-cancel gesture was removed entirely. We also removed the swipe-to-delete action from the old design — outlet deletion is an admin function not appropriate for field reps and was misused when accidentally triggered via swipe.
In-app navigation to an outlet did not exist in the original design. Every rep we observed exited to Google Maps manually, typed the address, got directions, then switched back to the app. On a 15-outlet day this was happening 5–8 times — a friction point that reps had simply accepted as "how it works."
Decision: A directions → icon button (navigation arrow) was added to each outlet card, positioned next to the distance display. Tapping it opens the device's default maps application with the outlet address pre-filled. Distance to the outlet is also now displayed directly on the card in the top-right corner, giving reps a quick proximity signal for route planning.
This required no new infrastructure — it uses the standard Android geo: intent to hand off to any installed maps app. Engineering complexity was minimal; rep impact was immediate and unanimously positive in beta testing.
The original routes date selector was a dropdown — a single tappable element that opened a calendar modal blocking the outlet list. The modal provided no information about what each date contained. Reps managing multi-day routes had to select a date, read the outlet list, then go back and try another date. An 88% task failure rate confirmed this was not working.
Decision: The dropdown was replaced with a persistent horizontal date strip pinned at the top of the routes screen. Each day is represented as a compact chip showing the day label (Mon, Tue…) and date number. Below the number, a row of coloured dots acts as a visual status legend for that day: a green dot indicates at least one completed visit, an orange dot indicates pending visits remaining, and a red dot indicates cancelled visits. "Today" is highlighted with a filled background.
This means a rep can scan their entire week's route status in under 2 seconds without a single tap. When they tap a day chip, the outlet list below updates instantly — no modal, no overlay. The "All Outlets" toggle remains accessible in the header for reps who want to view their full roster regardless of scheduled date.
The old cancel flow had no mandatory fields. Once reps discovered cancel (itself a 75% discovery failure), they could complete it with a single tap — no reason, no note, no photo. This produced 280 non-compliant cancellations per month at $50 per incident in audit rework.
Decision: The cancel call screen now enforces three fields via UI gating: (1) a required reason dropdown (e.g. "Outlet Closed", "Access Denied", "No Decision Maker"), (2) mandatory notes with a free-text field, and (3) at least one evidence photo. The "Cancel Call" CTA button is visually disabled and non-tappable until all three fields are satisfied. The required asterisk (✳) is shown next to each field label from the moment the screen opens.
Rep pushback centred on the photo requirement for minor situations. We addressed this by educating that a closed shutter, an empty car park, or a handwritten note from the outlet manager all qualify as valid evidence — the bar is not high, just auditable. Post-launch surveys showed 81% of reps accepted the flow within 2 weeks.
Interaction Solutions — After
06 — Visual Design
Hi-Fidelity Screens
The redesigned outlet list makes every action explicit and scannable. Each card exposes call state through a colour-coded badge (Active in blue, Pending in amber, Completed in green, Cancelled in red with ⚠ icon). The primary button adapts to context: "Start →" for unvisited outlets, "Continue →" for an active in-progress call. Secondary actions (Last Result, Cancel) live in the ⋯ menu — always one tap away, never hidden behind a gesture.
Left → Right: Clean outlet list with inline Start CTA and distance · ⋯ menu revealing Last Result and Cancel options · Active outlet showing Continue button · All Outlets toggle (green = enabled for full roster)
Left: Scheduled tab — pinned date strip with status dots (green/orange/red) per day. Centre: Status group headers separate outlet states in the list. Right: Search results now include status badges and date ranges.
Routes Date Strip — Visual Logic
🟢 Green dot = at least one completed visit · 🟠 Orange dot = pending visits remaining · 🔴 Red dot = cancelled visits · Today chip highlighted · Replaces the old single-tap dropdown with zero-tap status scanning
New cancel call flow — required reason dropdown (✳), mandatory notes (✳), and enforced evidence image (✳). Cancel Call CTA is greyed out and non-tappable until all three fields are complete.
⚠️ Design detail — evidence photo count: The cancel call evidence section supports uploading up to 16 images. Early prototypes capped this at 3; field ops managers requested unlimited uploads for thorough documentation. We landed on 16 as a practical ceiling — sufficient for detailed evidence without creating upload overhead that would frustrate reps in the field.
07 — Validation
Usability Testing — Redesigned Screens
We re-ran the same 6-task protocol from baseline with 10 reps (including 4 from the original cohort) on production Android devices in a simulated field environment.
| Task | Ease Rating | Before | After | Change |
|---|---|---|---|---|
| Start a survey call for an outlet | Easy | 28s / 5 taps | 11s / 2 taps | −61% time ↓ |
| Cancel a call (discover action from list) | Easy | Not found (75% fail) | 8s / 2 taps | 100% success ↑ |
| Cancel with reason + photo (full flow) | Easy | 3m 10s / 14 taps | 1m 22s / 8 taps | −57% time ↓ |
| Navigate to outlet using in-app directions | Easy | N/A (not found) | 5s / 1 tap | 100% success ↑ |
| Identify completed vs. pending outlets at a glance | Easy | 1m 48s / 11 taps | 5s / 0 taps | −95% time ↓ |
| Check which route dates have pending visits | Easy | 2m 05s / 9 taps | 4s / 0 taps | −97% time ↓ |
The route date status check dropped from 2 minutes 5 seconds to 4 seconds with zero taps — reps can now read their full week's visit status passively from the date strip without interacting with it at all. The cancel discovery task went from a 75% failure rate to 100% success, and the directions task — previously impossible — now takes a single tap.
08 — Outcomes
Business Impact & ROI
The redesign produced measurable gains across three business dimensions: field rep productivity, compliance cost reduction, and support ticket volume. Metrics were tracked over a 90-day post-launch window across the full 500-rep field force.
Calculation 1 — Productivity Savings
Calculation 2 — Compliance Cost Savings
Calculation 3 — Support Cost Savings
reduction in taps to start a survey (5 → 2), saving ~8.5 million taps per year across the field force
cancel discovery success rate in post-launch testing — up from 25%. Action moved from hidden swipe to visible ⋯ menu
app satisfaction score for outlet screens (out of 10) — measured in quarterly rep survey 90 days post-launch
reduction in time to check route date status — from 2m 5s with the old dropdown to 4 seconds with the date strip
I can see at a glance which day I still have pending visits on. I used to have to check every date one by one.
— Field Rep, post-launch survey
I didn't even know the cancel option existed before. Now I see it every time I tap the three dots. It makes complete sense.
— Field Rep, post-launch survey