Repository navigation
design "SF-SAC: Audit Information" page for implementation based on sprint 6 research insights #305
Description
Breakout issue of #274
Background
Sprint 6 research - observations/refinements by page
Sprint 6 mockups
Figma file
Observation(s)
- All users understood the questions being asked here and how to navigate the form.
- One user asked about the dollar threshold & Type B programs, and if that was still necessary. Another said it was when asked.
- A few users pointed out that the federal agencies list is incomplete and the format of checkboxes, while more intuitive than it was in the current version, would be cumbersome to use for the full list of agencies that would have to go here. (note from @MelissaBraxton "We should double check this. I think the users that asked about that may be misunderstanding what the list actually is and why it appears on this page. We should get to the bottom of the underlying need here and then adjust the recommendation.")
- Another user inquired why is this list here at all, though was short on details.
MVP recommendation(s)
- The agencies list will need to be updated to accommodate many more options. Checkboxes were appreciated but there may need to be a different way to display these. ((note from @MelissaBraxton "May need to revise based on above.")
Tasks
- Review sprint 6 research analysis
- Create checklists for refinement needed to each page
- Update Refine all SF-SAC forms based on sprint 6 research insights #274 with the checklist of refinements needed
- Make refinements
- Peer review
Definition of done
Acceptance Criteria (We'll know we're done when...)
- Screens in Figma are ready to be handed off to front end
- All text has a contrast ratio of 4.5:1 with the background
- Interaction are documented if they deviate from USWDS components
- The needs of someone navigating the site with the use of a screenreader or keyboard has been considered and documented
- There is an option for multilingual support
- There is supporting documentation for alt text, labels for links (anchor + target), error text in forms, and what assistive technologies should announce (if applicable)
Metadata
Metadata
Assignees
Labels
No labels
Activity
melchoyce commentedon Jul 11, 2022
Is this referencing this Figma page? https://www.figma.com/file/1bNncVt1TcFFDhQslqFC2o/FAC-Playground-(Copy)?node-id=2464%3A10742?
Or a different screen from the prototype file?
melchoyce commentedon Jul 12, 2022
Two ideas, both in this Figma page:
This first idea uses a multiselect combobox, which the USWDS does not currently support. I've made an issue for it here: uswds/uswds#4863
This second idea uses the HTML native multiselect option, which has a PR that's been merged, but hasn't been released yet: uswds/uswds#4766. However, we could probably just grab the updated code in the meantime and overwrite the version of USWDS we're using.
@MelissaBraxton @austinhernandez @sreuber Thoughts on design?
@petermarks-gsa @tadhg-ohiggins Thoughts on implementation?
sreuber commentedon Jul 13, 2022
@melchoyce My concerns relate back to a few specific comments on how people appreciated that a greater portion of the agency list was immediately visible. I feel like in the drop-down it might be too condensed. HOWEVER, this will still accommodate the longer agency list than the previous iteration of these mocks. I think this can work but it would be interesting to note any feedback for post MVP improvements.
melchoyce commentedon Jul 13, 2022
Thanks for this context — let me try a version where part of the list is visible by default. 👍
melchoyce commentedon Jul 13, 2022
Okay, here's a multiselect HTML list version, so the list items are visible:
Still only showing a few by default, but fewer clicking at least. Do you think this better solves the issue you heard people having?
austinhernandez commentedon Jul 13, 2022
@sreuber is there a reason these shouldnt go numerically? i understand that they are alphabetized, but in usability test people seemed to know their agency number
other than that — I think the multiselect open list vs the dropdown works, and i think thats the functionality on the legacy site.
sreuber commentedon Jul 13, 2022
@austinhernandez Yes, I simply lifted what the current site was doing when I originally designed this page way back when, so change what's needed.
melchoyce commentedon Jul 13, 2022
Updated the list:
Going to write up implementation notes next.
melchoyce commentedon Jul 13, 2022
@petermarks-gsa Implementation notes written: https://www.figma.com/file/1bNncVt1TcFFDhQslqFC2o/FAC-Playground?node-id=3623%3A17578
petermarks-gsa commentedon Jul 14, 2022
@melchoyce Cool, I created an implementation ticket: #354
Closing this out.