branding and app

Budgeting is one of the most useful skills we can learn, but it can be intimidating to take the first steps into getting set up. I designed a streamlined budget app to accompany a three-week course on finances. While there are countless budgeting apps, we focused the app on a single goal: empowering people to move from a monthly deficit to a surplus.

The course is part of a larger series of classes and resources called Equip. Beginning with an academic style and bringing in bold colors and geometric shapes, the branding had already been applied to elements like books, slides, and physical signage. The app then is just another step in an evolving design system.

Starting Out Slow

As the first steps to a budget can be filled with shame and confusion, we stripped down the process to be as basic as possible. We worked to keep the language clear and the process quick.

Users enter their income and expenses, and immediately get to see a breakdown of where their money goes.

Working Towards A Goal

There are two primary ways the course and app teach people to work through their budget: prioritizing and adjusting expenses. As users drag and drop to set priorities, we overlay a line labeling the breakeven mark. Items can be dragged out of the red, but it will also cause others to slip down below the line. It’s a simple way of creating a visual understanding of the concept. Users can also adjust amounts on sliders for each budget item to see visualize how that affects the overall budget.

The two basic user input strategies give tangible form to often abstract tasks. These allow for different learning styles to easily learn the basics of budgeting.