Neo Bank UI UX Design

Case Study

Mahdie Alavian Maryam Hemmati

UI UX Designer UI UX Designer

MohammadJavad Mansouri Narges Fallah

UI UX Designer UI UX Designer

April - August (4 months)

2022

A bout

O nce O
C VID-1 9 emerged and the pandemic-related shutdowns began, far fewer people have intended to go to banks to conduct in-person

banking services. In addition, number of bank applications users and new virtual banks with a wide variety of online financial services have

increased that is why users have felt more concern about complexity and usage of these application.

the main goal of j

this pro ect is to ease process of doing online banking operationsins in a neo bank application without any complexity for

users and to do so, we have identified users' needs, their strengths and weaknesses. We based the design cylcle on a user centered

approach which y ou will see in the following.

Problem Statement

The banking operations typically are complicated that is why desiging a neo bank

with simple operation flow and with high reliability can be useful for this problem.

In addition, to simplify the operations for users and prevent them from getting

confused, it is possible to create only one bank account for them.

Traditional banking offers in-person visits during their designated office hours,

which often interfere with customers' business hours. Doing banking operations in

bank offices also are time-consuming. It is significant for us to design a banking

application where bank customers can save their time and can do their banking

operations at any time

Product Features

Feature 01

Improve the experience of using "help" feature

Feature 02

Personalize some application’s features

Feature 03

Display frequent contacts for money transfer

Feature 04

Monthly, daily or weekly financial management for users

Feature 05

Periodic payment reminder

Design Process

01 Research 02 Define 03 Ideate

. 01 Desk Research . 01 Persona . 01 Brain storming

. 02 User Interview . 02 Affinity mapping . 02 Userflow

. 03 Survey . 03 User Journey map . 03 Sitemap

. 04 Competitor Analysis

04 Design 05 Test

. 01 Wireframing . 01 Usability Test

. 02 Visual Design . 02 Heuristic evaluation

. 03 Prototype

Discovering users behavior in

different layers (Assumptions)

Due to our assumptions, We have analyzed audience ( users ) behavior,

tried to k now our audience and discovered their mindset and behavior

in various l ayers of brand, product, market, industry and concept .

These l ayers l ed us to q uestions that we could ask our users in the

future to understand their real mindset and bahavior

C p om etiti e v a ysis nal

We have analyzed current and potential competitors to assess their strengths and weaknesses and get ideas from them.

I nter vi we

To discover the behavioral patterns of our target users in using neobanks, we have conducted in-depth interviews with five people directly

( in person ) and indirectly ( virtual . )O ne of our reasons for interviewing users was to find out whether similar products solve users' problems

or not .

Target G roup G nd Intervie wG oals

Individuals who are less familiar with technolog y

:
Interview goal Discovering reasons for not using technology, their problems and needs.

2. Individuals who are familiar with technolog y

:
Interview goal Understanding their needs, problems and concerns, discovering frequent activities in the financial field .

S ome Q uestions

What method do y
ou usually use to pay bills, installments and routine monthly financial activities

what routine financial activities should y ou do monthly

What is your experience in using banking apps

What services do y ou use mostly on banking apps What is ? y our reason for using them through these apps ?

S eason Of Intervie w
It is difficult to use banking applications for people who conduct these apps for the first time and the main steps should be taught them

effectively

Users have to use different banking apps since they have several bank accounts, some of which are not supported by some banking apps.

O nline Sur e vy
We have designed a q uestionnaire completed by 87 people. According to their answers, we could k now better our users and prioritize the

problems obtained through interviews.

Some examples of q uestions asked in the q uestionnaire are as follows

What problems have y ou faced when using banking applications ?

Almost half of people have problems when making transactions and 40 % have problems with forgetting

information related to log into their account.

% 20
% 14 5 .

% 30
% 12 5 .

% 40
%5
% 50
What do y
ou usually do not to forget y
our monthly payments ?

1 7% of people use reminder apps and 50% of them take notes

% 50
% 20
% 60
% 10
% 70
%5
% 60

Affi i y di n t agram

Affinity diagram was a great tool we used to organize a large number of data collected about our users into groups or themes based on

their relationships .

the main points mentioned by users

Since most of users have several bank accounts, they have to use a number of banking application

Some individuals who are unfimiliar with technology have a desire to learn how to use banking applications and some also mention that

video guides or communication with a supporter would help them to learn using online banking applications easily

It is difficult or even scary to use similar apps for users who ust started using the application. j

Persona

By researching target users, we got two personas:

1 Representative of a group that is unfamiliar with technolog y

2 The second representative is tech-savvy people

User journey map

in order to understand the user experience and how a user interacts step-by-step with our application, we have stepped into our user's

shoes and created a user ourney j map.

C ard sorting

We used the card sorting for information architecture and understanding user expectations as shown below . ( )

Site map

Based on the analysis of the data obtained from cardsorting, analysis competitors and interviews with users, we have designed the site map

to illustrate how different pages and content relate to one another.

Userflow

Userflow has been designed according to site map, users’ mindset and behavior. The mental model of users had a main role to design our

userflow and we focused on what users are going to do to make a good experience for them.

usability test
participants :

3 participants with differenct skills and motivation have taken the usability test to evaluate efficiency. these tests were performed on the

prototype and recorded by a mobile phone and camera .

scenarios :

scenarios and tasks designed for users included l ogin and registration, receiving Pooya password (O )
TP , etc .

Methodology :

our Methodology was an in-Person usability test. During doing tests by users, we observed their behavior, and recorded their challenges

and ideas in order to improve and revise our product

Users feedback and tests results :

After logging in, she expected to automatically get into the home page, but she had to click again on the welcome page

it was tough for her to find OTP section on the applicatio n

Therefore, we changed the location of "receiving O TP" section from the "card management" section to the "main page"

After registering, she was surprised to see the message " Your order has been successfully registered"

We changed the text of the message to " Your card has been registered successfully".

Before After

Sty e l Guide
Color
Logo Typography
0 7297C
Roboto => Light / Regular / Bol
IRANSansX => Light / Regular / Bold

1554F0

Icon

99B0F3

84A4BC

7C7C84

4 75460