top of page

Expense Calculator

Developing a tool that allows customers to more easily visualize their expenses and seamlessly create a budget

COMPANY

Simple Online Banking

​

MY PROJECT ROLE

Concept Developer & UX Lead

​

TIMELINE

Jan 2018 - May 2018

​

003-MacBook-Space-Gray.png

OVERVIEW

Project Background

During my time with Simple Online Banking, I was on the product design team working to build and ship web and mobile products, visuals, and interactions. I worked in a tech start-up style environment as part of a six-person design team working closely with engineers. One of my projects included leading the design and exploration of an expense calculator concept.

OVERVIEW

My Role as Project Design Lead 

This product started initially as an idea that I presented at an ideation meeting. Two lead developers liked my concept proposal and volunteered to engineer the tool if I designed it. For this project I was responsible for strategizing product functions and interactions, designing the UI, and working alongside developers in the engineering process. I presented the product alongside my two-person engineering team at a company-wide event in front of close to 200 of Simple's employees, including the CEO. 

OVERVIEW

Defining The Problem

The Simple Expense Calculator began as a new product idea that I presented at a think session inspired by my own (and many of my young peers) struggles with visualizing expenses. Young adulthood can be an exciting experience for those living independently for the first time, but many struggle with financial decision making, saving, and budgeting on their own.  

 

About a third of young adults (32%) are considered “financially precarious,” meaning they have few money management skills and little income stability, according to a University of Illinois study. Another 36% are considered financially “at risk” because they have had an unexpected drop in income within the year and had no savings to support themselves. These numbers made me question what Simple can offer to relieve some of this stress by promoting budgeting and saving in a more intuitive way as well as engaging a younger market. 

OVERVIEW

User Challenges

CCHMC cards-40.png

01

Lack of financial education and experience can make it hard for young adults to apply an effective budget.

CCHMC cards-41.png

02

Difficulty visualizing how frivolous spending can affect a budget and long-term savings stability.

CCHMC cards-42.png

03

Fear of making poor financial decisions that could cause a negative effect in the future.

OVERVIEW

Goals

CCHMC cards-43.png

01

Help users to better visualize how expenses will affect their overall income so they can make wise budgets.

CONCEPT DEVELOPMENT

Ideation Process

​

CCHMC cards-44.png

02

Help users to confidently create finance goals with fewer interactions than the current goal setting process. 

CCHMC cards-45.png

03

Encourage wise financial decision making by prompting users to put leftover money into savings.

IMG_3737_edited.jpg

CONCEPT DEVELOPMENT

Personas

design

CONCEPT DEVELOPMENT

Product Demo

The expense calculator concept allows users to create a budget by entering their monthly or bi-monthly income and detailing each of their expenses. This finance tools helps users to visualize how much of their income is used by their expenses and plan a budget.  Particularly helpful for new customers, it allows them to confidently enter new goals into the Simple app all at once and then prompts them to put leftover money into savings. 

CONCEPT DEVELOPMENT

Visualizing Expenses

Fig. 1

Fig. 2

Untitled-12-02.jpg
Untitled-12-03.jpg

Fig. 1 - This finance tool allows banking customers to better see the impact their expenses have on their income and easily change amounts to create a balanced budget. The percentage of income used for each expense is automatically calculated. 

​

Fig. 2 - The progress bar allows users to visualize how much of their total income is used by their expenses and how much will be leftover. After establishing a budget, the tool then prompts them to turn these budget items into expense goals.  

CONCEPT DEVELOPMENT

Encouraging Saving

Untitled-12-01.jpg

The progress bar allows users to visualize how much of their total income is used by their expenses and how much will be leftover. After establishing a budget, the tool then prompts them to turn these budget items into expense goals.  

My Role and Responsibilities

  • Led development and expansion of the product concept

  • Conducted research to better understand the challenges users face

  • Independently designed the UX and UI of the product within Simple's design styles 

  • Packaged designs and elements for project developers 

  • Presented final product to CEO at a company-wide event

Key Learnings and Reflection

One of the biggest impacts this project had on my product design process was learning how to successfully communicate with the in-house developers. Having a number of rounds of collaborative design and development with time for feedback from each side went a long way in speeding up the process from concept to deliverable. This experience helped me to prioritize including developer perspective throughout my iterative design approach rather than just the end of the process.

PORTFOLIO

NEXT / 1-2-3 Device Redesign

bottom of page