PCF Public Site Redesign

President’s Choice Financial (PCF) needed to refresh their public website to drive product growth, compete against emerging competitors, and gain market share. Over a six-month period, I redesigned PCF Public site pages and through multiple releases, we achieved outcomes below:

  • 15% increase in acquisition funnel entrance

  • 32% increase in overall sales conversions

  • 25% reduction in overall page bounce rates

Role: Product Designer
Timeline: 6 months
Responsibilities: UX Design, Research, UI Development, Content & Stakeholder management

UX Design

Web App

Public Site

Current Website

OVERVIEW

The Business Problem

PC Financial (PCF) Public Site has not been updated for 5 years. The outdated homepage and product pages didn't communicate PCF's value proposition and poorly showcase it's products. Marketing teams also struggled to drive growth and sales due to limited flexibility and lack of insights. Additionally, stakeholders and upper leadership lacked visibility into how design could drive value, leading to skepticism about our team's impact. In the project, I was tasked to improve the overall user experience of the website through broach changes on the most impactful pages of the site.

UNDERSTANDING

Stakeholder Alignment

We began our discovery phase through a kick-off meeting with our stakeholders to discuss our KPIs, success metrics and constraints of this project. On this meeting, we learned that our stakeholders expected the homepage to directly drive sales and new acquisitions. However, this posed a challenge because:

  1. Our team did not control lead generation strategies or product pricing, which are critical to user acquisition.

  2. Sales goals were tied to app onboarding and product usage, which were outside the scope of the Public Site redesign.

With the guidance of our Senior Product Manager and Project Manager, the success metrics for the projects was reframed to align with our with our teams sphere of influence and business goals. By illustrating the need to extend the redesign beyond the homepage to other critical touch points, we gained buy-in for a broader redesign approach.

Why We're Doing this?

Our team aligned the leadership team with key themes redesign themes. To establish a shared vision, we conducted stakeholder interviews to clarify expectations, identify priorities and align on our definition of success. These were the key redesign themes.

1

Update branding to compete with emerging competitors.

2

Increase product discoverability and highlight benefits.

3

Improve comprehension of points and rewards programs.

4

Drive traffic to product sales applications.

RESEARCH

User Archetypes & Persona

Working with marketing and product leads, we conducted user and market analysis to better understand our audience. We learned that:

  1. Customers viewed PCF as a shopping brand to earn points, not as a bank.

  2. PCF’s limited product offerings as a digital bank (e.g., no mortgages or joint accounts) meant targeting a specific subset of users was essential.

Based on these insights, we develop a content strategy that will reposition the brand as a bank. Together with marketing we worked on refine messaging and set realistic user expectations, for a subset of user archetypes from enterprise personas; providing my team with clear guidelines for design and content decisions.

Our Diagnosis: What Needs Fixing?

I began identifying pain points and quality-of-life optimizations to be made in the first 2 months of the project. I performed competitive analysis with the big five and our direct competitors, a heuristic evaluation, conducted user interviews and run usability tests to know our users painpoints. I also leveraged site analytics — specifically clickthrough and drop-off rates and performed an accessibility audit on pages the public site get most traffic.

Here are some common themes I found on my research:

  • PCF's content is text heavy and some visuals and animations are distracting and takes away from the content itself therefore increasing cognitive load for the user.

  • The users had difficulty finding information that they need to learn about the product. The first few seconds when they land on the homepage, they all see different marketing content about the PC Optimum points program.

  • The users find the navigation ineffective. The desktop website uses a side navigation fly-out.

  • Some users feel that PC Financial brand isn't as trustworthy compared to the big five banks.

OUR HYPOTHESIS

Simplicity is Sanity

Use the homepage effective to introduce products and current marketing promotions – and guide them through the product page where they enter the application flow. Reduce cognitive load by using clearer language and visual hierarchy and dynamic product cards that gives the customers the confidence they need about the product. Build their trust through social proof and testimonials so they're encouraged to initiate their application.

