[a11y Support] MHV Cartography - Homepage Team: Making Health Contacts Editable in Profile

[rileyorr]

[!NOTE] Current Phase: The team is currently in the ideation phase designing how Veterans might edit and remove Profile health contacts and is looking for accessibility feedback as they explore different ideas.

Issue Description

The MHV homepage team (Cartography) has existing functionality on VA.gov's Profile page that displays read-only content containing the Veteran's primary and secondary (if applicable) emergency contacts as well as primary and secondary (if applicable) next of kin contacts.

Research has found that Veterans expect to be able to edit and remove emergency contacts and next of kin contacts from within their Profile rather than needing to contact a phone number to do so.

Supporting Artifacts

• Figma file containing design explorations
• Mural containing flows and early IA feedback

### a11y Tasks
- [ ] Collaborate with Jonathan both asynchronously and synchronously as needed to provide feedback and recommendations as designs are being fleshed out
- [ ] Document recommendations and feedback in this ticket so it can be referenced in the future as needed
- [ ] **Coverage:** Jamie to assist while Riley is OOO week of 9/9/2024 with any questions Jonathan may have. Ref. comments in this ticket and slack channel [#mhv-on-vagov-cartography-team](https://dsva.slack.com/archives/C0581MN69TJ)

### Acceptance Criteria
- [ ] Feedback on final design(s) are provided 

## Ticket Updates (CAIA Internal)
- [ ] _Connect to an `Epic` or `Intake` (what body of work is this a part of?)_
- [x] _Label with `Originator/Team` (product team or stakeholder requesting support)_
- [x] _Label date in the `Open Date` field_
- [x] _Label with `Estimate` (level of effort expected for this ticket)_
- [x] _Add `Assignee(s)` name(s) to ticket_ (include Naomi)
- [x] _Add `Assignee(s) name(s) to each task` they will complete via handle tag (if known)_
- [x] _Select a `Priority Level`_
- [x] _Update date in `Last Checked` field_
- [ ] _Label with `Actual` (level of effort it took to complete this ticket)_
- [ ] _Update date in_ `Closed Date`

[rileyorr]

Here's some notes from my meeting with Jonathan yesterday about this work:

• Jonathan walked me through what the current read-only experience is on VA.gov and showed me other areas of Profile where Veterans can edit and/or remove contact information

• He walked through multiple design options in Figma ranging from 1 emergency contact and/or 1 next of kin contact to 2 of each and how they might edit/remove these contacts

• The main funkiness comes in when the Veteran wants to remove their primary contact because currently Veterans aren't required to have a primary contact listed:

  • Should they indicate whether or not they want their secondary contact to get bumped up to primary?
  • Should the secondary contact be automatically bumped up to primary since the secondary is contacted anyway if the primary is unable to be contacted?
  • The same likely applies to next of kin

• Recommendation: Work with product to decide if secondary contacts should be promoted to primary if the primary is removed. Removing the primary contact, leaving an empty state that prompts Veterans to add a primary but also having content under the secondary contact notifying Veterans that the secondary contact will be reached out to if the primary is unreachable introduces cognitive complexity that may be confusing for Veterans who both do and do not have cognitive disabilities.

• The current 'Remove' functionality pops up a modal that prevents the Veteran from completing a destructive task without confirming that they do want to remove the contact. There were explorations of adding a checkbox to bump the secondary to primary, but since we know folks often scan content they may miss the checkbox entirely. I would not recommend a multi-step modal to split into a 'one question per page' flow.

  • The profile's notification page does contain a flow that may work in this instance. For example, when the Veteran clicks the edit link to edit their phone number they're taken to a separate page that appears similarly to our VA form UI. They update their information on that page and select a 'Save' button. A similar approach could apply here where the Veteran confirms they want to remove their primary contact and the next page shows the secondary contact information and asks if they want to make that the primary contact. That still doesn't solve the potential cognitive challenges if they select no and the primary contact is left as an empty state.

• In other parts of Profile if an optional data field is in an empty state there's content that tells the Veteran to select the 'Edit' button to add a new contact.

  • It would be worth exploring the background of this pattern because it seemed confusing to both me and Jonathan. We both thought we would expect the button to read something like 'Add a next of kin' or 'Add a contact'.
  • Recommendation: Test the existing functionality with a screen reader to hear what's read when navigating to the 'Edit' button on an empty state contact. It could be that updating the button to something with the word 'Add' might better align with SC 2.4.4 Link Purpose since folks' mental models for 'Edit' assumes something is there to change or update, whereas 'Add' implies there is nothing currently there.

• We talked about potentially removing the H3s that indicate primary and secondary contacts but decided to keep them after talking through how some folks navigate by heading. There would also need to be an indication if there is more than one emergency contact that there's 1 of 2 or 2 of 2 in the list. Removing the headers also doesn't solve the main funkiness of the flow.

Next steps: I am waiting for followup from Jonathan to continue collaboration on the designs.

[sara-amanda]

@coforma-jamie adding you to this ticket for the week of 9/9/2024, based on Riley's coverage doc. See task list for additional information and comment in this ticket. We appreciate it!