Когда каждая новая страница придумывает свои правила
Крупный проект на Webflow редко разваливается сразу. Это происходит постранично: новой секции нужен чуть другой оттенок фирменного цвета — и кто-то его добавляет. Кнопке нужен отступ чуть больше — и вместо того, чтобы переиспользовать старый класс, создаётся новый.
Через полгода никто уже не скажет точно, сколько на сайте оттенков «почти чёрного», а каждая новая страница занимает больше времени, чем предыдущая, потому что строить её уже не на чём.
Система — это три вещи вместе
Дизайн-система, которая действительно держится — это не красивый style guide, пылящийся в Figma без дела. В Webflow это три вещи, работающие вместе: цвета и типографика через Variables, так что одно изменение обновляет весь сайт, согласованная шкала отступов вместо произвольных значений в пикселях, и нейминг — мы строим на основе Client-First — который держит классы предсказуемыми, кто бы ни редактировал проект.
Меняешь одну переменную — и всё, что на ней построено, обновляется мгновенно — без поиска сорока вручную вбитых цветов.
Компоненты, а не разовые элементы
Вторая половина системы — компонентизация. Кнопка — это не четыре разных класса под четыре разных случая — это один компонент с вариантами: Primary, Secondary, Glass, Text-only. Сборка новой страницы превращается в выбор нужного варианта, а не в изобретение нового элемента с нуля.
Та же логика работает с отступами и вёрсткой: небольшой набор переиспользуемых утилити-классов — контейнеры, отступы, спейсеры — покрывает большую часть того, что нужно странице, так что придумывать что-то новое приходится редко.
Собрана один раз, используется в каждом проекте
Именно эту систему мы закладываем в каждый проект на Webflow — отточенную на достаточном числе проектов, чтобы она просто работала с первого дня, а не изобреталась заново каждый раз. Это часть того, на чём построены Webflow-разработка и Дизайн-системы и style-гайды.
Готовая версия этой системы в виде отдельного шаблона скоро появится. Если не хочется ждать и нужен он прямо сейчас, напишите мне, и мы всё решим.