DARREN GAINZA
  • UX UI
  • Paintings
  • About me
  • RESUME

J.P. Morgan Digital Banking

​Problem

After the Silicon Valley Bank collapse, we recognized that startups and small businesses needed a modern, intuitive banking platform. But beyond ease of use, they needed the trust and security that only the world’s top bank could offer. With $125 million, we set out to deliver exactly that—an all-new digital platform blending a sleek, approachable user experience with JPMorgan’s unmatched stability.

I joined after initial competitive research and early third-party concepts, tasked with leading and finalizing the design. I delivered payment initiation flows for wires, ACH, real-time, recurring, and international payments; seamless account-to-account transfers; the Payments & Transfers dashboard with custom widgets; recipient management with a centralized hub; and bulk payments via file uploads or templates. Each team had around 20 engineers, and I maintained close collaboration to ensure a one-to-one match between design and development. Simultaneously, I upskilled junior designers on each team, refined JIRA processes, guided sprint deliverables, led stakeholder pitches, and contributed to cross-application pattern guidelines—ensuring a unified, familiar user experience across the firm.

My role

As the design lead for payment initiation, I delivered a new experience over two and a half years, working across four distinct teams. Each team had four project managers, one content designer, two junior designers under my mentorship, and up to 20 engineers—meaning I worked with dozens of stakeholders at a time. Starting on one team, I scaled to all four, aligning product managers on quarterly scope, breaking epics into deliverables, and partnering with dev leads to refine timelines. I iterated lo-fi concepts with product, content, and engineering, tested with six target startup users, refined designs, and ensured every scenario—responsive and accessible. I worked hand-in-hand with over 80 engineers total, conducted developer walkthroughs, ensured final desk checks matched design, and ran quarterly retros to continuously improve delivery.

​Skills

  • UX UI Design
  • Design strategy 
  • UX Research 
  • Prototyping 

Solution

I needed to get a high level understanding of airport travel and the average airport lounge customer. Since we lacked a dedicated UX research team we outsourced an industry insights report to Mckinsey & Company. Once I had a general understanding our target audience I used that data to conduct 6 moderated tests. I narrowed the audience even further to only include individuals who are cardholders with our competitors. This helped me understand how our target currently perceives their lounge benefit and what they desired to see improve.

Then I created a competitive analysis to gain insights into what the current industry standard is for premium digital experiences. I analyzed our competitors in the airport lounge space and applications made for ticket sales. This would help inform my approach to designing the lounge catalog, details page, and digital pass. 


Both of these streams of research gave me a strong foundation to kick off the initial design phase. I now understood our customers needs and what the bar is for a premium digital experience.

I used our design system for our mobile application as a guide and designed a wireframe flow of the catalog, details page, and our digital pass. My initial designs also included a checkout flow that allowed customers to purchase additional passes that was later scrapped due to tech and time constraints. After running the low fidelity designs by my product and tech partners and incorporating their feedback I created a high fidelity prototype. I used that prototype to set up 6 unmoderated test to collect feedback from our target audience. 

Our first round of testing shed light on usability issues with retrieving the pass and confusion regarding certain sections of our copy. After making improvements to the designs based on the new insights gathered I organized another 6 tests. I repeated this cycle 8 more times, each test raging in complexity and density, but all serving a purpose to improve the customers experience and achieve a premium feel.

Our roadmap stretched over 11 months and it included designing, testing, and developing. In 2021 we successfully launched Capital One’s first digital lounge experience in our mobile banking application. We hit our goal to elevate our brand and support our new travel card launch. My designs set the foundation for how we display lounges at Capital One moving forward since we have plans to expand our lounge portfolio globally. 

Impact

Since launching our MVP in 2021 our digital lounge experience has gotten over 7 million visits, averaging to 20,000 daily visits across our iOS and Android applications. 

Our lounge experience received a net promoter score of 95% meeting our business goal to elevate our brand and become a real competitor in the premium travel card space.

Points guy: "Amex and chase should be worried about the competition" 
thepointsguy.com/guide/capital-one-lounge/


