Budget App

Budgeting app helps people who are new to budgeting create a budget and think along with their budget as they spend.

App screen designs for the budget app.
iPhone showing a screen which reports on bookmarked spending categories.
iPhone showing a screen which presents the details of a transaction.
iPhone showing a screen which reports on the spending for each month in a year.
iPhone showing a screen in which the user selects from prebuilt categories for budgets.

Project Stats

  • Type Personal
  • Platform iOS
  • Status Proposed

Project Roles

  • User Researcher
  • UX Designer
  • UI Designer
Try Budget App
Design File for Budget App

Project Goal

Create a brand new budget mobile app to help people create and stick to a budget. The app will put all aspects of their budgets just a few taps away.

Target Audience

The primary audience is young adults and young professionals who have never used a budget before. The secondary audience is young adults who have tried budget apps but found them too complex.

Persona card for John who represents users who often start but quit using budget apps. Persona card for Lucy who represents users who like budget apps but want simpler offerings.

Research & Key Challenges

I used Google Docs questionnaires to remote interviews for a wide range of ages. While user journaling or diary studies aren’t as robust as other forms of research, it was the only way I could get the initial research done with my timeline and participants’ schedules.

The key challenges were to limit the features to just those features which will educate first-time budgeters about budget concepts. The participants said that the budget app they tried were too complex so I kept the feature set limited.

Competitive audit synopsis showing a preview of the spreadsheet with audit data. Interview transcript snippet showing some sample questions asked of John. Insight identification data distilled into meaningful directions. Preview of the U X research study.

Initial Design Concepts & Wireframes

First I drew many hand sketches to capture my initial design ideas, using the Crazy 8s method. The best ideas from my initial design concepts were translated into digital wireframes in Figma.

Crazy eight marker sketches for various screens. Digital wireframes created from the best concepts from the crazy eight ideations.

Usability Testing

Participants reviewed the digital wireframes and answered questions about navigation and asked further questions about budget concepts. Their feedback became usability testing data and recorded in a spreadsheet for each participants. The responses were transformed into affinity groups to find themes.

Usability issues and insights gathered from tester one during wireframe prototype use. Usability issues and insights gathered from tester two during wireframe prototype use.

Conclusion

The budget app design’s is neutral. I decided not to make it “fun” or “serious” because the apps tried by my participants fell into one or the other style and it didn’t help them. The app has a light and day mode which don’t conform to either “white” or “black” themes. I wanted the themes to be warm and approachable to offset the app’s neutrality.