Skip to main content

PwC - Request to Pay (RTP)

Client PricewaterhouseCoopers
Role UX Developer
Years 2018 - 2020
Financial Commerce SaaS UI

The Request to Pay application was a large-scale enterprise SaaS platform developed for PricewaterhouseCoopers to streamline end-to-end cash flow management across financial operations. Working as an embedded UX Developer across five cross-functional agile teams, the role demanded a balance between rapid sprint delivery and maintaining rigorous design consistency at scale - all within a complex Angular/Kendo UI environment where component decisions had downstream effects across the entire product.

Request to Pay Dashboard
PricewaterhouseCoopers Request to Pay homepage screenshot

Request It - Homepage & Dashboard

The Request It homepage was designed to orient users immediately - surfacing the two core actions (Track and Request) in a prominent right-rail, pairing them with at-a-glance procurement and invoice status counts so users could assess their workload before taking a single click. A welcome panel with embedded tutorial video addressed onboarding without interrupting the primary workflow. The entire UI was built on a custom Sass architecture created from scratch - establishing a scalable, component-driven foundation that maintained PwC brand consistency across the application while giving development teams a clean system to build on.

Invoice Submission - Status Tracker Detail
PricewaterhouseCoopers Request to Pay invoice submission status tracker detail screenshot

Invoice Submission — Status Tracker & Form Detail

At PricewaterhouseCoopers I designed a persistent multi-step workflow tracker for the Request It platform that gave users simultaneous visibility across a full Request, Source, Contract, Purchase, and Pay pipeline while also surfacing granular status detail on their current transaction — two lenses on the same workflow without cognitive overlap. The form itself manages a wide range of conditional inputs: supplier lookups, Work Breakdown Structure (WBS) Element and General Ledger (GL) Account field data, urgency classifications, and special handling flags — all surfacing inline validation states that communicated errors in context rather than on submit. Building this in Angular/Kendo UI required precise management of dynamic row generation, cross-field validation state, and a submit gate that enforced completeness before allowing downstream approval — all while maintaining accessibility and keyboard flow across a deeply nested component tree. The component-driven architecture was built for configurability, allowing development teams to scale and extend the system consistently across five cross-functional agile teams. The business outcome was a streamlined procurement experience that reduced friction across the entire cash flow lifecycle for a global professional services firm.

RTP Application - Detail View
PricewaterhouseCoopers Request to Pay detail view screenshot

Category Selection - Dropdown Autocomplete Search

One of the more technically complex interaction challenges was embedding a live typeahead autocomplete search inside an open dropdown component — a pattern that required manually refactoring Kendo UI's field library to prevent conflicts between the type-ahead input events and the dropdown's own keyboard handling. As the user types, the list filters in real time against a taxonomy of procurement categories, surfacing suggested keywords before narrowing the full list below. The result let users navigate a deep and unfamiliar procurement taxonomy in real time — a significant improvement in discoverability that would not have been possible off the shelf.

Request It FAQ Section
PricewaterhouseCoopers Request It FAQ section screenshot

Request It - FAQ & Resource Hub

The Request It resource hub consolidated everything a user might need into a single, quadrant-based layout - Application links, Policies, Training materials, and an FAQ accordion all living on the same screen without competing for attention. Each training video opens in its own modal, keeping users anchored to the page rather than bouncing them to an external player. The FAQ section uses a clean accordion pattern to surface answers on demand. Building the layout from scratch meant engineering each quadrant to meet accessibility standards independently - keyboard navigation, focus management, and ARIA roles all had to work correctly across four distinct interaction patterns on a single view.

Contact

Like what you see? Download my resume or use the form below to get in touch.

Email
Location
Northern Virginia, DMV
Clearance
Public Trust