Переменные в Фигме. Боль, JSON и AI.

Сейчас делаю концепт новой архитектуры цветов. Одна из фич — гибкое склонение токенов по группам.
Например, цвет primary может склоняться по:

🔵оттенку (neutral, positive, brand…),

🔵семантической группе (accent, contrast, inversed),

🔵платформе (web, iOS, Android),

🔵и, финально, теме — день/ночь.

Это даёт гибкость, расширяемость и задел на важные механики в будущем. Например, на действительно гибкую темизацию.

Но! Фигма так нативно и красиво не умеет. Только через костыль.

Во-первых, сразу отказываемся от идеи переключать оттенки модами (neutral, positive, negative… . вот эта штука). Очень хотелось бы, но нет уверенности, что хватит лимита по количеству модов — не хочется загонять себя в ограничения на старте.

И даже без этого, чтобы переключать остальные группы через моды, на первом слое нужно объявить всё логическое произведение групп (перемножить их между собой). И получается жесть.

Допустим, семантические группы мы выносим в моды. Но все остальные измерения зашиваем в уникальные переменные вида:

day\web\primary
day\ios\primary
day\android\primary
night\web\primary
night\ios\primary
night\android\primary

И это ещё нужно продублировать для каждого (!!!) оттенка. И так для каждого токена.

Зато в следующих коллекциях можно всё красиво связать с модами, скрыть промежуточные коллекции от публикации и получить аккуратное управление. Но какой ценой? Вручную это обслуживать почти нереально.

И тут внезапно на сцену выходят нейросети.

Даже обычный ChatGPT уже неплохо редактирует JSON. Достаточно:

1️⃣ экспортировать переменные из Фигмы через любой бесплатный плагин,

2️⃣ скормить JSON в нейронку,

3️⃣ внести правки,

4️⃣ импортировать обратно.

Да, бэкапы сохраняем постоянно — это база.

А если настроить это аккуратно через специализированные ИИ-инструменты (тот же Codex) и связать всё через что-нибудь вроде Cursor с Фигмой, можно автоматизировать часть рутины, обложить правилами и со временем минимизировать галлюцинации и лишние пояснения.

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

- -

🛫Канал: UXFLOW • Сергей Мухин
Сайт: uxflow.ru