MyHealthfinder | Office of Disease Prevention & Health Promotion
Redesigning for Accessible Preventive Health Information
MyHealthfinder is a website that provides easily comprehensible information on preventive health care and features an assessment tool that delivers tailored recommendations for clinical preventive services based on age, sex, and pregnancy status.
The client asked for a redesign of MyHealthfinder to prepare for a major campaign, which encourages Black and Hispanic women to find out which clinical preventive services they might need. This gave me and my team a chance to make sure the website was user-friendly and followed health literacy best practices.
Role: Lead UX designer at CommunicateHealth
Timeline: 26 weeks
Problem
Prior to the redesign, MyHealthfinder was difficult to navigate and the information was not always presented in a clear and concise way. This made it difficult for users to find the information they needed and understand their personal preventive health recommendations.
Solution
I led a team of designers and developers to redesign MyHealthfinder with a focus on usability and accessibility. We conducted user research to understand the needs of our target audience and then used this information to design a more user-friendly interface and improve the way the information was presented.
The Result
The redesigned MyHealthfinder website was launched in 2023 and has been well-received by users. The site is now easier to navigate and the information is more clear and concise. As a result, more users are completing the assessment tool and finding the information they need to make informed decisions about their health.
Main Challenges
1/3
Redesigning the Homepage for New and Existing Users
Initially, the website seemed to primarily offer the MyHealthfinder tool, overlooking the extensive repository of over 100 plain language health topics in both English and Spanish. Recognizing the need to showcase this valuable information, I collaborated with the content team to revamp the top navigation, providing clearer access to key sections for easier browsing and topic selection.
To introduce MyHealthfinder to new users effectively, I proposed and refined a new introduction (hero) section. This involved a series of discussions with the content team to ensure it aligned seamlessly with the campaign's visual style and messaging. I also worked closely with graphic designers to ensure the imagery integrated seamlessly.
Following the hero section, users encounter the MyHealthfinder tool, which provides tailored recommendations for screenings and vaccines. I collaborated with the development team to design this form, ensuring it's engaging and user-friendly.
Additionally, I expanded the homepage to incorporate various health topics across the website. This enhancement provides users with a more straightforward way to access content of interest.
I used rapid prototyping wireframes to help bring visualize a robust and actionable homepage
Before
The initial page only shows a single function, entering an age and sex, there is no additional information on the page about the site.
After
The updated page leads with what this site has to offer, provides the tool, and highlights key health topics for easy browsing.
2/3
Enhancing Personalized Recommendations Actionability
The updated version now prominently reflect the personalized information input into the tool, providing more active and assertive messaging—a departure from the previous, more passive language. (e.g., ”You said you”… vs. “Here are“) This adjustment ensures users immediately recognize the tailored nature of the information presented.
Based on insights gathered from Optimal Sort card-sorting sessions, the content team and I identified distinct categories that offer more effective organization of recommendations. These categories include scheduling visits and screenings, pregnancy-specific information, discussions related to sexual activity, personal concerns, and assessing risk. Incorporating bullet points and removing of redundant sentences has also contributed to a cleaner page layout, encouraging users to explore the health topics further.
Finally, at the client's request, we've seamlessly integrated two prominent callouts—one for COVID-19 vaccination and another for smoking cessation. These elements have been designed in a modular fashion, allowing for future incorporation of other featured recommendations. This approach ensures flexibility and adaptability in showcasing key health recommendation.
Working with content team we reviewed the Card sorting results and organized the recommendations into 6 unique groups.
Before
The initial results page has confusing content hierarchy, and does not organize the recommendations, making the page overwhelming
After
The updated page reiterates the personalization of these recommendations, and organizes them in actionable chunks. It strips out distracting and repetitive content so user can focus on clicking links.
3/3
Improving Interactions on Topic Pages for Easier Information Processing
In response to feedback gathered from previous user testing sessions focused on the Topics page, I implemented significant improvements. The previously unfamiliar "Browse sections" drop-down menu has been replaced with two easily identifiable tabs: "The Basics" and "Take Action." This modification has notably reduced interaction barriers and enhanced overall site comprehension. Users can now seamlessly navigate to the next page by selecting the desired tab at the top or utilizing the conveniently placed button at the page's bottom.
Furthermore, a top header update has been introduced, featuring an open design and transparent imagery. This adjustment effectively addresses a known issue involving awkward image cropping (such as heads being cut off), while also providing room for additional information like topic types (e.g., Doctor Visits, Pregnancy).
Lastly, our research revealed that users prefer to browse through multiple topics before making a selection to delve into. To cater to this preference, I recommended the inclusion of a Summary section, offering quick insights into the type of information available within each section. This enhancement further streamlines the user's browsing experience.
Discovery prototype, with goal of fixing top header image cut off.
Before
The initial page has a navigation drop down with vague label "Browse section", has inaccurate visual hierarchy like the breadcrumbs and has photo cropping which can cut off important visual cues.
After
The updated page highlights the topic category, provides users with a summary so they can quickly scan and move on, and removes complex interaction in favor of a toggle.
Reflection
The MyHealthfinder redesign was a collaborative and fun project for me I worked closely with content, research, development, and design teams to achieve our ambitious goals. It was also enlightening to collaborate with our Spanish translation team to ensure the entire site was accessible in Spanish.
Receiving the 2023 Clearmark for Best Digital Product is truly special experience as it recognizes the effort and dedication we put into improving the MyHealthfinder site. Knowing that the judges valued the user-friendly interface and the tool's focus on practical information is incredibly rewarding.
This accomplishment emphasizes the importance of creating health resources that are easy for everyone to use and understand. I'm proud to have played a role in a project that positively impacts how healthcare information is shared. You can visit the full site on the U.S. Department of Health and Human Services website.
The Clearmark awards recognize the best English and Spanish plain language content. With the ClearMark Awards, the Center sets a high standard for clarity and simplicity in the materials created by North American companies, governments and organizations.
MyHealthfinder has over 100 pages in Spanish and a fully functioning prevention recommendation tool.