Design Concept Of
Mobile Banking

Design concept for Alfa-Bank Mobile banking app, Marketing research, UX and UI.

The Key Issue

Alfa-Bank, one of the largest banks in Eastern Europe, has organized a competition to find ideas for a new version of its mobile banking application.

The terms of the contest suggested the development of a design concept for two use scenarios. A special emphasis was placed on UX-design.

Task
  • Me, as a non-client of Alfa-Bank, want to receive a credit card, because it has some of the best conditions on the market to make payments on the Internet and pay utility bills.

  • Me, as a client of Alfa Bank, who has a card that I regularly use, I want to open a deposit of UAH 20,000 for a period of 12 months in order to increase my funds.

Working Process
1
Business Research
Business Research
2
User Interview
User Interview
3
Persona & Scenario
Persona & Scenario
4
User Flow
User Flow
5
Prototyping
Prototyping
6
UI-Design
UI-Design

UCD Methodology

The development of the design concept was based on the User Center Design Methodology. Key tools:

Expert Solution For

First User Case

Credit Card Ordering Case

Me, as a non-client of Alfa-Bank, want to receive a credit card, because it has some of the best conditions on the market to make payments on the Internet and pay utility bills.

The Problem

A Large Variety of Cards

The current line of card products Alfa-Bank is quite diverse and includes 17 cards: 8 credit and 9 debit. Given the context of the card order and the proposed Use Case and add some text to make picture.

Research Stage

Given the context of the card order and the proposed Use Case, It is advisable to offer the user only one card, demonstrating its clear advantages.

Optimal solution

That’s Why We Choose Credit Card Maximum

Given the context of the card order and the Use Case, It is clear to offer only one card, demonstrating its clear advantages.

  • Credit limit up to 200,000 UAH with 55 days grace period
  • Interest-free installments for 12 months
  • Cashback up to 25%
First User Case

Our Expert Solution

Persona

Persona

Mark, 27 years

From Kiev, Front-end Developer, $1000 income, Not married (has a girlfriend), rent an apartament.

Mark loves new technologies and gadgets. Stylishly gets dressed. He buys a lot through the Internet. Often in foreign online stores. Mark already has a credit card from Privatbank, which he often uses and always replenishes it regularly.

At a free time: He meets with friends (go to bars, movies, concerts). A lot of time spends in the mall in search of something interesting at a discount. In the evenings, they mostly spend time on the Internet on the computer (30%) and the phone (70%): FB, YouTube, favorite online stores (Asos, 6pm). Sometimes he reads articles on techcrunch.com, itc.ua, habr.com

Main Goal: More to earn through professional growth

Phone usage:
Social networks
Whatching Videos
Internet serfing
Shopping
Scenario

Scenario

Context stage

After lunch in the office, Mark opened the Facebook app on his iPhone 7 to see what‚s new in the tape.

Device stage

Among other things in the Facebook feed, he saw an advertisement of a new mobile application - Alfa Bank mobile banking and open it .

Trigger stage

The message said: The "Maximum" credit card is 200 000 UAH for purchases with an interest-free loan for 55 days, as well as a cashback up to 25%. Download the Alfa-Mobile application and order an online card without visiting the bank.

User Flow

User Flow

Open Credit CardDetails Ensure that cardreally fit him Make an orderon credit card Download andlaunch app Simple flow, high priority Filling the part ofpersonal data Monitor the statusof the card Well Done! Complicated flow, low priority
First Step

Download and Launch App

The first screen of the application after launch is maximally minimalistic and
provides two key needs:

  • Enter - for existing bank customers
  • Become a client - for potential bank customers

Given the formed expectation at the stage of advertising communication, as well as the fact that becoming a client of the bank is less tempting offer than a card with a limit of 200 000 UAH, the first screen immediately positions a card with key advantages.

Second Step

Open a Credit Card Details

The block with the card is decorated in the form of a banner. The credit card glides smoothly across the screen, let‚s understand that you can click on it.

The heading "Get a credit card from Alfa-Bank" clearly sets expectations: "By clicking on this piece I can order a card."

Third Step

Ensure That Card Really Fit Him

Slider of 5 screens reveals the main advantages of a credit card Maximum in a simple and understandable language.

The first slide contains key information. Each subsequent slide expands it:

  • Interest-free installments
  • Credit vacation 2 times a year
  • Payment of a communal flat without commission
  • Cashback up to 25%
Step 4

Make an Order on Credit Card

After examining the current forms on the site and chatting with the support service, we found out that the opening of the card remotely in any case occurs through the call center. Considering also that the user may not have the necessary documents at hand, to order a card it is enough just to enter and confirm the phone number.

By phone number, you can also catch existing customers of the bank by offering them a different interaction scenario.

  1. Enter Phone Number
  2. Enter Verifying Code
  3. Done!
Step 5

Filling the Part Of Personal Data

