The Manger
Redesigning an internal KYC and customer service platform for a financial services company.
Role: Lead UX/UI Designer — sole designer, working alongside 1 PM, 2 backend developers, and the customer service team Timeline: 3 months
Status: Shipped to production · details abstracted under NDA
The outcome
The redesigned platform replaced a legacy tool that customer service agents had been working around for years. After launch:
Agents reported significantly faster handling of KYC reviews
Support escalations tied to UI confusion dropped noticeably
The new architecture made it possible for the team to work faster in the following quarter without rebuilding foundations
The problem
The existing tool was built feature-by-feature over several years. Customer service agents — the actual daily users — had been given a tool designed around database structure, not their workflow. Common actions like "block a user" or "review a flagged account" required navigating through modals stacked with dense data tables. Mistakes were frequent, and agents were developing shadow workflows in spreadsheets.
Rather than keep patching, we made the case to rebuild — avoiding further technical and design debt.
My role
I led design end-to-end: stakeholder interviews with the CS team, user flows, wireframes, UI system, and handoff. I partnered closely with the Project manager on scoping and 2 backend developers on feasibility. Key decisions I owned included the information architecture, the decision to eliminate modal-based data tables, and the constrained use of Vuetify components to balance speed of delivery against custom UX needs.
A lofi wireframe of how the manager looked like when starting the project.
Rethink the web map
In order to make something better, we have to understand how to organize the app and consider new features that should be easy to implement in the future.
This App had different roles and hierarchies, considering this, some staff would’t be able to had access to all the manager features. For confidential purposes this is an example of the web map.
Made in whimsical alongside the stakeholder and developer.
This map allowed to make a better navigation without a lot of unnecessary Content load, headers and made to improve the management of components for the future. (details were abstracted under NDA)
Improve User flows
Several features in this product was lack of understanding, why was it use and how? how the actions affected the client as a costumer service person? Misleading was a common concern on this. From the most comon features such as "block a user from the system" or understand the information they were looking at. And this was a problem not only for maintenance but the incorrect useage because UI mislead them.
one of the first things to improve, was to remove any Pop-Up modals that contained big data tables, to make it more efficient platform with a screen and actions on their own.
Before
After
Brand & UI
Another thing to resemble is the improvement for a responsive resize and separation of content in the sections using cards for items on the screen so they can be easily stacked or hidden. This project was developed using Vuetify based on material design components. Considering that is a complex platform for its content, the brand stayed minimal just to be recognized into the company and just applied the primary font, colors and a responsive logo. Most components were already made by Vuetify and icons were used by google fonts. (details were abstracted under NDA)
Actual Screen of the New Manager ( Info, Colors and Logo were changed to keep it confidential)