Vanguard

About

Responsive Web | 2020 - 2021

Our team at Deloitte delivered a complete overhaul of Vanguard’s entire Participant Experience – where a user will interact and manage their employer sponsored 401(k) plan.

My role

Senior Product Designer

As one of the most senior product designers, I was tasked with the more complex user flows and interactions. I was responsible for the design ideation, wireframes and dev-ready UI design.

Product team: Domestic & international product designers | copywriters | developers | creative director | product management | client stakeholders

Understanding the challenge

Where Vanguard was, before we started

The Vanguard Participant experience was in need of a design over-haul. It was cluttered, confusing, and out-dated. Investing for retirement is a complex process and this former design did not make it any easier.

We needed to reimagine the entire experience and it's core features from scratch and bring a user-centered approach it’s execution.  

Researching our users

The foundation of our experience transformation efforts

Our approach was research and user testing led that ensured our end-to-end design experience was serving Vanguard's customers (“Participants”) effectively. Our core goal was to build trust and confidence in a complex space of retirement savings.

Our research team conducted 6-weeks of in-person interviews, testing, and proof-of-concept prototyping.

We learned Participants need:
→ Small, achievable targets
→ Contextual, relevant advice
→ Reassurance along the way

*These were our high-level north stars. Each feature we took on had robust user insights and followed-up with user testing.

Information zoning

Low fidelity iteration

Before translating designs in to digital wireframes, I sketch the needs of the interaction from a 500-foot view. This helps me weigh approaches and ultimately define the context and hierarchy of the experience.

Sketching & wireframes

Taking our thinking up a notch

Next, I then translate the idea first in to sketches, followed by higher fidelity wireframes that we use in stakeholder and team reviews. These artifacts help how I iterate, refine, and pressure test across devices and scenarios.

UI design & prototypes

Finalizing the happy path and alternative states

At this stage, we transform the wires in to the UI design. We were supplied with brand colors, typography, and illustration styles. However, this over-haul required us to design and develop a new and scalable design system, including new interaction patterns and components.

Scroll to explore
Desktop
Mobile
The dynamic nature of the dashboard and the wide range of user types required multiple permutations of each section.
Dive deeper into Vanguard

See more Vanguard case studies

Vanguard's experience transformation was a huge undertaking for the team. Learn more about other features I worked on to get a taste of the depth of research, strategy and design thought that we brought to each feature.