Step 6

Monitor the Status Of the Card

While the card of the new client Alfa-Bank is issued, the application displays in real time the current status of the card.

Any customer questions will be promptly answered by the support service in Alfa-chat.

When the time comes to receive the card, the courier will call and agree on the convenient time and place of delivery.

"This is the best card I‚ve ever had. So much freedom and posh keshbek. And it was so easy to order! "

Second User Case

A Deposit Opening Case

Me, as a client of Alfa Bank, who has a card that I regularly use, I want to open a deposit of UAH 20,000 for a period of 12 months in order to increase my funds.

The Problem

Different Variants of Deposits

Alfa-Bank offers several variants of deposits in different currencies, for different periods and interest rates. We work out only the scenario of opening a deposit in the hryvnia.

Research Stage

Given the context of the card order and the proposed Use Case, It is advisable to offer the user only one card, demonstrating its clear advantages.

Optimal solution

That’s Why We Choose Alfa Deposit

The most profitable deposit from Alfa-Bank. The high interest rate is up to 15.75%, for a period of 3 to 18 months with interest payment after the end of the deposit period or monthly.

Given the proposed Use Case, it is advisable to offer user only one option of the deposit of all available, demonstrating its clear advantages.

This approach greatly simplifies the interaction with the interface, and hence - increases the conversion.

Monthly and after year Interest Payments

Term From 3 to 8 months

Percentage rate up to 15.75%

Second User Case

Our Expert Solution

Persona

Persona

Andrew, 30 years

From Kiev, Sales manager, $1300 income, Married (no children ), has an inherited apartament.

Andrew has a dream to go to the US and a whole month to travel from the west to the east coast. Therefore, he treats with care to money and does not make unnecessary expenditure. Thanks to which, he already managed to accumulate a decent amount on his Alfa-Bank salary card.

At a free time: Improves the knowledge of English by visiting language courses, reading books, walking in the air with his wife. Sometimes he meets with friends. Enjoy a meditation. Spends a few hours a day on the Internet. Using a computer (20%), a tablet (30%) and a phone (50%): FB, YouTube, Lingualeo.

Main Goal: Making a travel dream comes true!

Phone usage:
Social networks
Whatching Videos
Internet serfing
Shopping
Scenario

Scenario

Context stage

Andrew received notification of the salary transfer. He delay his work and opened the Alfa-Mobile application .

Device stage

Together with the report on the transfer of wages, he saw a proposal to receive an additional 3058 UAH, investing a deposit for 12 months.

Trigger stage

The money was good, besides, he already managed to save some money on the card. Andrew decided to learn more details about the deposit.

User Flow

User Flow

Ensuring GoodDeposit Conditions Choose a PaymentMethod Confirm a DepositOpening Potential Revenuecalculation Control OpeningDeposits Well Done!
First Step

Potential Revenue Calculation

The main way to open a deposit in a mobile application is to go to the corresponding menu section. The screen briefly announces the conditions for placing the deposit and focuses on the ability to calculate the return on the amount of the investment.

But there is another way - go directly to the calculated options of deposits directly from the main screen of the mobile bank. Using special algorithms, the system offers to open a deposit to those customers who, for a number of reasons, are most inclined to this (for example: the amount of the balance on the card account).

Second Step

Ensuring Good Deposit Conditions

Deposit submission is extremely simplified and actually consists of two settings:

  • interest generation method
  • “Deposit term / interest rate”

The choice of the method of obtaining interest is implemented in the form of cards, combined in a slider. Thus, the key on the screen is always the interest rate and income.

Step 3

Choose a Payment Method

Step 4

Confirm a Deposit Opening

Step 5

Control Opening Deposits

With an active deposit, the “Deposit” screen view changes. The key emphasis is shifting to open deposits. To manage the deposit settings, just click on it (the usual pattern used throughout the application).

Deposit is easy to identify by the amount of investment. Progress bar allows you to quickly track the status of the deposit. Subject to the opening of a deposit with a monthly interest payment, the corresponding segments appear on the progress bar. Achievement of a segment - interest payment.

"My money is in a safe place and they are working for me. It was so easy to open a deposit!"

Prototypes

Wireframes & Prototypes

01 Card Info
02 Enter Phone
03 Validation
04 Success Page
05 Enter Data
06 Data Complete
07 Order Status

The Main Screen

Easy-to-Use
Mobile Banking

Free directories: directories are perfect for customers that are searching for a particular topic. What’s great about them is that you only have to post once and they are good for long periods of time. It saves a lot of your time when you don’t have to resubmit your information every week or every month. The bad news is most of your traffic won’t come from here. I still feel it is worth it to get your link out there. Just take one day and set it aside for posting to free directories. You won’t need to do it again for at least 6 months.

Давайте обсудим вашу задачу

Спасибо

Мы свяжемся с вами в ближайшее время.

UX Hot