Дизайн5 мин чтения

Дизайн-системы в масштабе

Выход за рамки базовых библиотек компонентов для создания единого языка дизайна, который устраняет разрыв между дизайнерами и разработчиками.

Автор: Лев Данилов, основатель и технический директор

Дизайн-система — это не Storybook с кнопками. Это договорённость о том, как продукт выглядит, ведёт себя и развивается, когда над ним работают три команды и два подрядчика. Без токенов, версионирования и процесса contribution она превращается в ещё один legacy-слой.

Токены вместо хардкода

Цвета, отступы, радиусы и типографика живут в JSON-токенах и синхронизируются в Figma и код через Style Dictionary или аналог. Разработчик не подбирает #3B82F6 «на глаз» — он использует semantic token color.action.primary. Смена бренда становится задачей на день, а не на квартал.

Составные компоненты

Базовый Button, Input и Card — фундамент. Продуктовая ценность — в паттернах: FormField с ошибкой, DataTable с пагинацией, EmptyState с CTA. Именно их не хватает командам, когда «в макете красиво, а в проде всё разъехалось».

Процесс contribution

Новый компонент проходит короткий RFC: use case, API props, accessibility, примеры в Figma и PR в репозиторий. Без этого дизайн-система раздувается вариациями «почти одинаковых» кнопок от каждого продукта. Governance — не враг скорости, а фильтр от хаоса.

Понравился подход?

Давайте обсудим, как применить эти практики в вашем проекте.

Начать обсуждение
Дизайн-системы в масштабе — BIVEKI