isral Duke | Designer Budget App |

App screen designs for the budget app.

Budget App Details

Two phone screens, one with the budget categories, the other with budget category spend limits.
Two phone screens, one showing the home screen and a high spend category, and the other showing a detail of a transaction.

Budget app which helps first-time budgeters easily learn how to think in terms of a budget.

Try Budget App yourself

Project Role & Goal

During the budget starter app project I was the User Researcher and the UX Designer. It’s a mobile application to teach time first-time budgeters about creating and sticking to a budget. It is not a financial management application such as Quicken or Mint. Its scope is purposely limited in features.

Target Audience

The primary audience is young adults and young professionals. These users have never used a budget before and want to easily learn how to apply budget concepts.

Persona for John, one of the imaginary users to guide design decisions. Persona for Lucy, one of the imaginary users to guide design decisions.

Key Challenges

The key challenges were to limit the features to just those features which will educate first-time budgeters about budget concepts. Features were often requested which fall outside of the simple scope. Such features will be considered for later addition.

Research

I conducted remote and in-person interviews for a wide range of ages. Participants ranged from early twenties to late fifties. I asked the participants to use the think aloud method as they completed key tasks and explained what they thought to be each screen’s purpose.

Initial Design Concepts

Paper sketches were used to capture initial design ideas, using crazy 8 methodology. Some cues were taken from existing budget apps’ features, reducing complexity.

Initial design concept sketches for the budget app.

Digital Wireframes

The best ideas from initial design concepts were translated into digital wireframes.

Digital wireframes created from the best hand sketches.

Usability Testing

Usability testing data was recorded in a spreadsheet for each of the participants and in affinity diagrams. Two of the users were self-reported as dyslexic readers. The dyslexic users found the application easy to scan and read. All participants’ feedback were taken into consideration for a second round of wireframes.

Affinity diagrams distilled from usability testing insights.

Conclusion

Budget Buddy’s future depends on the signups using its service. Future feature releases will be considered from the perspective of learning about budget concepts. Features which align more closely to financial management apps will probably be ignored as that doesn’t align with Budget Buddy’s mission.

Skill Sets

UX

UX Design is learning about users and designing for their needs.

  • User Research
  • Accessible Content Development
  • Information Architecture

Design

Interaction Design is creating an interface or process around the users’ challenges and goals.

  • Inclusive Design
  • Figma
  • Creative Cloud
  • Graphic Design

Technical Skills

Technology is how users’ solutions are built.

  • Accessible Markup
  • HTML, SCSS, CSS
  • Bootstrap
  • GitHub

Certifications

W3C Accessibility

Verify W3C Certification

Google UX Design

Verify UX Certification

Interaction Design (I.x.D.)

Verify I.x.D. Certification