top of page

Nubank's Dashboard

Cover - Head Nubank.png

My Role

Product Designer

Goal

The objective of the second project at this level is to create a Product Interface for Web, Dashboard style. It should be only 1 page long, containing all the relevant content for the product you are working on. The product in focus must be a viable idea, so that you research 1 product that makes sense to create. The page must be for web, in standard format, without responsiveness and without concern with mobile.

Solution

Creation of a dashboard able to manage the credit card transitions.

Method Used

This project needed a simple but with a little more components to fit in. So I chose the double diamond and a priority list (GUT matrix) to connect better the dots.
Nubank Figma - Method.png

Desk Research

I didn’t know so much about the financial world and dashboards, so I needed to to do a lot of research even more to understand the company, target customers and dashboards. I came back a few times to search and validated more information as I ran the project.

The new generation of financial services in Brasil

Nubank is the biggest fintech in Brasil, with also filials in Mexico, Argentina and Germany. It was founded in 2013, in São Paulo, Brazil, by David Veléz, Cristina Junqueira and Edward Wible.

 

Nowadays, Nubank is used by more than 23 million Brazilians and has been received a large amount of money from different investors. In 2018, became an ''unicorn'' and in 2017 was elected the best card by customers according to a study lead by CVA Solutions. 

Values & Goals

The main goal of this startup is to change the financial world with simple and direct procedure, aligning also with:

 

  • Less bureaucracy;

  • No-fee credit card;

  • No payment on order a credit card;

  • Problem solve on digital with a good attendance.

Brazilian Profile of User

According to Nubank, 70% of users have less than 36 years. Besides it, in April increase the numbers of older users (60 years or more), around 30 thousand. 

 

To trace the profile of the users, I collected information about financial education in Brazil, to understand how they deal with money and investments. In the end, I could join these informations:

 

  • Because of the inflation and bad government decisions, Brazilians had fear of put their money in a bank account, like a savings account. But it started to change with the monetary establishment.

  • There is no effective plan of studies about this theme at schools.

  • Speak up about investments is a tabu or rich people thing, for most of Brazilians.

 

These percentage of people who invest their money, on digital accounts, have this profile:

 

  • 61% are men;

  • The age average is 38 years;

  • 52% have high school;

  • 48% are from B class;

  • 55% live in the south of Brazil;

  • 91% work and have remunerated job;

  • 38% are registered in the work card;

  • 13% are independent worker;

  • 11% are civil servant;

 

A large percentage of these investors prefer to put their money on a savings account (booklet savings).

Nubank - Pension Chart-01.png

Reclame Aqui

This site is the largest site of complaints in Brazil, so I read some complaints and the problems most commons around Nubank accounts.

Nubank- Relevance Info-01.png

Play Store

On play store, I read the comments and saw the scores given by the customers. In general, the score is high (4,4/5).

 

The customers like the attendance and the app itself, but there are some problems in specifics circumstances like transfers and blocks, in general. There are other problems in the experience that should be fixed like Leila engineer, some buttons, etc.

Apple Store

However, the situation change on apple store, the problems were around the update, limit of the credit card and balance bill, the majority of them. The score is lower (4,2/5) than in the play store.

 

There was this comment down below asking for the chart. What raised an assumption about the importance of the visual parts of the content.

Comment.png
''Took off the extract chart. I loved this chart, will it come back? ''

Dashboard

I didn’t know so much about dashboards and what it concerns, so I searched about. 

 

It was created to encourage and to analyse data to then take action. So I searched what kind of dashboard fitted better in fintech's case. After that, I noticed the strategic dashboard achieves the expectations.

Benchmark

I compared all of the competitor fintechs to Nubank to have a notion about resources, disadvantages, amount of customers and satisfaction (measured on Apple Store and Play Store). And I also included Nubank.

Benchmark-01.png

Survey

This research possibility me to create a survey and apply to raise qualitative data. I got 19 answers by Nubank customers only. 

Nubank - Survey charts-02.png
Nubank - Survey charts-01.png
Nubank - Survey charts-03.png
Nubank - Survey charts-08.png
Nubank - Survey charts-06.png
Nubank - Survey charts-07.png
Nubank - Survey charts-05.png
Nubank - Survey charts-04.png
Nubank - Survey charts-09.png
Nubank - Survey charts-10.png

Interview

I made an interview by calling that took 25 minutes, with a man, 23 years, graduated in business and who works with sales in a tech company. For this, I made a mediated interview with 11 questions, cause I needed to understand some points (value, experience and how kind of charts) and validated others came from the survey and assumptions (credit card, savings accounts and charts). 

