Дизайн-систему часто предлагают в начале проекта, хотя компании нужен один сайт. Система — это не файл с кнопками. Это правила, по которым разные люди собирают интерфейс одинаково: цвет, отступы, компоненты, тексты, примеры правильного и неправильного.

Чем система отличается от UI-кита

UI-кит — набор макетов: кнопки, поля, карточки. Его хватает, чтобы один дизайнер и один разработчик собрали сайт без самодеятельности. Дизайн-система добавляет договорённости: когда какую кнопку брать, как называть действия, как звучит ошибка, что нельзя ломать без согласования.

Если кит лежит в Figma и им пользуется автор, это ещё не система. Система начинается, когда второй человек может собрать новый экран и не изобрести третий оттенок серого.

Когда её пора заводить

  • Интерфейсов больше одного: сайт, кабинет, рассылки, презентации для продаж живут по разным правилам.
  • В дизайне и вёрстке больше двух человек, и правки расходятся.
  • Продукт выходит релизами, а каждый экран рисуется с нуля.
  • Одинаковые блоки уже разъехались: три вида карточек, четыре стиля форм.

Для лендинга и небольшого корпоративного сайта система из пятидесяти компонентов будет дороже, чем сам сайт. Здесь достаточно аккуратной сетки, типографики и короткого набора блоков. Это нормальный результат UI-слоя, а не отдельный многомесячный проект.

Когда рано

Рано, если продукт ещё ищет сценарий. Компоненты, собранные до первых реальных экранов, устаревают вместе с гипотезой. Сначала рабочие страницы и пара итераций по живым задачам, потом вынос повторяющегося в библиотеку.

Рано и тогда, когда некому её поддерживать. Документ без владельца через квартал расходится с кодом. Если в команде нет человека, который принимает новые компоненты, система становится архивом.

С чего начать без лишнего объёма

Практичный минимум: цвета и контраст, шкала текста, сетка, кнопки, поля, ссылки, сообщения об ошибках. Каждый элемент — с примером в интерфейсе, а не с абстрактной плашкой. Новые компоненты добавляются, когда один и тот же блок появился трижды.

Такой набор уже ускоряет разработку сайтов и интерфейсов. Полноценную систему имеет смысл оценивать отдельно, когда появляется второй продукт или вторая команда. Если сомневаетесь, начните с аудита текущих экранов: часто половина «системы» уже есть, просто она нигде не записана.