Quote & Book

End-to-end UX case study for a self-serve digital quoting and booking platform serving air and ocean freight customers across Toll Group's global network.

Quote & Book

End-to-end UX case study for a self-serve digital quoting and booking platform serving air and ocean freight customers across Toll Group's global network.

Quote & Book

End-to-end UX case study for a self-serve digital quoting and booking platform serving air and ocean freight customers across Toll Group's global network.

Role

Lead UX Designer

Tools

Figma, FigJam, UserTesting

Type

B2B Web App

Executive Summary

Toll Group — one of Asia-Pacific's largest logistics providers — had a fundamental conversion problem: securing a freight quote required emailing a salesperson, waiting 24 to 48 hours, and navigating a back-and-forth negotiation that deterred time-sensitive shippers and advantage-driven freight forwarders alike. Meanwhile, digital-native competitors were delivering instant indicative pricing through clean, self-serve interfaces.

The opportunity was to build Quote & Book: a B2B web application enabling customers to receive a tailored freight quote within 60 seconds on Toll's supported network lanes, then proceed seamlessly to booking — all without touching a salesperson for routine shipments.

< 60 sec

Target time-to-quote from first interaction

100%

International shipments only — no domestic

3

Freight modes: Air, Ocean FCL, Ocean LCL

0

Sales touches needed for eligible lane quotes

< 60 sec

Target time-to-quote from first interaction

3

Freight modes: Air, Ocean FCL, Ocean LCL

100%

International shipments only — no domestic

0

Sales touches needed for eligible lane quotes

< 60 sec

Target time-to-quote from first interaction

100%

International shipments only — no domestic

3

Freight modes: Air, Ocean FCL, Ocean LCL

0

Sales touches needed for eligible lane quotes

Mandatory user registration — a deliberate friction point — serves three functions: spam prevention, business identity verification, and profile pre-population that compresses subsequent quote sessions. The challenge was designing registration as an investment, not a barrier.

My role spanned the full product design lifecycle: stakeholder discovery, competitive analysis, user research, information architecture, task flow design, wireframing, interaction design, and the definition of success metrics that bridge user experience and commercial outcomes.

Problem Statement

Freight pricing in the logistics industry has long resisted digitisation. Rates fluctuate with fuel surcharges, port congestion, seasonal demand, and carrier availability. Toll's existing process reflected that complexity honestly — but honesty at the cost of immediacy drove customers toward competitors.

The status quo

Service scope and constraints

Before a pixel was placed, defining the system's boundaries was critical. The following constraints were non-negotiable product requirements established in alignment with operations and commercial leadership:

Supported modes: Air freight (general cargo), Ocean FCL (full container load — 20ft and 40ft), Ocean LCL (less-than-container load). Not supported: Domestic freight, road, rail, dangerous goods requiring special handling, temperature-controlled pharma, and live animals.

Weight limitations: Air freight max 1,000 kg / 6 CBM per shipment through the self-serve tool. LCL capped at 15 CBM or the weight equivalent. FCL has no weight cap beyond container limits. Oversize cargo routes to a human agent.

Geography: International shipments only. Lane availability is constrained to Toll's published network — the tool surfaces a clear message if the requested origin–destination pair falls outside supported lanes rather than generating a misleading quote.

Registration requirement: All users must register and verify a business email before accessing quotes. Anonymous quoting is not permitted, by deliberate product and commercial policy.

Goals

Senior experience work always requires holding two goal frameworks simultaneously. The product must serve Toll's commercial objectives without doing so at the expense of genuine user value — and vice versa. Where those goals conflict, the designer's job is to surface and negotiate the tension, not paper over it.

Business goals

User goals

Research

Research for a B2B logistics tool operates in a constrained environment. Users are busy professionals who guard their time, and the subject domain — freight pricing, Incoterms, HS codes — carries its own vocabulary that requires the researcher to earn fluency before the first interview.

Research plan

Research methods

Key research insights

Competitor Landscape

Rather than building a feature comparison matrix, the competitive review focused on UX patterns, trust mechanisms, and conversion strategies across six platforms. The goal was to identify design conventions worth adopting, patterns worth inverting, and gaps Toll could uniquely fill.

The white space identified across all competitors was the combination of: genuine multi-mode support in a single session, transparent all-in pricing with surcharge explanation, seamless quote-to-booking conversion without system switching, and an AI-powered personalisation for repeat shippers. No competitor executed all four. This became the north star for Quote & Book's design strategy.

Personas

Research yielded six distinct user archetypes spanning the full range of sophistication, frequency, and organisational context. From a solo e-commerce founder to a procurement director managing a regional supply chain, the design had to serve all six without optimising so hard for one that the others were alienated. Each persona is grounded in patterns observed across multiple interview and diary study participants — not a single individual.

Journey Map

The journey map below traces Marcus's end-to-end experience — from recognising a shipping need through to booking confirmation. It identifies emotional highs, friction points, and design opportunities at each phase.

Information Architecture

The IA was designed around two primary task domains — quoting and booking — with account management as a supporting layer. The hierarchy prioritises task initiation speed: a returning user should reach the quote flow in a single click from the dashboard.

Task Flows

Quote Flow

The quoting flow is deliberately constrained to three steps, presented with a persistent progress indicator. Each step is designed to surface progressive disclosure only — showing advanced options (e.g. dangerous goods, temperature requirements, special handling) without cluttering the primary path.

Quote Step Constraint: No Rate Without All Three Steps

The system does not generate a partial rate at any intermediate step. All three inputs are required to produce an accurate, compliant quote. The UI makes this clear through a locked "Get Quote" CTA that only activates upon step three completion, reinforcing the completeness requirement without frustrating users mid-flow.

Booking Flow

The booking flow is initiated directly from an accepted quote result and inherits all cargo data already captured. The user does not re-enter origin, destination, mode, or package information. The three booking steps collect the commercial and operational data needed to create a confirmed freight booking.

Service Constraints Embedded in Flows

  • International only: Origin and destination countries must differ, enforced with inline validation and clear error messaging.

  • Weight limits by mode: Air freight capped at 1,000kg per item (heavy cargo routed to specialists). LCL requires 0.1–15 CBM, beyond which FCL is recommended. FCL has no weight ceiling but suggests container types based on cargo weight.

  • Dangerous Goods: Activating the DG flag triggers mandatory IATA/IMDG class input and routes to specialists (4‑hour SLA), disabling auto‑quotes.

  • Supported lanes: Automated quotes only return for pre‑negotiated lanes; unsupported routes prompt a “Request Custom Rate” CTA for planning review.

Hi-Fi Mockups & Rationale

What follows is a representative selection of key screens from the quote and booking flows, rendered as high-fidelity wireframes. Each is accompanied by design rationale explaining the decisions made and the research findings that motivated them.

Registration - making friction feel like investment

Design rationale

The split-panel layout places the value proposition alongside the form — not before it. This was validated in testing: users who could see the "why" alongside the "what" completed registration 34% faster than those who saw a standalone form. The three tangible benefits mirror the exact language that resonated in research interviews. The "business email required" note is positioned as trust-building, not gatekeeping.