⚠︎ Please consider viewing on desktop for the best experience

Promoting Action & Engagement with Market Insights

Finance Data

Design Strategy

Interconnected Components

The Client: Big 4 Canadian Bank [kept anonymous by client request]

My Role: Primary UX Designer | Agency | Team of 4 designers, dev lead, data lead, QA, product owners

The Problem:

A key homepage feature surfacing holding updates & events was being seen by only 0.10% of the platform's users, roughly 30,000 people out of millions. The content existed but wasn't compelling enough to notice, understand, or act on.

The Solution:

Redesigned the holding events experience across several phases; transforming a low-visibility event module into a personalized, actionable feature with real-time updates, smart contextual text, and a mobile-responsive design– targeting a 30% increase in user engagement.

  • Built a modular component with event tags, dynamic smart text, & inline CTAs to reduce friction between insight and action

  • Designed responsive components across all breakpoints for simultaneous desktop and mobile parity

  • Created a full Figma dev handoff spec covering components, spacing, interactions, edge cases, and zero states

This project was a long one with a lot of moving parts.

The client had just received a ~$13 billion to use for infrastructure uplifting. Event insight modules had to be designed in tandem with several product streams. This project & the Detailed Quote (DQ) uplift was a part of that uplift.

(click on image to expand view)

Strategic UX Decision

Based on the success criteria provided by the client, our team recommended a “Short Track” and “Long Track” phased delivery strategy. Ship 9 new propriety event insight types quickly with minimal design disruption to prove value, then use that momentum to justify the full experience rethink. Incremental release reduced stakeholder risk while keeping the long-term vision intact.

What design strategy for long-track looks like while the project was still in short-track?

During the short-track of the event insights project, the detailed quote (DQ) page redesign was about to begin. I saw an opportunity to implement proprietary product on to a page that could greatly benefit from the event insights. The question I was asking as we were preparing to transition to the long-track was: where in their investing/ research journey would users want to see personalized holding information?

▲ The top is a concept of bringing insights into a popover module that could act as supplemental information for novice users, highlight interesting events within the user’s holdings that is relevant to the stock that is being researched, and as a navigational component to drive traffic to other areas of the client’s site.

(click on images to expand view)

◄ The bottom is the same concept, but bringing the insights into a text heavy page like the news portion of the site. The event insight modules add engaging visuals as well as provide quick preview to the dividend information without taking the user away from their investing journey.

Process Snapshot

A year+ project across several phases with multiple start/stops to accommodate for incremental updates, covering research analysis, UX design, responsive design, and full development hand-off. The phases were designated as “short-term” & “long-term”, all immediate design needs were to be delivered in the short term, while the long term success was determined by a holistic look at the entire experience of the event insights.

(click on image to expand view)

Designs Through the Phases:

Legacy Design

The events are proprietary to the internal agency and have been injected into the client’s page without any design retrofitting. The initial experience is an out-of-the-box integration and had been an easy win to have client-buy-in to include within the homepage.

(click on images to expand view)

Short-Track Design

The new event insights were updated to the most recent brand style guideline from the company. The homepage is still within the legacy design, meaning that the main priority for this phase is to update the style as well as adding call-to-action drop-down buttons (CTA) that assisted in creating a directive for users to take action but also to drive traffic to other areas of the site beyond the homepage. The drop-down buttons hid several actions (quote page, buy, sell, & add to watchlist).

Long-Track Design

The final designs take in consideration the entire site uplift and the new homepage designs. The drop-down CTA was removed to favor a singular action that is unique to the event type due to improved capabilities and new dev efforts to building the module. The updated event insights provide categorical indicators to assist with the variety events that are possible, but also accounts for any future events that the client wants to add.

User Flows & Idea Mapping

Created using client provided personas that are based on main behavior archetypes that their users embody when researching stocks.

(click on images to expand)