Case Study — NvestN Mobile App

Rashan C.
Rashan C.
Jun 4, 2019 · 5 min read

A fintech app for a new generation of mobile inventors.

Image for post
Image for post
NvestN Mobile App

The Problem

Building wealth is complicated for many families of the current generation. Investing is at its lowest since 1995. Many families are underserved by banks and investment houses.

Objective

Create a mobile app that will allow users to interact with an automated investing platform that selects investments and invest money without the use of a financial advisor.

Challenges:

  • Mobile Application

Team:

  • Founder (Project Owner)

Define The Problem

How do we speak to different generations via a mobile device and talk to them using the similar cross-generational language.

This was just the first stage. More of an MVP to test theories.

Based on this theory the founder created a user flow for on-boarding, producing a profile and entry into the application.

Image for post
Image for post
Initial Flow

Based on this flow, my suggestions were:

  1. Landing Page not needed. The dashboard will have navigation and login will be dependent on if the user is a returning user or not.

Revised Flow

Image for post
Image for post
Revised Flow
  1. Removing the Landing Page removes a barrier for a user to sign up. Less screens require less interaction which means less mental load and as a result will move more quickly to the sign up screen

Personas

Armed with these flows we created first drafts of our idealized users.

Image for post
Image for post
Image for post
Image for post
Image for post
Image for post
Personas

We conducted meetings with both investors and investment bankers to review our personas and business theory. After these meetings we removed the persona of Marie Henri. It was decided that this personas would be covered by the other two, and this persona did not present much unique opportunities.

First Draft Wireframes

Wireframes started with the questionnaire process. This step sets the voice and tone of the application. As a potential barrier for a user to engaging with the app, we wanted to focus on this first to get it right. A lot of work went into language and options.

Rather than settling for a boring question and answer model we used a chat method for interactions. Because most people, despite demographics, are so familiar with chatting on their mobile devices this method went well during testing. But it didn’t wow anyone.

Image for post
Image for post
First Draft Wireframes
Image for post
Image for post
Questionnaire - Wireframes

First Draft Visuals

Initial user reactions were positive, but not fantastic. Users would go through the questionnaire process but they didn’t seem to have a amazing time doing it. Many younger people and seemed underwhelmed by the experience but they completed the flow. Users who’s second language was english had a good time with the language and did not seem to struggle too much.

With this knowledge we kept the language but iterated on the visuals.

To set our app apart and to give a wow factor I used iconography. These icons were to help visually reinforce the options available to the user.

Take a look at a working prototype for this first draft.

Image for post
Image for post
First Draft Visuals — View Prototype

In the first round of visuals we found that:

  1. Chat icons were repetitive therefore they were removed after the first interaction.
Image for post
Image for post
Second Draft Visuals

In the Second round of visual designs I switched the icons for emojis.

  • The emojis gave the app a current look and feel,

The prototype was tested with senior college students. Many of whom enjoyed the visuals. The older audience, we noticed during testing clicked on the emojis faster than they had with only text buttons.

Final Designs

With the questionnaire finalized we expanded to other parts of the app. Namely the walkthrough and portfolio breakdown sections.

As usual we started with wireframes.

Image for post
Image for post
Final Wireframes

Using the wireframes as a guide I created the following visuals.

The walkthrough uses illustrations to convey a sense playfulness to users, and allows them to skip this step and go directly to the app.

Image for post
Image for post
Walkthrough

Here we see a user accessing their portfolio breakdown and adding funds to their account. Once again we kept the emoji theme that became a branding element for this app.

Image for post
Image for post
Interaction Design

View my personal website for other work.

See more of my design work on Dribbble.

My profile is on Linkedin.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch

Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore

Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store