Vanguard × UNC Hussman School of Journalism
UX Research · Interaction Design

Vanguard Year in Review Redesign

Transform the Vanguard Year in Review into an adaptive and interactive financial experience that adjusts to each user's needs, compares progress over time, explores future possibilities, and remains accessible to revisit and understand.

Figma Usability Testing Card Sorting Personas User Flows Hi-Fi Prototype
Explore the Prototype
Scroll to explore
Vanguard Year in Review — redesigned welcome screen showing the Guided/Self-Directed toggle

Role

UX Researcher
& Designer

Client

Vanguard

× UNC Hussman

Team

Sanjana Nukala
Nora Lyons
Bettina George
Francesca Fabiano-Grossi
Ben Eggleston

Timeline

Jan – May 2026

MEJO 581

Tools

Figma
Card Sorting
Think-Aloud Testing

01 / The Challenge

The Problem

Vangaurd wanted a redesign for their "Year in Review" feature as clients often underutilize it due to misunderstanding and lack of clarity regarding its benefits and specific features. The redesign targets retirees and those aged 50+ approaching retirement. This group represents a wide spectrum of financial literacy and comfort with technology.

The goal of this redesign is to show retirees exactly how Digital Advisor helps them, making the "Year in Review" more personal and easy to understand. By focusing on what retirees care about most, the redesign aims to turn confusion into confidence, encouraging them to use the feature to stay engaged and take clear steps toward their financial goals.

02a / Research

Getting to Know
Our Users

Before designing anything, we needed to understand how our users actually think about their finances and use the website. We ran listening sessions over zoom with investors 50+ to hear about their priorities, their relationship with financial tools, and what it means to feel "on track." Then we used moderated usability tests to have them test Vanguard's existing prototype.

Methodology

  • 5 participants, ages 50–67
  • Mixed levels of financial literacy and technical expertise
  • Moderated remote sessions over Zoom, 40–60 min each
  • Think-aloud protocol across 5 tasks
  • Likert scale evaluation + post-test interview

Participant profiles

Participant 1 — Professor & Dean

P1

56 years old Professor & Dean
Quechee, VT
Participant 2 — Adjunct Professor

P2

60 years old Adjunct Professor
Chapel Hill, NC
Participant 3 — Software Engineer

P3

50 years old Software Engineer
Cary, NC
Participant 4 — Professor

P4

67 years old Professor
Greensboro, NC
Participant 5 — Stay-at-home mom

P5

50 years old Stay-at-home mom
Charlotte, NC

02b / Research

Key Findings

What users liked

Visualizations like asset breakdowns, balance changes, retirement gauges were clear and concise even for lower-literacy users
Users could easily exit mid-review to edit contributions, then return
The option to skip straight to the action checklist was a standout feature
The YIR being optional was strongly preferred
Get a quick overview of their financial situation

"If you had to do it, that would be annoying. They have it like this, that's the way to do it."

Participant on the optional nature of the Year in Review

Problem findings — by severity

🔴 Catastrophic
—

The Year in Review expired on 02/11. Users couldn't return to it after the expiration date — critical, since many use it for tax season.

"People will need to use the YIR for tax season."

🟠 Major
—

Feature buried on homepage — required scrolling to find.

"I would have liked it if along the top there was a thing that said Year in Review."

—

No back button after navigating to Next Steps — users were frustrated.

—

No monthly breakdown — only start-of-year to end-of-year data.

—

Financial insights too vague to act on — unclear retirement progress.

🟡 Minor
—

External accounts not visible; managed-account links went nowhere.

—

Financial explanations felt redundant for near-retirement users.

"That's not my problem, they're the experts."

—

Dismiss/action button positions reversed and inconsistent. Progress dots not interactive — tedious to navigate backwards.

—

Inconsistent color palette across graphics.

"If I have to scroll down to look at it, I would ignore it."

Participant on feature discoverability

02c / Research

Our Four
Personas

We organized our usability findings into scales and mapped participants across them to identify distinct user types and design needs. We made scales that defined how often they check their accounts, trust in automation, preference for detail vs. simplicity, comfort with technology, level of financial education, and emotional confidence.

From this we identified four distinct user types, and they confirmed our findings that: one size does not fit all. Each user type had different needs and preferences, and we had to design an experience that could adapt to them to meet these competing needs.

Behavioral scale chart mapping participants across six dimensions to four user types
The Delegator persona

The Delegator

Low-tech, hands-off retiree who values simplicity and trust. Prefers financial tools that make decisions for them so they can focus on enjoying retirement.

The Careful Explorer persona

The Careful Explorer

Highly comfortable with technology and moderately financially literate. Actively monitors finances but wants clear explanations and reassurance before making important retirement decisions.

The Uncertain Learner persona

The Uncertain Learner

Cautious but motivated planner. Wants simple, trustworthy guidance without feeling overwhelmed by complex financial information.

The Tech Savvy Monitor persona

The Tech Savvy Monitor

