This is a new interest group that will collaborate to standardize the Evergreen user interface and establish a design system, including a component pattern library and a written style guide.

https://groups.google.com/a/evergreen-ils.org/g/ui-group is a dedicated mailing list for the new UI group. Note that new members must be approved by a Google Group owner; this is a spam prevention measure. We usually approve requests within a few minutes.

The group will meet on the 4th Thursday of the month at 2pm Eastern.

April 25, 2024: 90-minute meeting at the Evergreen Conference Agenda | Zoom link

• March 28, 2024: Agenda: recent UI changes, upcoming features in 3.13, style guide needs
• February 2024: no meeting
• January 25, 2024: Agenda and Notes | Video
• November 30, 2023 – 3.12 UI updates, further style guide discussion - Agenda and Notes | Video
• October 26, 2023 - Editorial style guide work, continued - Agenda and Notes | Video
• September 28, 2023 - Editorial style guide outline - Agenda and Notes | Video
• August 24, 2023 - How to find HTML & CSS files - Agenda and Notes | Slides | Video
• July 27, 2023 - Agenda and notes | Video
• June 6, 2023 - Agenda and notes
• April 27, 2023 - Introductory session at the Evergreen Conference. Slides | Lightning talk recap, beginning at 30:40 (no video of the full meeting)

The group will start with several small projects to standardize some elements of the Evergreen interface.

The Design System Roadmap shows how these fit into the long-term plan.

• Modals (and their buttons)
• Buttons
• Table column widths
• Form input types and autocomplete
• Empty states ("no results found" and the like)
• Settings groups

The long-term goal will be to create a comprehensive design system for Evergreen, including guidelines for governance of UI decisions.

This group organizes its work using the following official tags in Launchpad:

• accessibility: accessibility concerns & assistive tech (including screen readers, WCAG compliance, alt tags, etc.)
• terminology: wording issues; may be combined with ux-styleguide but is more specific
• usability: user interfaces, user experience, and general usability
• ux-buttons: User experience for buttons (wording, color, hover/focus states, etc.)
• ux-empty-states: User experience for default states ("nothing added yet", "no results found")
• ux-error-messages: On-screen error messages (not console logs)
• ux-forms: Usability issues with forms (may be further subdivided)
• ux-form-hints: Form field formatting hints, instructions, and placeholders
• ux-form-validation: Form validation issues
• ux-keyboard: Keyboard navigation, focus, and tab order
• ux-links: Link issues
• ux-menus: Issues with the wording, placement, or contents of navigation menus
• ux-preferences: UI-related user preferences
• ux-styleguide: Editorial style guide issues
• webstaffcolumns: Grid columns that can't be sorted or filtered, or show the wrong data, or are missing entirely

New tags may be canonized using the ux- prefix.