BWS native-app order tracking: three phones showing the redesigned status timeline.
Product · 2025

Order tracking that customers actually trust.

Redesigned BWS's native-app order status experience, including the unhappy paths most apps skip over. The result tells customers what's happening, when, and what to do if it isn't.

Role Lead Product Designer
Client BWS · Endeavour Group
Year 2025
Disciplines Native app · End-to-end · Branding

Brief

Lift visibility of order-status updates and carrier delivery updates inside the BWS native app. The order-tracking squad surfaces these updates; UI/UX translates them into customer-friendly language. The redesign needed to communicate clearly when things go right, and especially when they don't.

Problem

The existing flow handled the happy path well but obscured failure states. When deliveries were delayed, customers were left without clear next steps. ETAs were under-emphasised relative to what customers actually cared about, and unhappy-path scenarios were undifferentiated from successful ones. That left support tickets as the only path to resolution.

My role

As Lead Product Designer for the order-tracking squad, I led the experience end-to-end:

  • Audit of the original flow against support-ticket categories
  • Three rounds of testing at low / mid / high fidelity
  • Status-tag taxonomy and visual exploration
  • End-to-end design: wireframes, low-fi to mid/hi-fi, interaction
  • Alignment with the new BWS brand and design system
  • Dev hand-off and QA

Testing

Three rounds at low, mid, and high fidelity. Each round was scoped to validate or invalidate one specific assumption about how customers read order status — and each one re-shaped what I shipped into the next round.

Low-fidelity test boards: paper-grade wireframes of the My purchases list and Order details screens, used to test layout hierarchy before any visual treatment.
Round 1 — low fidelity. Tested whether ETA or status should lead the list tile. ETA won; the list view restructured around it.
Mid-fidelity test boards: greyscale layouts of order detail and progress bar variants, shown to participants to test which structure carried meaning without colour cues.
Round 2 — mid fidelity. Tested unhappy-path comprehension without colour. Six failure states needed their own slot in the progress bar — not a buried error message.
High-fidelity test boards: branded screens with full colour, type, and motion, validated against the new BWS design system before dev hand-off.
Round 3 — high fidelity. Tested the status-tag system end-to-end against the new brand. Locked the colour, icon, and copy pattern that ships into app, bot, and SMS.
Outcome

Status that explains itself, even when things go wrong.

3
rounds of fidelity testing
6
unhappy-path scenarios surfaced
100%
brand-aligned to new BWS guidelines
1
unified status-tag system, app + bot + SMS

Final designs

A redesigned order-tracking experience across My purchases and Order details, with a unified status-tag system, clearer ETAs, and explicit pathways to manage orders when something needs attention.

BWS final design: order status timeline across multiple states.
Final design: order timeline with clear ETA hierarchy and contextual actions.

My purchases

The list view surfaces only the information customers repeatedly asked for: ETA, current status, and a clear path into order detail. Status tags carry colour and language from the new BWS brand system.

Original BWS My purchases list: status text only, ETA buried, no differentiation between in-flight and stuck orders.
Original — one status string, no ETA hierarchy, no path into detail.
Redesigned BWS My purchases list: ETA leads, status tag carries colour and icon, each order tile links into detail.
Redesign — ETA-first, status-tagged, every tile a clear path into detail.

Order details

The detail view leads with what's actually happening, when, and what the customer should do about it. The progress bar uses the same status taxonomy as the list view, so language stays consistent across the journey.

Original BWS Order details: ETA hidden in body copy, failure states rendered as plain text, no in-app path to manage the order.
Original — ETA buried in body copy, failure states undifferentiated, support ticket the only resolution.
Redesigned BWS Order details: status tag and ETA top of screen, progress bar with happy and unhappy registers, contextual action buttons surfaced.
Redesign — status-led, ETA-prominent, contextual actions for every unhappy state.

Status tags

A small system that does a lot of work. Each tag carries a colour, an icon, and a copy pattern that maps to one of six unhappy-path scenarios surfaced during research. The same tags ship into the BWS bot and the SMS channel for consistency across surfaces.

Status tag system exploration.
Status tag system: colour, icon, copy pattern.

Progress bar

Three states the original timeline didn't differentiate (confirmed, packed, on-its-way) now each have their own moment in the bar with clear visual progression. Failure states slot in as a deliberate fourth visual register, not a buried error message.

Progress bar exploration.
Progress bar: happy and unhappy states visualised at the same level.

Ideation

Multiple ideation rounds across the high-traffic surfaces: list view, detail view, and the progress timeline. The goal was to test how status, ETA, and contextual actions could fit together without crowding any single screen.

Ideation frames.
Ideation: testing density and hierarchy across screens.

Dev notes & hand-off

Annotated specs covering interaction states, animation timing, and the conditional logic between API status responses and customer-facing tags. The hand-off doc became the squad's source of truth for both engineering and the support team writing the back-end status copy.

Annotated dev hand-off page covering interaction states, motion timing, and the conditional logic between API status responses and customer-facing tags.
Dev hand-off: interaction states, motion, conditional copy. Open the full hand-off (PDF).

Methods

Native app End-to-end design User testing Branding Interaction design Ideation Agile Design systems
Next project

Taper · Design 2.0

Thanks for stopping by.