↑ Back to top

Overview

Problem

Summary

Research

Ideation

Design

Iteration

Customization

JusPay

Designed “One Tap Payment” for cards and improved payment success rate by 10% for JUSPAY, B2B2C payment solutions, which handles 125+ million card transactions daily.

juspay.io/in/hypercheckout

Overview

Context

JusPay($442M) is a leading fintech company that provides B2B2C payment solutions with an Annual Revenue of $16.2M. Their SDKs are installed on 1.5 billion+ devices and process over 125+ million transactions every day. Amazon, Netflix, and Vodafone are the many companies using their solutions. JusPay enables frictionless payments for a billion consumers every day. They struggled to keep up alongside the hyper-growth of the fast-pacing world. JusPay wanted to innovate a frictionless one-tap payment experience.

My Role

Lead Designer, Quantitative Data Analysis, User Journeys, UI Design, Interactions, Prototypes.

Time Line
6-8 Months

Project Type
B2B2C, Enterprise and Consumer facing

Team
4 Designers, Researcher, 2 Engineers , Account Manager, Product Owner, CTO,CEO.

Problem & Background

Consumers want to enjoy a fast and smooth checkout process. They spend 60 seconds on average to enter or re-enter payment information or face technical issues. Due to this, they are frustrated and impatient, leading to abandoning their carts or during payment process.

Business Customers Problem:
The payment process JusPay currently provides uses in-app browsers for businesses who use their payment solutions. Which, in turn, decreases trust during the payment experience. This raises the need for businesses to customize payment interfaces according to their brand and UI guidelines to have a consistent, trustworthy payment experience.

Business Opportunity

One Tap Pay simplifies the checkout process for consumers and increases impulsive purchases. Which in return enhances sales for businesses. The simplification of the payment process also aimed to tailor and customize offers and discounts as per consumer needs.

Minimising frustration and distractions during payment helps mitigate cart abandonment and reduce failed transactions.

Lobby of JusPay office.

Summary

Research and Analytics

Partnered with the product owner to learn varied payment methods and human versus system failure rates for 20+ JusPay customers.

I owned and prioritized increasing the debt and credit card success rate since 75% of transactions are card-based.

Data Control Room at JusPay office.

Mapped Payment Status

Used analytical data to map all states of human failure points along the payment journey for debit and credit cards.

Explore and Iterate

After 6 iterations from my exchanges with the CEO, CTO, account managers, SDK developers, marketing team, and JusPay customers, I owned every account debit and credit card journey.

Enabled Businesses to Customise Payment Experience

JusPay products use an in-app browser as an interface for the payment experience. This increases the demand for businesses to customize payment interfaces according to their brand and UI guidelines to have a consistent, trustworthy payment experience.

I teamed with 4 businesses to help reduce Avg. the payment journey time and increase the card success rate.

[data-wf-bgvideo-fallback-img] { display: none; } @media (prefers-reduced-motion: reduce) { [data-wf-bgvideo-fallback-img] { position: absolute; z-index: -100; display: inline-block; height: 100%; width: 100%; object-fit: cover; } }

[data-wf-bgvideo-fallback-img] { display: none; } @media (prefers-reduced-motion: reduce) { [data-wf-bgvideo-fallback-img] { position: absolute; z-index: -100; display: inline-block; height: 100%; width: 100%; object-fit: cover; } }

[data-wf-bgvideo-fallback-img] { display: none; } @media (prefers-reduced-motion: reduce) { [data-wf-bgvideo-fallback-img] { position: absolute; z-index: -100; display: inline-block; height: 100%; width: 100%; object-fit: cover; } }

Developed Customisation SDK Guidelines

Businesses are at different stages with unique problems like customer trust, product use, and the total amount spent on their goods/services.From partnering with another designer, I developed a system of rules to allow businesses to change payment experience as per their needs.I collaborated with account managers and the marketing team to learn business requirements and planned to upsell JusPay Payment solutions.

Outcome

My contribution resulted in achieving the milestone of 10% increase in the success of payment and reducing the average payment process time from 60 to 10 seconds.

Preparing for First Meeting

Stepping into the world of Fintech for the first time, I wanted to learn how JusPay payment solutions operate.

Before the kickoff meeting, the team and I split the secondary research tasks into five groups: payment methods, legal regulations, JusPay customers, tokenisation for data protection and industry trends.

At the start of the meeting, I had four learning goals:
→ What is the CEO's vision for the payment solutions space, and how does this project contribute?
‍
→ What are the main friction points in the existing payment process?
‍
→ Problems faced by businesses and their requirements?

→ What payment methods should I prioritize and cover during the design process?

Data Analysis

From discovering the goal of the meeting to how my stakeholders understood the problem. I learned the main success of this project would be measuring the reduction of drop-off percentage at each step of the payment process.

I started to think about what would move the needle based on available time and resources. Due to the extensive quantitative data available, I partnered with the product owner to learn payment drop-off rates for 20+ businesses.

‍
I started off with the objective of learning:
→ Percentage splits for payment methods? Since there are 6+ payment methods, this helps me to prioritise.
‍
→ Drop off points at each stage of the payment process and why?
‍
→ Differences in drop off between human error and technical error in the payment process. So I can learn and focus on the reduction of human errors to increase payment success.

Insights

The average amount of time consumers spend while paying is around 60 seconds.

Endless Payment Methods
There is a significant drop-off during payment selection, and this is mainly due to plenty of payment methods and offers consumers need to decide during checkout.

Cards take the Stage
‍Identified that over 75% of transactions are card-based, with drop-offs occurring after initiating the payment process.

Human errors
‍Discovered and classified human error and system error. Focused on reducing human errors, one of which is consumers entering the wrong One-time password(OTP).
‍

