| 10-15min | Sarah Imholt updates on Hyrax UI issue grooming project | Sarah Imholt | Sarah will give an overview of a Hyrax Github initiative she's spearheading, which aims to refine and add further context to a pool of existing UI-related Hyrax issues and bugs.
https://github.com/samvera/hyrax https://docs.google.com/spreadsheets/d/1_S7ZbwJZY2WYHuY5OBCoBR0MIVrFa1tkrfj6-zIDoKw/edit?usp=sharing Hyrax Roadmap - Goal: Come up with a plan to make the system more usable and useful for end-users.
- Went through all issues (500+) to determine which are UI/UX related.
- Also working with #repo-managers group.
- Trying to organize and present needed work to community.
- Some issues were cleaned up and closed out.
- Github labels are used inconsistently.
- More consistent labeling and definitions are needed. Some application is not very useful.
- Grouping by part/function and level of readiness.
- Some issues need research / study / design, some can be resolved by developers.
- Project board exists in Github, will be updated.
- There are some bugs noted.
- Some tickets are very clear, some are really vague.
- Should we possibly revisit the UI/UX Github advisors group?
- After Sarah has things organized, she'll look for feedback on what to do with regard to prioritization.
- If you have additional issues, please add them as soon as possible, and reach out to Sarah with questions!
|
| 10min | Princeton's LUX design system | Shaun Ellis | Shaun will give an overview on Princeton's LUX design system, its background, why it was created and what purpose it serves. He'll also share a case study of how it'll be implemented in a new Rails application.
https://github.com/pulibrary/lux - Development practices changing - putting designers and developers on the same sprints is challenging. Design can be a prerequisite for modeling, development, etc.
- Shaun went through original LUX design system proposal.
- Problems: inconsistencies between websites - different code/markup, developers reinventing the wheel.
- Bootstrap upgrades became difficult.
- Unclear how to develop accessibility and software development principles.
- Hard for front-end developers to come in at the last minute - a number of unfamiliar backend systems to keep updated and interface with.
- One example of proposed consistency - a single alert item to be dropped in where needed, as opposed to varying styles.
- Easier to create/test for accessibility conformance.
- More flexible/minimal markup style (horizontal vs vertical facets).
- Shared vocabulary was a goal - carousel, etc.
- Not exactly Atomic Design - uses principles, but somewhat different terminology.
- Language agnostic - Rails, static, etc.
- Didn't want to take away functionality from Blacklight, which was designed to be used without needing JS.
- Includes principles like properly nesting heading styles.
- Don't really have templates yet, but there is room for this. Feedback form could be an example.
- Version number is very important.
- Showed example in Codepen.
- Using in production in a few spots (dss.princeton.edu, and backend order system - Figgy).
- Next steps: integrate Justin's work in BlacklightVue branch.
- With LUX, you can drop in single components, it's not all-or-nothing.
- System is 260 KB for CSS and JS. Smaller than Bootstrap. When upgrading, just bump up version number in package.json; easier than Bootstrap, easy to do across multiple applications.
- Starting a request/approval management app for HR tasks based on Lux.
- Two initial concerns: performance and knowledge of JS.
- Using LUX plus Bootstrap is higher payload as they transition over to LUX alone.
- Talking to Princeton UX department - they are interested in developing a design system.
- Some departments have more CSS-level code in design system. LUX is coupled more tightly.
- VueDS uses a model similar to https://github.com/styleguidist
- Similar look and feel to Bootstrap, which helps with onboarding.
Shaun's slides for the presentation can be found here: https://urldefense.proofpoint.com/v2/url?u=https-3A__docs.google.com_presentation_d_1OfqwsVctKNTieDbF4U1VbfYyfquQLT35YpDq5Qa0vS4_edit-3Fusp-3Dsharing&d=DwMGaQ&c=yHlS04HhBraes5BQ9ueu5zKhE7rtNXt_d012z2PA6ws&r=Ea4h8hpZersthv0zXU3u95TF_PqXZyGRyBiuj4XXsOE&m=2chCtiQreb9GCCYjtyFLhxfblGmORPG8-5m47S7qc8Q&s=vXoY_VLosKd2akzTsvgQfIgSFoLSAbXaMgv2GykU1Bo&e= |
| 5min | Samvera Connect 2019 ideas? | Adam Arling / Nik Dragovic | With an eye towards the fall 2019, are there any UX-related activities the group is engaged with which would be worth mentioning, or aiming for at Samvera Connect 2019? |