Incom ist die Kommunikations-Plattform der Fachhochschule Potsdam

In seiner Funktionalität auf die Lehre in gestalterischen Studiengängen zugeschnitten... Schnittstelle für die moderne Lehre

Incom ist die Kommunikations-Plattform der Fachhochschule Potsdam mehr erfahren

YOCO – Your personal financial coach

Introducing YOCO – a financial app with the goal of coaching and helping you be better with your finances and investments.

1. Course description

During the course Crafting User Interfaces with Christian Hertlein (Head of Design at N26), we had a look at how to translate complex topics into useful interfaces of different roles and functions.

In order to create a functional and appealing visual interface, we had to take our user's needs into consideration, use design processes and research.

A total of 4 small tasks and one main task – which were solved in small groups – wave been completed during this course. These tasks touched the subjects of sharing, trust and money, which we explored through several methods to prepare us for the final (main) task.

2. Final task description

For our final (main) task, we were dealing with the aspect of money in a digital world with the key topics of: Trust and Financial Literacy.

We weren't tasked with only designing a solution that had to deal with money but also think about an interface that builds trust with the user and support the user in becoming more financially literate. (It was not obligatory to take both aspects into consideration at the same time but we did want to take on the challenge.)

3. First Steps

In order to create our solution we had to do some extensive desk research, find out what we wanted to create, find a fitting target group and write a scenario and persona.

3.1. Research

For our research we had to understand: what is trust, how do banks build trust and what is financial literacy.

We checked different online banks as well as several insurances Apps in order to find patterns, see which designs were working and which could be done differently or better. In summary, we found quite a few papers on financial literacy and bank trust, as well as websites about these topics.

3.2. Ideation

After doing our research we decided to have a brainstorming-session in which we filtered it down to these ideas:

  • App to connect different banks
  • Investor App ( for example investing in a startup)
  • Business Starter App ( for those ones starting their businesses)
  • Simple „Financial Education“ App (for students)
  • Game App for Financial Literacy

At the end we decided on the following:

  • A Banking App with Focus on Human Aspect – Bringing back the Human aspect through the App

wall_financial-literacy.jpgwall_financial-literacy.jpg
wall_trust.jpgwall_trust.jpg

3.3. Subject and Idea

We decided to concentrate our efforts on the „human“ aspect for this final task. It was important for us to design a solution that could feel more human and more personal, since online banking evolved itself to be a rather impersonal experience where no real human interaction exists anymore. What will happen in the near future once traditional bank branches are no more? If we want people to be more financial literate wouldn’t it be great if you had a coach for yourself? We are social beings so, why not bring an online-based platform that would help you with your finances? And most importantly, can we build trust in an App through human interaction when dealing with a serious topic like money?

3.4. Target Group

After doing our research and having our idea we decided to set our target group in young millennials (people between 20 and 30). This decision was based on the fact that we had read several papers and other sources explaining how and why millennials lack sufficient financial literacy skills and have little concern in planning out their own future. We found this quite fitting to build upon and decided to stick with it.

3.5. Persona and Scenario

After having our main subject and a goal to reach the next step was to create several Personas. Because of the sheer complexity of our undertaking and time constraints we came to the conclusion to stick with just one persona, whose name is Roberto, and create a scenario to help us design our solution.

Roberto_28.jpegRoberto_28.jpeg

3.5.1. Roberto

Roberto, 28 Berlin Studies and works additionally as a Freelancer He is on his last year of his Master in Design

Social environment / Backstory

  • He has two siblings and is the oldest.
  • He is from Spain and has experienced the problematic financial situation there.
  • As a result, the parents had financial problems.
  • Has a girlfriend and lives in a shared flat in Kreuzberg with some friends
  • He gets some contracts as a freelancer but usually works as a barista
  • He is a digital native but has nostalgia on an analog lifestyle
  • He believes he has a good overview of his own finances

