How might we transform a failed retirement calculator into an MVP that delivers value for users and John Hancock?
UX Design
@ John Hancock
User Research
Roles
Product Designer
Team
Solo project
Duration
5 weeks
August - October 2023
Takeaways
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
User Insights
TL:DR
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
Solution:
-
description here description heredescription heredescription heredescription heredescription heredescription heredescription.
Takeaways
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
User Insights
Project Overview
Project Overview
A John Hancock external team previously launched a Retirement Planner tool—but it fell short. Our users are still wondering: will I be financially ready for retirement?
Objective
A former retirement calculator failed to resonate with users. I was called to rethink the experience and define a Minimum Viable Product (MVP) for the Personal Investing portal.
A former retirement calculator failed
For users: Deliver a retirement readiness experience that helps them understand where they stand and how to improve. This means making a complex and often overwhelming topic feel approachable and actionable.
-
For users: Deliver a retirement readiness experience that helps them understand where they stand and how to improve. This means making a complex and often overwhelming topic feel approachable and actionable.
-
For John Hancock: Create a trust-building moment that introduces users to our new Managed IRA offering, meeting them with value at the right time in their journey.
-
Uncover the behaviors, pain points, and moments of ease for users with visual or fine motor disabilities navigating our investing platform.
-
Identify key areas to improve digital accessibility and preserve user loyalty.
-
Define this unheard user group as a core John Hancock audience that shape future design decisions.
-
Engage stakeholders in expanding accessibility as a pillar that is explorative, generative, and human, rather than merely “compliant”.
Objective
A former retirement calculator failed to resonate with users. I was called to rethink the experience and define a Minimum Viable Product (MVP) for the Personal Investing portal.
-
For users: Deliver a retirement readiness experience that helps them understand where they stand and how to improve. This means making a complex and often overwhelming topic feel approachable and actionable.
-
For John Hancock: Create a trust-building moment that introduces users to our new Managed IRA offering (personalized advice for their needs).
Design Approach
As I worked through this project, I held onto a few key tenets:
-
Don't reinvent the wheel. Move past redesigning a UI, and study why users didn’t resonate with the former experience, and apply these insights to your reiterations.
-
Design for how people actually behave. Leverage psychology to design towards natural human behavior.
-
Think outcome-first. Create direction for the user, not dead ends, that unite the them and the business forward.
Design Process
Featured Prototype
Takeaways
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
User Insights
Preparatory Research
Preparatory Research
Leveraging Existing Research
Challenge
Stakeholders were eager to launch a competitive retirement planner—fast. With limited time, starting new research from scratch wasn’t feasible.
Solution
Instead, I analyzed existing primary research from past user interviews to uncover core sentiments around retirement uncertainty. Here’s what surfaced:
Takeaways
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
User Insights
Former User Interview Question:
Do you know if you will have enough
money to cover your expenses in retirement?
Takeaways
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
User Insights
Problem Statement
How might we build a retirement calculator that helps users know if they're on the right track to retirement?
How the Beta Performed
How the Beta Performed
Auditing a Failed Retirement Planner
Takeaways
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
User Insights
Before ideating, I examined data analytics of the previous, underperforming retirement planner to identify engagement drop-offs.
User Insights
Viewing documents has consistently scored the lowest completion rate out of other purposes.*
-
Discovery point: Most users didn’t engage on with the tile or email promoting the retirement planner.
Viewing documents has consistently scored the lowest completion rate out of other purposes.*
Design Opportunity
How might we capture user interest at the discovery point and encourage initial engagement?
-
Users quitting: For those who clicked the email, they didn’t complete the onboarding modal process.
Design Opportunity
How might we create an onboarding experience that encourages users to complete the process and stay engaged?
Takeaways
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
User Insights
UX Heuristics Audit of Former Retirement Planner
I audited the planner for usability issues, keeping in mind the ten usability heuristics.
Here are the problems I identified:
Takeaways
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
User Insights
Step 1: Onboarding Modal
Viewing documents has consistently scored the lowest completion rate out of other purposes.*
1. All the questions are placed on one modal, increasing the cognitive load.
Viewing documents has consistently scored the lowest completion rate out of other purposes.*
2. The modal asked for personal information that is sensitive, such as their health and income, without explicit reason as to how it will be used.
Solution
Clearly explain why and how user information will be used—to foster transparency and gather more meaningful feedback.

Takeaways
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
User Insights
Step 2: Retirement Planner
Viewing documents has consistently scored the lowest completion rate out of other purposes.*
3. Choice paralysis: So many filters to use become overwhelming for the users to play with, increasing the cognitive load again (Hick’s Law).
Viewing documents has consistently scored the lowest completion rate out of other purposes.*
4. No clear next step to guide users after completing process
Design Opportunity
How might we provide users with a clear next step after using our retirement planner?

User Insights
Insight 1/2
Discovery point: Most users didn’t engage on with the tile or email promoting the retirement planner.
Insight 2/2
Process: For those who clicked the email, they didn’t complete the onboarding modal process.
Design Opportunity
How might we capture user interest at the discovery point and encourage initial engagement?
Skip to final design
Design Opportunity
How might we create an onboarding experience that encourages users to complete the process?
Skip to Final Design
Design Opportunity
How might we instill trust and safety within the users when asking for their sensitive information?
Skip to Final Design
Design Opportunity
How might we provide users with clear next steps that guide them toward improving their retirement readiness?
Skip to Final Design
Takeaways
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
Design Process
description here description heredescription heredescription heredescription heredescription heredescription heredescription here
User Insights
Affinity Mapping
Affinity Mapping
Defining User Needs and MVP Offerings
I mapped insights from the former Retirement Planner, a competitive research report on retirement tools, and a marketing survey on how users choose investment funds. Then, in yellow post-its, I ideated summary MVP offerings for a redesigned retirement calculator.
Drag and zoom into this imbedded Figma file!
Interactive Prototype
Final Designs
Phase 1: Discovery Point
1. Spark Engagement with a Poll
I utilized the "spark effect" by designing a one-question poll to engage the user's mind in thinking about their retirement readiness (or lack thereof ). It helps them feel recognized while also serving as a smooth transition into the retirement planner.



Phase 2: Preserving User Engagement
2.1: Step-By-Step Process
The prior planner's all-in-one modal led to low task completion. My redesign breaks the process into individual screens with a timeline at the top to set user expectations and build anticipation, encouraging users to complete the process.


Phase 2: Preserving User Engagement
2.3: Hick's Law in Filtering
The previous planner overwhelmed users with too many filters. I simplified the process by limiting filters to three common, easy-to-understand factors: retirement age, yearly contribution, and spending, making the calculator an easier starting point for planning.
Phase 3: Ending the Flow
3. A Win-Win Conclusion
To nudge a clear, empowering "next step" to users, I used the Von Restorff effect and framing JH’s personalized Managed IRA as the standout option among two bland decoy choices. This approach not only guides users toward financial readiness but enables John Hancock to market their new offering in a relevant space.
