
Interac e-Transfer
Revamping 3M+ Notifications
sent a day sent across Canada
Revamping 3M+ Notifications
sent a day sent across Canada
Timeine
2024 (Jan-June)
Skills
Product Design
Iterative Design
Info Hierarchy
Role
Full Stack Designer
UX Researcher
PROJECT OVERVIEW
The Problem π‘
Interac e-Transfer, a widely used service processing over 32 million transactions annually, utilized decade-old email templates, resulting in inconsistent user experiences and outdated design standards.
The Solution π±
We redesigned Interac e-Transferβs email templates from the ground up, creating a consistent and modern UX that aligns with todayβs design standards - enhancing clarity, trust, and engagement for millions of users.
THE DESIGN CHALLENGE π―
How can we enhance Interac's email notifications to match brand guidelines, improve UX/UI clarity and hierarchy?
What does Interac e-Transfer look like today...
Autodeposit -
1 CTA
Experienced users don't need to open the email as funds are already in their account.
Less frequent users must complete a security question, ensuring engagement with each notification.
Traditional Q&A - 1/2 CTA
Users can request funds from anyone. Recipients can accept, decline, or block notifications.
Request for Money - 3 CTA
Why is it so dated...
The existing email templates, neglected for over a decade, feature outdated design elements, inconsistent branding, and fail to meet modern UX/UI standards and best practices. This approach significantly impacts UX, prompting a thorough audit!
Missing Interac Branding: Templates lack consistent Interac branding, impacting brand recognition and trust.
AUDITING EXISITING TEMPLATES
Logo and Financial Institution Consistency: Inconsistent logo and CTA use confuses users and disrupts branding.
Poor UX Information Hierarchy: Information is poorly structured, hindering quick comprehension.
Incomplete Subject Line Copy: Subject lines lack key details, reducing clarity and engagement.
Key ideation principles and solutions π‘
My goal for this refresh was to focus on three key concepts: Fun, Modern, and Understandable. Keeping these principles at the forefront helped shape ideas that addressed user pain points and issues identified in the audit of existing templates. Key ideas included:
Modern Visual Design
Effective Call-to-Action (CTA)
Improved Information Hierarchy
Security Emphasis
Building custom elements and creating an Interac
e-Transfer notifications design system π οΈ
I developed unique visual components tailored to Interacβs brand, creating a scalable and reusable design system for consistency across all notifications. Detailed guidelines ensure seamless implementation and maintenance by all stakeholders.
DESIGN 1.0
Revamping the notifications: Initial exploration π
To kick off the project, I brainstormed a variety of ideas focused on making the notifications fun, modern, and understandable.
Shortlisting my ideas...
1. Interac Branding and Use of Ochre: Ensuring every email aligns with
Interacβs brand guidelines, prominently incorporating the signature ochre color.
2. Fun and Exciting Imagery: Incorporating images that add an element of fun and excitement to the notifications.
Validating decisions with user research π¬
For the user research phase, we conducted surveys and moderated interviews to gather detailed feedback on the new notification designs.
Our primary objective was to evaluate user understanding and perception of Design Iteration 2.0, ensuring it conveyed the intended message and aligned with the Interac brand identity.
1.Refining Email Preview Language
Users prefer formal language over informal phrases like "money in."
The key insights π
2. Refining Language for Clarity
Users showed a preference for universally understood language
3. Balancing Imagery with Professionalism
Some users appreciated modern design, but many preferred a simpler and professional look
4. Removing Repetitive Content for Readability
Users noted that reducing information can improve the email's clarity
Open to view the full Research Study!
Designing by Asking Users, Iterating by Listening π
DESIGN 2.0
Building upon insights from user testing, Design Iteration 2.0 aims to further refine Interac e-Transfer notifications.
Problem: Users faced difficulties with the clarity and formality of email notifications.
Solution: Implemented several key updates to improve the user experience and align with the Interac brand.
Improved Clarity and Formality: Updated subject lines and content language to be more concise, professional, and aligned with Interac branding.
Enhanced Visual and Functional Elements: Redesigned background assets, headers, and repositioned expiry notices for better visibility.
Enhancing QA user experience
Enhancing Autodeposit user experience
Problem: Users and stakeholders noticed inconsistencies, image issues, and informal language in email notifications.
Solution: Implemented updates to enhance professionalism and brand alignment.
Refined Subject Line Communication: Updated copy to be concise and formal, improving clarity.
Improved Visual Consistency: Eliminated non-aligned images and introduced consistent bank components to enhance professionalism and user trust.
Validating design decisions with user testing π
We conducted user testing on design 2.0 to ensure our updates met user expectations and aligned with Interac's brand. Feedback was crucial in refining our approach and validating our design choices.
Expanding and refining our template arsenal π οΈ
Creating a Comprehensive Template Collection:
After completing Design 2.0, we embarked on a massive overhaul, creating nearly 78 additional templates to ensure every type of e-transfer scenario was covered. These templates included:
E-transfer notifications (QA Users)
E-transfer schedule transfers
Request Money
Autodeposit notifications
Notification Preferences
Custom Bulk Templates
This extensive project took about a month to complete, involving many revisions and approvals from multiple stakeholders, including legal teams, project managers, and UX copywriters.
Introducing security measures and management portals π¨
Enhancing User Security: In response
to feedback and fraud concerns, we added crucial security copy to our emails.
Example: "Please do not forward this email, as the information is confidential. Operational and support teams will never request access, ensuring your security.β
Developing a Report Abuse Portal: We initiated the creation of a portal to manage abuse reports, which required legal and FI approval.
Within Email: βTo restrict messages, block this user, or manage your Interac e-Transfer preferences, click here.β
Refining and Balancing Stakeholder Preferences π¦
DESIGN 3.0 - FINAL DESIGNS
Building upon insights from user testing, Design Iteration 2.0 aims to further refine Interac e-Transfer notifications.
Balancing Financial Institution Concerns: To address FI discomfort with prominently displaying logos and details, we revised the design to emphasize the dollar amount and currency, moving FI information to a less visible position.
Ongoing Collaboration: This phase required continuous stakeholder collaboration to balance preferences with user needs and security
Letβs take a look into the final designs! π
Updated templates are meant to launch into market in October 2024! Until then, our development team is rigorously testing for accessibility and security to ensure optimal performance.
MY REFLECTION ON THIS PROJECT
01. Stakeholder Coordination
Balancing the expectations and requirements of over 15 financial institutions proved challenging. Each institution had unique perspectives on design and branding, making it difficult to reach a consensus that pleased everyone
02. Tone and Context
While adding fun elements seemed appealing, feedback showed that many e-Transfers are business-related. Users preferred a more formal tone to reduce fraud perception and better reflect the seriousness of financial transactions.
03. User-Centric Design
Our iterative design process underscored the importance of user feedback. Engaging with users early and often ensured the designs met their needs and aligned with their expectations, ultimately improving user satisfaction and trust in the service.