Design system
A design system combines design rules, reusable components and usage guidance. It also needs maintenance and traceable changes.
Shared rules for digital interfaces
A design system is a maintained combination of design foundations, reusable components and rules for their use. It may describe colours, typography, form fields and error behaviour. Responsibilities and changes are part of it too.
In an example business, the customer portal and internal administration use the same input field. The design system defines its label, help text and error presentation. Each application still decides which address or customer number is valid under its business rules.
A component library supplies the building blocks; a design system also explains when and how they are used and developed further. A collection of attractive designs alone does not fulfil that purpose. Its scope should fit the interfaces that actually recur, so maintenance effort and value remain proportionate.
Sources
Related terms
- Design tokenA design token stores a named design decision. Multiple components can use it, allowing a value to be changed in a defined place.
- UI componentA UI component is a reusable part of a user interface. Its purpose determines the presentation and interaction behaviour it needs.
- Focus orderFocus order determines the route through focusable elements. It should preserve meaning and operability, including during dynamic changes.
- Keyboard trapA keyboard trap leaves keyboard users stuck within a region. Deliberately containing focus in a dialog needs a keyboard-operable exit.
- Skip linkA skip link bypasses repeated navigation and leads to the main content. The destination must also work for subsequent keyboard navigation.
- Accessible nameAn accessible name labels a control for assistive technology. It should explain the action and agree with the visible text.
Articles on this topic
Design & UX with ASES
User experience, interfaces and brand presence