What is the Kaltura Design System?
The Kaltura design system is a set of standards to manage the Kaltura products' design at scale by reducing redundancy while creating a shared language and visual consistency across different pages and products.
Why Use a Design System for Kaltura Products?
The idea of creating the design system for Kaltura products was to develop a single underlying system that unifies the user experience across platforms, devices, and input methods.
The Design System bridges the gap between the development, product and design teams by sharing reusable portable and scalable components.
The goals for the Design System at Kaltura are to:
- Develop a single underlying system that unifies the user experience across platforms, devices, and input methods.
- Expand Material’s visual language and provide a flexible foundation for innovation and brand expression.
- Create a visual language that integrates the principles of good design with the innovation of advanced technology and accessibility.
Using the Design System simplifies customizing theming for our products down to every style and property to match any brand.
Why is Kaltura Implementing a New UI?
- Accessibility is an important factor when creating and designing Kaltura products. Kaltura uses an industry leading standard (MUI Material UI) to ensure that all components are accessible.
- Functionality of Time - From design to development to production, time is saved by teams since there is a defined visual language across the board. Everyone is using a common language to design and develop our products.
The Design System has a component list. You may choose an item from the list of components, for example a drop down menu or icon, and reuse the item. The discussion between teams is clear and bug fixes are cross site. If you fix one component the fix is propagated across the board to all locations. QA can test fixes rapidly and the development time using the Design System is much faster. You can create variations of components and do not have to build components from scratch.
Transitioning to the Kaltura Design System
The Design System is built completely separate from the current Kaltura MediaSpace and Kaltura Application Framework pages. If you choose to rebuild you pages, the current application's display will not be impacted.
New pages may be released faster and there is no worrying about backward compatibility.
Design System Features
- Components
- Design Tokens
- Utilities
- Page Templates
Design System Components
- Themes
- Visual Index
- App Architecture
- User Interaction
- System capabilities
- Visual Design
- Icons and images
- Window and View
- Menus
- Buttons
- Fields and Labels
- Selectors
- Indicators
- Touch Bar
- Extensions
- Colors
- Accessibility
- Resources
- Typography
- Illustrations
- Sounds
- Interaction states
- Spacing
- Data visualizations
The design system is accessed through ....
More information is available in the Theming module article.
