Путь дизайнера: от брифа до живого прототипа и аудита Figma через агента. Не генератор картинок и не чат в браузере — агент читает ваши файлы и Figma через MCP, следует дизайн-системе и собирает живой прототип.
На входе текстовое описание продукта, на выходе — интерфейс, который открывается в браузере: переходы, состояния, формы, пустые экраны.
Три примера из работы дизайнера с агентом и ключевые понятия маршрута.
Каждый шаг содержит готовую рекомендацию, промпт для агента и понятную проверку результата.
Этот шаг стоит первым во всех маршрутах /resheniya. Воспользуйтесь удобным сервисом «Плати по миру» по ссылке ниже: выпустите карту, пополните через СБП, затем войдите в Cursor через GitHub и оплатите Pro этой картой.
Сравните платформы и режим работы, прочитайте мост «как писать агенту», затем поставьте стек на ПК. Оплата Cursor — на предыдущем шаге через Плати по миру.
Большинство дизайнеров попробовали AI как генератор картинок, не получили ничего применимого и оставили тему. Агенты работают иначе: им можно отдать задачу, а не запрос. Это и есть главная развилка маршрута.
Сначала агент работает только с файлами на компьютере. Чтобы он видел вашу Figma, подключите Figma через MCP-сервер и вставьте Personal Access Token. Полноценный доступ (Dev Mode: просмотр, стили, код) даёт платный план Figma Professional/Dev; на бесплатном плане доступ урезан. Лайфхак: Figma for Education даёт полный доступ студентам и преподавателям.
Оба агента живут на вашем компьютере, видят файлы и умеют работать с MCP. Разница — в силе модели и в барьерах доступа из РФ. Гайд дальше показывает общий процесс: сначала среда, потом задачи.
Велик соблазн сразу попросить агента собрать экран. Не торопитесь: откройте папку проекта как рабочую, дайте агенту прочитать правила и только после этого ставьте задачу. Порядок «среда → наполнение → задачи» — то, что отличает разовый эксперимент от рабочего процесса.
Развёрнутая среда — только каркас. Работать на вас она начинает после наполнения: код разработчиков, чтобы агент понимал, во что превращаются макеты; ссылка на файл Figma, с которым работаете; дизайн-система, если она есть.
Скилл — отдельный файл с описанием того, как делать конкретную вещь: шаги, порядок, на что смотреть, типичные ошибки. Агент подхватывает такие файлы сам, когда задача подходит. Начните с готового Design-кластера ProektMap и адаптируйте под себя.
На входе обычный текстовый бриф. Агент задаёт уточняющие вопросы, собирает из ответов описание продукта и делает работающий прототип, который открывается в браузере. На нём сразу видно, где сценарий рассыпается.
Когда решение проверено на прототипе, попросите агента подготовить перенос: список экранов, компоненты и токены из вашей системы, иерархию слоёв и чек-лист. Перенесите макеты в Figma (плагином или вручную) по этой структуре, а агент сверит результат с системой — так перенос не разъезжается с дизайн-системой.
Аудит макетов на соответствие дизайн-системе — самая благодарная задача для агента: он видит и файл, и правила. Ручная проверка, на которую уходит день, превращается в список за несколько минут. Дальше вы правите по списку.
Первые дни с агентом — это пять типичных проблем. Каждая решается за минуту, если знать причину. Держите этот список рядом.
Среда агента, подключение к Figma, дизайн-система в файлах и скиллы под ваши задачи — дальше каждая новая задача идёт быстрее.
Переходите в рабочую зону: разверните среду, подключите Figma и соберите первый живой прототип из своего брифа.
