Chase app PFM
Feature case study

Interact with prototype

My Roles
UX Design & Research
UI Design

project Background

Chase, owned by JP Morgan, has put a lot of effort in the past providing the most relevant products for their customers. Now, they are looking to offer tools to help customers manage their money better. To do this, Chase is looking to create a new personal finance management tool to be integrated with the existing app.

This feature is aimed primarily at Millennials. According to research, their future is still being impacted by the Great Recession, affecting their attitude toward money and investing. Many worry they will not be able to save for a house, pay off student loan debt, or save for retirement. Chase sees this as a unique opportunity to help them with their many financial challenges.

Task and Mission

Discovery

Research Goals

Interviews

Participants
  • Gender
    - 2 males
    - 2 females
  • Race
    - All caucasian
  • Age
    - Three Millennials
    - One Gen X
  • Employment
    - All full-time employed
  • Marital Status
    - Three single
    - One married
Summary
  • Interviewees liked the idea of "setting it and forgetting it."
  • Managing finances should be as easy as possible.
  • Many liked the idea of being able to see all finances in one place, like a dashboard.
  • Frustration around a lack of control in some of the apps that are already on the market.

Define

Persona

I consulted my notes from the interviews and was able to develop the type of persona who would use the new savings goal feature in the Chase app. Based on my research and interviews it became clear that this group, the Millennials, needed help in saving money. Gabriel is based on the people I spoke to and the struggles they have with saving for the future. He was created to help bring that struggle to light and make the journey to saving money more relatable. Here, we really begin to get a sense of who Gabriel is.

Task Flow

There are three task flows : One for a user to create a new goal, another for modifying an existing goal, and finally one where the user could transfer funds once the goal was set up. A task flow demonstrates the beginning to end walk through the process with no deviations.
View the full task flow.

User Flow

Here is where I got to get into the head of Gabriel, my persona, and really look at what a real user might decide to do along the path to creating his goal. There are many decision points to consider, like is he creating a new goal or modifying one that already exists. He also needs to take into consideration how the goal will be funded. The user flow is like a task flow but takes decision points into consideration, which may take the user into other directions along the flow. View the full user flow.

Sketches

I used both my task flow and user flow to start sketching some low-fi wireframes. This sketch represents the creation of a new goal with a second step of editing the goal once it's created. Getting the ideas rapidly down on paper really helped to solidify the flow. I find this method the best way for getting ideas down quickly and being able to iterate on them just as quickly. View the full sketch.

Design

High Fidelity Prototype

Once I got the low-fi sketches to where I wanted them, I began creating the high-fidelity wireframe/prototype inside of Sketch. Here, is where the UI starts to come together and I was careful to stay within the parameters of the already established branding of the Chase app. I wanted to be sure I stuck to the original task of making sure the new tool embedded well and smoothly with the rest of the app.
Interact with the prototype.

usability Testing

Participants
  • 69 total test subjects
    - 4 in person (All female)
    - 65 remote, unmoderated
Test Objectives
  • Determine the ease at which users can navigate through the banking app to accomplish their task, which will be to set up a new goal and then edit that goal.
  • Observe how users searched for and found the feature.
  • Observe the path in which they took to get to the goal setup screen.
  • Test the overall ease of use of navigating through the feature.
  • Observe any frustrations or obstacles users may have that may impede their ability to complete their task.
Test Summary
  • In Person Testing
    - Users had very little trouble completing the task asked of them.

    - Difficulty on the Funding screen.

    - Issues with some CTAs.

    - High marks for ease of use.
  • Unmoderated Remote Testing
    - 52% had no trouble completing the task.
    - 31% used an alternate route
    - 48% gave up
    - Many had issues with the Funding screen and either clicked around the screen a lot or outright gave up and did not complete the task.

Affinity Map

From the affinity map I was able to pin point a couple of distinct patterns. There were some users who had difficulty with a few of the elements on the Edit Goal screen. There was also clearly some confusion around the Funding Screen and the fact that the Continue button seemed grayed out to people. Between the patterns that emerged and users' suggestions, I was able to prioritize which changes I needed to make. In this case, making sure the Funding screen can be more easily understood takes priority because that page was impeding people from moving forward. View the affinity map.

Priority Revisions

I determined that most of the suggestions for change that came from users and the patterns found in the affinity map were simple enough to implement. Had there been a significant amount of changes that needed to take place, I would have used a priority matrix to pin point exactly which changes were low effort/high impact and implement them.

Next Case Study:
Build-a-meal
See Next Case Study

Like What you see? Then hire me!

Whether it's a UX or LX project I have the breadth and depth of experience to bring it to life. Hire me for contract, freelance, or full time hire. Let's work together on YOUR next project!