The Approach:
Incremental Changes Over Phases

Thanks to the gathered feedback and data we had a clear path forward and turned those insights into action items. To deliver impactful changes while addressing stakeholder concerns we used an iterative approach. This included: redesigning the homepage, updating banking and credit product pages, creating reusable campaign pages and a responsive web Design System.

THE EXPERIENCE

The Homepage Design

The homepage is the front-door of a brand and it has to communicate PCF's first digital impression. It needed to effectively communicate the brand's value and guide users to key actions such as taking them to product pages.
When I designed the homepage, I worked first with our CMS specialist to repurposed CMS components to minimize development work. I also focused on clarity and a stronger hierarchy of information so we were able to refine the amount of information presented within the product cards and make it more scannable and digestible for customers.

The updates included the following:

Trackable CTAs
Tagged to capture analytic insights in our tools.

Immersive Hero
full-width, evergreen and campaign variants, with CTAs.

Dynamic Product Cards
Layouts that highlighted product benefits users cared about and synced with campaigns, resolving tensions between product teams vying for visibility.

Social Proof
Reinforced PCF’s value by featuring app store ratings and customer testimonials, emphasizing user benefits to drive app adoption and onboarding success.

Homepage Iterations

THE RESULTS

Driving more traffic and better engagement

30%

Reduction in bounce rates

65%

Increase in sakes traffic

10%

Increase in users scrolling past the 75% page mark

PART TWO

The Credit Card Page

With PCs growing product portfolio, it needed a page that would house all it's products and allow users to compare different products guiding them towards making a decision. This page was was added under the credit cards menu to allow users to quickly compare different card tiers at a glance.

These were the features I thought and developed to nudge users to start an application.

  1. Added a feature that allows users to compare credit cards

  2. These dynamic card houses a summary of the value prop of PCF's credit card products.

  3. The card also shows additional benefits of the card

  4. Eligibility pop-up so users doesn't leave the page and can click apply whenever.

  5. Further down the page, it shows PC Optimum participating and social proof stores to futher build trust.

PART THREE

Value Driven Product Pages

Similarly, enhancements were phased in tandem with home page iterations for consistency and to ensure product and marketing partners felt comfortable with the pace of change.

Decoupling product page and marketing pages

We've separated the product page and campaign page which were previously linked together. Marketing teams struggled with manually duplicating and customizing pages for campaigns, while users often encountered irrelevant content. Decoupling these pages enabled more personalized and effective user experiences.

Additional Site Wide Improvements

1

Content Hierarchy: Positioned product benefits to the top of each product page, highlighting what mattered most to customers.

2

Removed Unnecessary Animations: Stakeholders disliked inaccessible animations, so we streamlined visuals to prioritize usability.

3

Moments of Impact: We designed purpose-based visual language, using the brand’s accent colour (purple) and squiggle illustrations to draw attention to key content.

4

Design System Alignment: Updated fonts, colours, and imagery to align with the refreshed brand design system, creating a consistent yet unique look for the public sit

5

Trackable Interactions: Collaborated with the analytics team to create traceable interaction points, enabling precise tracking of user behaviour and campaign performance.

6

Simplified Points Table: Improved customer comprehension by visually simplifying how users could earn rewards. Later, we introduced an interactive version, allowing users to calculate potential points based on their unique banking and shopping habits.

7

Navigation and information architecture improvements.

8

Worked with our accessibility team to flag all accessibility problems through a tool called level access. These flagged items were then added to Jira for the developers to knock down as quick wins.

REDESIGN OUTCOME

Overall Redesign Impact

Updated branding, increased findability and product benefits comprehension all lead to a unified family of pages that drove higher quality acquisitions to convert.

15%

Increase in acquisition funnel entrance.

32%

Increase in overall conversion

25%

Reduction in overall page bounce rates

Back

Reach out