JUNE 29, 2022
HEALTH CARE COST ESTIMATOR FOR VANGUARD
A free estimator tool for advisors to facilitate their clients when planning for health care costs.
—OVERVIEW
WHAT
Vanguard’s health care tool aims to deliver more ease of mind in addressing the complexities around health care planning by offering simple questionnaires that provide options for clients to use in their planning process. This holistic tool consists of an estimator that churns numbers to provide first year health care, and long term care costs. In addition to that, it facilitates the advisor to further their conversations about medicare plans with their clients by being able to match their preferences to the plans. The advisor can also create comparisons of estimates for their clients to make an informed decision.
WHY
Planning for retirement can be challenging. Retirees worry about outliving their money, with high health care costs being the biggest worry. The health care cost estimator is another useful tool in the financial advisor’s toolkit to put their clients at ease by helping them plan for health care costs alongside their retirement planning.
HOW
This holistic tool was built in partnership with Mercer, a leading benefits provider. The printable inflation-adjusted and location-based estimates include costs for health care and long-term care applicable for the first year of care. It goes in depth and matches client preferences to a medicare plan. Furthermore, it enables a side by side analysis of health care costs in different scenarios; all of which is supported by expert resources, and insights.
PROJECT GOALS
We wanted to create an opportunity for sales to create meetings with advisors and to expand the reach to priority broker dealers. We also wanted to enhance digital engagement in terms of stickiness, and retention. Lastly, we wanted to support planned marketing efforts to support advisors with health care conversations as part of open enrollment.
Role — UX Design Consultant
Tools — Sketch, Invision, Mural, Airtable
Duration — 5 months
Scope — Strategy, Interaction design, Interface design
—INTRODUCTION: CONTEXT AND BUILDING BLOCKS
Understanding all the external factors, such as business needs, and technical constraints
Vanguard as an enterprise has a lot of divisions that leverage the same tools. Health care cost estimator originally was an effort of Vanguard Retirement Optimizer (another product of Vanguard). Our stakeholders deliberated that it would be beneficial for the users (financial advisors) in the financial planning realm to also be able to use the tool that is not behind the firewall. While health care cost estimator on the Vanguard Retirement Optimizer was a tool within another experience; for the financial advisors we wanted to make it a standalone tool. Thus, it needed an orientation in the form of a landing page.
Although, as a team, we were availing the previously conducted research, we had to take into account the differences in the user flow, and the UI from the one applicable to the VRO product. VRO had a different design system, thus to make it cohesive with the UI of the website the product was to live in, there was reskinning, and re-strategizing required.
The overarching purpose for the landing page was to offer a holistic view into the health care cost estimator. Right of the bat it invites the user to dive into the estimator if they need no assistance in starting conversations with their clients, and understand the main areas of health care costs in retirement.
Other than that the landing page is fully equipped with detailed advisor’s action guides, frequently asked questions about the results of the estimator, as well as featured insights.
Landing page
Version 1
Version 2
I laid out the framework for the landing page by collaborating with a content strategist. My first attempt is as shown in the first video clip. I used the components from the design system, such as the sticky header to keep the user anchored to what category of information they are in, as they scroll. Other notable things include the division of content.
In my second iteration, as seen in version 2, I decided to change the hero image from something very geometrical to something that creates a softer, and empathetic look as the topic is planning for costs in retirement. I decided to go for a warmer toned image that also showed humans to elicit the sense of relatability. Some other iterations that were made from V1 were:
My contributions
reconsideration of typographical hierarchy.
call to action buttons were minimized to reduce decision making on the user’s behalf. In fact the tertiary buttons dedicated to downloading more material were then changed into hyperlinks within the content.
the choice of colors was also toned down, to stay more in line with the design system.
a lot of deliberate resizing, and realigning was done to create breathing space between the elements and give a more clean, and concise look.
—DIVING INTO THE EPICENTER OF THE EXPERIENCE
RESKINNING AND RE-STRATEGIZING THE TOOL
From the landing page the user accesses the estimator. The ask of this effort was minimal in terms of laying the framework of the tool; all the inputs and required field remained the same as it was in the tool in the VRO product. The differentiating factors included proper categorization of the input fields in terms of optimum content strategy, a more clean, and modern user interface, specifically around the selection of a partner/spouse in the cost estimation, a more comprehensible UI around additional information and tooltips. The comparison can be seen in the clips shown below. The experience is broken down into two scenarios - a single client, or client with their partner.
Health care cost estimator
HCCE as seen on Vanguard Retirement Optimizer - V2
Final version as seen on the Financial Advisors website
HCCE as seen on Vanguard Retirement Optimizer - V1
Client scenario
Client with partner scenario
Final version as seen on the Financial Advisors website - client and partner scenario
Since there wasn’t much deliberation done on the design work for the main tool screen, the iterations were nominal, and I dove right into leveraging the components from the design system for the UI. Some of the changes that I made were:
My contributions
Consolidating the inputs in categories for easier comprehension. The thought behind this change was to ease the process for the advisor when it comes to collecting information from the clients. Containing it within the categories provides them with an overarching view of what types of information they require to make estimation on their clients behalf so they can relay that information to their client before their meeting to clear the fluff. These categories included: Client information, Selection of health care plans, and Selection of health risk category.
I added the option of “clear all fields” in case the user wants to start from scratch.
Majority of the input fields had extra information but in order to respect the real estate of the screen I annotated them with superscripts, and inserted their corresponding information in the disclosures and footnotes section, down below the screen. In the previous version, the approach was different; there were information icons next to these fields; once hovered over, they would exhibit a box with that information.
There were some improvisation done to the estimator after its first release. One of which being offering more material about household income at retirement. Research showed that a lot of advisors were not well informed about how the income at retirement can affect the choice of medicare plans. Therefore, the business created a detailed pdf which I nested in a helper text right below the input field of “household income at retirement” so that the user can not miss it.
In the first VRO version, in the proximity of the medicare plan input, there is a helper text that invites the user to learn more about medicare plans. The business decided to transform it into a tool with the estimator, to create a cul-de-sac experience. In light of this development I wanted to give more real estate to the medicare match tool. This can be seen in the current version, in a blue container with a clear call to action button, next to the medicare plan section.
In one of the previous versions of VRO, there is no option to select a partner, that’s because the information is being pre-populated from the preceding user flow. In the second version, however, there is an option to select whether a spouse/partner needs to be added. For the financial advisors website, health care cost estimator is a standalone tool, and no information is being pre-populated from any previous flow. Keeping all these things in mind, I added a checkbox to add the spouse. As the user clicks the checkbox, the partner section opens up, and the inputs inputs required are populated on the screen.
Health care cost estimator results
The result of the health care cost estimator is given in dollar values, categorized into 50th, 75th, and 90th percentile. The percentile refers to the percentage of individuals with a similar background to the clients whose projected costs rank the same as or lower than the advisor’s client's based on the calculator's scoring criteria.
These costs are further grouped as “annual health care costs” and “lifetime long-term care costs”. Within the annual health care costs the medicate costs are further itemized into medical costs, dental costs, and vision costs. This however, is only applicable to 75th percentile as the backend can only crunch data for the specific percentile for the time being.
The itemized costs for annual health care costs was a feature enhancement based on user feedback. The user feedback also suggested that it would be a better experience if they were able to demonstrate to their clients multiple scenarios and show which estimate can be the most cost effective. We took that suggestion and designed an additional feature of scenario analysis.
HCCE results screen as seen on Vanguard Retirement Optimizer
HCCE results screen as seen on Financial Advisors website - V1
HCCE results screen as seen on Financial Advisors website - V2
An instance where the client is retiring after 65 therefore they do not have any pre-Medicare costs to account for.
What we see in the results on VRO is very minimal with very less comprehension around the estimates provided. It was also limited in terms of the percentiles it provided: 50th percentile for annual health care costs, and 75th percentile for the long term care costs. I had more data to engage with as a designer so I leaned on displaying that information more visually for easier comprehension. This approach also helped in terms of scalability, when later after the first release, we got user feedback to also incorporate itemized costs.
My contributions
To make the page more flavorful I added a splash of color in the header and introduced overlayed vector art.
For the purpose of simpler navigation, and also to acclimate the user with what to expect on the screen, I added a secondary navigation bar that also behaved as a sticky header, meaning it stayed on top of the screen as the user scrolled, in fact the tabs would be highlighted as the user scrolls to the respective section of the page.
I reconsidered the usability of some of the buttons from version 1 and re-positioned them in version 2 of the design.
The first version did not cater for the inclusion of the itemized costs, therefore it was easier to include the estimates for pre-medicare costs next to the medicare costs. Once we decided to incorporate itemized costs for the medicare costs, as well as pre-medicare costs in certain instances, it was hard to push in all that data into the same layout. Therefore, I introduced more rows and columns, and extracted pre-medicare costs from the medicare costs space, and allotted it its own section prior to the medicare costs. Pre-medicare costs also came with their own itemized costs therefore this layout was more comprehensive and thorough.
The inclusion of partner was treated in the same way as seen in the visuals above. The medicare costs populate below the client’s medicare costs. However I also had to consider a use case where the client, and the partner both are retiring before the age of 65 which would mean that both will also be eligible for pre-medicare costs. This use case is also shown in the above visuals - the partner’s pre-medicare costs can be seen on the side of the client’s in the pre-medicare costs section.
Lastly, to continue the experience into the Scenario Analysis feature, the results screen made the most sense, because the user at this point can consider comparing other estimates with the one they get. To keep it subtle, so that the user’s attention does not get drawn to the feature right away, digressing them from the actual purpose of the screen, I created a banner with the call to action button, and muted colors below the estimates. Scenario analysis tab was also added to the sticky header.
HCCE results screen as seen on Financial Advisors website
An instance where the client is retiring before 65 therefore they have pre-medicare costs to account for.
HCCE results screen as seen on Financial Advisors website
An instance where the client and partner are retiring before 65 therefore they have pre-medicare costs to account for.
Challenges
Due to a lot of business factors I believe the design suffered a little. There was a lot of uncertainty around the usage of the design system because of lack of unanimity amongst the superiors.
I was riding solo on this project; I was my own advocate. So I took some decisions in time, with the information I was provided. Once there was an established hierarchy and team leads were assigned, I learnt more about the logistics and the ins and outs of the project which encouraged me to highlight the subtle inconsistency around some components in the design. However, due to lack of resources, the business decided to back log those factors.
—CAPITALIZING ON THE USER FEEDBACK
ENHANCING THE TOOL
After the release of the tool, the business received a lot of positive feedback as well as recommendations of what the user would fancy seeing - Scenario Analysis was the result of one such recommendation.
Scenario analysis is a continuation of the health care offer. The user accesses this part of the experience from the result screen of the estimator. Scenario analysis is a comparison between the estimates. It enables the user to create up to three scenarios by altering any of the inputs that play into the estimates. They can then launch a scenario out of the many and see the detailed cost estimates as the experience then takes them back to the results screen.
Scenario Analysis
Previous version
Current version
The thought process behind this part of the experience was to keep the journey seamless. The contents of the scenario analysis screen are an amalgamation of the components from the estimator, and from the results of the tool. Since the idea was to provide the user with comparisons, I wanted to make it easy for the audience to draw out those comparisons by creating a visual comprehension. So I created a legend from the inputs required in the estimator, and the categories of the dollar values that the estimator then crunches. I created a layout of vertical card columns that housed the estimator values. When the user enters the scenario analysis experience, they are bringing in the results that they received from the estimator; they are shown as “current scenario” in the scenario analysis experience.
First version of the design
My initial idea for the interface when adding a scenario was to slide out a section for the inputs where the user can type in their new values. Once they click the button to estimate costs it will translate into another vertical column card namely Comparison A. When the partner field would be selected that would mean that the information about the partner will populate on the screen. When adding a new scenario a similar container will slide out next to the partner section for the user to add in their inputs. The downside with that approach was more around the visual aspect of the UI; the spacing, the composition, and the behavioral aspect of the components was not in line with the design system, as well as general composition rules. Besides that there was a backend limitation; we could not introduce the option of selecting the partner within the scenario analysis experience for the user, it had to come from the very starting point of the estimator when the user checks off the partner field.
Second version of the design
Keeping those reservations in mind I removed the “add partner” checkbox from the scenario analysis screen as the partner information will be carried forward from the main tool page. To streamline the component where the user can change inputs I did a design system audit, and reviewed the website where the tool will be living on to find some elements of the UI which I can utilize to create consistency. I decided to opt for an overlay approach; so when the user clicks “add a scenario" button the inputs are presented in a box as an overlay. All the inputs from the estimator are shown in the box along with the estimate costs call to action button.
—TAPPING INTO THE OPPORTUNITIES
CREATING A CUL-DE-SAC EXPERIENCE
Our UX team saw an opportunity stemming from the health care plans input in the cost estimator; Medicare Match was a result of this effort.
One of the enhancements we intended to bring to the Health Care Calculator product was the Medicare Match Service created by Enterprise Advice. Throughout the initial launch of the MVP, we saw some roadblocks to completion of the Health Care Calculator journey. Once users made it to the beginning of the calculator experience itself, only 65% made it through to the results. Feedback from advisors suggested that one of the challenges was the selection of a Medicare plan itself - a key input in the calculator. This feedback coincided with the prior research done in the Health Care space within Vanguard Retirement Optimizer (VRO) where we found that Health Care planning was an area where advisors appear to have more of a disadvantage relative to other planning topics.
Medicare match was a contemplated result of having a mechanism constructed by the enterprise’s methodology that needed a simplified experience and look. Taking a strategic approach, we created a 4 step questionnaire to articulate possible results that can align with the clients’ preferences. As a result, this will facilitate the advisors to identify the coverage that best matches with their clients’ needs. In other words, the answers to the questionnaire represents the closest available Medicare plan that the advisor can use to model costs. The plans are ranked based on the client’s preferences.
Few things to keep in mind were:
Medicare Match
Current version
We learnt that the outputs from Medicare Match did not have a 1 to 1 corollary in the Health Plan selection of Health Care Cost calculator - meaning, you risk getting a result from Medicare Match that cannot be selected as an input in Health Care Calculator.
The team in Retail worked around this leveraging a mapping logic of Medicare Match outputs to Health Care Calculator inputs. We then worked around as to how we might leverage this, especially catering for the need to make the mapping logic apparent to the end user.
Previous wireframes from the VRO product
My contributions
While Medicare Match did not materialize for the VRO product, the wireframes were useful as a reference point. The initial approach to the Medicare Match tool on VRO started from the helper text beneath the Medicare plan input field on the health care cost estimator screen. I refined that approach in order to give the tool more significance.
In VRO the entire tool is designed in an overlay. I assigned more weightage to the tool by dedicating it complete real estate on the screen, still staying true to the cul-de-sac experience.
The results of the Medicare Match were very hard to read by the end user. A lot of the details and valuable information was lost in translation. As a team we decided to lay it out in a more comprehensive format. As the medicare plans were contingent upon the zip codes, as well as the client preferences, working with the developers we decided that we can assign percentages to the plans that were close to the client’s preferences. That way they can visually see what plan works best for them. To each plan I also added the tag of which one is available in their area.
The results of the Medicare match were very similar in treatment with the scenario analysis interface where I created a legend on the left side based on the questions asked to determine the client’s criteria and then mapped those with the ones within the plans.
To cater to the limitations of the model, I also added disclaimers to each plan, and informed the user that while based on their criteria a certain plan works best for them but for the sake of the calculation, another plan that our model accommodate, can be mapped and input in the calculator to get a decent estimate.
—REFLECTION AND NEXT STEPS
UX is more than just discovery and design
It is equal parts soft skills, and proactive communication with the stakeholders. I had to advocate not just for myself, but my design decisions as well. There was a limited UX personnel which meant there were less people to signify the importance of design, and user experience in a product roadmap. As a solo designer I had to do most of that leg work.
Iterations are important
It is always a good refresher to have as a designer that no matter how far you go in the design work there is a huge possibility that there will be a full fledge iteration needed. I personally think that the decision taken to trim down and consolidate the elements of the design was a fruitful decision in terms of the longevity, and scalability of the design.
There is no such thing as a dumb question
In retrospect I think asking more questions would have been helpful and worked in my favor. I had this fear that my questions may come off as dumb, or stupid, which refrained me from asking. While it did push me to do my own research, and dig through the plethora of resources, it was a trade off for time and restlessness.
Next steps
The health care cost estimator tool carries a lot of potential, and is flourishing every since its first elevation. There are ongoing enhancements of providing more resources and content within the tool, to make it easier for the users to comprehend the mechanism of financial planning, and health care costs.