Highly tech-savvy and financially sophisticated. Wants detailed data, advanced tools, and full control — no oversimplified explanations.

Audience Brief

  • Age 50+, approaching or in retirement
  • Different financial literacy levels
  • Varying comfort with technology
  • Struggle with small text, dense screens, long reading sessions
  • Need tools that feel trustworthy, simple, and personalized
  • Want to revisit insights later via saved reports or PDFs

Key problems we identified through our research

1

Financial Tracking

Users nearing or in retirement want to see annual financial trends to track their investments over time to identify any patterns or insights over the years.

2

Different Finance Experience

Users with different financial backgrounds had very different reactions to the same content and graphics. One experience was trying to serve everyone and ending up serving no one fully.

3

User Preferences

Users across different age demographics and backgrounds lacked features that could make the experience more accessible. Many were frustrated with each page’s layout and preferred the website where they could choose what to look at.

03a / Structure & Thinking

From Research to
Architecture

As we moved into design, we used the card sort method to to group the different features and the way users interacted with them. Rather than diving straight into the structure we used the card sort to organize the sequence. We noticed a general structure that seemed to resonate: start with familiar, reassuring information (overall account health), then layer in complexity (projections, comparisons, simulators) only after users feel grounded in their data.

Card sort results showing how users naturally grouped financial information

03b / Structure & Thinking

Two Paths Through
the Review

Based on this idea we experimented with 2 flows. Flow 1 centers on the Guided/Self-Directed toggle. Flow 2 leads with animation and theme customization. However, both share the same preferred path through the core content.

Flow 1 — Toggle-focused user flow diagram with all branches and decision points
Flow 2 — Animation-focused user flow diagram

03c / Structure & Thinking

Why We Structured
It This Way

Decision 1

Toggle at Entry

The decision

Guided vs. Self-Directed mode selection before any content loads.

The reasoning

Digital and financial literacy vary enormously in the 50+ audience. A single toggle at entry serves both groups without requiring two separate structures."This allows the sequence to stay the same, regardless of the type of user, and maintains a predictable path.

Decision 2

What-If Simulator Placed Late in the Flow

The decision

The simulator appears on the Contributions page and Retirement Goal page — not at the start.

The reasoning

I argued for this placement specifically because users need to feel comfortable with the numbers and insights before experimenting with hypotheticals. Placing it earlier creates decision anxiety. When users are already looking at their contributions and start wondering "what-if," they are more likely to naturally engage with this feature. This is directly traceable to my card sort sequence.

04 / Design Process

From Sticky Notes
to Screens

Ideation

Our team ran a design thinking session over Zoom, moving from illogical ideas → original ideas → refined ideas using "Yes AND" buildouts to develop each concept. My contributions that made it into the final design:

Interactive visualizations with large, tappable graphics → the animated donut chart and bar comparisons
What-if simulator for contributions and retirement age → integrated into Contributions and Retirement Goal screens
Voiceover feature for accessibility → optional audio overlay throughout the flow
PDF download / save-to-profile → the End of Report export feature
Personalized goal-setting at entry → became the Guided/Advanced toggle mode
Original ideas from design thinking session — sticky note board
Refined ideas from design thinking session — developed concepts

Original ideas (left) refined through "Yes AND" buildouts into actionable features (right).

Screen-by-Screen Specification

Before touching Figma's visual layer, we built a full content specification — 11 screens, each with defined content, new features, data visualization types, button actions, and UI elements. This helped connect our research findings and the prototype: specifying what every screen needed to accomplish before designing how it would look.

Flows → Specification → Hi-Fi

The design progressed through three phases, each building on the last, with research guiding every structural choice.

User flow diagram — mapping every branch and decision point
1

User Flows

"Mapping every branch, decision point, and preferred path."

Refined concepts — content hierarchy and interaction spec
2

Content Specification

"Defining content, hierarchy, and interaction for each screen before styling."

High-fidelity prototype — final design within Vanguard's visual system
3

Hi-Fi Prototype

"The final prototype, built within Vanguard's visual system."

05 / The Final Design

The
Redesign

Prototype Walkthroughs

Beginner Mode

Guided experience — simplified explanations and a curated path through the review

Advanced Mode

Self-directed experience — full data access, detailed charts, and advanced features

See It In Action —
Explore the Full Prototype

11 screens · Adaptive modes · Interactive visualizations · PDF export

Explore the Full Prototype
⚙️

The Toggle

To account for varying financial literacy, we added a Guided vs. Self-Directed toggle at the start of the Year in Review. This gives users immediate control: "Guided Mode" simplifies language and visuals for casual investors, while "Self-Directed Mode" provides the deep analytics advanced users expect. This manual choice ensures accuracy and personalization without extra steps needed from something like a survey.

Welcome screen showing the Guided/Self-Directed toggle with Start review and Skip to checklist buttons
✨

Interactivity & Accessibility