One mile at a time travel site: “This might be the most thoughtfully designed lounge experience that I have ever been in, I can’t wait to see the lounge portfolio expand” 
onemileatatime.com/reviews/capital-one-lounge-dfw/

User research

I conducted several rounds of interviews to identify traits of our target audience. Having a quantitative way to identify our customer made it easy to set up filters for unmoderated user tests when it came time to testing my designs.
Target demographic
Picture
Usertesting.com
I used Usertesting.com to conduct unmoderated tests. Every time I came up with a new design I would test them with an average of 7 targeted users. Then I would synthesize the insights gathered from the tests and socialize a deck that highlights key takeaways and next steps to inform our stakeholders.
Picture
To ensure all the information in the Lounge Details page is accessible I asked users to complete specific tasks such as finding the lounge hours, locating the covid policy, and determining how many guest they can bring. 
Picture
To make sure the Digital Pass was easy to find and use I asked users what they needed to access the lounge, how comfortable they felt with Apple Wallet and Google Pay, and how many complimentary guest passes they receive.​

Competitive analysis 

I conducted a competitive analysis of our industry leaders to set the bar for a premium digital experience. I pulled key insights from each competitor's digital experience and highlighted flows that I could potentially incorporate into my designs. The applications ranged from lounge space providers like Chase to leaders in the travel industry like Airbnb. 

The full list was Google, Trivago, Airbnb, Trip Advisor, Chase, American Express, Stub Hub, Ticket Master, and Lounge Buddy.
Picture
Once I identified the key insights I organized them according to what our needs were for this new endeavor. Splitting the data into two streams. The first helped me design a catalog page that displays all of the lounges our customer has access to. The second helped me design a details page that informs our customers about everything they need to know before entering one of our Lounges.
Picture

Concepts

My initial interaction design was pushing the limits of what was typically expected of a bottom sheet at Capital One. The catalog was housed in a bottom sheet and when a Lounge was selected the bottom sheet lowered a third of the way to reveal a carousel of images. This was inspired by the Airbnb digital experience. ​
Picture

Fail & fail fast

Since this was an extreme departure from the normal use cases for bottom sheets our team had concerns about the approach. Mainly because the solution required hard coding this interaction because it wasn’t available out of the box in our design system. 
Picture
Picture

​Digital pass exploration

Here are some of the concepts I made and tested for the Digital Pass. Overall they did not align with Capital One's brand and the QR code losses scannability when drastically altered. 

Additionally when these designs were tested users asked for the access details to be closer to the QR code itself so it's easy to understand what the QR code does. 
Picture
I was a big fan of pushing the background of the pass further and including more travel imagery. 
Picture
I wanted to explore making the QR code stand out by incorporating an ombré of our colors and our logo.

🔥 Demo of the experience today 🥳

Here is a screen recording of the experience in the application today. The perspective is of a Venture Cardholder. We successfully launched in November of 2021. This was my first major customer facing product.
Picture

Platform support

Our mobile banking application is available on the iPhone, iPad, and Android devices. Each demanded unique treatment to execute the correct designs and interactions based on the platform and orientation. I made sure to highlight every difference in my documentation for easy developer handoff. 

An unforeseen challenge was that our design systems iOS token names and Android token names were structured differently. Our iOS Figma and Storybook tokens were in alignment but Androids tokens were not. Leading me to I organize more frequent check ins with our Android developers to ensure alignment and clarity. 
Picture

iOS

Here is the Catalog, Details, and Pass pages for our iOS experience in our mobile banking application. Developer hand off went very smoothly and the initial QA phase was a 1:1 match!
Picture
Picture
Picture

iPad

Our application is available for iPad so I followed Apples Human Interface Guidelines. 
Picture
Picture

Android

Our mobile banking application is available for Android devices. To offer the best experience I aligned the designs to follow standard Android interactions that their users are familiar with. I designed for a wide variety of screen sizes and handed off images to developers in .webp format ranging from .5x - 3x. 
Picture
Picture
Back to the top
Proudly powered by Weebly
  • UX UI
  • Paintings
  • About me
  • RESUME