Контекст
В Оптимакрос я отвечал за внутреннюю библиотеку компонентов и дизайн-систему. Совмещал руководство frontend-командой, управление продуктом и проектом, а также развитие дизайн-системы.
Задача: создать основу для продуктовых команд
Нужно было с нуля организовать разработку общей библиотеки интерфейсов. Задача охватывала не только компоненты, но и правила их использования: документацию, темы оформления, версии пакетов и доставку обновлений.
Моя роль и команда
Сформировал команду из трёх разработчиков и одного дизайнера. Отвечал за найм, личные встречи, планы развития и рабочие процессы. Организовал планирование, ретроспективы, оценку задач и документацию в Jira и Confluence.
Лично проектировал архитектуру библиотеки и компонентов, проводил проверку кода и дизайна. Разрабатывал собственный механизм управления состоянием React и типизированный адаптер для Zag.js, обучал дизайнера работе с компонентным подходом.
От дизайн-токенов до пакетов
Создал дизайн-систему в Figma и систему переменных для тем оформления. Для разработки и документации компонентов настроил Storybook. Общие правила кода и структуры проекта помогли команде работать согласованно.
Организовал монорепозиторий на Lerna, непрерывную сборку и доставку в GitLab, версионирование и публикацию npm-пакетов с Nexus. Написал скрипты для повторяющихся операций и плагин Figma для выгрузки стилей компонентов.
Результат: библиотека как внутренний продукт
В рамках направления разработаны более 40 независимых переиспользуемых компонентов. Команда получила архитектуру, документацию, темы оформления и полный процесс выпуска библиотеки — от изменения кода до публикации пакета.
Что стоит за результатом
Библиотека компонентов требует продуктового подхода: команды, понятных правил и поддержки пользователей внутри компании. Моя работа соединяла эти задачи с непосредственным проектированием и разработкой.