Designing Innovative Financial Solutions at Canada’s 2nd Largest Bank

UI/UX Design Intern — TD Canada Trust, Winter 2019

Daniela Ornelas
5 min readJul 8, 2020

TD Lab, located in Kitchener-Waterloo, Canada, gives students hands-on experience that introduces design, business, and technology. During my internship at TD, I designed apps to help Generation Z manage their finances to prepare for future student loans, payments, and mortgages.

A Young Freelancer’s Essential Tool: E-Paid

Team: UI/UX design intern (me!), software developer intern
Duration
: January — April 2019
Project: E-Paid
Tools: Whiteboard & Marker, Sketch, Invision
Platform: iOS App

Result: E-Paid won TD Lab’s Midterm Hackathon! It was later presented to TD stakeholders and pushed for further development.

Context: I was required to lead through the problem space and create an app that met the challenge of incorporating Interac’s E-Transfer API, conducted product research, organized user testing, and ensured successful product development.

User Interview & Research

To understand the user, I decided to conduct an interview on a student roommate of mine. Meet Erin. She is a web design freelancer. We asked her:

As a freelancer, what is your biggest struggle?
“My main struggle as a freelancer is keeping track of all my clients! I’m constantly switching between apps to check my contact book, calender, and texts messages. It becomes overwhelming and can cause me to seem unprofessional.”

How do you determine your value as a freelance web designer?
“Determining my value was one of the most difficult problems that I encountered. Initially, I would charge for the entire project, not per hour. This caused me to make $5 per hour if I wasn’t able to realize the complexity of the project.

What tools do you use to schedule?
“I use the calender app on my phone. It’s not my favourite tool since I can’t be notified when I’ve been paid without manually entering it, but it works for now.”

Pain points according to research findings

  • New freelancers do not know their value and how much to charge their clients
  • New freelancers are more likely to avoid confrontation and not speak up if their clients avoid paying them
  • Keeping track of deadlines, scheduling, and other commitments

Meet Jenny — Persona

User Interface

Arranging the style guide for E-Paid, it was important to keep in mind accessibility, CTA’s, a legible typeface, and simple cards. Using color was essential to providing guidance to the user in what actions they needed to take and creating a thorough, intuitive experience.

Solution

Complete freelance work+ E-Paid’s automatic invoicing = no confrontation, quick payment, and no pain points.

First, the user is required to sign-in. We only require their e-mail and password. I require their e-mail to allow automatic invoicing and receiving e-transfers, therefore removing the burden of asking clients to pay them.

Second, the user lands on the homepage. Using tabs, we’ve divided all tasks into three organized groups.

Third, the user creates a task. They will decide a date, a start time, and end time of the task. Since the user is new to the freelance world, and may not know how much to charge their client, we provide them with the average rate that other freelancers in the area are charging based on their task. An invoice will be automatically sent to the clients provided e-mail as soon as the end time of the task has occurred. This prevents the user from facing confrontation or directly asking for payment as they build their confidence as a freelancer. For stubborn clients, the user can select to send them a reminder of their unpaid invoice every 3 days until it’s paid.

Once a client pays the user view e-transfer (they’ll be sent an invoice with the E-Transfer link at the end time of the task), then the task in the unpaid section automatically moves to the paid section. The user doesn’t require to ever manually move the tasks between the three sections, or chase clients that have not paid them, allowing them to focus entirely on producing their best work.

(Left) Paid Task, (Middle) Unpaid Task, (Right) Upcoming Task

On the “More Details” page, the user is able to see when their last invoice was sent, see client information, authorize that the task has been paid for using other methods of payment, duplicate tasks, or manually resend an invoice.

Leanings

Initially, I entirely focused on providing a solution to every issue a freelancer might encounter. For example, I wanted our platform to cover patents, tax issues, accounting, invoicing, and payment collections. I realized that tackling all these problems would dilute our original problem statement, and leave us with an app that wasn’t clear and concise to the user. To solve this problem, we stripped down our unrealistic approach and focused on the true problem presented, which is to allow a platform for freelancers to get paid faster by incorporating the Interac API.

I would be happy to answer any questions about my design process and internship experience through an email!

--

--