|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.
- 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.
- 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:
|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?|