content(ai-assistant-figma): сократил местоимения

This commit is contained in:
root committed 2026-09-26 21:35:52 +02:00
1 parent 03a8e73ea6
commit c8a9c82bfa
2 files changed
+26 -26

No files matched your search

+13 -13
View File
@@ -106,22 +106,22 @@
<p class="case-page__sub">Мост между Cursor IDE и Figma для создания и запуска скриптов</p>
<p class="section__prose">
Я каждый день работал в Figma: проектировал сайты и приложения, использовал плагины, а когда готовых решений не хватало, делал свои. Со временем заметил, сколько времени уходит на повторяющиеся действия. Рутину вроде организации слоёв хотелось отдать скриптам, а сложные задачи, которые вручную казались неподъёмными, так и оставались в списке на потом.
Рабочие будни проходили в Figma: проектировал сайты и приложения, использовал плагины, а когда готовых решений не хватало, делал свои. Со временем заметил, сколько времени уходит на повторяющиеся действия. Рутину вроде организации слоёв хотелось отдать скриптам, а задачи, которые вручную казались неподъёмными, так и оставались в списке на потом.
</p>
<h2 id="context">Контекст</h2>
<p class="section__prose">
Плагин я делал для себя. Я уже использовал LLM для разных задач и писал с их помощью скрипты для Figma. Код создавал в Cursor, а для запуска раньше приходилось переносить его в Figma вручную. Сам писать код плагина и скриптов я не умел, поэтому по ходу работы изучал документацию и API плагинов Figma, а правила генерации скриптов в Cursor постоянно уточнял.
Плагин я делал для себя. LLM уже помогали создавать скрипты для Figma. Код готовил в Cursor, а для запуска переносил в Figma вручную. Навыков самостоятельного написания кода плагинов и скриптов не хватало, поэтому по ходу работы изучал документацию и API плагинов Figma, а правила генерации скриптов в Cursor постоянно уточнял.
</p>
<h2 id="task">Задача</h2>
<p class="section__prose">
Я хотел убрать ручной перенос кода и запускать скрипты прямо из Figma. Плагин должен был связать Cursor с Figma, дать возможность повторно запускать уже созданные сценарии и быстро копировать для LLM контекст выбранного объекта или страницы.
Задача состояла в том, чтобы убрать ручной перенос кода и запускать скрипты прямо из Figma. Плагину предстояло связать Cursor с Figma, дать возможность повторно запускать сценарии и быстро копировать для LLM контекст выбранного объекта или страницы.
</p>
<aside class="case-callout" data-callout>
<span class="case-callout__emoji case-callout__emoji--pulse" aria-hidden="true">💡</span>
<div class="case-callout__content">
<p>Я мог добавлять в каталог скрипты под разные задачи и запускать их прямо в Figma.</p>
<p>Каталог позволял добавлять скрипты под разные задачи и запускать их прямо в Figma.</p>
</div>
</aside>
<figure class="case-media case-media--real">
@@ -138,7 +138,7 @@
<h2 id="solution">Решение</h2>
<p class="section__prose">
Локальный сервер и WebSocket связали Cursor с плагином. Когда скрипт готов, я открываю плагин и нажимаю «Выполнить». Код автоматически передаётся в Figma.
Локальный сервер и WebSocket связали Cursor с плагином. Когда скрипт был готов, достаточно было открыть плагин и нажать «Выполнить». Код автоматически передавался в Figma.
</p>
<figure class="case-media case-media--real">
<img
@@ -152,7 +152,7 @@
<figcaption>Экран скрипта перед запуском в Figma.</figcaption>
</figure>
<p class="section__prose">
Сохранённые сценарии можно запускать из каталога и без Cursor. Я использовал готовые скрипты чаще, чем создавал новые.
Готовые сценарии запускал чаще, чем создавал новые. Из каталога их можно было запускать и без Cursor.
</p>
<figure class="case-media case-media--real">
<img
@@ -166,7 +166,7 @@
<figcaption>Меню дополнительных действий со скриптом.</figcaption>
</figure>
<p class="section__prose">
Чтобы LLM точнее понимала макет, плагин копирует информацию о выбранной ноде или целой странице. Эти данные я использовал в диалоге с моделью.
Для более точных ответов модели плагин копировал данные о выбранной ноде или целой странице. Этот контекст можно было передать LLM вместе с запросом.
</p>
<figure class="case-media case-media--real">
<img
@@ -180,7 +180,7 @@
<figcaption>Панель управления скриптом с переключателем Live.</figcaption>
</figure>
<p class="section__prose">
Логи выполнения мог читать LLM-бот в Cursor. Если дело было не в ошибке, а в логике скрипта, я разбивал его на небольшие шаги и запускал их по очереди. Сначала проверял сценарий на отдельном файле, а если всё работало, пробовал в рабочем макете.
Логи выполнения мог читать LLM-бот в Cursor. Логические ошибки разбирал по шагам: делил сценарий на части и запускал их по очереди. Сначала проверял скрипт в отдельном файле, а после успешного теста пробовал в рабочем макете.
</p>
<figure class="case-media case-media--real">
<img
@@ -208,7 +208,7 @@
<aside class="case-callout" data-callout>
<span class="case-callout__emoji case-callout__emoji--pulse" aria-hidden="true">✅</span>
<div class="case-callout__content">
<p>По моей оценке, на задачу вручную уходило от 1 до 30 минут. Запустить сценарий теперь можно было одним нажатием.</p>
<p>На ручное выполнение отдельной задачи уходило от 1 до 30 минут. Это оценка, отдельную статистику не собирал. Теперь скрипт запускался одним нажатием.</p>
</div>
</aside>
<figure class="case-media case-media--real">
@@ -223,10 +223,10 @@
<figcaption>Индикатор активного выполнения скрипта.</figcaption>
</figure>
<p class="section__prose">
Высвободившееся время позволяло браться за более сложные рабочие сценарии. В рабочих файлах я часто запускал скрипт, который сводил векторные иконки через flatten для корректного отображения в продакшене. Другой превращал фрейм в компонент, создавал его инстанс и переносил мастер-компонент в заданное место на странице компонентов. Скрипты также обновляли цветовые токены после ручных изменений и помогали собрать файл дизайн-системы с множеством страниц.
Высвободившееся время позволяло браться за более сложные рабочие сценарии. В рабочих файлах часто запускал скрипт, который сводил векторные иконки через flatten для корректного отображения в продакшене. Другой превращал фрейм в компонент, создавал его инстанс и переносил мастер-компонент в заданное место на странице компонентов. Скрипты также помогали обновлять цветовые токены после ручных изменений и собирать структуру файла дизайн-системы с множеством страниц.
</p>
<p class="section__prose">
Были и другие задачи: добавить варианты компонентов, сохранить набор токенов из JSON в текстовом слое или собрать прототип с переходами по клавиатуре. Я автоматизировал и подсветку кода в макете, чтобы показать идею и подобрать цвета синтаксиса. Вручную я бы за это не взялся.
Были и другие задачи: добавлял варианты компонентов, сохранял набор токенов из JSON в текстовом слое или собирал прототип с переходами по клавиатуре. Подсветку кода в макете тоже автоматизировал скриптом, чтобы нагляднее показать идею и подобрать цвета синтаксиса. Вручную за такую работу не взялся бы.
</p>
<figure class="case-media case-media--real">
<div class="case-video-shell">
@@ -239,12 +239,12 @@
<figcaption>Сборка формы из компонентов дизайн-системы по референсу с помощью скрипта.</figcaption>
</figure>
<p class="section__prose">
За время работы я лучше разобрался в Figma Plugin API. Теперь при планировании заранее замечаю, какие действия можно скриптовать, чтобы не тратить время на повторяющиеся операции.
За время работы лучше разобрался в Figma Plugin API. Теперь при планировании заранее учитываю, какие действия можно скриптовать, чтобы не тратить время на рутину.
</p>
<h2 id="next-steps">Планы</h2>
<p class="section__prose">
Дальше я хочу убрать Cursor из рабочего процесса и общаться с LLM-агентами прямо в Figma. В зависимости от задачи агент сможет подготовить переиспользуемый скрипт или выполнить действие по текстовой команде.
Дальше планирую убрать Cursor из рабочего процесса и общаться с LLM-агентами прямо в Figma. В зависимости от задачи агент сможет подготовить переиспользуемый скрипт или выполнить действие по текстовой команде.
</p>
<p class="section__prose">
Сейчас готово только окно интерфейса. Работа с агентами и запуск действий пока не реализованы.