User Experience Designer/ Product Designer
Introducing
Duration: 6-14 months before going live
Role: Visual/UX DESIGNER
Tools: Sketch, Figma, miro, Try my UI
Design Team: 1 UX lead, 1 copy writer, 1 VD, 1 UX
TD Payment Plan
75%
12k +
active customers
Plans setup since 2022
Users
1.
Identify
13%
Millennials
13% of millennials pay off their
statement in its entirety, where the rest
either miss their statements or pay their
minimum payment for the month in order
to manage their budgets.
20%
Budget-conscious
20% of all Canadians do not pay their
statements in its entirety per month.
19.99%+
Interest-conscious.
Customers pay an interest of 19.99%+
per month for all of their outstanding
balance. This payment plan will help those
who are in need to reduce the interest rate
of their monthly statement.
Mid -Fidelity Wireframes
Once we had the usability results we started defining the core base of the UX. We worked on 5 main customer irritants from the usability testing.
Site map
PRODUCT
Task Flow
3.
Competitive Analysis
Test cases
-Setting up a payment plan
-Paying the minimum payment
-Paying all active plans in full
-To identify usability facilitators & barriers present when
exploring the new feature
-To understand / validate participants’ expectations &
unmet needs around the experience
3
Prototypes
20
Particapants (25-50 yrs)
3
1
15% discoverability rate for entry point: Not ideal on manage tab
80% particapants could setup a plan to pay back a large purchase
Design insights
70% participants gravitate towards 'pay bill' instead of TD payment plan
How often would participants use TD payment plan in a month?
30% were not able to pay off balance in full
20% were confused with statement and current balance
How did they perform the tasks?
(10%-20%: FAIR, 20-40%: GOOD, 40-80%: VERY GOOD)
FAIR
VERY GOOD
VERY GOOD
GOOD
GOOD
2.
Information Architecture
Next, we developed a detailed component diagram showing all the app components, such as front-end, back-end services, APIs, and database.
Defined services for handling specific functionalities, such as payment processing, interest calculations, and user management.
Identified and designed integration points with external systems, such as banking APIs or payment gateways.
Site Map
.png)
4.
User Testing
10%
Design insights
Usability testing parameters
Post findings
TD credit card customers who:
-Don't pay off their monthly balance in full
-Want to budget their monthly spending
-Want to pay less interest on their outstanding balances
Design modifications
-Setting up a payment plan clear to all
-Paying towards plans, whether minimum or full, not intuitive to most
-Payment plan on the Manage tab not a common starting point
80%
Task succession rate
-Had to rethink the entry point
-Clear and concise messaging
-Introduced status of each plan, etc.
10+
.png)
1. Discovery
Open the TD banking app to review your recent transactions and see a new quick link promoting TD Payment Plan.
Curious about how this feature can help manage your finances, click on the quick link button on the header to learn more details before you set up your plan. First time users will always be shown a before you begin page to better help them understand the befits and perks of the feature.
High-Fidelity
TD Payment Plan allows you to split large purchases made with your TD credit card into 6/12/18 months, interest-free monthly payments. Read about the flexibility to choose the duration of the payment plan, ensuring it fits comfortably within your budget.
2. Setup
3. Plan Name
Once you’ve selected your duration, you’’ll have to enter a plan name. This can help personalize your plans and help keep track of them when you’ve setup a TD payment plan.
To help with plan name guidelines just tap on the drop down.
4. Validate Email
Next, you’ll enter your current email to ensure you receive any communication from TD regrading your plan.
If you need to update or change your email, you can do so by updating it on this screen. TD will automatically change it across the whole app.
5. Review/Edit
Now, you can review the details of your TD payment plan. if you're not satisfied with the details, tap on edit and feel free to update any existing changes.
5.
6. T&Cs + Confirmation
After reviewing the terms and conditions fact sheet, you'll be navigated to the success page confirming your TD payment plan for your chosen purchase.
Personalized Experience
We know who the user is and their banking habits/actions and accordingly present personalized messages that are relevant to their profile and their specific circumstances.
.png)
Streamline and Timely
Consistent experience and page types, where completing the main task becomes effortless. updating in real time the status of the plan: pending, active, closed.
Friendly and Conversational
Guide the customers through tasks witheasy to understand human language. Helps to soften the experience, reducing
customer anxiety and gain their trust.
Which purchase would you like to setup for TD Payment Plan?
How many months would you like to pay off your purchase?
6.
Our Design Strategy
As a customer, I struggle with managing large, one-time payments, which disrupts my monthly budget and financial planning. I find it challenging to pay significant amounts upfront, affecting my cash flow and limiting my ability to maintain stable financial habits.
What's our focus?
PROBLEM
Overview
As a TD customer, I want a Payment Plan option that allows me to lock eligible purchases into an equalized payment plan for a fee. This feature gives me flexibility to spread purchase costs over time, helping me manage cash flow effectively without compromising my regular spending habits.
Our Product
SOLUTION
Here's a snippet
Our Team: Marketing and Design team presents TD payment plan
