Component-based Design System and Development
summary
Red Hat builds a reusable design system called PatternFly v4 that replaces Bootstrap and jQuery with a thin CSS layer, CSS variables and framework-agnostic atomic components implemented as WebComponents that can coexist with React and Angular. The UXD team grows from 5 to about 100 while standardizing UI across ~50 products. The concrete payoff is reduced duplication and fewer inconsistent implementations, and the system is open source so teams can adopt a community or company-tailored build rather than rewrite every frontend.
AI-written summary · about
chapters (13)
- 0:00Component-based design systems
- 2:37Red Hat needed a design system
- 5:53What is a design system
- 6:59PatternFly evolution to components
- 9:31Universal component-based solution
- 10:55PatternFly Next features
- 12:03PatternFly improves consistency
- 14:09Growth with designers and engineers
- 15:33Q&A: Web, desktop, mobile
- 16:37Q&A: Adopting PatternFly
- 17:20Q&A: Migrating from Bootstrap
- 18:29Q&A: Living design systems
- 20:26Closing remarks
related talks
34mPatternFly Elements - A Performant Design System
20mDesign Systems for the Rest of Us
35mDesign system - From a Developer Point-of-View
19mDesign Systems at Scale: Maintaining UI Consistency in Dynamic Plugin Architecture
27mAdvanced Design System Considerations
22mDesign Systems, when and how much? — Diana Mounter
27mAccelerating Development using UI frameworks
22m'Centralizing the Frontend with Design Systems and Web Components'