Reima

Client:

VA.gov

Design

IA

Reima

Client:

VA.gov

Design

IA

Batch.Works product catalogue book on a work top with a graphic printed image on the front
Batch.Works product catalogue book on a work top with a graphic printed image on the front
Batch.Works product catalogue book on a work top with a graphic printed image on the front
Batch.Works product catalogue book on a work top with a graphic printed image on the front

About the project

Veterans with VA.gov accounts can manage dependents on their benefits with an interview-style online tool. With this redesign, we brought this form up-to-date with VBA , USWDS, and accessibility standards.

Streetside billboard with flyposters of the Batch.Works brand and illustrations

Product leaders pointed out that, before we could move forward with more adventurous projects like dependent verification, we needed to bring the VA.gov dependent management tool up-to-date, lest we send a bunch of traffic to the outdated form and risk Veterans’ forms being rejected because we let them submit outdated information.

Our review of the form, along with OCTO mandates, gave rise to a few goals that we parsed out like so:

Phase 1

  • Bring the online form up-to-date with the PDF form managed by the Veterans Benefits Administration (VBA)

Phase 2

  • Update design and web components to USWDS web components

  • Move toward a one-thing-per-page standard

  • Address other low-hanging UX and accessibility issues 

Matching a PDF without becoming one

One challenge at VA.gov is ensuring we’re collecting all the information needed to make a decision about a Veteran request without merely digitizing the PDF forms that lay out what information is required. 

In addition to matching our dependent management form to 686c, the PDF put out by the VBA, we took our proposed updates to the dedicated content and accessibility team. We collaborated to produce a content source of truth that we could refer back to as tweaks were made to designs.

One-thing-per-page

One-thing-per-page (OTTP) was a goal passed down from design leadership to move away from form pages that feel endless and to instead show only chunks of information that make sense together on a single page. This helps all Veterans to focus on one question at a time and reduce overwhelm, especially those with differing cognitive abilities. 

Breaking up content

While OTTP served to break up groupings of content into respective pages, there were still several points where large blocks of content on a single page posed a challenge. These blocks were difficult to scan and posed a risk of Veterans overlooking key information. We strove to break these up in a way that made sense or reword them so that only necessary information appeared onscreen.

Polite screen readers

One of the accessibility issues we were able to remedy was that of screen readers overlooking freestanding text. By applying the JavaScript attribute aria-live="polite" to these blocks of text, screen readers would read these content without disrupting the Veteran’s experience. 

Didn’t make the cut

The dependent management form is actually a frankensteining of two different forms, one for dependents and one for extending benefits for dependents who are in college. Because of this, there are a couple of use cases where a Veteran would have to enter the same information twice. The content team and I proposed a solution to this that would apply information that the Veteran entered to multiple forms. 

However, technical limitations prevented us from implementing this solution. The updated array builder, the pattern, that allows Veterans to add multiple children or spouses, and upon which our solution depended, had not been fully vetted prior to us being required to use it. 

Looking ahead

My contract with the project ended before we were able to launch phase 2 updates. I hope for the love of all that is holy that someone is getting these updates in front of Veterans prior to launch or at least very soon after. 

As we worked towards these updates, it became clear that improvements to the flow of the form would be an impactful longterm goal. 

Where current designs ask Veterans to declare all changes they intend to make at the beginning of the form, I’d love to see a version that asks the Veteran what they want to do first, let them complete that task, review, and then move on to the next task or finish. I suspect Veterans would be able to better get their arms around what can be a sometimes untenable form with this format. 

Product leaders pointed out that, before we could move forward with more adventurous projects like dependent verification, we needed to bring the VA.gov dependent management tool up-to-date, lest we send a bunch of traffic to the outdated form and risk Veterans’ forms being rejected because we let them submit outdated information.

Our review of the form, along with OCTO mandates, gave rise to a few goals that we parsed out like so:

Phase 1

  • Bring the online form up-to-date with the PDF form managed by the Veterans Benefits Administration (VBA)

Phase 2

  • Update design and web components to USWDS web components

  • Move toward a one-thing-per-page standard

  • Address other low-hanging UX and accessibility issues 

Matching a PDF without becoming one

One challenge at VA.gov is ensuring we’re collecting all the information needed to make a decision about a Veteran request without merely digitizing the PDF forms that lay out what information is required. 

In addition to matching our dependent management form to 686c, the PDF put out by the VBA, we took our proposed updates to the dedicated content and accessibility team. We collaborated to produce a content source of truth that we could refer back to as tweaks were made to designs.

One-thing-per-page

One-thing-per-page (OTTP) was a goal passed down from design leadership to move away from form pages that feel endless and to instead show only chunks of information that make sense together on a single page. This helps all Veterans to focus on one question at a time and reduce overwhelm, especially those with differing cognitive abilities. 

Breaking up content

