Leading the UX of a complex B2B ecommerce re-platforming project

How I led the team through a fixed timeline, an unclear scope and unfamiliar squads to land a B2B ecommerce experience where enterprise procurement teams could complete approvals, manage catalogues, and place orders without hitting dead ends.

B2B Enterprise UX Procurement Design Replatforming Cross-functional 0-to-1 Design System
RoleLead Product Designer
Duration18 Months
TeamCross-functional, 30+
SkillsUX, Research, Strategy
Officeworks B2B platform showing enterprise checkout and approval workflows
Impact at a glance

What this project delivered

8%
Of Officeworks' business customer base migrated with minimal disruption
$80K+
Annual savings in team member time
*based on behavioural data approximation
15+
Complex user flows redesigned end-to-end
Context

The situation

Officeworks' B2B platform was built on legacy technology that could not support the growing complexity of enterprise customer needs.

The migration brief was intentionally conservative, which is to move customers to the new platform with minimal disruption. I reframed the key problem statement and succeeded in including UX improvements in the journey we touched.

Key problem statement

How might we migrate business customers to a new platform while using the transition as an opportunity to address known UX failures, without scope creep, and with the confidence of stakeholder buy-in?

My Role

What I was responsible for

As Lead Product Designer, I led a team of two designers across the entire replatforming initiative.

  • Leading end-to-end UX design across all replatforming workstreams
  • Conducting extensive user research with business customers and internal stakeholders
  • Defining information architecture and interaction patterns for complex workflows
  • Creating and maintaining design system components specifically for B2B needs
  • Collaborating with engineering, product, and business teams across multiple squads
Challenges

What was getting in the way

  • The timeline and feature set were fixed without designer input, on a waterfall project where every feature had to be migrated regardless
  • Designers fought for improvements without an agreed scope, while the business feared scope creep
  • Designers risked becoming a bottleneck as shifting goalposts made it hard for developers to build against a stable target
  • Adoption of the design system
  • New squads, a mix of internal and external people, were unfamiliar with the collaboration and design review process
Approach

How I solved it, one decision at a time

Each challenge above shaped a specific decision, from securing research access through to how new squads worked with design.

Building research access

Rather than fighting the non-negotiable features, I focused on building research access and securing a budget independent of the project team. I ran workshops with the heads of teams, starting with the Head of B2B, to explain what designers do and why. From there, a business specialist gave us a contact list, and I ran a survey in Askable to identify and segment participants with the design manager.

For each fixed feature, I surfaced pain points through interviews and industry expertise, then prioritised fixes across the journeys we touched, encouraging designers to research first before designing to the BA's specs.

Using contextual inquiry, 25+ stakeholder interviews, behavioural data analysis and competitive research, I found approval workflows and catalogue management were the biggest pain points, with confusing terminology sending users into the same dead ends repeatedly.

Research findings and user insight synthesis from stakeholder interviews
Research findings synthesised from stakeholder interviews, part of building direct access to business customers.

Defining scope

Defined a clear scope of what needed improving, aligned with the PO's priorities, using a scoping document and regular meetings with the PO. This protected designer time from constantly fighting for improvements, and gave the business assurance against scope creep.

Scoping document used to align improvements with the PO's priorities
Scoping document used to align on what needed improving with the PO.

Keeping goalposts stable

Worked on ways of working so designers were not a bottleneck, keeping the goalposts stable for developers as we built and iterated on the design library alongside the design system. This happened through meetings with the tech lead, shared documentation for versioning, and a backlog process with the PO and tech lead to prioritise components and updates, keeping developers and designers in sync.

Backlog and versioning workflow used to keep developers and designers in sync
Backlog and versioning workflow, kept in sync with the tech lead and PO.

Driving design system adoption

Worked on the design system by reviewing and addressing developer questions and facilitating recurring meetings with devs to build buy-in and familiarity early on, then working with other designers to write documentation in Confluence. This meant UI designers' work could be implemented consistently, and shaped how designers and developers collaborated.

Design system documentation used to drive adoption across devs and designers
Design system documentation, built with devs and designers to drive adoption.

Establishing a review process

Set up a recurring design review session with the PO, and supported designers with their own review session beforehand. Also supported the design for catalogue display, and actively fed back on catalogue management, account management and business checkout design.

Design review session artefact for the B2B project
Design review session, run ahead of the PO review.
Catalogue and checkout design supported through the review process
Catalogue and checkout design, supported through the same review process.
Results

Detailed outcomes

Business metrics

  • $80K+ in annual savings in team member time, by reducing hours spent on support calls, troubleshooting checkout issues, and resolving approval confusion
  • Successful migration of 8% of Officeworks' business customer base with minimal disruption
  • 1 minute saved per checkout on average, through streamlined approval workflows and clearer error messaging that eliminated repetitive failure loops

*Based on behavioural data approximation

Research pipeline

  • Grew the research pool from 0 to 15 business customers via a business specialist, plus 50 more contactable and segmented in Askable for ongoing research

Strategic value

  • Created a scalable foundation for future B2B feature development
  • Established design patterns adopted across other Officeworks digital products
  • Built strong, durable relationships between design, product, and engineering
  • Established a way of working that kept design in the loop on checking the implemented version, without becoming a bottleneck for developers even as goals kept moving
  • A documented, PO-aligned scope reduced time spent negotiating priorities and gave the business confidence against scope creep
  • New squads adopted a consistent design review process, reducing rework and misalignment with the PO
Colleague testimonial about working with Angeline on the B2B project
Feedback from a Design Lead on the B2B replatforming project
Colleague testimonial about working with Angeline on the B2B project
Feedback from a Product Owner on collaboration and design quality
Colleague testimonial about working with Angeline on the B2B project
Feedback from a stakeholder on research and strategic impact
Learnings

What I would carry forward

Reflection

Getting alignment on UX improvements was not straightforward. The team's original position was to replicate the existing experience and update the UI. Making the case required translating research findings into business risk, showing that the cost of replicating known pain points outweighed the cost of addressing them during migration. Securing that agreement became one of the early wins of the project.

Next case study
Building and scaling the first design system at Officeworks