Design systems

Design Systems help to create a common language between designers, developers, and other stakeholders. Documenting design decisions will help keep your team aligned even if you cannot maintain a formal design system.

Components

Components should be documented in many different ways. Normally designers start with defining visual design and behavior, but general rules on how a component should be used is just as important. Component usage documentation should also consider accessibility and localization implications.

Design guidelines

Just as important as documenting components is defining core visual design rules. This can be core design basics such as typography, color, and spacing, but should also consider things like page layout, empty state, animation patterns, and other common patterns. Core design basics, or “tokens”, are usually defined early on in the creation of a design system since they are the building blocks to the rest of the elements of the design system.

Accessibility

Inclusive design is a must in product design. No user should be left out because of a disability. When building a design system, accessibility must be considered. An example is always providing a visible label on form elements. Usually code components are built with safety nets to prevent this from happening, but if you are properly documenting these accessibility guidelines, then that should help educate your designers and developers to help avoid such mistakes.