Project overview
The Chase Digital Loan Experience (DLx) is the single touchpoint borrowers and internal teams rely on to complete and track every task required to close a loan. When a company reorganization moved DLx under a new product group running a different design system, the entire product needed to be rebuilt on a new foundation — screen by screen.
As the sole designer on the initiative, I treated the migration as more than a technical lift. Since every screen in the product was already being touched, this was the moment to resolve design debt that had never been prioritized before — deliberately, not just ported over as-is.
The problem
Users had grown used to inconsistency. Design discrepancies in the legacy product, mismatched patterns, unpredictable behaviors, an onboarding flow that never quite made sense, had gone unaddressed long enough to become part of the product's baseline experience. The migration gave us leverage we hadn't had before: a mandate to touch every screen meant we could finally fix what had never been in scope, for both internal teams and external borrowers.
Discovery
Rather than migrate blind, I started by listening. I ran a series of conversations with the sales team and product manager — the people closest to daily platform use and client friction and structured around three goals:
Synthesized objectives
From initial calls I had, there were 3 main objectives I wanted to tackle for this objective.
Full design system migration
Objective 1
The biggest effort of this initiative was migrating 40+ screens from one design system to another. It was important to always be in sync with the developers and have frequent demos of the screens.
Addressing inconsistencies and updating components + tokens
I went through the end-to-end flow of a loan application on UAT and matched the screens with Figma. I found inconsistent spacing, written content, colors, icon sizes, etc. Taking note of where the discrepencies were helped in addressing these to the developers when demoing the migrated screens. To solve this issue, I made sure that all migrated screens were attached to tokens, linked components, and provided the Storybook link to the exact code to use.
Vibe coded flow for testing and demo's
Using Copilot and Claude, I created a prototype of the migrated screens for our developers. This gave our tech team a clear understanding of all user interactions, behaviors, and patterns of the website before implementation. I also used the vibe coded prototype to show stakeholders the vision of the migrated screens and show them new enhancements we wanted to make.
Onboarding revamp
Objective 2
During our discovery phase, users brought up confusion on the create an account flow and sign in flow. The confusion was mainly in which email to use for their account and if they should "Continue with Chase" or not.
Previous version
Mini workshop brainstorm for flow revamp
I met with the product owner, product manager, 2 developers, and 3 internal sales team members to go through the old flow and created a new flow that addressed all known user pain points.
I proposed to simplifying the onboarding process UI and also eliminating the "Continue with Chase" option and automatically linking the email used to send the invitation to create an account on the onboarding flow.
New and improved onboarding experience
Using the updated user flow chart we curated, I designed a new and improved onboarding flow on Figma and vibe coded a prototype to test with internal team members. All testing was successful and users were ecstatic about the new flow. Noticeable enhancements I made were:
• Removing the "Continue with Chase" login option to simplify the onboarding experience.
• Pre-filling information that we have already collected from the backend for the user once they click the invitation link to create an account + login.
• Reducing he information overload by splitting the screens in multiple steps for better cognitive load.
Streamlining workflow
Objective 3
After the migration, I wanted to ensure that the workflow between design, developers, and product was as smooth as possible. I created artififacts for my team to reference and also presented this work to the broader design organization to help others with their team workflow as well.
File structuring
To better help new designers, developers, and product partners coming into my working file, I ensured to organize their points of reference
To better help new designers, developers, and product partners coming into my working file, I ensured to organize their points of reference
To better help new designers, developers, and product partners coming into my working file, I ensured to organize their points of reference
