HelloWallet’s Retirement Explorer

Company: HelloWallet (2010-2015)
Roles: Director of UX, Lead Product Designer, Data Visualization Designer

Introduction

In 2013 I lead a team of UX Designers, Visual Designers, and Engineers to create a new product that would revolutionize the way people in the United States planned for retirement. It was called “Retirement Explorer”, a separate - yet integrated - product for HelloWallet to offer its user base. Before leading the team, I broke off from the main product development group to explore what this product should be.

Product Goals

• Be exploratory in nature; allow users to explore how small financial changes today can have massive impacts to their retirement "picture" later in life

• Keep interactions simple, and use clever data visualizations to show exactly how money grows, and how it is spent in retirement

• KPI's: Increase Retirement Plan Contributions, Increase Retirement Planning Engagement (QAU - Quarterly Active Users), Positive Feedback from Qualitative Research

The Result

Retirement Explorer was released and replaced flagship retirement systems of AonHewitt, Vanguard, Morningstar Inc., and others back in 2015. The product was so powerful that it was a major factor in Morningstar, Inc’s decision to acquire HelloWallet in 2014.

Shortly after I left HelloWallet, Retirement Explorer won Best in Show at Finovate Fall 2015 - the main annual FinTech conference.

Early Ideas (Calculator Approach)

The early idea was to simply recommend changes to savings and spending based on a powerful stochastic forecasting engine behind the scenes. However, early user testing of concepts proved that customers wouldn’t trust an opaque algorithm to make major life changes. It was clear we needed to allow people to explore themselves, with guidance along the way.

“Following talks with key stakeholders, I led my UX team in the creation of a more visual playground – something that was more “interactively educating” – with the UX Team.

Early Sketches (Visual Life Simulator)

We decided that the new experience was going to settle around something more familiar than what was initially envisioned. We wanted to design a graph that would show someone not only the results of their current retirement planning/saving, but how exactly non-decisions would affect their retirement picture.

Below you can see my original sketch, and some of the variations that were tested along the way.

Early Validation Wireframes

After more user testing validated the new, more interactive experience...I lead the UXD Team (User Experience/Design Team) in developing revised wireframes, and a more polished UI.

In order to power the underlying graphic engine, a lot of information about an individual was required. We came up with a mobile-menu design paradigm in order for users to navigate different inputs. It was important to have all inputs proximate to the graphed life simulation UI - preserving the "play & explore intention of the product.

Design Direction of Main UI

Users could slide the two 'lollipops' to see just how powerful retiring one year later can be (blue circle is the age at which they retire and magenta square is the age at which they accept social security). Also possible, sliding the social security lollipop to see affect on retirement savings and changing the 'income allocation' numbers on the left rail.

Demo at Finovate 2015

I left HelloWallet to pursue other opportunities in May 2015 – one year after we were acquired by Morningstar. Shortly after I left, HelloWallet demoed Retirement Explorer at the Finovate financial technology conference, winning Best in Show 2015. Below is a video of the demo that was performed by a product manager after I left. The ideas expressed were some of the design principles that I created designing, testing, and iterating on the product when it was in development.