CDC Travelers’ Health
Responsive Site Redesign
Role
Research, Ideation, Visuals, Prototyping
Timeline
3 Week Sprint
Type
Responsive Site
(Mobile to Desktop)
Tools
Figma, Maze, Slack, Pen & Paper
Our team was tasked to design and create a visually appealing desktop and mobile travel health site that better engages users to help them navigate their travels abroad while considering a few key factors:
Ease of use
Learnability
Accessibility
We take a deep dive into what our users problems are with the current site and what our users look for in a travel health site experience.
Overview
You might have a lot of these to look at, so the buttons below are links to the mobile and desktop prototypes. Just in case you want a quick glance at the final product before reading through my process ; )
Learning Curve
I don’t have a ton of experience with international travel so I want to make sure my research shows exactly what the CDC Travelers’ Health site is intended for… What are users aiming to get out of an experience with a traveler health website?
So, here’s the Context…
The CDC Travelers’ Health Site is currently attempting to provide information on travel related diseases, recommended vaccinations, travel notices and general health advice for specific destinations.
… And here’s the problem.
Through research and testing, my team and I found the abundance of content on the CDC website to be overwhelming and difficult to navigate, leading to inefficiencies, errors, and potential health risks from confusion and misinformation.
Before going to the people we took some notes on our initial findings of the site. We used some basic Heuristic Principles to help us.
Here’s some of our key takeaways…
Thoughts
So yeah, it’s pretty confusing to navigate through. Why are there so many navigation options and why are they so unorganized? I feel overwhelmed just looking at it!
i rounded up some users test it out
Through moderated testing, using Zoom, I searched for testers who could meet a couple of requirements to focus on our demographic.
We needed young travelers who were to be from 20-30 years old who had some experience with international travel.
Thoughts
To be honest, this wasn’t easy. Most people from this age demographic had never been on the CDC Travelers’ Health website. Younger users were more likely to gather advice from friends or social media. Some of our testers were more concerned with general safety over health safety; given the reduced impact of the pandemic they haven’t felt the need to research risks before traveling.
The Covid-19 pandemic also put a stop to most traveling so during the time that our site would have been the most helpful, a lot of our testers weren’t traveling due to restrictions.
Competitors seemed to have it together
World Health Organization
Expansive amount of information, similar to CDC T.H., but organized with great information architecture
Strong navigation system!
Mayo Clinic
User-friendly navigation
Intuitive, visually appealing interface with thoughtful use of color
Easy to use “Search” flows that are thoughtful of mobile user experience
National Institutes of Health
Important information placed at the top of screen
Not quite as visually appealing but strong focus on functionality
Another strong navigation system! Sensing a theme here?
Meet Atlas
ATLAS WAYFARER, 31
Location: Seattle, WA
Profession: International Marketing Specialist | Startup
About Atlas
Frequently travels internationally for work
Has some personal health concerns and can’t afford to get sick with important growth opportunities happening with her company
Needs a way to check for health advisories and stay up to date on necessary vaccinations for international travel
take a look at The Current information architecture and streamline
We want to implement a seamless Navigation System so users can get the information they need in a learnable and accessible way. Remember, Atlas is a busy woman in a busy industry, she doesn’t have much time to spend getting lost in a sea of travel health information.
With four new main navigation tabs we can begin to categorize all of our subject matter into easy to find, easy to click links. After testing the new sitemap with 30% overall improvement in finding important travel health info we set out on a mobile first design approach by creating wireframe mockups.
it Started with a sketch or two…
mobile wireframes
I tested our first iterations using Maze and found 4/5 users completed the tasks (Plan a trip to Costa Rica and Find a Travel Specialist Near you) with 100% success rate on the final task (Search for information about Ebola).
Adding visual appeal and a modern design would help the site feel easy to use and learnable
We selected a color palette that aligns with the CDC brand but with updates to make it feel more modern and user friendly. It was important to incorporate vibrant colors, engaging visuals, and contemporary design elements to create a energizing yet trustworthy aesthetic. Paying attention to typography, iconography, and overall layout ensured a visually striking and visually consistent layout.
Now we Ice the CAke
Landing Page
Travel Specialist Clinic
Desktop Landing Page
Reflection
The commitment and work ethic demonstrated by my team members was truly inspiring. Each person brought unique skills, perspectives, and expertise to the table, creating a dynamic and collaborative environment.
One of the significant challenges we encountered was gaining a clear understanding of our ultimate direction with the site. Many of our initial assumptions about the target demographic and foundational research needed refinement. This led to moments of uncertainty and confusion, as we grappled with aligning our objectives with the needs and expectations of the users.
Through those periods of uncertainty I was able to exercise my ability to lead by example with keeping communication channels open and creating a workflow structure that really helped us to remember to check in with each other to create a cohesive product.