The Challenge

When I decided to start tracking my spending and financial goals, I struggled to find a solution that had the customization, automation, and goal setting functionality I was looking for.

As I expect many designers do in this scenario, I found myself brainstorming a better solution. I wanted to design an app that would provide a customizable budget, connection to a community, and tracking for savings goals all in one place. I researched financial apps for my own use and for this project by testing mobile and web-based budgeting apps, and explored the options for a spreadsheet-based system. Spreadsheets had the customization I needed but without the automation, and existing apps on the market had the opposite problem: automation by syncing banks and credit cards, but not a lot of flexibility for spending categories. Plus, many of the apps focused on spending, rather than long-term investing and saving goals.

The Solution

The app primarily needed to be customizable, plus include the option to set and track financial goals. I also noticed that fitness apps use community support to keep their audience motivated, and I wanted to include the same functionality in this app as well. Since financial information is sensitive, the user would be able to dictate how much information they shared, and with whom (the default settings would set everything to private). If the user didn't want to share information around financial goals or achievements, they could still engage with the community by sharing tips and advice for getting out of debt, saving for a big purchase, couponing, and more.

The app would also have the option to invite partners or roommates to specific goals and budgets, making it easier to track shared expenses, credit cards, purchases, and goals.

UX Design

To start, I created wireframes for the user experience and user flow of the mobile app. The app has three main interfaces: the profile, budgets, and settings, which are easily accessible via the persistent navigation bar at the bottom of every screen.

Each user has a profile that they can fill out as much or as little as they would like, and can follow other users to share goals and get financial tips. The user can also access their budgets from within the profile view.

The budget interface is where the user will spend the most time while using Foundry. Because this app is designed to be used on the go, the categories and summaries needed to be easy to understand with a glance. The clean layout, large buttons, and clear icons make it easy for the user to quickly track their spending and see how much money they have remaining in each budget category. Swiping left or right navigates between each category, with the selected budget displayed prominently at the top of the page. The action buttons, such as the help button, Adjust Budget, and Add Expense, are prominently located near the bottom of the screen, so the user can access them with a quick thumb tap while holding their device with one hand.

In settings, the user can control their preferences for privacy, notifications, and more.

Visual Design

The visual design focused on a clean user interface with large visuals. Since budgeting can be an intimidating or time-consuming undertaking, I focused on a simple layout and straightforward options in each screen. The user can use the app in a way that meets their needs, whether as a simple ledger or a more robust budgeting and goal-setting tool.

The primary color, a bold green, is associated with currency, financial health, and growth. The logo—a wrench designed to look like the letter F in Foundry—is a nod to the app as a tool within the user's toolkit toward financial independence.

Summary

This project was a really great chance to think through the UI for a mobile app that would be used on the go. Because of the customization and limitless number of budget categories, it was a good practice in designing an app that had the ability to scale with the user's needs, while working within the constraints of a small device's screen.