Motivations (why does this Persona need our product / service?)

  • He wants to be personally advised on his finances.
  • He does not want to be too dependent on a service
  • He realizes that, because of his lifestyle, he spends far too much money
  • He wants to have a better overview of his finances and how he can improve it
  • He wants to save further for his future

Personality

Existential Fears / Positive / Hard-working / Outgoing

Frustrations

  • Does not trust traditional banks, due to the financial crisis in Spain
  • He's afraid of not making the right decisions
  • He does not understand the bank system very well and finds it way too complicated
  • He is always stressed out when writing bills and the tax declaration

Ideal experiences / goals / aspirations / feelings

  • He wants to have a product/service that gives him security about his finances
  • He finally wants to trust a financial institution again
  • He wants to have a personal advisor who understands his wishes and needs
  • He wants to plan his expenses better
  • He wants to choose his advisor but does not want to go to a branch
  • He wants to have control over his finances and the product that he is using.

3.5.2. Roberto's Scenario

It is the beginning of the month and Roberto has a notification from his App telling him that his overview has been analyzed. He is now able to make an appointment with his personal consultant to talk about future plans.

He opens the App

On the landing page, he finds the overview of his finances and he decides – before checking on investments plans – that he would like to have a look at his monthly balance. It's his first month using the app and he wants to contact his consultant to open a new plan to invest his money for his future.

In the App he then decides to select his personal consultant who will help him. He chooses „Amanda“ and makes an appointment for today (4.July) 4pm (since she is unavailable at the moment).

He then goes and takes a break before talking with his new consultant. At 4pm his telephone rings. Amanda is calling Roberto, he then answers it, connects to a video-call and meets Amanda. They have a nice conversation in which Amanda explains him about his options. She proposes him to think about them and talk again next week. She informs him, that she will send him the documents through the chat so he can read them again in his free time.

They finish the call

After that, Roberto sees that Amanda has also sent him a tip that could help him with his finances.

He opens and reads it

Knowing that he has an appointment with her for next week he goes back to the apps main menu. Feeling more calm, thinking that he has achieved the next step in securing his future financially, he finally closes the app and puts his phone away.

4. First Hypothesis

Financial Consultants that can be contacted through a video call and are chosen by the user can provide more trust in a financial app.

4.1. Idea Definition

As already mentioned, our concept was to emphasize the human aspect of banking for the customer. When opening a new bank account they will be assigned a personal contact, which is tailored to their own wishes and needs. The interface adapts accordingly.

Trust should be built primarily through personal interactions with the consultant; e.g. through simple video calls and a chat. The advisor should also be available at all times and for all concerns in order to give the customer the feeling of being in good hands.

Financial Education is activated by personalized push notification (which appear at preset intervals). These then lead to the app, which further information on inputs, expenses and further assistance to better manage their own money.

4.2. Survey

After defining our initial hypothesis we decided to conduct a survey to understand more what people think about their financial situations. We created the survey (in English and in German) asking questions such as whether one is a customer of an online or a traditional bank, how they think about their financial situation or if they want to choose their own personal financial consultant.

Since we wanted as many results as possible we've sent the survey through incom, email and facebook.

survey1 english.jpgsurvey1 english.jpg

4.3. Survey Results

Out of over 65 entries, we received the following results:

  • 75% are costumers of an online bank (and trust it)
  • 73% are costumers of a traditional bank
  • 42% go from time to time to their bank branch
  • 63% are happy with their financial situation
  • 58% think that they have a good overview of their finances
  • (but) 58% would like to have help in their finances and 30% are not sure if they need help
  • 84% would like to choose their consultant
  • 66% say that they have „medium“ financial literacy
  • 75% want a product with tips
  • 81% want to track their own finances

And the most important for our first hypothesis:

  • Most (56%) of the people that answer our survey would prefer to meet their consultant in person.
  • 4% wanted to have the video call
  • 16% did not want to contact a consultant
  • 20% prefered having a normal telephone call with they consultant
  • 4% prefered to be able to chat with their consultant

