Design challenge | UX design

A Comprehensive Login/ Sign Up Flow 
for Users onboarding into a Fintech Platform

Client

Volopay

Service

Design Challenge

Industry

Fintech

Completion

Heading

Context

As part of the interview process at Volopay in Dec 2022, I was given a 2 day home assignment. Before we jump right in, here is a quick overview of the product.

the product
Volopay is a spend management platform and it helps businesses automate and control financial processes, providing visibility and efficiency in managing corporate spending.
‍
This platform streamlines expense management and enhances financial oversight.
the usp
1. Comprehensive Expense Management,
2. Real-Time Tracking and Reporting,
3. Budgeting and Spend Control,
4. Integrated Corporate Cards,
5. Automated Invoice Processing,
6. Multi-Currency Support.
The problem statement

Build a comprehensive login/signup flow for users onboarding into a fintech platform.

The flow should consist of all the user-facing screens for the login/signup flow onto a platform.
All use cases of the whole flow should be covered in detail.
Login flow should be secure considering it’s a fintech.

The solution

A comprehensive Low-Fidelity Login and Sign up flow for a UPI payment application consisting of all the use cases covered in detail while being secure.

The Design Process

This was the process that I followed:

i
Discover
Large Enterprises require the necessay
ii
Design
Large Enterprises require the necessay
iii
Develop
Large Enterprises require the necessay
1.1 IDENTIFYING THE USER SEGMENTS

On examining the user segments of the Volopay application based on the type of spending, I was able to categorise them as follows:

i
Startups and Small to Medium-Sized Enterprises (SMEs)
ii
Large Enterprises
iii
Rapidly Growing Companies
iV
Tech-Savvy Organisations
v
International Businesses
vi
Remote and Distributed Teams.
EXPECTATIONS OF THE TARGET AUDIENCE
1.2 EXPECATIONS FROM THE FLOW

Through user research, I identified that ease of use, efficiency, clarity, and data security are top priorities for users during the Sign-Up and Sign-In process.


Security and Trustworthiness
efficient and User-Centric Design
1.3 user journey

Through user research, I identified that ease of use, efficiency, clarity, and data security are top priorities for users during the Sign-Up and Sign-In process.


efficient and User-Centric Design
efficient and User-Centric Design
2.2 user flow

Through user research, I identified that ease of use, efficiency, clarity, and data security are top priorities for users during the Sign-Up and Sign-In process.

To address these needs, I broke down the flow in two steps to gather the necessary company information efficiently:

STEp 1 - logging in
1. Basic Info: Email, Password, or SSO (Google, Microsoft, LinkedIn).
‍
2. Email Confirmation: Verification via magic link or code.
UI Elements
1. Intuitive, clean design with labeled fields and examples.
2. Clear buttons for SSO with recognisable logos.
3. Simple, clear error-handling instructions.
4. Highlighted message reminding users to check their email for verification.
STEP 2 - info procurement
1. Account Details
2. Business Details
3. Business Document Verification
4. KYC Process
5. AML Check
UI Elements
1. Clearly labeled steps with animations to enhance the user experience.
2. Benefits of each feature highlighted throughout the process.
3. Concise fields with drop-down for easy input.
4. Progress indicators showing completed and remaining steps.
5. User-friendly, interactive navigation for smooth transitions.
3.1 wireframes

SIGN UP FLOW

These screens are designed with an emphasis on smooth transitions between steps, clear communication of account setup requirements, and flexibility in case of errors (email verification, resend options).
The combination of real-time feedback, social sign-in, and benefit reinforcement enhances user engagement and reduces drop-off rates.

SIGN UP FLOW

These screens are designed with an emphasis on smooth transitions between steps, clear communication of account setup requirements, and flexibility in case of errors (email verification, resend options).
The combination of real-time feedback, social sign-in, and benefit reinforcement enhances user engagement and reduces drop-off rates.

3.2 final product
3.3 future considerations that could improve the flow

To improve the flow of the onboarding process depicted in the wireframes, here are several actionable suggestions that will enhance user experience, reduce friction, and increase engagement:

Autosave for Form Data
Current Situation:
It’s unclear if there’s any autosave feature in the current flow.
Improvement:
Implement autosave for form inputs, especially when dealing with long multi-step forms.
Reason:
If the user leaves the process, having their data saved allows them to resume without re-entering information, preventing frustration and abandonment.
Inline Validation & Assistance
Current Situation:
Some fields appear to have validation (e.g., password confirmation), but it could be more robust.
Improvement:
Implement real-time inline validation with instant feedback (checkmarks for correct formats, warnings for incorrect input).
Reason:
Immediate feedback reduces frustration. Without having to wait until form submission to see mistakes, users can fix errors immediately, streamlining the process.
Tooltips and Contextual Help
Current Situation:
Users are provided labels for fields but no additional help for understanding input requirements.
Improvement:
Add tooltips or small "i" icons next to fields that provide extra information when hovered over or clicked.
Reason:
Certain fields may be confusing (e.g., “What exactly qualifies as business size?”), and offering quick, help can eliminate confusion without interrupting the flow.
Key Learnings

Some essential lessons I've learned on completion of the design challenge:

i

Optimizing Onboarding Flow:

I learned that breaking down complex tasks like KYC and document uploads into manageable steps can prevent users from feeling overwhelmed.
This modular approach not only streamlines the onboarding process but also improves completion rates, which has helped me design more effective user activation strategies.
ii

Efficiency Through Automation:

Implementing features such as auto-save, real-time validation (e.g., OTP verification), and automated file uploads taught me the importance of simplifying the user journey.
By reducing errors and minimising frustration, I’ve been able to create more user-friendly and efficient platforms which has given me confidence in the overall process.
iii

User Flexibility and Progress Indicators:

Allowing users to skip non-essential steps and using progress indicators has shown me how critical it is to keep users engaged and in control.
This flexibility has led to reduced abandonment rates and has helped me design processes that accommodate users' needs and preferences better.

Liked my Work?

Let's Talk

Liked my Work?

Let's Talk

Liked my Work?

Let's Talk

Liked my Work?

Let's Talk

Liked my Work?

Let's Talk