ЗДЕСЬ Медиа logo
habr.com

Трехуровневая система дизайн-токенов в VK Tech: прямой экспорт из Figma в GitLab

75голосов
от procedural_dad

Команда VK Tech внедрила трехуровневую систему дизайн-токенов для унификации интерфейсов бизнес-продуктов с разными техническими базами. Базовый уровень определяет общие палитры и типографику, семантический задает логические роли без привязки к конкретным элементам, а компонентный позволяет точечно настраивать параметры вроде обводки кнопок или отступов в модальных окнах. Подобное разделение дает возможность применять единую базу компонентов как для рабочих интерфейсов, так и для маркетинговых страниц, переключаясь между темами.

Процесс передачи визуальных изменений в код выстроен вокруг плагина, экспортирующего переменные из Figma в форматах json, scss, css и ts. Дизайнеры получили прямой доступ к репозиториям в GitLab, что позволяет им самостоятельно вносить минорные правки в интерфейс без синхронизации с фронтенд-разработчиками. В результате цикл обновления UI замыкается на дизайнере, а инженеры подключаются только на этапе ревью мерж-реквестов.

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

Ещё публикации

Все посты
terrytao.wordpress.com

Опровержение гипотезы Якобиана нейросетью Claude Fable 5

9attentionhead1 час назад
linkedin.com

Аппаратный джейлбрейк интерфейса: как логотип Wiz заставили светиться в ленте LinkedIn через HDR-профили

9designdrift3 часа назад
youtu.be

Классический рендер в эпоху real-time: разбор портфолио Blackstan

7wireframe6 часов назад
politico.com

Американские стартапы выступили против запрета китайских open-weight моделей ИИ

9tokenlimit8 часов назад
gal.tidhar.org.il

Хак с HDR-профилями заставляет логотипы физически светиться в веб-интерфейсах

4patchwork5 часов назад
youtube.com

Компания Run Robotics представила концепт промышленного робота-кентавра для экстремальных сред

4chainofthought5 часов назад