department-of-veterans-affairs / vets-design-system-documentation

Repository for design.va.gov website
https://design.va.gov
37 stars 57 forks source link

Experimental Design [enhancement to Multiple Responses - multi-page, from checkboxes] #2562

Open mengA6 opened 6 months ago

mengA6 commented 6 months ago

What

Give a brief description of the component or pattern you want to propose.

Another variation on the Multiple Responses - Multi-page pattern, with checkbox selections creating a multi-page list and loop, headings showing the position in the list ("1 of 3: Afghanistan"), and per-section review screens that allow the user to edit the selections that generated the list and loop questions.

Purpose

What problem does this component or pattern solve for the user?

Detailed in our midpoint review IA feedback:

  1. Lets users select multiple relevant items from a list
  2. For each item, display form field(s) and instructions
  3. Allow users to return to the parent list at any time to add/remove items
  4. For each item, indicate the current position in the list ("1 of 3: Afghanistan")

Usage

Context or task: Explain the scenario or user tasks where this component is, or could be, used.

When we need to collect detailed information on each of the options the user selects in checkboxes.

Behavior

Describe the key interactions for this component, calling out any specific considerations for mobile.

clicking "Edit locations and dates" returns to the question with the checkboxes, with the previously-selected options checked.

Examples

Include any examples you have of this component or pattern. These can be screenshots, links to a Sketch file, or links to staging or production.

See the Disability Benefits (526EZ) - Toxic Exposure documentation page > Allowing Veterans to edit answers in a section. We have designed but not yet implemented this.

Accessibility

Include any accessibility considerations.

Some captured in our accessibility midpoint review feedback.

Cognitive load and orientation to where one is in the loop could be an issue. We had a recommendation to use more specific and orienting content like "Enter any date range you served in Afghanistan" instead of "Enter any date range you served in this location", but in our case, the level of effort and risk in implementing that specificity was high

Guidance

What would you want to tell other teams about this component or pattern?

It is a way of structuring a very complex form, but wherever we can avoid having to ask these questions, that's obviously a path that is much easier on the user.

Research (optional)

Include any research you have already conducted, or plan to conduct, on this component or pattern.

We plan to do research on this pattern. See ticket: Create Toxic Exposure Evaluation Research Questions and Approach #73031

Code (optional)

Include any existing code.

Not complete yet, but @christinec-fftc has an approach

Next steps

You may present your work to the Design System Council at an upcoming meeting. If you do not or cannot attend the Design Council Meeting, you can opt to get an asynchronous approval.

Submit requests to join an upcoming Design System Council meeting in #platform-design-system.

During the meeting, the Design System Council Working Group will evaluate the request and make a decision.

If your request is approved, you can add your component or pattern to the system. If you have any questions on how to add your component or pattern to the system, please reach out to the Design System Team at #platform-design-system.

caw310 commented 6 months ago

@mengA6 It might be a little early to present this to DSC. Perhaps ship this then come to DSC with the finished version. Let me know if you have a timeline for when this will be shipped.

mengA6 commented 6 months ago

Okay. Implementation is in progress, and I'll reach out when we are close to having it complete. cc @christinec-fftc @RakshindaAslam @alatempa24

mengA6 commented 5 months ago

@caw310 we are close to completing implementation of part of this: the list and loop generated from checkboxes. Implementation of the summary screen will take a while longer. Wondering if we should complete all of this before presenting it to DSC, or if we can show it with just the list and loop portion built.

caw310 commented 5 months ago

@mengA6 I would guess that it would be better to complete all of this before presenting to DSC.