top of page

Fidelity Investments Canada

With over $250 billion AUM, Fidelity Investments Canada is one of the largest financial services companies in the country.

fid-desktop-mockup.webp

UX research for an improved navigation

Services

User Research (Including: Personas, User Testing, & Tree Testing) Information Architecture, Landing Page UX Design

The Problem

Fidelity Canada offers a wealth of articles on investing, that caters to everyone from beginner investors to investment professionals. With all of this content, the site's navigation had become increasingly cluttered, creating challenges for users to easily find the information they were looking for.

In addition, Fidelity aimed to engage younger investors, who may have felt overwhelmed by Fidelity's advisor-centric interface.

Results

  • Updated site map

  • Updated dropdown design, with fewer links and added descriptions, so users know what to expect

  • New landing pages for all links in the dropdown menu

  • Landing pages allowed users to explore topics, as opposed to choosing from a long list of page names in the navigation

PROCESS

PHASE 1: User testing the current navigation

The first step was knowing who our users were. I created personas based off of prior user research provided by the client, which helped identify three main user groups for testing: beginner investors, experienced investors, and advisors.

We conducted unmoderated user tests using the current website, and the Loop11 user testing platform. User testing included the following:

  • Users were given realistic scenarios and tasks to complete using the website

  • Users were asked to find key pieces of information so we could observe their success rate

  • Users were asked qualitative questions about the site navigation and content

user testing mockup.webp
Recommendations
  • Drop-downs to have fewer links

  • Create a hierarchy of information: Revise site structure to funnel users from broad topics in the menu, to more specific links in the landing pages

  • Use more direct descriptive wording for menu titles

  • Add brief descriptions below titles in the menu

Qualitative Data

" I felt lost... I need to learn more about the topic to be able to navigate the website." - Beginner investor

"There's a lot on the website. I'm a little bit overwhelmed." - Experienced Investor

Quantitative Data

66% of users expected the root menu to be clickable

70% of investors incorrectly looked in "Mutual Funds" or "ETFs", when looking for funds to invest in.

PHASE 2: Turning data into design

My colleague and I analyzed hours of user test data, extracting key pain points and identifying trends in user behaviour. Using these insights, I created the first version of the new site map, and recommendations for the design of the dropdown.

PHASE 3: Tree testing the updated navigation

Using the new navigation, we conducted a tree test with our 3 user groups to get insight on how to further improve the navigation. Tree testing, using the Optimal Workshop platform, included some of the same questions as our initial user tests, so we could compare success rates.

 

Users saw an average of 38% higher success rate with the new navigation, but there was still room for improvement.

Example of a tree test: "Tree test task #1, Use the website navigation to find out if you need a financial advisor.
PHASE 4: Menu UI & landing page design

After user feedback from the tree test, I as able to finalize the site map. The redesigned navigation reduced clutter in the drop-down menus and introduced dedicated landing pages to better guide users to the right content. Additionally, the navigation included brief descriptions, addressing feedback from investors still familiarizing themselves with financial terminology.

Landing pages were designed to allow beginner investors to learn the basics, while also guiding more experienced users to the more advanced content they were looking for.

Drop-down navigation with many links

Before

17 links in dropdown, users not clear where to click

Drop-down navigation with fewer links and descriptions

After

Information is grouped into 8 links with a landing page for each. Each link has a clear description to help guide users.

FINAL DESIGNS: Landing pages

I designed the UX for 11 landing pages to correspond with the new navigation.  

Please note that I only designed the UX, using pre-existing components from the Fidelity Website. Fidelity Canada already had a well-thought out design system, and their in-house design team layered the UI on top of my wireframes.

fid_landing_edu.webp
fid_landing_etf.webp
bottom of page