FSR List Loop Redesign

[LindaLi123]

Issue Description

When Veterans incur a debt with the VA and cannot pay the full amount, they're able to request financial help via the Financial Status Report (VA Form 5655). The Financial Status Report (FSR) collects a snapshot of a Veteran's monthly financial situation. The form asks Veterans to include a list of utilities, assets, etc. To help Veterans quickly add multiple items of the same category, we designed a list loop component. However, the component tested poorly during usability research. Additionally, the component is inaccessible to screen readers. Finally, because the list loops are customized components they're tedious to update and contain many bugs.

The solution

The FSR's UI has been redesigned to remove the list loop components. This redesign will use patterns and components that exist in either VA.gov's experimental or established design systems.

The FSR's updated designs can be accessed in this UXPin prototype. Please note: this is an in-progress design as of 4/29/2022.

The redesigned pages

• Veteran's contact information
• Veteran's employment history
• Veteran's other income
• Spouse's employment history
• Dependents
• Financial assets
• Real estate
• Vehicles
• Trailers, campers, boats
• Other assets
• Household expenses
• Utility bills
• Credit card bills
• Other debts
• Other living expenses

[denisecoveyduc]

@rileyorr Would you be able to update this epic ticket with any mock ups or other details about the list loop redesign work? Maybe the info exists on another ticket - I didn't see one if that is the case.

When @OptionSelect and @Dr-Pongo have the bandwidth I'd like to initiate the design > dev handoff and discuss sizing with them.

[rileyorr]

@denisecoveyduc just updated the ticket and linked the list loop mockups! I'm happy to answer any questions or meet whenever y'all have a chance to dig into the designs and want to discuss 🚀

[denisecoveyduc]

@rileyorr That's great thank you!!! I set up touchpoint for Thursday May 5th.. let's sync up with @OptionSelect and @Dr-Pongo then as an intro call. We can level set on next steps at that time.

[rileyorr]

Cross-posting the 21-686 form so we have it to reference when we start digging into the new list loop pattern of adding pages. Test-user-1 seems to work!