The original YIR was a static scroll. Our redesign replaced this passive experience with interaction: subtle animations draw attention to key data, milestone pop-ups celebrate achievements, and every graphic is tappable for deeper detail. The optional voiceover feature, one of my original suggestions, builds on our research that some retirees struggle with dense on-screen text. This adds a layer of accessibility without cluttering the experience. Larger fonts and high-contrast illustrations also support readability throughout.

📊

Year-Over-Year Comparison

One of our major usability findings was that users wanted to see progress over time, not just a brief overview of the current year. Our redesign adds "You vs. You Last Year" comparisons, and a dedicated archive of past Year in Reviews organized by year. For users closer to retirement, an optional Quarter in Review provides even more detail as their financial progress becomes more important.

Year-over-year comparison showing previous vs. current retirement funding status gauges
🎚️

What-If Simulator

The what-if simulator and its placement was one of my original ideas. It appears on the Contributions page and the Retirement Goal page: the exact moments when users are already engaged with their own data and naturally start asking "what if I changed something?" The inputs on this overlay let users adress immediate concerns and allow of actionable insights.

What-if simulator with sliders for monthly contribution, retirement age, and income goal showing projected balance and likelihood
📥

PDF Export & Archive

The YIR expiration was the single most catastrophic problem we found. Users couldn't return to it after 02/11, even when they needed it for tax season. The PDF export directly solves this by letting users keep their reviews for later use. The archive lets users revisit any past Year in Review on demand. For the segment of the 50+ audience that prefers a tangible document over an app experience, this is the feature that makes the whole redesign actually useful in the long run.

Archive of past Year in Review reports organized by year Save YIR as PDF feature on the end screen

Why it works — feature summary

Feature What it solves Who it serves
Guided / Self-Directed Toggle
One experience that works for both high- and low-literacy users without splitting the structure
The Delegator · The Tech Savvy Monitor
Interactive Animations & Voiceover
Replaces passive scrolling with engaging interaction; addresses accessibility for users who struggle with dense text
The Uncertain Learner · The Delegator
Year-Over-Year Comparison
Turns a snapshot into a story — users see progress, not just a number
All personas
What-If Simulator
Empowers users to explore retirement scenarios at the exact moment they're already engaged with their data
The Careful Explorer · The Tech Savvy Monitor
PDF Export & Archive
Permanently solves the expiration problem — report available any time, no login required, tax-season ready
All personas

06 / My Role

My Role

The Team Accomplished

A complete UX pipeline: listening sessions, moderated usability testing with 5 participants ages 50–67
Behavioral persona development
Card sort informing information architecture
Two full user flows with 11+ annotated screens
A high-fidelity Figma prototype pitched directly to the Vanguard client team

What I Specifically Contributed

Wrote many of the core think-aloud task scenarios for the usability test that the five tasks participants completed during testing
Identified major and minor problems from my individual participant's session
Built out the Careful Explorer persona (technically literate, moderately confident — the user type most similar to my own usability test participant)
Brainstormed the ideas for interactive visualizations, what-if simulator, voiceover, and PDF export — all four appear in the final design
Used my card sort results as the structural backbone of Flow 1's screen sequence. I also was a primary contributer for flow 1.
Encouraged team dynamics and collaboration, especially with the ideation process.

07 / Reflection

What I
Took Away

What I'd Improve

There were many insights we got from our initial research that I would have loved to implement as well. For example, a smaller detail we noticed from the research was that some users didn’t like the style of the graphics or the number of pages in the YIR. I think it would be interesting to explore different style choices or reduce some of the existing screens to adress smaller insights like this.

What Surprised Me

I was really surprised how different types of users interact with products. When I initially went through the Vanguard site, there were some problematic points I noticed that I expected us to fix but when we gathered our insights I was surprised to find how frustrated users got over small details I ignored. In regards to the process of creating the redesign, I was surprised by the challenges of working on a project like this with a team. While, I think the end product ended up much better because of our collaboration, I was surprised to see the different approaches to design and brainstorming my teammates had and it was a learning process to combine our vision into one.

What I Learned and How This Shaped My Thinking

I learned how crucial UX research is to the process of UX design. When I first started this class I thought UX design mostly included creating Figma designs and making things look more aesthetically pleasing and structured. However, through this project I was able to build on my empathy driven design skills and create designs that truly resonate with user needs. I learned how important it is to delve into each aspect of the UX process and how these small steps impact the a cohesive and effective final product. I also learned how doing user research is not just understanding who they are and their demographics but understanding how they think. This was a lesson I especially learned through building our user personas because they all ended up being based on how a user interacts with a financial site, like how often they checked their accounts or how they approached a financial decision.

Pitched to
Vanguard

A complete UX research and design pipeline — from moderated usability testing with five retirement-age participants to a high-fidelity Figma prototype — pitched directly to the Vanguard client team. Five features, one cohesive flow, and a behavioral design framework that serves every user type without splitting the experience.

Explore the Prototype
← Previous Flare All Work → Back to Projects