Creating a Vaccine-Tracking App UI for COVID-19

Introduction

The research question we are trying to solve is: how efficiently is the government distributing the vaccine? What we want to improve is twofold; the ability for people to track their personal vaccine data, and the ability for governments to have more localized data on vaccine statistics. For people, this would be to make sure everyone gets both doses, and understand how vaccinated other people are in their area. For governments, this would be to have localized data on vaccinated people to more efficiently disperse vaccines. The existing understanding of the problem is little, as the COVID-19 pandemic is unprecedented. We want to increase the efficiency of vaccine distribution and increase vaccine awareness of individuals so that people can understand the vaccine trends in areas around them, and the government can effectively assess where to increase their efforts.

Motivation

We wanted to create a product that would generate meaningful data for both individuals who use the app, and also those in charge of vaccine distribution. We want this to help individuals understand what areas of the US map are safe to travel by providing them aggregated data about vaccination percentage (based on Census population data) at the granular location level of zip codes. For instance, if someone wants to travel to a different zip code to visit a loved one, they can check that zip code ahead of time to see what percent of that zip code is fully-vaccinated or half-vaccinated.

On the vaccine distribution side of things, verified data analysts will be able to use the aggregated demographics and location data to understand trends of the vaccination dispersal, as well as vaccine reluctance. This can help inform vaccine distribution logistics, vaccine outreach/promotion campaigns, and other possible solutions to problems that do not have this data.

Figure 1: This is a Design Project for INST408D in the Information Science Major at University of Maryland — College Park taught by Professor Yuhan Luo

Related Work & Competitive Analysis

It’s important to note the limitations of current solutions. Currently, there are several vaccine trackers like the ones from New York Times or Bloomberg which report data of the entire US or by state. Although these solutions are effective at understanding the overall trends of vaccination, such non-specific data cannot help provide an accurate picture at the lower level, and at the lower level is where we can be more efficient in understanding where to distribute the vaccine without waste and how to promote taking the vaccine itself. The purpose of this app in this context is to generate the data needed to help cities, counties, and smaller parts of the state understand the way their population is taking the vaccine. Using our dataset not only produces granular data, but since it is self-reported Survey data, which will eventually be verified via vaccination card, it is a much larger dataset than anyone can have. The hospital appointment system could also be seen as a competitor, but in US healthcare, there is no centralized system for all hospitals that is updated as frequently as our solution. Furthermore, to use this data means combining and preparing it at multiple levels, which can lead to removal or imputation of data, making it less accurate. Lastly, the hospital appointment system is flawed because there could be those who miss the appointment, so it is not the most accurate source.

Key Design Requirements & Design Process

Ethical Considerations

As this is sensitive data, the first and foremost priority for our team was privacy and the proper use of collected data. This meant that privacy was a huge factor in our design, and we wanted to address that factor in two ways. First, we wanted to ensure we were transparent with users of our app, so we explained our mission, what we do, and how we use data explicitly. This was brought up in our first round of feedback on an earlier version of our prototype. Second, we wanted to make sure we designed our questionnaire in a way so that the data we collected was less specific to the user. We did ask more questions than we originally thought we were going to, as a result of feedback saying the data we had wouldn’t be enough for meaningful analysis of vaccine trends. You can see how we do this in Figure 3B by not asking street address, but zip code as the most granular location data.

Figure 2: Examples of the our transparency with our users about their data and the questions we ask our users

Because of the increased specificity of the data we were collecting, we wanted to make sure we were able to verify vaccine distributors to ensure that people who had access to this sensitive information were only using it to understand how to increase the efficiency of vaccine distribution. We implemented this by reading an authorization code which can be purchased with proof of affiliation to a stakeholder for this data. We also require individuals to put their names in as well as the organization they are affiliated with in order to promote accountability. Here is an example of of our implementation of this on the Researcher UI:

Figure 4: A researcher must sign up using their own name, organization, purpose of use, and a Authorization code to access the dataset

With our two-sided strategy, we hope to not disperse granular data to the public, and ensure our users are protected from improper or unethical use of data.

Accessibility

We wanted to make an app that incorporates accessibility in our design. Early on, our heatmap looked like a weather heatmap with gradients of red and green. When we shared an early prototype to peers, we realized one of our classmates was red-green colorblind, so the heatmap was not as accessible to him. Also, using the heatmap was confusing as hotter areas meant more vaccinations, but it is typically perceived as worse. We solved the issue of colorblind accessibility by using color blind palettes to determine our color scheme, which resulted in the blue color we use throughout the design. We solved the issue of confusion by using circles rather than gradients, which makes it more clear what the visualization is representing. This is reflected in our HeatMap so that all people can access data using their accessibility features, and understand the percentages in the zip codes around them.

Figure 5: An example of our implementation of the colorblind palettes in both our UI and the HeatMap

Usability

To ensure our design was usable, we made sure to keep our UI as consistent as possible in our app by incorporating a static toolbar. We learned this in our class when we studied the 10 usability heuristics, and we wanted to focus on making sure the user was never found in their flow without an escape. This enables users to access key functions at all times during their journey through our app. We also used color to show escape actions, as a signifier to the user.

Figure 6: An example of consistent toolbars and signifiers

Final Version of the Prototype

Our final version of the prototype includes both the User UI and the Researcher UI. Below is a demo video outlining the user flow of the User:

We also have functioning prototypes built in Figma. Here is our prototype for the User UI:

Figma

And here is a sample of the Researcher UI prototype:

Figma

Future Work & Conclusion

Our vision for this project in the future is to continue to elevate it and move it forward. Since this app heavily relies on a map to navigate where vaccinated individuals are located and how many there are, we could also make it a part of Google Maps. It can also show locations where no one has been vaccinated, similar to how traffic data is displayed, but in zip codes. This will help show people how much of a risk there is in a specific region, so they can make decisions about their travels. We also plan to have a verification process via vaccine card. You would be able to upload your vaccine card and then use the QR code our prototype already generates to gain entry into non-essential buildings like movie theaters or restaurants. This feature could help promote our app as these places would require using our app to sign in to their locations. We would also use social media and promotion services to encourage people to use the app. Overall, the aim of this project was to generate data for the CDC and other stakeholders to understand how to disburse and promote the vaccine so the US population gets to herd immunity as soon as possible. For users, the aim was to give an utility to understand the safety of the areas around them regarding COVID-19. We believe our solution meets the unmet need of granular data to help vaccinate the US the most efficient and effective way.