Search UX/UI dev criteria

[gumbeauuu]

Primary nav button/component

• [ ] Lockup: label + icon

• [ ] Button states

  • [ ] Default
  • [ ] Hover
  • [ ] Active/selected: input field is populated: background-color: ; search icon goes away, label slides left, right arrow (trailing) appears on the right side, indicating a page change

• [ ] Responsive sizes

  • [ ] desktop
  • [ ] tablet
  • [ ] mobile

Input field

surfaces when the search button is clicked

• [ ] States
  • [ ] Default
  • [ ] Hover
  • [ ] Active/selected, and populated
• [ ] Responsive sizes
  • [ ] desktop
  • [ ] tablet
  • [ ] mobile

Nav interactions

• [ ] close affordance
  • [ ] clicking away (outside) container
  • [ ] selecting [ X ]
  • [ ] keyboard: escape key
• [ ] submit affordance
  • [ ] tap search
  • [ ] tap enter on keyboard
• [ ] pressing search button when there's no input:

Search page

• [ ] Text field with search button
• [ ] Result summary: "1–10 of 1,655 results"
• [ ] "Showing results for [search query]"
• [ ] Max per page: 20 as a starting place
• [ ] Responsive sizes
  • [ ] desktop
  • [ ] tablet
  • [ ] mobile
• [ ] Pagination component
• [ ] Null state
  • [ ] 0 results
  • [ ] Title: "There are no matching results." Content Strategy team can finesse this

Entry

• [ ] Title
• [ ] Description
  • [ ] with description
  • [ ] without description
• [ ] Offered by, related to, department
• [ ] Labels: PDF documents, locations, services
• [ ] Responsive sizes
  • [ ] desktop
  • [ ] tablet
  • [ ] mobile

---

Background

• Research google doc
• https://github.com/cityofaustin/techstack/issues/4111 requirements brainstorming meeting

[robbobfrh84]

Gonna close this now that we've rolled into the next phase. Chase, let me know if there's anything in here that you didn't want closed and we'll open it up again or create a new or more specific issue.