With these results, our first hypothesis was mainly proven wrong

CUI - Umfrage.pngCUI - Umfrage.png
IMG_20180613_111540.jpgIMG_20180613_111540.jpg

5. Second Hypothesis

Financial Consultants that can be contacted through Augmented Reality can provide more trust in a financial App.

5.1. Idea Definition

Since we interpreted our results as such that many don't normally want to go to branches but still prefer to interact with their consultant in person, we thought of creating a product in which the user can do exactly that – from the comfort of their home.

Therefore we thought that interactions based on augmented reality with a financial consultant in a financial app would be very fitting in also possibly creating more trust with the users.

In short – we were trying to create a product that could be implemented in the near future.

We still wanted to test the video call, even though many disliked it since – in online banking – it is mostly associated with the annoying process of identifying you online through a webcam. It was still important for us to find out if it could be a viable method of interacting or not. Therefor, does our target group prefer to interact with their financial consultant over the app through augmented reality calls (AR-calls) or do they prefer doing so through video calls? Furthermore, where do they feel more trust?

5.2. User test

Based on our new hypothesis we wanted to test how users interact with their consultant through an AR-call or/and a video call. For the user test we prepared the following beforehand:

  • Create a dialogue in which the coach would advise the user
  • Organize and prepare a room in which we could do our user test
  • Organize our equipment
  • Get drinks and snacks for the testers
  • Create a quick App Prototype
  • Prepare a survey that each participant should fill out after the test

During the user test we had two scenarios:

  1. The person would check the monthly balance, making an appointment with the consultant and making an AR-call and then a video-call.
  2. The person would check the monthly balance, making an appointment with the consultant and making a video call and then an AR-Call.

These were the equipment we used for the test:

  • iPad was used for a survey after the user finished the test
  • Nexus 6P was used as the device for the click prototype
  • Nikon D5200 filmed the whole experience
  • Video projector connected to a Laptop projected some effects onto the consultant to simulate an AR-Call

WhatsApp Image 2018-06-20 at 19.54.06.jpegWhatsApp Image 2018-06-20 at 19.54.06.jpeg
IMG_20180618_152551.jpgIMG_20180618_152551.jpg
vlcsnap-00006.jpgvlcsnap-00006.jpg
vlcsnap-00005.jpgvlcsnap-00005.jpg
vlcsnap-00004.jpgvlcsnap-00004.jpg
IMG_20180711_122956+.jpgIMG_20180711_122956+.jpg

5.3. User test results

During the test, which was made in one day, we had a total of 8 participants and this where the results:

  • 50% of the testers prefered interacting with the coach through an AR-call
  • 38% preferred the video call
  • 12% liked both
  • 88% would trust the coach whether it was through an AR-call or video call
  • 12% found they could trust their coach better through video-call
  • 75% found the feature of contacting their personal consultant useful in a banking/financing app.

6. Detour: Augmented Reality

Because of our new survey results, we saw that our second hypothesis was more or less right: users do trust their coach through and AR medium.

We, therefore, decided to create an augmented reality solution of our product and conducted some additional research on this. We tried designing some mockups of how the AR interface could look like and thought up a scenario playing in a not to distant future. This resulted in giving us some problems, though.

There wasn't enough time to do a more thorough investigation about this subject matter that we didn’t feel comfortable continuing with our current results. The scenario was to vague, the evolution of future technology not well thought out and the implementations of the mockup therefor not sufficient for a realistic story.

In the end, we decided to pivot back to a more traditional screen design solution and concentrate on making the interaction with the coach as realistic and enjoyable as possible. By no means did we scrap the idea of using AR-calls as a possible method of communication, though. AR was going to be an option for the user to communicate with but didn’t play a major role in our idea anymore.

7. Final idea

