Time: 2 weeks
Project Type: App Redesign
Team: 4 Designers
Research Lead: Britni Thompson & Heather Keller
Project Manager: Maxwell Graj
Design Lead: Elva Björk Ástþórsdóttir
Tools: Sketch, InVision
CDC works to protect America from health, safety, and security threats both foreign and in the U.S.
Whether diseases start at home or abroad, are chronic or acute, curable or preventable, human error or deliberate attack, CDC fights disease and supports communities and citizens to do the same.
Currently, the CDC has multiple apps covering a variety of topics. During these past two weeks, we had the challenge of combining two apps, their “TravWell” app and “Can I Eat This?” app, into a single intuitive app. Both of the apps are in need of a visual redesign, as their UI elements are dated, which makes them unappealing and not fun to use.
Additionally, right from the start we learned through research, survey and interviews that the CDC apps are overall not very well-known, and none of our interviewees or survey participants have ever used these apps before.
Therefore, it was evident that we needed to step up to the challenge and create a beautiful yet professional-looking design for a simple solution to find valuable information about health and food as they travel around the world.
This section covers our teams plan of work throughout the 2-week design sprint.
Our team created a Gantt chart to begin organizing all of our deliverables, tasks and subtasks. Milestones were created to help divide up the different stages of work and to give the team a visual representation on our progress. Multiple check-ins occurred throughout the week, allowing our team to mark our completed tasks, add new tasks and adjust our plan of work as needed.
As the first week of our design sprint came to an end, our team was right where we needed to be. We had another check-in to discuss our plan of work for the weekend, to make sure everyone felt comfortable with our progress and to address any questions or concerns. This is when we started to transition the conversation from research to visual design.
Our design process consisted of multiple group check-ins and sketching activities, such as “the crazy eight”. Our team started this process by creating a site map and feature inventory list. This allowed the team to move on to user flows and design sketches that fit the needs of our user personas and helped address their specific problems. The our design team began turning the sketches into low-mid fidelity mockups. During this process our designers created a UI element kit to help collect and organize our design patterns, fonts and color choices. From here, a beautiful high fidelity mockup was created and turned into a functional prototype.
Through multiple group meetings, activities and debates our team was able to navigate this two week design sprint almost as seamlessly as the CDC app redesign itself. We worked with one another to come up with user friendly layouts and accessible design patterns. We continued to remind one another who our users are and could be and did our best to address all need.
Our Process
To begin user research, our team looked over the two existing apps (TravWell & Can I Eat This?) to discover what the purpose of each app was and how they functioned. From there we were better prepared to create our survey questions.
Each group member wrote out several questions, we compiled them together took out the redundant ones then put them into a google survey. We received 33 responses in total that greatly help us not only get a start on creating interview questions but giving us insight on what our personas would need.
Our research team interviewed 4 people to help further understand what the problem was and what features the app truly needed. To get to that we placed the responses from the interviews and survey into two affinity maps. Once that was sorted and “I” statements were created we had a solid idea of who are personas were as well as their pain points.
We put together affinity maps from both the survey and interviews, and created “I” statements.
The key takeaways were:
Following the survey and user interviews, we synthesized our research findings and were able to create two personas which allowed us to move into journey maps.
“The world is my oyster, I like mine with hot sauce.”
Cliffton (25) loves traveling and backpacking the world by himself. He has set himself a goal to visit every country in the world in his lifetime, but needs a platform that can both give him information on food and water safety, as well as provide trustworthy resources in case of an emergency if he ever got sick again.
“Having children is a reason to travel, never a reason to stop.”
Susan (42) is a loving mother of four kids, and married to a wonderful man. Susan has always loved to travel, and she wants her kids to experience the world with her. She is starting to plan out a trip to South Africa, and needs a clean and intuitive platform that can provide trustworthy information on vaccines and other required documents in a secure way, as she wants to be able to keep all their information in one place.
For competitive and comparative research, we started with researching other organizations similar to the CDC – more specifically ones that were centered on health and food safety for travelers.
The World Health Organization (WHO) was closest to what we thought was direct competition, so we included their app in our feature inventory. We also included MyID, which is an app that stores personal medical information for easy access on-the-go, and we included Vaccine Record, which is an app that stores vaccine records and informs users of how long vaccines last.
Lastly, we included the Travelers’ Health page from the CDC website in our feature inventory. We decided to include this because we noticed the website offers users much more information and features that could be useful in an app format.
Our goal with the feature inventory was to compare and identify common features among the apps, as well as to visually analyze how to best combine the Can I Eat This? and TravWell apps.
We also wanted to see what our 2 apps could be missing as far as key desired features go, and how we could best add those features in our design process. Through this and our 2 card sorts, we were better able to understand what features to prioritize, and we would be able make well-informed design decisions moving forward.
The next step of our process was to start thinking about the navigation system. Initially our team conducted a closed card sort with a total of 30 different cards that listed a combination of the CDC TravWell and Can I Eat This? application features and 3 predetermined categories which identify feature importance.
This helped us understand users priority levels and provided us with insight into what our users considered to be the most and least important features.
This table shows the percentage of your participants who sorted each card into the corresponding category.
It attempts to propose the most popular groups based on each individual card’s highest placement score.
Following the initial closed card sort, our team still needed to understand how potential users would organize all of the application features from both the CDC TravWell and Can I Eat This? application. Because the particiapants organized the app features based on importance level, our team was able to identify trends indicating possisble categories.
In this second closed card sort, we used the information previously gathered to form predetermined categories allowing participants to categorize the various app features. This helped our group come up with a cohesive navigation system and uncover logical trends based on how our participants organized the provided card deck.
This table shows the percentage of your participants who sorted each card into the corresponding category.
It attempts to propose the most popular groups based on each individual card’s highest placement score.
Both of the previous card sorts helped our team identify the most important features that we felt needed to be showcased in our app redesign. However, our team felt it would be important to research and analyze similar mobile applications to discover the various design patterns and UI components used.
Supported by the U.S Web Design System (USWDS), one of our teams key takeaways is that govenment and medically based applications tend to design in a visual style which, “offers a clean, modern aesthetic that meets high standards of usability and accessibility while promoting credibility and trust” (USWDS).
This additional research helped our team gain a deeper understanding into the considerations needed to design a successful application for non-profit, medical and government based organizations or programs.
Below are a few UI examples of mobile applications that our team felt encompassed successful design patterns and followed the USWDS principles.
Problem Statement
Cliffton loves traveling and backpacking the world by himself. He has set himself a goal to visit every country in the world in his lifetime, but needs a platform that can both give him information on food and water safety, as well as provide trustworthy resources in case of an emergency if he ever got sick again.
PROBLEM STATEMENT
Susan is a loving mother of four kids, and married to a wonderful man. Susan has always loved to travel, and she wants her kids to experience the world with her. She is starting to plan out a trip to South Africa, and needs a clean and intuitive platform that can provide trustworthy information on vaccines and other required documents in a secure way, as she wants to be able to keep all their information in one place.
During the visual design process, our lead designer took the initiative to create a UI style guide. This was a huge help for the group, as it encouraged us to keep organized and consistent files, components, typography and colors. Because multiple designers were working on the low, mid and hi-fidelity designs at the same time, this UI kit became even more necessary enabling our team to work faster, easier and smoother. This UI kit can also act as a deliverable to our client.
Although the app is not yet released, we believe “CDC Safe Travels” seamlessly merges the “TravWell” and “Can I Eat This?” app into a new user-friendly, fun-to-use mobile application. Not only does it provide health and safety information and warnings, but it also helps users that are looking for safe food and drinks in foreign countries.
Safe Travels, a CDC mobile application, solves the problem of merging “TravWell” and “Can I Eat This?” into one user-friendly mobile application while providing health and food safety guidance to a variety of users.
Other
Projects.
Online Training Platform