01 // Overview
Reimagining the RBC One Platform
During my time as a product designer at Royal Bank of Canada (RBC) I was given a hypothetical question of what the Investor Services platform, RBC One, would look like with a blue sky approach. This provided me with an interesting challenge as I had full creative control over improving an entire portal’s experience used by thousands of high net-worth clients.
Within 1 month I independently interviewed subject matter experts for the platform, performed a competitor analysis, conducted an internal audit, designed low-fidelity concepts, high-fidelity mockups, and created an animation concept. Half a year later, I spent another month building out other high-fidelity mockups for new sections of the portal.
02 // Background
Tools
Role
Timeline
Team
03 // Problem
How might we enhance the user experience and aesthetics of RBC One to better support its high net-worth clients?
In the summer of 2022, RBC Investor Services (RBC IS) was facing drastic changes having lost one of its biggest Canadian clients and selling off its overseas counterparts to focus on strengthening its Canadian market. As part of this shift in focus, I was asked to reimagine what the experience would be like for the clients interacting with the tool by enhancing the user experience and aesthetics. The goal was to pitch these concepts to C-Suite executives to get funding for an updated platform.
RBC One is a platform servicing thousands of high net-worth clients that provides information regarding portfolios, trade settlements, financial and operational information, as well as other tools supporting their business needs. Despite the weight that this platform has in supporting its high net-worth clients, it has not seen any significant changes to its design in a decade, and such has fallen in standards from an aesthetic perspective. As well, the platform is plagued with usability and accessibility issues from features that were not fully developed or were overlooked.
04 // User Research
What are a user’s goals when using RBC One?
Before diving into the redesign I needed to understand what the goals and challenges were for the users interacting with RBC One. Unfortunately, I wasn’t able to reach out to clients directly, so I did the next best thing and connected with subject matter experts and client representatives through informal interviews to understand what the goals are of the users for the homepage and the platform as a whole.
Goal // 01
Minimal touchpoints
RBC One needs to reliably and quickly provide access to information to support a user’s day-to-day operations.
Goal // 02
Information needs to be tailored
RBC One offers diverse services and therefore must cater to different personas using it by providing relevant key performance indicators.
05 // Existing Platform Audit
What are the shortcomings in RBC One’s current state?
After the informal interviews and getting an understanding of how users interact with RBC One, I took a closer look at the platform and organized my findings in terms of UX and UI issues.
Issue // 01
Outdated UI and Visual Bugs
These issues undermine the credibility of the platform and could easily turn off new potential clients when given a demo of the portal.
Issue // 02
Navigation Issues
Due to the limited capacity in the horizontal navigation, any new links are placed in a “More” tab, making it difficult for visibility.
Issue // 03
Lack of Personalization
Despite the platform being used by a variety of different users with different goals, the experience being provided is the same.
Type
Issue
Description
06 // Competitor Analysis
How does RBC One compare against the competition?
Another key activity I undertook was connecting with people who had access to competitor custodian portals and assessing the strengths and weaknesses of each of them based on a standardized grading system. This would allow me to determine what gaps our portal faced from a UX/UI perspective. The best elements would later be used to drive the initial concepts.
07 // Gaps & Opportunities
What are the opportunities for making RBC One better for our users?
Based on all the information gathered from the subject matter experts, the portal audit, and competitor analysis, I determined what gaps the RBC One portal faced, and what opportunities there were to remedy these pain points.
GAP // A
Inadequate widgets
Incredibly small widget library with lack of visualizations to allow for informed decisions by the users.
Opportunity // A
Comprehensive widgets
Provide all critical pages users need information for and create widgets for those pages, with an emphasis on visualizations for ease of use. For niche cases, let users create custom widgets.
GAP // B
One-size-fits-all approach
The current dashboard provides the same experience for all users, and lacks the ability to be customized to a user’s needs as widgets cannot be rearranged.
Opportunity // B
Provide a tailored experience
Conduct UX research for all personas and determine what information is relevant for their experience. Allow for a user to modify the position and size of each widget.
GAP // C
Too much customizability leads to cognitive overload
Providing users unrestricted control over customization can create an overwhelming and a less inclusive experience, particularly for non-tech-savvy individuals or those who are uncertain about what information is relevant to them.
Opportunity // C
Focus on personalization over customization
Focus on personalization over customization. Provide an onboarding experience to allow for the user to select a persona relevant to them and provide them a prebuilt dashboard that fits their needs.
08 // Medium Fidelity Wireframes
Getting the ideas flowing
I periodically met with the directors to show my progress and get their input to ensure we were heading into the right direction. The mockups below are some of the early iterations and are not reflective of the final result, as the designs are not public.
Navigation
One of the big changes that needed to be made was transforming the horizontal navigation bar into a vertical one. The platform’s information architecture contained many links and this would allow for every page to be visible as opposed to the current state with new links being nested in a “More” tab, especially since new tools and features are being added to clients frequently.
Login screen
For this experience, I decided to keep it faithful to the current version, but provided a general facelift. The only major change I wanted to integrate was allowing for marketing materials or updates to be present to the user prior to logging into the page as well as the addition of a loading animation when the user logs in to eliminate any ambiguity.
Data visualizations
One thing which was lacking in the current home screen dashboard was actionable key performance indicators that provide information in a meaningful and digestible format. I needed to showcase layout concepts that took dashboarding best practices into consideration such as the importance of information hierarchy.
Onboarding
Providing an onboarding experience when a user first logs into the platform would circumvent the identified gaps, as pre-built dashboards could be built out for each persona. In case a user accidentally makes an incorrect selection or wants to change their persona later, there would be the option to do so when creating a new dashboard.
Modify widgets
Allowing users to reposition widgets was necessary for users who wanted a custom view. As well, having a widget library with descriptions provides context for the widget’s purpose. For more advanced users that need a specific view or metric, having the ability to customize a widget is made available to the user. Giving them a step-by-step guide through this process provides the flexibility of control, while also reducing the cognitive load.
09 // Final Experience
RBC One, reimagined
Putting all the previous work together, I worked through the mockups and iterated on the designs with feedback from the business team to create a reimagined RBC One portal home screen, onboarding experience, as well as an animation concept.
As these screens aren't public facing I can't show the final work that was done, except the login screen.
10 // Phase 2
Reimagining the experience for the rest of the portal
Months following the positive reception of the initial concepts with C-Suite executives, the business team had developed a sitemap for the new portal as well as the specific features that would be required for a user on these pages. I was asked to perform the same task on other critical screens. This portion of the project focused less on UX research and more on “marketing,” as the primary goal was to spark conversations with the various product owners for the different segments within the RBC One platform on what the future could look like.
Eventually this led to the development of several features, utilizing my new design language. As these screens aren't public facing I can't show the final work that was done except for the phase 1 of the login page that is now live! The rollout for phase 2 will update the components to the latest version of Angular.
11 // Reflection
Outcome & lessons learned
Due to the weight of the project, my redesign was exposed to many different people including RBC IS’ CEO. The redesign was given the green light to begin development at the start of 2023 and is currently underway.
Lesson // 01
Great designs are backed by research
As I was given no requirements, what could have been an overwhelming task was simplified by understanding the users and the problem space from interviews with subject matter experts, internal users, and assessing competitor portals.
Lesson // 02
The power of animations
“If a picture is worth a thousand words, a video is worth a million.” It was easier for people to envision what the future of the portal would look like through an animation.
Lesson // 03
Value of pitching
Communication was key when selling the redesign to C-Suite executives as I needed to explain how user experience and aesthetics create business value.