We realized during the past weeks that people prefer to have personal contact with their coach, want to be better at finances but are not really sure in what they would like to invest in. Another observation we made was that out initial survey told us that video calls with a coach were not very popular as a way of communication; Though, during our user test there were little differences of preference when it came to interacting with the coach “next to you” (through AR) or through a video call. What we could observe from this was that it was important to give the user options in how to decide in which form they would like to contact their coach. Knowing this, we could keep our key concept – we worked on during the entire project – of the human aspect and add an additional aspect of free decision making.

Since many are unsure about what they need, we decided to create an App that could help them improve their understanding of their own finances and start having a look into investments. This is especially relevant for students, who currently don’t have the basis to invest high amounts of money, but will likely earn a lot in the future and can therefore benefit from an existing basis of knowledge in this area. Trust would be built in time and through their freedom they would have in choosing not only their personal coach but also the form in which they would feel more comfortable contacting him or her.

Trust and the human aspect should not only be translated in an interface which will give you the possibility to make free decisions but also by giving the app an emotional look and feel through the visualization of its content – using warm colors and presenting a relaxed feeling reinforced through proper imagery and iconography.

7.1. Meet Yoco

YOCO is a financial app that supports and advises you to easily invest. We are an independent service with the goal to improve your financial education so that you have full control over your finances.

The main function of the app is to provide you with a personal consultant, a coach, whom you choose for yourself. Basic functions such as displaying your own monthly balance and giving you tips (from your coach) to improve your own finances are included. You can then contact your coach at any time as needed, through the medium where you feel most comfortable from: video call, voice call or chat. He or she will guide you through the process of choosing a suitable investment plan to make sure it's right for you so that you can achieve your goals.

7.2. Implementation & Design

To understand best how our persona Roberto would use out app YOCO we've created a user flow diagram. With this we could understand which functionalities were essential and needed to work perfectly and which wer nice to haves.

Yoco-user-flow_bgr.pngYoco-user-flow_bgr.png

Additionally, we've created an application structure to make sure our app makes sense and is plausible. Since it's overlying main feature was to have the ability to choose and contact ones personal coach from (mostly) every screen in the app our application structure has gotten a bit complex. Especially several conditional states were important to figure out quite early in the design process to not forget which screens had to be created.

YOCO-Application-Structure_bgr.pngYOCO-Application-Structure_bgr.png

Finally, we've created our screens implementing mainly warm colors giving it a more inviting and cozy look and feel. The user shouldn't feel stressed or nervous when using the interface. We've also limited the use of imagery only for the home screen – where the user is greeted also with a different background image depended on the time of day – and the profile picture of the coach. The iconography was chosen to be rounded and lined without having surface colours. Also, wording was set in a way that the user is always referred to personally, e.g. “Good morning Roberto”, “You have an appointment with …”, “Your available money this month …”.

YOCO-screens-all.pngYOCO-screens-all.png

7.3. Click prototype

to-figma-button.pngto-figma-button.png

To view and test out our click prototype we've created with Figma click here.

8. Conclusion & Learnings

Right from the beginning it was quite difficult to find the right way to work with complex topics such as trust and financial education. The long and extensive desk research made it more clear in understanding what the problems were but also made it more difficult to find a fitting and viable solution we wanted to work on. To narrow the sheer amount of information we've collected over the past days, we found it very important to develop hypothesis' from our findings to test and iterate upon – via surveys, quick prototypes and mockups, and user tests.

Don't be afraid to pivot. We felt very determined to create something totally futuristic and innovative with our AR-concept but realized it being an unrealistic task to undergo in our small time frame. By testing communicating with the coach through AR and video call we came to the conclusion that the user was more interested in having the ability to choose how to communicate, which subsequently led us to rethink our main idea a bit.

In conclusion we felt that we've learned a lot from this course. Especially the great feedback from Christian made us realize how important it is to look at every detail – such as assuring consistency in language, colors, imagery, etc. – and never forget about the entire picture (which might change during your research) as a whole. We felt very happy working together in our group and are pleased with how far we've managed to get with our final result.

V&D.jpgV&D.jpg