Bank Transaction Trace
I was the lead product designer on this project for TD Bank from 2024-2025. I worked with a design director, a product owner, a UX researcher, and a team of developers.
We made it 48 times faster to perform a transaction trace and reduced average call handle times by 20 seconds, saving an estimated $23 million USD annually.
Context
TD Bank serves over 10 million customers in the U.S. and 28 million globally.
ACH Warehouse is one of many web apps used in the call center by agents. It is a government monitored network in American banking used to view transactions such as bill payments, direct deposit of payroll checks, tax refunds and government benefit payments.
Customers call in to ask details of these transactions and each agent will need to perform a transaction trace in ACH at least 10 different times throughout their shift.
This project started as part of a larger effort to align systems in the call center with retail branches and the public site.
Discover
We interviewed agents and stakeholders in the call center
First, I observed call centre agents taking customer calls while they shared their screens. Then I compiled a list of questions, recruited additional agents and interviewed them, asking them to share their screen. What did they use ACH for? How often did they need to use it during their shift? Can you walk me through how you would trace a transaction for a customer?
We reviewed existing transaction table patterns in retail and the public site.
I reached out to the enterprise design system team as well as the retail design team and asked to see any existing designs or research around transaction table views.
We met with developers to understand technical limitations
I met with the lead architect and developers for the call centre to get a better sense of what was possible to change within the varied apps used across procedures.
Define
What we initially thought would be a small design update to collapse tabbed views into one page, quickly turned up some much larger problems than saving an extra click.
The technical debt in the call centre was enormous.
Years of band-aid fixes had resulted in agents needing to hop between 10 or more legacy apps. Slowing agents down with long load times, crashes, and multiple sign on requirements for even one procedure created anxiety that their customers would get angry with them.
Agents and their customers were not familiar with the language being used.
While interviewing agents, many said that they were not familiar with the terms used in the procedure and could not explain them let alone how they related to information the customer would ask for. They were executing procedure steps in the UI, relying on memory alone.
The most common action, a transaction trace took well over 8 minutes to do.
While this long procedure suffered from the technical debt and the confusing language used, it also had some uniquely challenging pieces involving agents needing to write down a 10 character ID of letters and numbers manually and then deciphering where in a greenscreen filled with code to type it in before reading the results from the same greenscreen. This resulted in many instances of user error that necessitated starting the procedure over again from the beginning.
Develop
Ideate
After seeing the results of the research it became clear that our initial goal of collapsing three table views into one would be a laughably small band-aid on much bigger problems. I drew up a wireframe of a more detailed and legible singular transaction view and wondered if it would be possible to simply click on the transaction and have a modal appear with all the trace information the agent needed, bypassing all those broken steps.
Prototype and test
With the large issues facing the call centre systems and the original scope of our research task being much smaller, we presented our findings and my wireframe to stakeholders and developers highlighting the desire to prioritize fixing the transaction trace procedure in ACH and requested a scope increase. Developers agreed that they would be able to pull the necessary data into the modal and stakeholders quickly approved the change of direction.
I created a prototype and we recruited more agents to test the new design.
Iterations
Initial feedback was good, agents were able to find the trace information quickly on their own and were thrilled at the idea of having that data pop up quickly. I wanted to be sure we were capturing more than just one action and asked agents if they had the information shown, would there be any other reasons they would need to open the previous apps. They confirmed there were about 5 more fields of information they may need access to so I took the designs back and added in the missing info.
Deliver
Our final solution addressed the three problems we had uncovered:
We eliminated 2 extra screens within ACH and 3 other web apps in the transaction trace procedure.
This reduced technical debt and maintenance efforts spent on legacy systems.
We aligned language used in ACH with retail and the public site.
Using common terms helped agents communicate what they were doing to customers more easily. Aligning to retail branches allows for faster cross department training and consistency in the customer journey.
We simplified a repetitive, complex procedure into 1 step.
The simplicity of the new procedure meant that newer agents and retail tellers no longer relied on more experienced agents to perform the trace for them. Fewer open apps meant fewer system crashes and user errors leading to overall improved average call handle times.
Outcomes
We made it 48 times faster to perform a transaction trace. A process that used to take 8 minutes now takes 10 seconds.
We reduced average call handle time by 20 seconds, saving an estimated $23 million USD annually.
We aligned the ACH call center system with other systems in the bank.