FLY UX

BELMONT BANK

Brief: Improve the landing page; improve the "Checking the latest transactions" and "make payments" use cases.

Target audience's motivations: be able to check different bank accounts; be able to make actions effortlessly.

Business vision:"Belmont Bank" is a fictional retail bank addressed to millennials.

The bank required its mobile bank app to be modern but simple to use.

In order to discover and understand the problem as well as the users main goals I started by gathering data.

After having conducted user interviews and online surveys with the target audience, I felt my ideas were clearer:

INSIGHTS:

USER GOALS AND DESIRES:

Check the latest transactions
Transfer money to new or saved bank accounts
Make payments
Be able to request money or split the bills between friends and family

USER PAIN POINTS:

Not be able to understand the exact location of the transactions.
The screens are not very clear and organised
There is not suggestions about recipients getting notifications.
There is not option to change currency.

PLAYBOOK: USER INTERVIEWS, USER TESTING, COMPETITIVE BENCHMARKS,

USER JOURNEY MAP

DISCOVER (DIVERGE)

DEFINE(converge):

With structured data on hand I defined the possible structure and the ideal user journey for the two specific use cases.

The user flow should have been easy and effortless.

After an attentive analysis, I decided to design the mobile app by:

mixing visual elements and text so it would be more easy to relate the transaction to places or people.
cutting off complexity and use progressive disclosure
making the hard facts easy to find: account balance, pending payments.
mapping where the expenses had made.
considering the fact that millennials make an extensive use of social media.

PLAYBOOK: ASSUMPTION MAP, THE GOLDEN PATH, DESIGN PRINCIPLES

SKETCH (diverge)

I sketched many variant solutions as possible such as different interactions and microinteractions:

how the system behave, how it respond to actions how communicate results and how it helps to fulfil intentions.

PLAYBOOK: CRAZY 8'S, SOLUTION SKETCH

DECIDE (CONVERGE)

In this phase I decided to narrow down the various choices to one solution; based on this

I created high fidelity wireframes:

I set the various possible cards as the actual real representation of them (users can swipe the cards on the right or the left to see the info related to them)
I decided to create a "Transactions" tab in the navigation bar.
Next to the name of the place where the transaction took place I also put the logo of the business.
When clicking on logo a separated page appears with the exact location on the map where the related transaction had been made.
The app automatically suggests the available Belmont Bank recipients accounts thanks to the access to the user's phone contacts.
The recipients are displayed with their profile photos if they have one.
The recipients can be notified via social media or messages.

PROTOTYPE (DIVERGE)

I created a High fidelity prototype by designing the screens through “Sketch” and then export the screens to Axure in order to create hotspots and render the prototype interactive.

FLY UX

BELMONT BANK

The bank required its mobile bank app to be modern but simple to use.

After having conducted user interviews and online surveys with the target audience, I felt my ideas were clearer:

INSIGHTS:

USER GOALS AND DESIRES:

Check the latest transactions

Transfer money to new or saved bank accounts

Make payments

Be able to request money or split the bills between friends and family

USER PAIN POINTS:

Not be able to understand the exact location of the transactions.

The screens are not very clear and organised

There is not suggestions about recipients getting notifications.

There is not option to change currency.

DISCOVER (DIVERGE)

DEFINE(converge):

With structured data on hand I defined the possible structure and the ideal user journey for the two specific use cases.

The user flow should have been easy and effortless.

After an attentive analysis, I decided to design the mobile app by:

mixing visual elements and text so it would be more easy to relate the transaction to places or people.

cutting off complexity and use progressive disclosure

making the hard facts easy to find: account balance, pending payments.

mapping where the expenses had made.

considering the fact that millennials make an extensive use of social media.

PLAYBOOK: ASSUMPTION MAP, THE GOLDEN PATH, DESIGN PRINCIPLES

SKETCH (diverge)

DECIDE (CONVERGE)

PROTOTYPE (DIVERGE)

I created a High fidelity prototype by designing the screens through “Sketch” and then export the screens to Axure in order to create hotspots and render the prototype interactive.

PLAYBOOK: interactive prototype.

Link to the Axure prototype: https://twwaby.axshare.com

FLY UX

BELMONT BANK

The bank required its mobile bank app to be modern but simple to use.

After having conducted user interviews and online surveys with the target audience, I felt my ideas were clearer:

​

INSIGHTS:​

​

USER GOALS AND DESIRES:

Check the latest transactions

Transfer money to new or saved bank accounts

Make payments

Be able to request money or split the bills between friends and family

​

USER PAIN POINTS:

Not be able to understand the exact location of the transactions.

The screens are not very clear and organised

There is not suggestions about recipients getting notifications.

There is not option to change currency.

DISCOVER (DIVERGE)

​

DEFINE(converge):

​

With structured data on hand I defined the possible structure and the ideal user journey for the two specific use cases.

The user flow should have been easy and effortless.

​

After an attentive analysis, I decided to design the mobile app by:

​

mixing visual elements and text so it would be more easy to relate the transaction to places or people.

cutting off complexity and use progressive disclosure

making the hard facts easy to find: account balance, pending payments.

mapping where the expenses had made.

considering the fact that millennials make an extensive use of social media.

​

​

PLAYBOOK: ASSUMPTION MAP, THE GOLDEN PATH, DESIGN PRINCIPLES

SKETCH (diverge)

DECIDE (CONVERGE)

PROTOTYPE (DIVERGE)

I created a High fidelity prototype by designing the screens through “Sketch” and then export the screens to Axure in order to create hotspots and render the prototype interactive.

​

PLAYBOOK: interactive prototype.

​

Link to the Axure prototype: https://twwaby.axshare.com

INSIGHTS: