Mahshidata - Blue Bank app

Achieved 58% CSAT for the new lend money feature

Blue Bank App - Borrowing money with less paperwork and follow-up

Overview

Blue Bank is a Neo-Bank that makes online financial transactions easy.

Although more people struggle financially, bank loan requests are still processed in the same slow, confusing way. If Blue Bank allows online loan requests, it may succeed.

What was the solution?

Provide flexibility with the amount of money they want to receive
Streamline the process of giving documents, collateral, and authentication and follow-up

Role

User reserach

User experience design

User interface design

Tools

Figma, FigJam, Illustrator, Photoshop, Google meet

Teams1X Mahshid (UX)1X Hamid (PM)

View prototype

You will read about ...

Business requirements

Competitors approach

User research

Brainstorm, prototype & iterate

Business requirements

To discover business requirements I looked at the bank website and talked with a banker.

Competitors approach

The competitor analysis provides strategic insights into the features, functions, flows, etc. I categorized similar and different features. Including lending tech platforms, digital banks, and other neo-banks.

User research

I found blue bank users with financial issues by using a screener survey and then interviewed them to identify their problems and goals.

Insights from data synthesis

User goals

Get money as much as they need
Get money as fast as possible
Get money with little paperwork and follow-up

View more research data

Interview findings

▪ The amount of money is more important than the reason they ask for it.

▪ Finding a guarantee or putting up collateral is difficult.

▪ Users are perplexed by the requirements.

I drew these user goals from data synthesis

▪ Get money as much as they need

▪ Get money as fast as possible.

▪ Get money with little paperwork and follow-up.

Users needs

▪ Loan availability

▪ Loan amount flexibility

▪ Clear terms and requirements

▪ Clear procedure

▪ Easy follow-up

▪ ...

Brainstorm, prototype & iterate

We brainstormed & prioritized solutions by dot voting and impact-effort matrix.

We ultimately chose a solution that combined

Amount of money flexibility
Less paperwork and follow-up

We went through 4 different iterations of the designs.

Iteration 1.0: Task flows to determine steps users must take to successfully use the app. I created a simple user journey to determine where we can solve user needs and how many steps and tasks they should follow.

Iteration 2.0: Sketching solutions following task flow to move from ambiguity to clarity. We checked sketches with the team, to make sure designs are feasible, viable, and aligned with legal rules and that we solved the user's need at every step.

User testing

Iteration 3.0: I created Hi-fi prototypes to test with real users and ensure we met our goals. Our biggest challenge was user recruitment.

Instead of MAZE or other unmoderated testing tools. I moderated tests and recruited testers via social media, and personal networks.

View test details

I conducted a qualitative usability test on 5 users.

Metrics

Task success rate
NPS score

Tasks scenarios:

You need $10,000 of money and can pay for it next year in 12 installments - 5/5
Send the information about your ID card. - 5/5
You have scanned all documents and they are verified please continue the process and verify yourself. - 5/5
You are verified, continue the process and apply for $10,000. - 5/5

User NPS

At the end of the user testing, I asked participants whether they would recommend the app to someone else.

NPS = 87% ( 13 /15 promoters) - 10% ( 1 /10 detractors) = 77 %

Last iteration

After user tests with 5 potential end-users, I was able to understand how navigable the app feature is in its current state and find many UI bugs to improve the user experience. Also,

To avoid bottlenecks and speed up processing requests on the bank side each request has a deadline. So we need to declare how many days each step is open. Therefore, in each step's card, I added the time limit to let users know how much time they have before their request vanishes.

Feature screens

Eligible vs Ineligible

Our users want money fast, so they want to know the requirements beforehand. At the start of the loan request, we check if the user meets the basic criteria and offer a solution to help them meet them quickly and continue asking for money.

Easy follow-up

Loan request follow-up should be simple. Since the app allows multiple loans, we provide a history of loan requests, steps, deadlines, amounts, and status.

Users can click on view more to see all records or proceed with any request.

Adaptability

We see that users want flexibility in the amount they request and consider how much they should pay secondarily, so I started the loan request with a calculator step. This allows users to adjust to their circumstances.

View other solution screens

Help with user-provided data

For overdue installments, users must provide e-check payment information. I show a picture of the e-check to help users understand what information to provide.

Grouped steps

Money-seekers may consider the process's ease and duration. I provide a few grouped steps and their deadline. To avoid having to recall or check them in the calculator step, we show users the required documents again here and inside each step.

Easy document scan

Users may experience problems sending digital documents. I created photo-scanning assistance by displaying a red border in the camera to indicate a problem and a responsive reaction from the app to fix it.

Team collaborations

I created the final screen flow for handoff after validating the outcome and incorporating usability insights into designs.

Lessons learned

Over document

Documentation simplifies lives! I learned the hard way that ambiguous designs won't be engineered to spec.

To ensure consistent component padding, naming conventions, and documentation, I had to revisit my designs several times.

Attention to constraints

The fintech industry is full of limits and constraints so I have to carefully check whether my design solutions are aligned and comply with their rules.

Success metric

Achieving 58% CSAT for new lend money feature.

If I had more time...

I would like to invest more time to control the accessibility and improve it.
I would like to create micro interaction for the app that can complement the design
I would like to think about other edge cases and scenarios of using the feature and seeing beyond the user's happy path to provide an inclusive design.