Technically speaking: How we built a new health care application for Veterans
The U.S. Digital Service team at VA recently introduced a new digital application to make it easier for Veterans to access health care. A previous post tells the story of why we built it; this post gives a behind-the-scenes look at how we did it.
By: Anne Kainic, Albert Wong, and Jeff Maher
The U.S. Digital Service is transforming government services through technology and design. We had the opportunity to provide a better user experience to Veterans applying for health care eligibility, while also showcasing how modern web development practices produce higher quality software.
You may have seen the finished product on Vets.gov, but we’d also like to show you how we made it happen.
Our task was to build a new UI for the online health care eligibility application and to submit the form data to an existing back-end system within the VA network. Like any other software project, we had to figure out:
· What tools we would use to build the front-end
· How the front-end would connect to the back-end
· How to deploy the new application
Our primary goal was to provide an improved user experience for Veterans to access the health care they deserve. While achieving that mission, we also set out to demonstrate that modern web development best practices produce higher-quality software, and that these practices can be adopted government-wide.
Building the Front-End
To demonstrate how quickly functionality could be delivered using a modern web platform, we first built a prototype using vanilla JavaScript, HTML, and CSS. With this prototype — a concrete, interactive application on a public URL — approved, we moved to building a version of the application ready for production. A few weeks in, it became clear that piecemeal JavaScript would not create a maintainable application. We wanted something that was more modular and easier to test out of the box.
We also set out to demonstrate that modern web development best practices produce higher-quality software, and that these practices can be adopted government-wide.
We quickly pivoted to a new approach and started rebuilding the application using React, a front-end framework. React gave us the ability to create forms with modular and reusable components, an opinionated structure for how data flows through the application, and a single-page-app oriented design that decouples the front-end from the backing API. Many front-end frameworks allow teams to bridge the gap between new software and old by providing a strong abstraction layer, under which we were able to incrementally migrate pieces of the existing online enrollment process. This iterative approach allowed us to arrive at the right technical solution for our project and ultimately build a better experience for our Veterans.
Deployment
Our next challenge was figuring out how to display the form to Veterans. Federal software is typically hosted on internal servers, which require manual configuration and maintenance. To avoid setting up machines and networks, easily scale systems, and reduce costs, we instead opted to host our application using a cloud-based service, a private sector best practice.
Having a modern, standard, cloud hosting environment was an important component of our success. True cloud solutions that are fully scriptable and supported by open source tools and infrastructure can have a significant impact on the reliability of a site, as well as the efficiency of the development team.
Iteration
The online application went live on June 30, 2016. Since then, more than 54,000 applications have been submitted, compared with about 6,000 that would have been submitted with the legacy system. These applications are all processed within five days, and many Veterans can now see a doctor within a week of applying. We’re continuing to work with our partners at VA to increase the number of applications that can be automatically verified.
As any developer knows, the work does not end at launch. Despite manual and automated testing, we still had to fix the inevitable bugs. Due to our iterative process and mostly automated deployments, we were able to deploy fixes to bugs hours or days after identifying them, further validating our software development approach. We reset expectations about how quickly software can be iterated, thereby reinforcing a culture of higher quality code.
In five months of development work, we were able to launch a more accessible online health care eligibility form for Veterans.
This project also enabled us to lay the groundwork for how to create the next set of Vets.gov forms. It became clear early into our development of React components that they could be abstracted into a component library to build forms more quickly and easily. By creating a module component library, we can simply import specialized text input components or radio button group components, with validation logic and styles already baked in. While this is doable with traditional HTML and JavaScript, React components provided stronger module boundaries that made this process much cleaner.
The ability to build forms rapidly is one of the main functions of the Vets.gov team, which is building a single unified digital experience for all Veterans. Forms are one of the primary ways citizens interact with their governments. If we can make accessible, easy-to-use forms quickly, then we can drastically improve the experience Veterans have when trying to access their benefits. Figuring out the technical implementation for how to build forms is a key part of the process.
By combining industry best practices with new tools and frameworks, we’re working with our partners at VA to leverage modern software development practices and establish a strong foundation for future work to come. Most importantly, this work helps Veterans access the healthcare they have earned.
Anne Kainic, Albert Wong, and Jeff Maher are software engineers at the Digital Service at VA.
