UX Flow | Retirement Goal Creation

The problem: Most people have a vague idea of the financial goals they want to reach. More often than not, they aren't quite sure what steps to take to reach those goals, whether or not they've reached their goals, or how changes they make will impact their finances.

The objective: Introduce NerdWallet as a tool people can use to see their entire financial picture and identify ways to reach their goals with confidence. 

More specifically, this flow walks the user through setting up a retirement goal. The main challenge here was to give the user an understanding of their current savings, and to let them explore how small changes would impact their future. 

Oh yeah. And don't make it too long, too confusing, or too intimidating. Go!

Step one: account creation

Step one: account creation

Step two: gathering the basics

Step two: gathering the basics

Step three: log in details

Step three: log in details

Step four: goal selection. In this case, we will focus on the retirement goal.

Step four: goal selection. In this case, we will focus on the retirement goal.

Interstitial

Interstitial

Step five: retirement goal intro. We wanted to start with one simple question and then lead into the more “in the weeds” questions the user might not be ready to answer.

Step five: retirement goal intro. We wanted to start with one simple question and then lead into the more “in the weeds” questions the user might not be ready to answer.

Step six: gathering more information. Once again, this is information people know off-hand. User research found that by starting with one question and incorporating it into the next screen, users felt like they’d accomplished more in the process.

Step six: gathering more information. Once again, this is information people know off-hand. User research found that by starting with one question and incorporating it into the next screen, users felt like they’d accomplished more in the process.

Step seven: account linking. This was the most tricky part. We had very little room to reiterate that the process is safe, while also highlighting the benefits of linking accounts. Aside from “power users,” most people don’t know their account infor…

Step seven: account linking. This was the most tricky part. We had very little room to reiterate that the process is safe, while also highlighting the benefits of linking accounts. Aside from “power users,” most people don’t know their account information off-hand. Tapping “Maybe later” would give the option for people to self-report how much they had in their savings and retirement accounts.

Step 8: crunching the numbers. This shows people a baseline of where their retirement finances currently are and would lead them into the next step.

Step 8: crunching the numbers. This shows people a baseline of where their retirement finances currently are and would lead them into the next step.

Step nine: current contributions. This final step helps to calculate and show people how their money will grow based on how much they’re currently putting in.

Step nine: current contributions. This final step helps to calculate and show people how their money will grow based on how much they’re currently putting in.

Step ten: the outcome. This step was designed to allow people to adjust in real-time to see how their future income changes. If they retire a year earlier, how will that impact their retirement income? If they give $10 more a month, what will that a…

Step ten: the outcome. This step was designed to allow people to adjust in real-time to see how their future income changes. If they retire a year earlier, how will that impact their retirement income? If they give $10 more a month, what will that adjustment mean to them in 30 years? They can toggle, adjust, and find a contribution goal that makes sense for them currently, and in the future.

The end! A ten step process is a lot for most people to go through. The goal of the headers throughout the entire process was to make it more of a conversation – confirming that their input was received, and encouraging them to move forward. This is…

The end! A ten step process is a lot for most people to go through. The goal of the headers throughout the entire process was to make it more of a conversation – confirming that their input was received, and encouraging them to move forward. This is just a small moment of delight to say, “Good job, you did it.” The illustration mirrors the sentiment of growth. Planting something now will lead to a large, beautiful garden in the future.

Updated copy | Former copy

Previous
Previous

First Republic UX

Next
Next

Backstage Rebrand