Дизайн-система

Дизайн-система (design system) — единая база знаний о дизайне какой-либо IT-системы (платформы, веб-сайта, приложения и т. п.), соединяющая UX/UI-дизайнеров (которые её формируют и в ней работают) и разработчиков (которые по ней ориентируются в своей работе). Призвана систематизировать, стандартизировать и автоматизировать разработку интерфейса, ускоряя и облегчая тем самым этот процесс и стабилизируя качество продукта.

Содержит:

• все элементы визуального языка, применяемого в интерфейсе системы, начиная от мельчайших «атомов» (кнопки, строки поиска, пиктограммы и т. п.) и заканчивая группами шаблонов и общим фирменным стилем;
• правила поведения этих артефактов и взаимодействия с ними;
• принципы работы с дизайном, текстом, архитектурой интерфейсов и с самой дизайн-системой;
• описание общего семантического поля.

Сочетает в себе содержимое более упрощённых баз знаний UX/UI-проектирования:

• UI kit — визуальные элементы интерфейса;
• фреймворк — если элементы хранятся в виде кода, позволяя разработчикам пользоваться библиотекой готовых компонентов;
• гайдлайн — правила и рекомендации по работе с элементами, шаблонами и макетами (работа с сеткой, цветами, иконками, как и когда заданные параметры можно модифицировать).

Готовые элементы интерфейса чаще всего хранятся в виде кода (что усиливает эффект автоматизации).

По сути, дизайн-система для проектировщиков интерфейса — это энциклопедия, а для остальных разработчиков— инструкция. Чем масштабнее проектируемая система или многочисленнее команда разработчиков, тем острее стоит потребность в наличии дизайн-системы. Дизайн-система чаще всего создаётся в единственном варианте для всей компании, чтобы унифицировать производство всех цифровых продуктов организации.