custom-cover-arrow

Outta Pocket: An Educational Financial Management Platform

Background

What does accessible financial management mean? This was the prompt that my team and I sought to resolve for General Assembly’s 3 Day Hackathon. Financial management is something that all of us have to deal with at some point in our lives, but it’s a topic that has so many layers to it that can often be overwhelming and confusing for individuals, especially those new to the field. It's especially relevant today, with the sharp rise of numerous digital currencies like crypto currency.

This particular aspect about financial management is what inspired my team and I to eventually create our final product, Outta Pocket, a mobile first website application that acts as an educational hub for users of all levels to understand more about financial management and have a safe space to comment and ask their questions to the financial experts. Despite the short time frame to design and develop this application, I couldn't be more proud of what our team was able to create. 

Role

UX Designer | UX Researcher

Design Team

Daniel Park

Natalie Tallerico

Dona Das

Developer Team

C Forest Traylor

Christopher Moriarty

Kevin McMahon

Jared Goldstein

Timeline

February 2022 | 3 Day Hackathon

Methods and Approach

User Research, Affinity Mapping, Personas, Feature Prioritization, Wireframing, Usability Testing, Prototyping, Mockups, Developer Interaction/Handoff

The Problem (Hackathon Prompt)

Create an application to address "Accessible Money Management"

Kickoff Meeting: Understanding the Prompt

When our team of 3 designers and 4 developers met for our initial kickoff meeting, we automatically assumed that we would be creating some form of a budgeting application that would allow users to easily track their expenditures and budget accordingly. It seemed the most logical and simplest solution to answer the given prompt, especially given our short time frame to create the application. However, the design team and I wanted to at least validate these assumptions by interviewing individuals who are concerned about financial management, which ended up changing the whole direction of our product…

01) Research

What is Accessible Money Management? 

To discover what accesible money management really meant, we interviewed 3 individuals about their experiences of managing their finances and what accessible money management signifies to them. We then consolidated our findings into an affinity map to discover common trends and insights that existed amongst them.

Affinty-Map

Using these insights and trends, we then formulated “I Statements” to really empathize with our users and reflect their needs, desires, and pain points, about accessible financial management. It was at this point where we started to see how our original idea of a simple budgeting app may have not been the correct direction for our proposed product. 

I-statements

Instead of a simple budgeting app, our research showed that users instead wanted some sort of tool to help them understand what financial management is, and have resources to look at when they may not know what a certain financial management topic is. This would allow users to become more confident and empowered when presented with a critical financial decision. As a result, this new definition of "accessible money management" is what we took inspiration for the direction of our application. 

02) Define

User Persona: Francie

Using the findings found from our interviews and affinity mapping, as well as our "I Statements," my team and I created Francie, our persona who reflects individuals who want to be more empowered and knowledgable about their financial management decisions.

Francie-Revised

Francie needs an easy way to access a tool box of resources regarding managing her money, so that she can feel empowered and make knowledgable decisions in regarding to spending, investing, and saving. 

03) Ideate

The Solution: Outta Pocket

With the insights we gained from our user research, and keeping in mind the needs, goals, and frustrations of our persona Francie, our team created Outta Pocket, a mobile-first web application that provides users of all levels to be more aware, knowledgeable, and feel more empowered about their financial management. The application provides users:

01) A robust set of lessons and tools where they can choose from a wide variety of money mangement topics that are most relevant to them currently/they want to know more about. 

02) A safe space where users don't have to be afraid about being judged about their prior knowledge of financial management. Users are able to comment on each lesson to highlight what stood out to them.  

Francie's Task: What's Crypto All About? 

With our solution statement definited, our team designed a task flow for Francie to complete as she navigated through the app for the first time. In her scenario, Francie wants to know more about cryptocurrency, a very popular topic in today's financial world. This task flow also gave our developer team a greater idea on data structures and code that they would have to implement on the back-end of our application as well. 

Task-Flows@2x-1

04) Design

Creating Outta Pocket

My team and I collaborated together in Figma to design mid-fidelity wireframes that would apply and demonstrate our proposed solutions and flow for Francie's specific task. We made sure to pass of these screens to our developer team as soon as possible as well, in order to make sure that they understood the exact features necessary for the application. Below are some of the key screens that my team and I designed.  

Outta-Pocket-Lesson-Dashboard
Lesson-Page
Finance-Calculators

05) Prototype

High-Fidelity Mockup

Once we showed our developer team our designed wireframes and obtained their feedback, the design team and I began to add color, images, and even created a custom logo, to finally create a high-fidelity prototype of Outta Pocket. We also created a very simple design system for the developer team to use when they start working on the front-end of our product as well. 

Reflection

I'm so glad that I chose to participate in this hackathon, as it gave me so much valuable experience, especially in terms of what it means to work with a team of developers. It was awesome gettting to experience first hand how their work flow is like, and constantly communicate with them in order for our visions for Outta Pocket to be perfectly aligned. Despite the short timeframe of this project, I'm so proud of what our entire team was able to accomplish in such little time and I'm glad that, despite our inital assumptions, we were able to create a product that we best felt answered the prompt of "Accessible Money Management."

Next Steps

There were so many additonal features/design decisions that my team and I wanted to include in our product that we weren't able to include because of our strict time constraints. These include: 

  • Usability Tests on our Initial Prototype
  • Accesibility Options for senior citizens, less tech savvy people, etc. 
  • A "Recommended for You" Section to provide catered lessons to users
  • A mix of both video and written content to provide users a wider range of resources
  • Offering videos with options for different languages and/or with subtitles