Challenge
How might we help university students make better-informed financial decisions?
Solution
A budgeting tool that leverages university-provided data and encourages students to forecast the outcomes of different financial choices.
My Role
UX/UI Designer (sketching, wireframing, prototyping) and PM for the functional prototype development (on a student team)
Personal Takeaways
User research for this project was especially interesting. We had to be considerate when asking students intimate details about their financial situation, and understanding if they didn't care to divulge that information.
Process
Ideation
The seed for this idea came from user research conducted as part of my job with the Student Information Systems Replacement Project at UC Berkeley. During summer 2015, I worked to update the student web portal with financial aid and campus employment information, but we'd been repeatedly asked by students whether there would be a budgeting tool as part of the new site. I was able to bring that idea to my UI Design course, and gather a team around it that was also excited to improve the student experience.
USER RESEARCH
To approach the problem of student budgeting we interviewed current Berkeley students and observed their current budgeting process. Do students budget at all, and what tools do they use? What timeframe do they consider? Do undergraduates and graduate students have different needs? We found that most students did not spend much time budgeting, felt stress and often guilt when they did, and had trouble grasping a comprehensive view of their finances because of the many different sources of information.
Personas
We found that students fell into four main categories in their approach to financial planning:
No financial planning at all
Confused, but willing to learn
Pen + paper level budgeting
Highly involved and detailed
We chose to solve for the problems and goals of the students who did pen and paper budgeting, with the hope that we could reach the others if we designed it well enough.
User Journey
We imagined our tool as an integral part of the financial aid process, where students would be notified of their award package and then use the budget tool to help them make decisions like whether to take out a loan or get a campus job.
Site Map + IA
We designed within the constraints of the existing CalCentral site so that our final product would have a chance of being implemented campus-wide. Thus, the tool needed a flat architecture to allow students to accomplish their main goals on one page.
Sketches
We created a number of paper prototypes to get our ideas down and challenge certain assumptions we had made. We began thinking about our data sources and how much flexibility we could provide while still remaining accessible to students who would not have much financial literacy. We learned through initial testing that students were most likely to budget on a semester timeframe.
Wireframes + Lo-FI PROTOTYPE
Next we created simple clickable prototypes. At this stage each team member created their own; mine was built in OmniGraffle and was a bit higher fidelity than others due to my prior experience with the CalCentral site.
USER Testing
We then took our prototypes to the students. From our lo-fi prototypes, we learned that students welcomed assistance figuring out their budget numbers. We realized the need to include smart defaults and to repeat important information if possible. We chose to drop some functionality that was useful but added complexity. The most common refrain was that it was hard to tell how useful it would be when all the data was fake. We would need to create a functional prototype to see how students responded to their own data.
High Fidelity PROTOTYPE
After multiple rounds of revision and testing, I enlisted the help of a student developer on the CalCentral team to code our final prototype. During the last few weeks of our course, I acted as PM for the prototype, ensuring it would be completed and functional in time for our final presentation. Because of his help, we were able to test the final design in a very realistic way, with working data.
Details
Course: UI Design + Development (Info 213 @ UC Berkeley)
Date: Fall 2015
Role: UX/UI Designer
Tools: OmniGraffle, Invision
Group Members: Andrew Wu, Astika Gupta, Kinshuk, Pooja Jain
Developer: Winston Kim