Плагин FISYCO отправляет локальные переменные файла Figma в библиотеку токенов FISYCO, а та доставляет их в ваш репозиторий через pull request. REST API Figma отдаёт переменные только на тарифах Enterprise, поэтому на остальных тарифах переменные попадают в FISYCO через плагин. Стилям он не нужен: их FISYCO читает по API сама.
Перед началом
- К проекту подключены Figma и репозиторий. См. Подключение Figma и Подключение репозитория.
- Создавать библиотеки могут сопровождающие проекта, а также владельцы и администраторы пространства.
- У вас есть аккаунт FISYCO. Плагин работает от его имени.
Установить плагин
Установите плагин из Figma Community. После этого он появится в меню Plugins в ваших дизайн-файлах Figma.
Войти по коду
Интерфейс плагина на английском, поэтому его кнопки ниже названы так, как вы их увидите.
- В Figma запустите Plugins → FISYCO и нажмите Connect. Плагин покажет код и откроет страницу входа FISYCO.
- Если страница попросит, войдите в FISYCO.
- Введите код из плагина в поле Код пользователя и нажмите Продолжить.
- Проверьте название приложения и аккаунт, затем нажмите Разрешить. Дальше плагин продолжит сам.
Код действует 10 минут. Страница никогда не берёт его из ссылки: так никто не сможет получить доступ, просто прислав вам ссылку.
Создать библиотеку токенов и отправить переменные
- В FISYCO добавьте в проект библиотеку типа Токены. На шаге Общие настройки укажите название и вставьте ссылку на файл Figma.
- На шаге Метод синхронизации выберите Стили автоматически, переменные через плагин. На шаге Стили оставьте нужные группы стилей и нажмите Настроить Local variables.
- Шаг Переменные ждёт плагин. В Figma откройте тот же файл и запустите плагин. Он покажет FISYCO is waiting for variables. Нажмите Send variables.
- Вернитесь в браузер: на шаге появятся коллекции и группы из файла. Отметьте группы для синхронизации.
- На шаге Генерация задайте форматы и структуру и нажмите Создать библиотеку. Отправленные переменные войдут в её первый прогон.
Ожидание привязано к вашему аккаунту FISYCO, а не к файлу, поэтому войдите в плагин тем же аккаунтом. Оно длится 30 минут. Потом плагин сообщит FISYCO is no longer waiting: снова откройте шаг Переменные и отправьте ещё раз.
Как выбрать группы
Библиотека токенов синхронизирует группы, а не файл целиком. Группой считается первая часть имени переменной внутри её коллекции: color/brand/primary входит в группу color.
- Сначала на шаге Переменные ничего не отмечено. Отметьте нужные группы; отметка коллекции включает все её группы.
- Пустой выбор не синхронизирует ничего. Неотмеченная группа не попадёт в код, а группа, добавленная в Figma позже, останется в стороне, пока вы её не отметите.
- Плагин всегда отправляет все локальные переменные. FISYCO оставляет только выбранные группы.
- Чтобы изменить выбор позже, откройте вкладку Обзор библиотеки, нажмите Править состав, затем Сохранить состав. Новый состав применится со следующей синхронизацией.
Если снять отметку с группы, чьи токены уже лежат в коде, следующий pull request их удалит. Перед сохранением «Править состав» покажет, сколько токенов уйдёт.
Отправлять изменения
- Откройте плагин в файле. В первый раз он спросит Which library does this file feed? Выберите библиотеку и нажмите Continue. Выбор сохранится в самом файле, и соавторы получат его тоже.
- Нажмите Send to с именем библиотеки. Кнопка Change library переключает на другую вашу библиотеку токенов.
- Плагин покажет, что добавилось, изменилось и осталось прежним, и даст ссылку Open the run.
Pull request откроется сам, если в настройках библиотеки включено Автоматически создавать PR после каждой синхронизации. Иначе нажмите Создать PR на странице библиотеки. О форматах вывода: Токены в CSS, SCSS и TypeScript.
Без плагина FISYCO не может забрать переменные. Если Figma сообщила о публикации переменных после вашей последней отправки, библиотека покажет Переменные изменились в Figma. Откройте плагин и отправьте их снова.
Кнопка Refresh tokens
После первой отправки через Send to в панели свойств файла появится кнопка Refresh tokens. Она отправляет переменные, не открывая окно плагина; то же делает Plugins → FISYCO → Quick Sync. Кнопка срабатывает, только когда файл привязан к библиотеке и никакая настройка библиотеки не ждёт переменные. Иначе она подскажет, что сделать сначала.
Что отправляет плагин
- Локальные переменные открытого файла: имена, типы, значения по режимам, режимы, коллекции и области применения (scopes).
- Имя файла, чтобы FISYCO показала, откуда пришли переменные.
Больше ничего из Figma не уходит: ни слоёв, ни изображений, ни комментариев, ни стилей. Вход хранится в хранилище плагина Figma на вашем устройстве. Выбранная библиотека записывается в сам файл.
Отключиться или сменить аккаунт
Нажмите Disconnect внизу окна плагина. Плагин забудет вход, и можно будет подключиться другим аккаунтом. Привязка файла к библиотеке сохранится.
Помощь и поддержка
Напишите на support@fisyco.com, указав имя файла и что вы делали. Как мы обращаемся с данными, описано в Политике конфиденциальности.