Creating a budgeting app with visual planning tools
I designed a budgeting app for Gen Z freelancers who prefer graphics instead of numbers
Tools & Methods
User Research
Competitive Audit
Wireframes
UI Design
1:1 Interviews
I conducted 5 one-on-one interviews, asking five different questions about the interviewee's experience with budgeting apps.
Empathy Maps
I used the insights I received from the interviews to create empathy maps. I outlined what the participants said, thought, do, and feel when it comes to tracking their spending.
Persona
Once the empathy maps were complete, I was able to create a persona based on the insights.
I chose three financial apps to conduct a competitive audit: Mint, Qapital, and Copilot.
Mint
It looks very clinical, like something a traditional bank would look like. It makes me feel like my dad is doing his budget, and not me.
Qapital
Qapital is simply a savings app and not for budgeting or tracking spending
Copilot
The design is modern and slick, but it also looks like I’m on wall street and that could be intimidating
Wireframes
Time to start designing
Using Figma, I translated my first sketches into low-fidelity wireframes. Then, I improved them by adding a few relevant stock images and copies. At this stage, the wireframes were defined enough for some user testing. Based on 4 tests, I’ve made a few alternations and moved on to creating high-fidelity prototypes.
UI Design
Designing for modern budgeting
Once the usability issues were resolved, I designed the final screens in Figma. My goal was to create a visual identity that was not intimidating for users. Something slick and simple. Also, I checked the competition and took a deep dive into my catalog of references for inspiration.
