The image featured at the top of the about us page #1
The image featured at the top of the about us page #1
The image featured at the top of the about us page #1

DeepStack Payment Processing Platform

DeepStack Payment Processing Platform

Implement the diverse payment methods to provide an efficient and flexible payment experience for users.

Implement the diverse payment methods to provide an efficient and flexible payment experience for users.

Role

I  UX designer in Digital Banking team

Timeline

I  Aug. 2024 - Oct. 2024

Project Overview

Project Overview

What is Deepstack?

Banc of California’s digital payment processing platform for merchants, enabling them to accept online and in-person payments while providing unified access to transaction data, account activity, and reporting within the bank’s ecosystem.

Banc of California’s integrated merchant payments platform with centralized transaction data and reporting.

Business Overview

Business Overview

Problem

The current platform relies solely on a virtual terminal, forcing manual card entry that is slow, error-prone, hard to scale, and limits security and customer self-service.

Task

Implement new payment links as an additional payment method, enabling customers to pay independently while saving time, reducing errors, improving scalability, and enhancing security.

Business Objective

Business Objective

The new payment links feature aims to:

15% *

increase in client retention.

increase in client retention.

25% *

increase in new client sign-ups

increase in new client sign-ups

*numbers are hypothetical and derived from market projections.

Research & Discovery

Research & Discovery

To better understand competitors' payment methods and inform the design process, I conducted a comparative analysis of Square and Stripe, focusing on their user flows.

To better understand competitors' payment methods and inform the design process, I conducted a comparative analysis of Square and Stripe, focusing on their user flows.

objective

Evaluate the payment process functions of similar platforms to identify opportunities for streamlining and improving Deepstack’s payment link functionality.

activity

Analyzed Square and Stripe’s payment flows to identify key features and usability patterns, informing design improvements for Deepstack’s payment link experience.

finding

Square aligned more closely with Deepstack, offering a simple and straightforward experience for both merchants and customers.

Define & Ideate

Define & Ideate

Use cases

I created two payment-method use cases and mapped step-by-step user journeys to understand behavior, visualize the end-to-end flow, identify overlaps, and streamline the experience for merchants and customers.

To better understand user behavior and define the user journey, I created two use cases comparing different payment methods. Based on these, I mapped step by step user journeys to visualize the full process, identify overlaps, and streamline the flow, ensuring an intuitive experience for both merchants and customers.

01. Virtual Terminal

a merchant enters customer's payment info

User Scenario

User Scenario

Vivian buys flowers from Flower Shop Z and wants to pay with her credit card at the shop.

Vivian buys flowers from Flower Shop Z and wants to pay with her credit card at the shop.

User Journey

User Journey

02. Payment Link

a customer enters their payment info through the payment link

User Scenario

User Scenario

Amy sees a chair in the X Furniture Shop catalog and wants to buy it and pay on her own.

Amy sees a chair in the X Furniture Shop catalog and wants to buy it and pay on her own.

User Journey

User Journey

User Flow

I mapped both virtual terminal and payment link flows, identified shared entry steps, and unified them by integrating payment links into the virtual terminal, reducing cognitive load and keeping all payment options in one interface.

Based on the user journeys, I mapped flows for both the virtual terminal and the payment link. I found that the initial steps were identical, which allowed me to merge them into a unified flow. Although the original requirement treated the payment link as a separate process, I identified an opportunity to reduce cognitive load by integrating it into the virtual terminal. This positioned the terminal as a central hub for all payment methods, keeping users in a single interface while they select their preferred option.

Object Map

Using the updated user flows and requirements, I created an object map to clarify the system structure, visualize how elements fit together, and ensure everything is efficiently organized and aligned with requirements.

Using the updated user flows and requirements, I created an object map to clarify the system structure, visualize how elements fit together, and ensure everything is efficiently organized and aligned with requirements.

Pain Points & Recommendations

Pain Points & Recommendations

Virtuall terminal

Current

Recommended

Current

Recommended

*mid-fidelity prototype is intended to show basic user flows only.

*mid-fidelity prototype is intended to show basic user flows only.

What I have learned

What I have learned

Through this project, I learned that even smaller initiatives benefit from a thoughtful UX process. By analyzing and combining two separate user flows, I created a more streamlined and optimized experience that reinforces the value of simplicity and efficiency in design.

Through this project, I learned that even smaller initiatives benefit from a thoughtful UX process. By analyzing and combining two separate user flows, I created a more streamlined and optimized experience that reinforces the value of simplicity and efficiency in design.

Thank you for watching.

Thank you for watching.

Thank you for watching.