Design Intent - IA Feedback - Virtual Agent Chatbot, Chatbot, Benefits Micro-Services - Claims Status Flow

[erinrwhite]

Next Steps for the VFS team

• [ ] Assign this ticket to the team member(s) responsible for addressing feedback provided by Platform.
• [ ] Comment on this ticket:
  • If the Platform reviewer has any Thoughts/Questions that require responses.
  • When Must feedback has been incorporated. As appropriate, link to any other GitHub issues or PRs related to this feedback.
  • When Should/Consider feedback has been incorporated, or if any feedback will not be addressed. As appropriate, link to any other GitHub issues or PRs related to this feedback.
• [ ] Questions? For the most timely response, comment on Slack in your team channel tagging @platform-governance-team-members.
• [ ] Close the ticket when all feedback has been addressed.

Thoughts/questions

• Thank you for bringing this through the collab cycle!

Feedback

Practice areas will document their feedback on the VFS-provided artifacts following the Must, Should, and Consider Framework. Platform Governance reviewers may also provide additional notes that don’t comment on the artifacts themselves but are important for implementation (eg. engineering/coding notes).

Must

• [ ] Clear, unique link text on action cards: If it is at all possible to customize the link text on the yellow "action needed from you" cards, the link text should describe the action to be taken, and the link text on each card should be unique. ex. "Upload marriage history" "Upload common law marriage documents" etc. This will reduce cognitive load, help users scan text more easily, and differentiate card content if there are multiple cards.

Should

• [ ] Multiple claims: if > 10 claims, add up-front link to claims status tool: For users with many recent claims to review, add an option for users to go to the CST early on in the flow to give another option in addition to the one-by-one flow within the chatbot.
• [ ] Multiple claims: escape hatch I see that one of the Figma designs contains a third option, "I have a different question", during the list and loop for claims. I recommend keeping this option, or another similar one, to allow folks to exit the loop.

Governance team actions

• [x] Format feedback as individual tasks (check boxes)
• [x] Assign this ticket to the VFS team member that opened the Slack request
• [x] Add the VFS team product label
• [x] Add the VFS team the feature label (if applicable)
• [x] Add the touchpoint labels
• [x] Add the practice area labels
• [x] Add the Collaboration Cycle initiative milestone
• [x] Add the Collaboration Cycle initiative epic

[leahspix]

Thank you @erinrwhite! Feedback received and in review.

[leahspix]

Comment to address feedback in the must for #78550 and #78570

Unique link text: this would be the biggest lift. Many tracked items exist in the Claims Manual and the tracked item titles are very long. It would require a unique ID mapped in the API call but not in the Claims Manual table. For the image to be in line with the text, the text must be in a grid pattern within the adaptive card. If the text runs to the edge of the column, it doesn't overlap but cuts off. We could get a tracked item list through DataService (?) to provide the volume of tracked items (items needed from you). Would provide mappings of values for the textual representations but this would be through an internal VA API and would require a different integration. This may not be the easiest solution.

Questions:

1. If the tracked item's unique link text is cut off and there are ellipses to represent the remainder of the text, how would this be read by a screen reader?

Possible Solution:

1. We could implement the full name of the tracked item into the link as that is the most easily accessible property that is unique, this would however be a long statement and cut off by the column next to it and be represented by ellipses (...)
2. Even if visually, the Tracked Item title is truncated - we can add the entire tracked item title in the speak tag with the full name, so it does not get truncated and is read to the visually impaired

We can provide a screenshot for reference and will add that shortly @bushnicoleVA

cc: @nathalierayter @briandeconinck

[erinrwhite]

Thank you @leahspix! Can y'all share a screenshot of how this might appear for sighted users?

It sounds to me like having screen readers speak the whole link would be a good solution for SR users. @briandeconinck is out this week - @rsmithadhoc tagging you in here for your perspective as well.

[leahspix]

@erinrwhite attached screenshot versions for both the screenshot of the ellipses and the truncated link from @bushnicoleVA. Please keep in mind it's not going to look how it will in the Chatbot because it's mocked in the emulator in case you have concerns about color or text! Note - These are a couple options we have, the external link icon is an image just requires a little finagling to get in line with the description. We can dynamically move the image with the link text but only right and left, not at the end of the link itself which is why when that text wraps it does not follow it. So we can either cut off the text if it goes to another line, not have the icon and just have the words to explain opening in a new tab, or let the text wrap and just keep the icon on the right.

[goodenoughgraceVA]

Hi @erinrwhite and @rsmithadhoc, adding a comment here about text for links opening in a new tab based on Brian's ticket #78570 since he's out this week.