‍Customization
Companies need the payment interface to be more customized to make the user feel the payment process is part of the app to increase trust and have a smooth experience.

Ideation with Blue Sky approach

I conducted a workshop asking stakeholders how the payment system should be to achieve the One Tap Pay experience.

The team was encouraged to take the blue-sky approach to Ideate. This helped hypothesize every possible solution to increase the conversion of payments and reduce drop-offs. Through this, the team filtered solutions on technical feasibility, meeting legal regulations, business demands, and future payment features for new consumer behaviours.

Design Principles

In order to align stakeholders, streamline idea filtration, and facilitate pivotal decision-making throughout the project, we formulated four fundamental design principles.

Privacy as the Default are principles one, two and three.
Focus on customer's privacy during every step of the payment process.  

No UI is the Best UI
Consumers need to spend less time looking at an interface and focus on other tasks.

Assume Intelligent Defaults
Use machine learning to learn consumer-preferred method and offers.

Interrupt only on Exception
Nudge the consumer as a last resort.

Consumer Flows

I prioritised card flow since 75% of all transactions are card-based. I considered every step of the card's journey, which helped me learn about the tech and legal feasibility from my engagements with stakeholders and develop hypotheses.

While iterating on the main flow, I directed my focus to learning other states and exploring extreme journeys in the payment process.

This is critical for the success of this project; learning unique journeys helped me care for millions of payment experiences and explore solutions diligently. Although the image below consists of a main payment journey, I also worked on EMI for cards, adding cards, which is not covered in this case study.

Feedback from Businesses

Amazon Prototype

Amazon is one of JusPay's major businesses. Through learning their drop-off percentages, the CEO of JusPay, the Account Manager, and I mapped out and tested with the consumers. We found out,

→ Consumers buy low-value commodities, and they would want to pay quickly.

→ If it is a high-value commodity, they spend their time carefully evaluating their purchase.

[data-wf-bgvideo-fallback-img] { display: none; } @media (prefers-reduced-motion: reduce) { [data-wf-bgvideo-fallback-img] { position: absolute; z-index: -100; display: inline-block; height: 100%; width: 100%; object-fit: cover; } }

What business would benefit from “One tap payment”?

The learnings from consumer testing results were also confirmed by the Amazon team, which takes care of payments for the platform. So, I need to change the personas to pivot on the user goal and business space.

Through collaborating with the account manager, we narrowed to 3 companies. The companies were focused on boosting retention in sales, less commodity value, and needed their consumers to make impulsive purchases with a quick checkout process.

Case Study Swiggy Approach and Exploration

My design process involved explorations and several iterations of the payment status, information hierarchy, iconography, and visual style for the components. This made the team make decisions diligently, considering the advantages and disadvantages of each solution.

Feedback from Consumers

Received vital pointers on what the experience failed to address from usability tests conducted by the JusPay researcher. We gathered initial impressions from using interactive prototypes.

→ Consumers lack trust in the system as they stare at the screen to check if the transaction is complete.
‍
→ They struggled to understand the payment's success when they were away from mobile.
‍
→ 8/10 consumers said they pay during public commutes. Which usually claimed to be crowded.

→ Old Habits Die Hard. Initial impressions indicated that consumers felt alienated from the new interface.

Increased Trust via Sound and Vibrations

1/2
Consumers had issues believing that the payment was successful. I built trust by adding not only visual feedback but also sound and haptic vibration. Used Google Material Design guidelines to understand sound design and included vibration to provide feedback.

Figma prototype with sound
‍

2/2
Observed consumers stared at the screen until it was successful. Collaborating with the SDK engineer and project manager, I enabled consumers to switch between applications in this scenario while keeping them updated on the progress.
‍

[data-wf-bgvideo-fallback-img] { display: none; } @media (prefers-reduced-motion: reduce) { [data-wf-bgvideo-fallback-img] { position: absolute; z-index: -100; display: inline-block; height: 100%; width: 100%; object-fit: cover; } }

Old Habits Die Hard

Consumers felt alienated and perplexed with the new payment experience when experiencing a “5-second timer” before the payment process began for the first time.

So I focused on allowing user getting familiar with the experience. Through ideating with developers and product owners from the early stages, I helped consumers get familiar with “One Tap Payment” over time.
‍

Speech Interaction

One hypothesis which failed was using the mic to speak OTP. It required permission for the first time to access the microphone, and consumers felt it was easier to type the password and had issues in a loud environment.
‍

[data-wf-bgvideo-fallback-img] { display: none; } @media (prefers-reduced-motion: reduce) { [data-wf-bgvideo-fallback-img] { position: absolute; z-index: -100; display: inline-block; height: 100%; width: 100%; object-fit: cover; } }

Businesses Need Tailored Experience

From engaging with the 4 companies (Amazon, Swiggy, Cred and Zomato), the team came to the realisation that payment trust differs from one business to another.

Customers felt confident when experiencing one tap payment with Amazon, knowing their money would be transferred, and Amazon has a reputation for a good return policy. With a startup, the consumers had scepticism and a hard time believing that the payment was successful or a scam.
‍

Customization for Businesses

Since businesses need tailored experience, I created a table, partnering with another designer, to provide scope and recommendations for customisation to the SDK developers. This helped businesses customize their payment experience according to its needs.
‍

Business Opportunity to Upsell Solutions

From engaging with the 4 companies (Amazon, Swiggy, Cred and Zomato), we learned there was an opportunity to upsell payment solutions. I partnered with account manager and product owner to create a three-tier system, which focused on customizing the payment interface, monthly payments, and one-tap payments. As displayed in https://juspay.in/products
‍