Live vs. loan is a mobile app that explores how gamifying loan debt management can motivate users and encourage learning around finances. This case study was an independent capstone project in my Designlab UX Academy curriculum in March, 2017.

Introduction

Problem

This project was identified based on my own personal experience with managing and tracking student loan debt, and is a nationally pervasive problem:

  • 44 million Americans have student loan debt
  • 70% of students graduate with student loans
  • National debt totals to $1.3 trillion; for borrowers between the ages of 20 and 30, the average monthly student loan payment is $351
  • Student loan debt impacts a person’s long term financial plans, the pursual of personal interests, their family planning goals, and other major personal and professional life decisions and purchases
HYPOTHESIS

I began exploring opportunities to design a product that could potentially alleviate frustrations and reduce loan amount or shorten payoff timelines for borrowers, grounded in the following hypothesis:

If Americans with student loan debt are more informed about their financial options and more motivated to proactively manage their debt, then they will be empowered to lessen or pay off debt more quickly leading to faster financial freedom.

Final solution allows users to manage all of their loans on a unified dashboard and interact with loan repayment on a gamified interface.

My Role

Project ManageR

Project brief / timeline
Research plan
UX strategy blueprint

User Research

Literature review
Competitive analysis
In-person interviews
Usability testing

UX Strategy

Personas
IA / Application map
Sketching
Wireframes
Prototyping & iteration

PRODUCT DESIGN

Feature analysis
Design from inception to final interface
Branding
UI and IxD

Discovery: UX Research

Jumping into the research phase of the project I was faced with my first challenge: I wrote an interview guide and presented my work to a group critique to receive feedback, quickly realizing that without more focus on uncovering deeper user motivations and behaviors, I could be wasting time gathering less critical information.

I needed to take a step back and really dig into a few questions: what was the user problem I was trying to solve around student loan debt? What deeper motivations underpin a person's feelings and behaviors around this topic?

What deeper motivations underpin a person's behaviors?

I gained more focus by conducting a 5 Why's analysis and creating a research plan that explored core user motivations. I began with an audit of current financial management applications, reviewing finance app screenshots, and finally conducting 1:1 user interviews.
Research Goals:

Quotes from 1:1 Interviews

I can’t do anything crazy [in life], I don’t have that freedom. Like if I wanted to try and start a business, I don’t feel compelled to go for it if I have this loan.
I wish they offered personal guidance... someone to say, “Did you know there were these other options you could be doing?,” or “You’re on the right track.”
[Lessening my debt] was a sloooww drip...Now that I’m really getting down, I’m REALLY motivated. I want this done and over with.
It went from a value that seemed out of reach, like 70K, or even 100K...and when it hit 50K, when it got down there, it felt like I could actually pay this off. When I threw that one chunk of money at it, and so much went away, it felt so great.

Key Research Takeaways

Interviews • Competitive analysis • Lit review

Identified Opportunities:

Ideation

Personas and User Flows
I captured user frustrations, and motivations in the development of a persona, which I referred back to through out the remaining design process to stay grounded in the user’s needs, mental models, and lifestyle habits.

Next I wanted to visualize how a user might move through different processes within the app to accomplish specific goals. For example, I sketched out different flows that a user could take to add their loan info or link their loan service provider within the application. Different bottom navigation sketches helped me visualize how a user might explore the app's features.

How might a user accomplish this specific task?

Finally, I synthesized my research notes to brainstorm and prioritize application features, sketch out an application map, and begin my first round of wireframing.

Application Map

Wireframes

Based on my user flow sketches and application map I created wireframes in Adobe Illustrator.
Iteration
I made multiple design iterations after reviews with a mentor and design group critiques. For example, multiple design directions were sketched out for the Accounts menu, as well as the home screen Progress tab, and the bottom navigation bar.

Usability Testing

In order to validate my design ideas, I created a wireframed protoype in InVision. I specifically wanted to test my assumptions about the onboarding process and loan sync user flow.

Testing assumptions


Some of the primary takeaways from testing were the successful completion of all tasks including the loan syncing feature, and small adjustments to visual elements, which informed my next wireframe iterations.

I also decided that further testing was needed on the “Friends” feature to determine if this social accountability element were appropriate and/or motivating in the context of loan debt management.

Interaction and Interface Design

GamifiED INTERFACE

The decision to gamify the LVL App became pretty clear after feedback from user’s showed there was a significant lack in motivation to proactively payoff and learn more about student loan debt management options.

Feelings of frustration, embarrassment, shame, guilt, and apathy surrounding student loan debt pointed to a unique opportunity to reframe the debt problem and created a challenge of designing an app that was not only useful but engaging and fun.

A unique opportunity to reframe the debt problem


Gamified elements within the app design include:

Interaction Design
  • Rapid, frequent, and clear feedback, such as the constant display and movement on user’s progress bar
  • Game-like elements of uncertainty are incorporated, such as bonus challenges and surprises within the app
  • The ability to connect with friends expands the goals and motivation of users to their social circles--whether for accountability purposes or for those motivated by friendly competition

UI Kit and Branding

After a brainstorm regarding my vision for the LVL brand, I arrived at some key words:

RELIABLE, TRUSTED, SAFE, CHEEKY, FUN

Grounded by these brand assets, I created a mood board, sketched logo designs, and created a visual style guide.

Style Guide

The visual style of the product aims to make managing student loan debt less “crippling” (a word used by a real user) and significantly more pleasant:

Final Designs

Takeaways

In addition to this project being a great learning experience, I also had a lot of fun with the topic, considering it started from my own personal frustrations with student loan debt.

As mentioned previously, one challenge I had early in the process was developing a clear focus around what the problem was that I was attempting to solve. Had I started my research before clearly outlining the problem space and setting clear research goals, I could have been finding solutions to the wrong problem.

In the end, it was clear that the problem was more than simply paying off loan bills, but a deeper connection to motivation (or lack thereof), despite loan bills being highly connected to users accomplishing other life goals. This focus informed my research goals and interview questions, which impacted the rest of my project priorities and product features.

In hindsight it was also clear how important communication was as I regularly engaged in constant loops of design, feedback, and iteration. Check-ins with my mentor and group critique sessions helped me take a step back, hear from diverse perspectives, and improve on my designs.