We drafted examples of content that include (link opens new tab) in the screenshot below. Since these links are included in a regular card as opposed to an adaptive card, there isn't an option to include screen-reader only text, so we would have to go with visible text. However, we wanted to make a note that we are a feature team, and the chatbot platform team doesn't include visible text (link opens in new tab) with links currently live on the bot, so there would be a lack of consistency there and would be open to additional recommendations for link accessibility.

@leahspix tagging you here as well :)

[erinrwhite]

@leahspix @bushnicoleVA @goodenoughgraceVA

Thanks all for the level of detail here! I appreciate the screenshots of all these scenarios.

It seems like the cleaner option for the link indicator on the adaptive cards is the pure text option and not worrying about the image indicator, especially since the alignment options for the image are limited. More folks will be more likely to perceive and understand the plain text over the image, and this would also conveniently align the adaptive card links with a plain-text option used in the regular cards.

This is a great question re: the chatbot team's implementation of links. I will be reviewing our historical tickets with that team. I think it has been a good amount of time since we saw them at the collaboration cycle, and if they were to come through today we'd offer them the same feedback. Following up with my PM @shiragoodman.

@rsmithadhoc says he will check in on this thread in the morning and weigh in on the accessibility side. Thank you for your patience!

[rsmithadhoc]

@leahspix

A screen reader would read the entire text when using overflow: ellipsis; because the full text is still in the DOM.

However, I would avoid truncating text with ellipsis because the meaning may not be clear to users. In CSS overflow: ellipsis; truncates when the content will extend beyond the container, so you don't have control over it. If a user is zoomed in, they may see links that say "Upload Cla..." or similar, which is unclear for the user.

I also don't believe this passes WCAG 2.2 AA - 1.4.10 Reflow, since the content is being presented with a loss of information. Typically if content is cut-off using ellipsis, a separate link should be provided to the full content. However, in this case, the link itself is being cut-off, so I don't think it passes.

@goodenoughgraceVA

I think visible text is the best option. If chatbot could be updated with visible text or an issue opened with that team, it would be great. But if only the feature team can add it to what they are working on, I think it should still be done.

[erinrwhite]

Thanks @shiragoodman for finding all of our historical chatbot findings tickets. We don't have a record of logging this feedback with the chatbot team, but I did flag this issue with another chatbot feature team last fall, though our guidance has changed a little since then (moving away from the icon and toward text). Echoing @rsmithadhoc, please incorporate the visible text if possible.

thank you!

[leahspix]

Thank you @erinrwhite @rsmithadhoc that's helpful guidance! We believe we understand the recommended path forward to use visible text if possible. So it is okay to add (link opens in new tab) to indicate to the user that the link opens in a new window?

@goodenoughgraceVA @bushnicoleVA

[erinrwhite]

@leahspix yes definitely! I recommend (opens in a new tab) without "link" at the beginning, which is emerging as the new standard.

[goodenoughgraceVA]

@erinrwhite @rsmithadhoc Got it, thanks! We're adding the visible text to all links now. We're also building out the Multiple claims: if > 10 claims, add up-front link to claims status tool: flow based on the 'Should' feedback and will have that ready to share for staging review.

We also wanted to make note of some concerns about the Multiple claims: escape hatch feedback. After confirming with our devs on possibilities and reviewing the chatbot's other skills, there isn't a clear, direct path we could give to users as an "escape hatch" due to the platform-wide end of skill satisfaction survey (screenshot below).

To exit the claims skill, a user has to answer the survey before being returned to the main chatbot, and we don't have control over that content and its implementation. So, in other words, if we included a 'I have a different question' button, the user would then be prompted with "did that answer your question?" That's not the best user experience since it's quite a confusing prompt if the user says they have a different question.

The Platform team plans to address this in their upcoming backlog once the new Claims Status Flow has launched on/after 4/11. As a feature team, we're developing a post-launch testing plan, and we're going to include research questions related to an escape hatch (user perceptions of exiting the flow when they have a different question, incorrectly ending up in the claims flow, etc).

Appreciate y'all reviewing all of my and @leahspix's comments and following up with quick feedback! :)

[leahspix]

@erinrwhite @rsmithadhoc the following updates have been made to address some of the points from your design intent feedback:

• [x] Update all speak tags to be descriptive of what is present on Adaptive Cards for tracked items and claim selection cards
• [x] Investigate how to represent a thinking bubble on a screen reader.
• [x] Image tags have appropriate descriptions
• [x] Colors used on tracked items cards is from design.va.gov

Feedback/suggestions on colors for yellow/orange cards, color contrast, button and link text, screen reader on interactive elements, and the thinking bubble and screen reader have been integrated and merged into the code so testing can be performed: department-of-veterans-affairs/va-virtual-agent#1663 department-of-veterans-affairs/vets-website#28831

cc @bushnicoleVA @goodenoughgraceVA