While OTTP served to break up groupings of content into respective pages, there were still several points where large blocks of content on a single page posed a challenge. These blocks were difficult to scan and posed a risk of Veterans overlooking key information. We strove to break these up in a way that made sense or reword them so that only necessary information appeared onscreen.

Polite screen readers

One of the accessibility issues we were able to remedy was that of screen readers overlooking freestanding text. By applying the JavaScript attribute aria-live="polite" to these blocks of text, screen readers would read these content without disrupting the Veteran’s experience. 

Didn’t make the cut

The dependent management form is actually a frankensteining of two different forms, one for dependents and one for extending benefits for dependents who are in college. Because of this, there are a couple of use cases where a Veteran would have to enter the same information twice. The content team and I proposed a solution to this that would apply information that the Veteran entered to multiple forms. 

However, technical limitations prevented us from implementing this solution. The updated array builder, the pattern, that allows Veterans to add multiple children or spouses, and upon which our solution depended, had not been fully vetted prior to us being required to use it. 

Looking ahead

My contract with the project ended before we were able to launch phase 2 updates. I hope for the love of all that is holy that someone is getting these updates in front of Veterans prior to launch or at least very soon after. 

As we worked towards these updates, it became clear that improvements to the flow of the form would be an impactful longterm goal. 

Where current designs ask Veterans to declare all changes they intend to make at the beginning of the form, I’d love to see a version that asks the Veteran what they want to do first, let them complete that task, review, and then move on to the next task or finish. I suspect Veterans would be able to better get their arms around what can be a sometimes untenable form with this format. 

Product leaders pointed out that, before we could move forward with more adventurous projects like dependent verification, we needed to bring the VA.gov dependent management tool up-to-date, lest we send a bunch of traffic to the outdated form and risk Veterans’ forms being rejected because we let them submit outdated information.

Our review of the form, along with OCTO mandates, gave rise to a few goals that we parsed out like so:

Phase 1

  • Bring the online form up-to-date with the PDF form managed by the Veterans Benefits Administration (VBA)

Phase 2

  • Update design and web components to USWDS web components

  • Move toward a one-thing-per-page standard

  • Address other low-hanging UX and accessibility issues 

Matching a PDF without becoming one

One challenge at VA.gov is ensuring we’re collecting all the information needed to make a decision about a Veteran request without merely digitizing the PDF forms that lay out what information is required. 

In addition to matching our dependent management form to 686c, the PDF put out by the VBA, we took our proposed updates to the dedicated content and accessibility team. We collaborated to produce a content source of truth that we could refer back to as tweaks were made to designs.

One-thing-per-page

One-thing-per-page (OTTP) was a goal passed down from design leadership to move away from form pages that feel endless and to instead show only chunks of information that make sense together on a single page. This helps all Veterans to focus on one question at a time and reduce overwhelm, especially those with differing cognitive abilities. 

Breaking up content

While OTTP served to break up groupings of content into respective pages, there were still several points where large blocks of content on a single page posed a challenge. These blocks were difficult to scan and posed a risk of Veterans overlooking key information. We strove to break these up in a way that made sense or reword them so that only necessary information appeared onscreen.

Polite screen readers

One of the accessibility issues we were able to remedy was that of screen readers overlooking freestanding text. By applying the JavaScript attribute aria-live="polite" to these blocks of text, screen readers would read these content without disrupting the Veteran’s experience. 

Didn’t make the cut

The dependent management form is actually a frankensteining of two different forms, one for dependents and one for extending benefits for dependents who are in college. Because of this, there are a couple of use cases where a Veteran would have to enter the same information twice. The content team and I proposed a solution to this that would apply information that the Veteran entered to multiple forms. 

However, technical limitations prevented us from implementing this solution. The updated array builder, the pattern, that allows Veterans to add multiple children or spouses, and upon which our solution depended, had not been fully vetted prior to us being required to use it. 

Looking ahead

My contract with the project ended before we were able to launch phase 2 updates. I hope for the love of all that is holy that someone is getting these updates in front of Veterans prior to launch or at least very soon after. 

As we worked towards these updates, it became clear that improvements to the flow of the form would be an impactful longterm goal. 

Where current designs ask Veterans to declare all changes they intend to make at the beginning of the form, I’d love to see a version that asks the Veteran what they want to do first, let them complete that task, review, and then move on to the next task or finish. I suspect Veterans would be able to better get their arms around what can be a sometimes untenable form with this format. 

Streetside billboard with flyposters of the Batch.Works brand and illustrations
Streetside billboard with flyposters of the Batch.Works brand and illustrations
Streetside billboard with flyposters of the Batch.Works brand and illustrations

Lead Design

:

Supporting Design

:

Product Manager

:

Froontend Dev

:

Ajia Wallace

Fiorella Geedi

Laura Steele

Sean Midgley

More works

More works

More works

Create a free website with Framer, the website builder loved by startups, designers and agencies.