Once upon a time, I interned at TD's innovation lab. The lab's goal was to propel the bank towards the future of technology and banking. Turns out that a lot of that future relied on students, and we were tasked with building something amazing for students, by students.
So how might we increase TD’s engagement with undergraduate students to create a new product or service that would assist students with real issues?
The goal was to solidify TD’s position as the student bank of choice and continue to build a reputation grounded in trust and reciprocity. I ended up designing a student budget calculator to help prepare students transitioning from high school to post secondary.
To build out this project, I followed the Double Diamond design process. I began by researching, analyzing and synthesizing my ideas to better define the problem statement. I then began the process to design, prototype and iterate continously.
Initially, this problem statement was presented to a senior class of business analysts students at Wilfrid Laurier University by TD Bank. They uncovered some key findings from focus groups.
After analyzing the focus group findings further, my developer partner, Nhan Nyugen and I decided to focus on engaging students entering university, since we believed that this group best aligned with our problem statement.
I discovered several pain points around financing their education and where to go to get the inside information about university, for example, residence cost, as all of this data was scattered across the internet.
I discovered TD’s current budget calculator which was a list of over 30 input forms. The input fields were extremely intimidating to look at and were not designed with the user in mind. For example, there was a field for tuition in months, this and other expenses added difficulties to the user’s experience. This calculator was the exact opposite of a beneficial tool.
I then did a competitive analysis and found that all the other major banks had a similar tool. These processes were lengthy and did not provide much help.
BMO
CIBC
How might we revitalize TD's student budget calculator into a beneficial tool?
Once I reiterated and was satisfied with the result, I laid out the steps and designed a flow. I considered the hierarchy of the information and the relationships between them. For example, for the residence flow, the next logical step would be the meal plan, as the two are associated with each other. I also included a summary page after all of the costs to give the user a break from the input fields and act as an overview of their progress so far.
In order to visualize the information, I looked into various styles like a piechart, a thermostat and eventually settled on two bar graphs. I realized that this was the best and most straightforward way to display the data. I decided to keep green as the primary colour and a variety of very bold colours for the category elements that contribute to the bar.
The designs I had created from the hackathon provided me with a very solid base for the next stage of revision. I asked fellow colleagues and interns to comment and critique my designs one by one as I presented my content to them. I received very critical feedback as to both the visual design of the calculator, and the user's experience.
This was the first big UX project I ever worked on from ideation to conception. I learned a lot about UX, and I learned a lot of tools and skills to add to my toolkit. I redefined the problem statement, worked alongside a developer and learned what it meant to build empathy for users.
I'd also like to take the time to thank David Janik Jones, my mentor at TD. I got to learn so much from him about user experience design and I'm so honoured that I had this opportunity. As the project continues into its next stages,
I will always be proud of my work on TD’s student budget calculator and will look out for when it rolls out into the market to help students just like me.
To view the live site check it out here
Or on TD Lab's website