Briefly, the customer talked about problems around no withdraws, transactions reports and transparency of the purchases (and division of it in categories). He said that he likes the lack of bureaucracy, good and fast humanize attendance, transparency of taxes and data. In addition, he spoke about prefer pie charts than other types and that is so important to the financial organization.

Assumptions

As I searched, I’ve got some assumptions. Some of them I already validated or not on beginning of desk research and others I needed the survey and interview to understand better them. Mainly the interview possibility me to have a lot of insights that I could cross over the validated assumptions.

 

Here are all of the assumptions that I had during the path (I highlighted in purple the validated ones) and some of them I noticed it wasn’t relevant after the surveys and interview:

 

  • Customers like visual parts to help;

  • People prefer to solve problems on internet banking;

  • The most part of the customers are men;

  • They prefer the saving accounts because is more stable and safer;

  • The main problem is around the credit card;

  • Taxes free are the biggest advantage;

  • Savings account is very used;

  • Charts help to stronger one of the values of Nubank (transparency);

  • Charts are important to comprehension of numbers;

  • Users prefer the line chart.

Problem Statement

Nubank, as a digital bank, needs to improve navigation through the app and internet banking with more interaction and even more transparency. Also, the new one fintechs on market are gaining customers faster, so differentials are essential on it.

Empathy Map

I gathered information about the users in the desk research, in surveys and in the interview, thus, I decided to create an empathy map before started the persona, cause I wanted to have established, briefly, what I got of the users. I put some quotes extracted from the survey and interview.

Nubank - Empathy map-01.png

In the end, I noticed that users are a little bit confused, frustrated, etc, about the navigation and visualization of contents. The transparency, that are proclaimed by Nubank so hard, is not so expressed in these part of the app, the same about the interests and made purchases.

Persona

Nubank - Persona-01.png

User Journey Map

The insights made forms and I wrote down here in opportunities, as well as I realized that is crucial and linked to the two values most expressed by Nubank: transparency and control of the user.

Nubank - User Journey map-01.png

GUT Matrix

Besides it, I felt the necessity to analyse the complete scenario and give priority to this dashboard, and because of it, I thought the GUT matrix the best choice (being through 1 to 5, to 1 less and to 5 high priority). 

 

I made a balance between the users' needs and the startup's business purposes, in the end, I compared it to what users spoke on interview and surveys too (and this group had more score than rest).

Nubank - GUT Matrix-01.png

Moodboard

Nubank - Moodboard-01.png

Style Guide

Nubank has a young, modern and joyful voice tone between the users, therefore the other mentioned values before. The visual identity has a predominance of purple colour that means for the startup: ''(...)unique colour, strong and with a huge personality.''

Nubank - Style Guide-01.png

Wireframe

The second sketch was chosen cause the role information was easier to understand, with less necessity to click a lot to open new tabs and was better divided based on similar categories.

20200901_160229.jpg
20200901_160238.jpg
Dasboard - 01.png
Dasboard - 2.png

Visual Design

I create the visual design on Figma too.

 

The improvement that I did:

  • Users wanted more transparency and it is a value widespread by Nubank, so I made as much as it was possible to show and synthesize so many information that needed to contain.

 

  • I put the details more showed and less clickable that I could, aligning it to the charts, to be easy to understand and to make decisions. This format was base on the existent in the app.

 

  • I did the dashboard page of the credit card because of what users said and what they most use in Nubank products, this was align to the results of GUT Matrix too.

01.png
Main page.
  • The line chart is not the most prefer on researches that I did, but it was the easiest one to comprehend and analyze this sort of data, which is something that is crucial to the financial organization, and also for some group of users, to help to invest what rest (or not) their money. A filter was put on this chart to establish a period of time.

  • The bar chart was also not mentioned, however, it was linear and most mensurable for data analysis.

  • Taxes were important to the transparency construction, too commented by users, thus I put a tab and charts to expose it.

3.png
Expenses tab.
  • The buttons to pay the invoice of the month were next to the credit card, as well as the bill to print if the user prefers to pay with cash. And the button to read more is to explain the invoice due date and its payment methods, etc.​​​

  • The possibility of generating a report and print was mentioned too, so every data report has this button.​​

  • Recent transactions area is destiny to recent purchase in a short period of time super detailed.

Prototype

For prototyping, I used Figma too.

 

If you want to test yourself click here.

Thank you :D

bottom of page