Design VAMC service accordion to align with VBA service accordion

[xiongjaneg]

User Story or Problem Statement

VAMC Facility Service appointment information will be migrated into updated Service Location to align with appointment information location in VBA RO MVP. A design showing how VAMC service accordions will look after migration will help front end engineers understand changes, such as a box around content, order of content, etc.

VBA service accordion example in Sketch

Mural of VAMC service accordion migration

Design

• VAMC Sketch file (FE design)
• VAMC Figma file (Drupal design)

Out of scope

Add more button label issue #16452 is out of scope as a CMS Team ticket and should not be considered as part of this ticket

Acceptance Criteria - Sprint 99 (5 points)

• Create design in Sketch for Front End
• Create design in Figma for Drupal
• Review with Content Designer (Dave)
• Review with accessibility (Laura)
• Review with UX Lead (Amanda)

Acceptance Criteria - Sprint 100 (5 points)

• Update mockup with feedback
• Request UX lead review / signoff (Amanda) - 48h

[davidmpickett]

@davidmpickett to refine

[thejordanwood]

@xiongjaneg I refined the ACs on this ticket and set up a meeting on 12/6 with @davidmpickett to get more clarity on the updates that are needed for this.

[davidmpickett]

Jordan and I met today to discuss what should be on the Sketch file for VAMCs and made a very official document

[thejordanwood]

I've created the FE design for this and reviewed with @davidmpickett. It can be found on the Service accordion page in this Sketch file.

[thejordanwood]

I've created the Drupal design for this and reviewed with @davidmpickett. It can be found on the VAMC services page in this Figma file.

[davidmpickett]

Slack thread for feedback

[thejordanwood]

I've made updates based on @aklausmeier feedback. There are a couple of open question that probably won't be solved this sprint:

1. Dave filed a defect ticket about the fact that the "Add service location" button text can't be updated. We can change the button text once this is solved.
2. There are a couple of questions asking if certain fields need help text. I think this is a bigger CMS question and plan to ask Blake about it in a meeting we have scheduled tomorrow to go over VBA content type feedback.

cc: @xiongjaneg

[xiongjaneg]

Noted in ticket description that Add more button label defect is out of scope for this ticket #16452

[jilladams]

@thejordanwood @xiongjaneg same here -- updated ACs with status as of today, given that Amanda gave first round feedback. Feel free to update as needed.

[thejordanwood]

@aklausmeier @davidmpickett I've updated the VAMC Figma file and responded to the feedback you had. I think this is final, but let me know if there was anything that I missed.

There was no feedback about the FE design in the VAMC Sketch file, so I'm assuming that's approved.

[aklausmeier]

@thejordanwood both files look good, checking off UX review AC which appears to be the last AC but I'll let you close ticket when you are ready