Royal Bank of Canada
Initiatives
I led the development of RBC’s Colour Theory, ensuring brand colours were accessible and met contrast ratio standards. I also contributed to updating our iconography for the visual language refresh. Separately, I created UX mockups and storyboards for the money transfer initiative to illustrate the user journey.
​01
Discovery:
What’s Not Working
02
Define:
What Needs to Change
03
Develop:
What We Recommended
04
Deliver:
Where It’s Headed
Assumptions:
-
Primary Goal: To create a color system that supports accessibility standards, ensures good visual hierarchy, and encourages ease of navigation.
​​
​
-
Design Philosophy: Emphasis was placed on simplicity, balance, and a modern color scheme that aligns with RBC's branding while also improving user experience
​
Color Palette Update:
-
Primary Blue: A new vibrant shade (#1e62c3) was introduced as the primary blue for RBC, offering better contrast and improved usability for key interactive elements like links and CTAs.
-
Accent Colors: RBC Yellow was selected as a primary accent color to highlight important elements, with RBC Slate added as a third primary color when needed.
Accessibility Considerations:
-
The updated color palette was designed with accessibility in mind, ensuring that all background and foreground color combinations meet required contrast ratios, making the platform easier to navigate for users with visual impairments.
Visual Hierarchy and Color Usage:
-
The palette was structured to create clear visual hierarchy, using color to guide user attention and emphasize key pieces of information.
-
Secondary colors were incorporated to add visual interest and highlight secondary content without overwhelming the user.
Testing & Refinement:
-
Color combinations were tested for clarity, legibility, and accessibility across a range of devices and user scenarios to ensure a consistent, high-quality experience.
Consistency Across LOBs (Lines of Business):
-
The new color system was designed to be adaptable to various RBC lines of business, ensuring a cohesive experience regardless of the specific service or platform.
Newcomers journey
UX mockups + Storyboarding
The goal is to provide a personalized, user-friendly experience through the RBC platform. By guiding users through a tailored process, newcomers can find neighborhoods that match their preferences and needs, ensuring a smoother transition into Canadian life.
Assumptions:
User Needs: Newcomers will be unfamiliar with Canadian neighborhoods and the general lifestyle in Canada, including transportation, safety, schools, and proximity to amenities.
​​
​
User Behavior: They may feel overwhelmed by the wealth of information available online and will benefit from a more guided experience to help narrow down their options.
​
Research & Persona Development:
​
-
Focus on personas like Li Peng, who is moving from Beijing and looking to settle in Ontario. Understanding the persona helps define their needs and expectations.
Scenario Setup:
​
-
Step 1: A new immigrant receives confirmation of permanent residency and starts researching information about life in Canada.
-
Step 2: Li Peng finds online information overwhelming and reaches out for help, demonstrating the need for a simplified user journey.
​
UX Flow Creation:
​
-
Step 1: Newcomers are presented with a set of questions to help identify their preferences for their new neighborhood (e.g., transportation options, safety, and proximity to schools).
-
Step 2: Based on their responses, they are guided to a set of neighborhoods that fit their criteria, helping them visualize the best options.
Interactive Guidance:
​
-
The user flow emphasizes simple interactions, such as selecting options from drop-downs or checkboxes to narrow down neighborhood suggestions.
-
The platform is designed to guide users step-by-step, creating a smooth transition between decisions without overwhelming them with excessive information.
Money transfer via cloud
UX mockups + Storyboarding
We wanted to make RBC’s cloud-based money transfer service stand out by telling a story through a storyboard. Instead of just wireframes, we created interactive personas and visual scenarios to show how users interact with the app. This human-centered approach made the experience more relatable and engaging.
UX approach
Client Personas: We developed detailed personas to represent different user types, ensuring we captured a variety of interactions with the service.
Storyboarding: We mapped out real-life scenarios to show how users would navigate the app, making it easier to understand their experience.
​
Wireframes: To complement the story, we included wireframes to visualize the app’s structure and functionality.
User Testing: We gathered feedback to refine the design, ensuring the final product was intuitive and aligned with user needs.
