Lifesaving Solutions: Vaccine Finder for the WA Department of Health

Providing all Washingtonians a user-friendly website to locate vaccines during a pivotal time in the Covid pandemic

Project Overview

Over the course of six weeks in the early stages of the COVID-19 pandemic, I had the privilege of collaborating on the development of a critical tool commissioned by the Washington Department of Health - the vaccine locator website launched as part of the state-wide Vaccinate WA campaign. The primary goal was to provide the public with the latest trusted information to locate COVID-19 vaccinations on a user-friendly platform during a pivotal and often confusing time in the fight against the pandemic.

My Role

As the lead frontend engineer, I played a crucial role in collaborating closely with a multidisciplinary team that included public health experts, backend developers, and UX designers. My primary responsibilities included frontend software architecture decisions and implementation, internationalization, and accessibility.

Objectives

Rapid Deployment: Quickly create and release to aid in the rapid distribution of COVID-19 vaccines and responding to sometimes daily changes to public health policy and project requirements.
User-Friendly Interface: Develop an intuitive and utilitarian platform for users to easily find and schedule vaccination appointments on any device.
Internationalization & Accessibility: Implement a system that was able to handle displaying information in multiple languages and ensuring that users of all abilities were able to access and use.

Challenges

1
Urgency: The urgency of the pandemic required a rapid response to aid in the vaccination effort while dealing with constantly shifting requirements.
2
Information Dissemination: Providing concise information on vaccine availability was a significant challenge. As new vaccines and information received signoff from public health officials the team had to respond to change in data and interface structure to handle the changes.
3
Internationalization: Maintaining an consistent source of information that could be accurately translated as official messaging was updated required constant attention and refactoring.

Solution

Key Contributions

Familiar Search Experience

Working closely with the UX designers on the team, we decided on a simple, utilitarian interface with a Google-like search experience that is familiar to the most amount of people.

The goal was to provide users a single search input that accepted zip codes and displayed search results that initially showed only the most important information, including location contact information and the types of vaccines available.

Internationalization Strategy

In order to effectively communicate with the greatest amount of people, I was responsible for implementing the frontend strategy for displaying text content that was translated into numerous languages including those that read right-to-left.

I ensured that the interface was still legible no matter the language and worked with our backend engineers to develop a data model that could respond to the frequently changing text and translated content.

Flexible Accessibility Options

Given the high profile nature of the site, the project timeline, and that public-facing government websites require adhering to the highest accessibility standards, the team decided to use the Accessibe platform to ensure all aspects of the site were accessible to all users.

I was responsible for integrating with the platform and ensuring that the various accessibility profiles and settings it provides didn't interfere with our front end code.

Technology Highlights

Rapid UI Development

We relied on the built-in functionality provided by MUI to handle text direction changes as well as the large selection of prebuilt, tested components for quick UI development

Internationalization Simplified

The i18next framework allowed the team to implement an architecture that provided easy identification and display options for text content that needed to be translated

WCAG & ADA Compliance

Accessibe gave the WA Department of Health a trusted tool to provide all public users the ability to easily use the vaccine locator website

Results & Impact

Metrics

Website Traffic: Experienced a surge in traffic upon website launch, with over 2 million users accessing the website within the first week.
Internationalization: The flexibility of the interface and data structures we put in place contributed to expanding to offer 43 different languages and dialects.
Public Engagement: The website became a trusted government resource, garnering positive media coverage and continued user engagement.

Impact

The Vaccine Locator Website played a vital role in streamlining the vaccination process, contributing to the overall effort to combat the COVID-19 pandemic.

The collaborative efforts of the team allowed the WA Department of Health to continue sharing vaccine information throughout the pandemic and easily respond to changing federal guidelines.

Reflection

Collaborating on the Vaccine Locator Website for the Washington Department of Health was a profound experience that highlighted the power of technology in addressing urgent public health needs. As a frontend software engineer, this project reinforced my commitment to leveraging technology for the greater good and demonstrated the positive impact that collaborative efforts can achieve during challenging and stressful times.

Although the project included some of the most ambiguous and frequently changing requirements I've experienced so far, it was invigorating and oftentimes exciting to know the work we were doing would have an impact on a large userbase that I have never had the chance to build websites for.

Lessons Learned

Keep It Simple: This project taught me that simple solutions for displaying and storing information often result in short-term flexibility and long-term consistency
Be Flexible & Positive: Responding to frequently changing requirements can sometimes drag projects down, but maintaining a positive, flexible attitude has a large impact on the work that gets done
Teamwork Feels Great: Collaborating with stakeholders outside of technology teams is a perfect way to identify edge cases earlier and ensure that your work is actually solving the problems it's supposed to

Future Recommendations

For future projects, I recommend building on the success of this initiative by continuing to prioritize user accessibility, collaboration with relevant stakeholders, and setting up data in a way that could handle internationalization. You never know the next time your site might need to be translated to 43 different languages.

PREVIOUS PROJECT:

Starbucks

Component Library & Internal Apps

NEXT PROJECT:

Paragon Real Estate

Luxury Property Website