The Balance Budgeting Calculator
Helping People Take Control of Their Budget
Designing a monthly budgeting calculator that helps readers of The Balance better understand their personal finances.
Checking Out The Competition
To kick things off, I ran a competitive analysis to see how other companies were approaching the layout and functionality of a budgeting calculator.
Competitors
Smartasset, Quicken, Bankrate, Mint
Trends
Expense Categorization
Pie chart visualization
Remaining income after expenses
Areas for Improvement
No categorical breakdowns for expenses
Long lists of expenses that are difficult to read or short list that lack context and explanation
Lack of actionability
Organizing Expenses to Maximize Space
As I worked with the editorial team to determine all of the necessary expense types and categories, we saw the number of inputs quickly grow into a very lengthy list. We could have
My solution, to what was a potentially overwhelming user experience, was to categorize all of the expense inputs into seven color coded expandable drawers. This reduced scrolling and helped users establish a visual connection between the expenses and pie chart.
Informative Data Visualization
My aim for this data visualization was to communicate to the user exactly how their expenses are spread out, and possibly become aware of areas they were spending much more than they realize. To accomplish this I included:
Automatically updating pie chart, to reduce ussr tapping/clicking.
Category percentage breakdown, so users have an additional cue to compare their expenses.
A thing at the bottom which shows how much remaining cash you have after your expenses are paid
Lastly, I chose to layout the numbers in the way you might see on a receipt. I felt the familiar pattern made it easy to understand where the totals were coming from.
Adding Some Actionability
A final piece to hammer home the state of the users budget was a status message that updated based on their remaining monthly fund. If the users remaining money, after inputing their expenses, was positive they would receive a message of encouragement to keep up their budgeting habits. If it was negative then they would
Testing the Hypothesis
After collaborating with our engineers, we were able to release the budgeting calculator live on The Balance. Following its release I ran a series of user tests to determine whether my design decisions encouraged a positive experience with little to no friction. In these test I asked participants to interact with the calculator as if they were using it for themselves, and then answer a series of questions to gauge their experience.
When asked if there was any point where they felt confused or unsure what to do next, while using the calculator, some responses were:
“Honestly I can’t think of anything, because it was so easy to use.”
“I felt that it was very intuitive. I love the colors, and that they tell me exactly how much I’m spending.“
“I thought that it was extremely easy to use, and at no point did I feel confused or that i didn’t know what to do.“
This positive sentiment was shared by all participants who took part in the testing. Out of all of the mobile and desktop users, there was no one who felt as though the drawers or data visualizations were confusing. This was also evident in the screen recordings, in which no user had any hesitation in their interactions.
Actionable Insights
Some users questioned what some of the categories meant, and were not aware of/ did not see the tooltip icons for the categories in question.
The use of bright contrasting color was well received and enabled the users to have a better understanding of specifically where their take-home pay is being spent.
Multiple users mentioned the expense of property taxes (which was not included in the calculator), while they were inputing their other home expenses.
Next Steps
Add property taxes as an option under the housing category.
Property taxes is a major expense to overlook when setting a budget.
Make tool tip icons more visible.
Multiple users missed out on using tooltips while interacting with the calculator. They had specifically asked for a feature that was identical to the tool tips, but they were unable to notice them.
Incorporate more helpful links and general budgeting recommendations.
