--- title: "Навык агента для работы с флоу" description: "Установите навык flow-generator, чтобы ваш AI-инструмент для написания кода мог создавать, переводить и реструктурировать флоу Adapty через Adapty CLI." --- > **AI agents**: to search Adapty docs faster and with fewer tokens, install the Adapty skill. Claude Code (self-updating via plugin): `claude plugin marketplace add adaptyteam/adapty-skills && claude plugin install adapty-skills@adapty` — other tools: `npx skills add adaptyteam/adapty-skills --all` [Навык flow-generator](https://github.com/adaptyteam/adapty-skills) позволяет AI-инструменту для написания кода создавать и редактировать ваши флоу прямо из терминала. Просто опишите, что нужно сделать, — инструмент считает конфигурацию билдера флоу через [Adapty CLI](developer-cli-quickstart), перепишет её, отрендерит превью и сохранит черновик после вашего подтверждения. Навык — это набор инструкций, которые ваш AI-инструмент загружает по требованию. Этот охватывает те части конфигурации флоу, в которых легче всего ошибиться: какие правки останавливают публикацию, какие ссылки ломаются при удалении экрана, и что предпросмотр может доказать, а что — нет. :::important Навык генератора флоу является экспериментальным и сохраняет изменения непосредственно во флоу на вашем дашборде. Сначала запускайте его на черновике или копии и проверяйте каждое изменение в Flow Builder перед публикацией. ::: ## Перед началом работы \{#before-you-start\} - **AI-инструмент для написания кода с поддержкой навыков**: подойдут Claude Code, GitHub Copilot CLI, OpenAI Codex и Gemini CLI. - **Продукты в вашем каталоге Adapty**: прежде чем разработать экран продаж, навык запрашивает список ваших продуктов и уточняет, какие из них должны быть на нём. Если подходящих нет, он может создать их на основе предоставленных вами идентификаторов продуктов в сторе — и сначала уточнит это. ## Что вы можете с этим сделать \{#what-you-can-do-with-it\} ### Создание флоу с нуля \{#author-a-flow-from-scratch\} - **По описанию**: «Пейвол для моего фитнес-приложения, два тарифа, годовой выбран по умолчанию.» Навык подбирает композицию, собирает её из проверенных шаблонов — вкладки, карточки тарифов, переключатели, обратный отсчёт, прогресс-бары, нижние шторки — и использует продукты, которые вы выбрали из своего каталога. - **По скриншоту или дизайну**: Дайте ему референс — и он воспроизведёт макет, цвета, типографику и стиль иконок, а затем расскажет о каждом отличии, которое не удалось устранить. Референсом может быть пейвол конкурента, один из ваших экранов или фрейм из вашего дизайн-инструмента. Если ваш AI-инструмент подключён к этому дизайн-инструменту через MCP, он читает фрейм напрямую — никому не нужно экспортировать скриншот или заново описывать дизайн словами. - **С оценкой по конверсии**: Если вы не дали дизайн, навык прогоняет экран через библиотеку `paywall-teardown` от Adapty и исправляет то, что влияет на конверсию сильнее всего, — ещё до того, как вы это увидите. Вы получаете экран, построенный по паттернам, которые продают в вашей категории, а не универсальный макет. ### Изменение существующего флоу \{#change-a-flow-you-already-have\} - **Локализация для новых рынков**: добавляет локаль и заполняет все локализуемые поля — заголовки, подписи к кнопкам, описания тарифов, слоты изображений и плейсхолдеры полей ввода. Это самый быстрый способ адаптировать один готовый пейвол для десяти языков. - **Переписать текст сразу во всех локалях**: изменяет формулировки, не трогая структуру, и редактирует текст вокруг переменных цены, а не через них, — так цены продолжают корректно подставляться. - **Изменить структуру флоу**: добавляет, удаляет и переставляет экраны, затем восстанавливает нарушенную навигацию и сообщает о недостижимых экранах. - **Добавить квизы и ветвление**: создаёт группы с выбором, идентификаторы вариантов и условные действия, которые направляют каждый ответ на отдельный экран, — шаг персонализации, превращающий онбординг в целевой визит на пейвол. - **Создать варианты для теста**: создаёт новый флоу на основе уже рабочего, затем применяет нужное изменение. Тема, шрифты, локали и продукты переносятся автоматически, поэтому вариант отличается ровно там, где нужно. - **Обновить стиль под сезон или кампанию**: берёт цвета из референсного изображения и применяет новую тему ко всему флоу, вместо того чтобы переоформлять каждый экран вручную. ## Что получается на выходе \{#what-it-produces\} ### Пейвол с временной шкалой плана \{#a-paywall-with-a-plan-timeline\} Нумерованная временная шкала над двумя карточками планов. Отображается на устройстве, поэтому стор уже рассчитал цены — включая стоимость в месяц для годового плана, которую вычисляет Adapty. ### Пейвол из одного предложения Задание звучало как «добавить экран пейвола» — без референсов и исходного флоу. `$0.00` — это заглушка для предпросмотра, а на бейдже написано **Best value**, потому что скидка не была указана. ### Флоу из трёх экранов \{#a-three-screen-flow\} Квиз, план, предложение — с настроенной навигацией между ними. Обратный отсчёт отрисовывается, но убедиться, что он запускается, можно только на реальном устройстве. ## Установка навыка \{#install-the-skill\} Навык входит в репозиторий `adapty-skills` вместе с `adapty-integration`, `ads-manager` и `paywall-teardown`. Каждая из этих команд устанавливает все четыре. ```bash claude plugin marketplace add adaptyteam/adapty-skills claude plugin install adapty-skills@adapty ``` Затем выполните `/reload-plugins` в Claude Code, чтобы активировать навыки. ```bash git clone https://github.com/adaptyteam/adapty-skills.git cp -r adapty-skills/skills/* ~/.copilot/skills/ ``` ```bash gemini skills install https://github.com/adaptyteam/adapty-skills ``` ```bash git clone https://github.com/adaptyteam/adapty-skills.git cp -r adapty-skills/skills/* ~/.agents/skills/ ``` ```bash npx skills add adaptyteam/adapty-skills --all ``` `--all` устанавливает все скилы во все агенты, которые обнаруживает [skills CLI](https://skills.sh). Чтобы установить только этот скил, используйте `--skill flow-generator`. Скилы, установленные таким образом, не обновляются автоматически — выполните `npx skills update`, чтобы получить более новую версию. Затем вызовите его — `/flow-generator` в инструментах, которые поддерживают слеш-команды, или фразой «Use the flow-generator skill» в тех, которые не поддерживают. Дальше всё происходит на обычном языке. Большинство запросов — это одно из следующего: - **Опишите флоу**: что делает приложение, что продаётся на экране, какой план выбрать по умолчанию. - **Укажите на дизайн**: скриншот, один из ваших экранов или фрейм в инструменте дизайна. - **Попросите о конкретном изменении**: назовите флоу и изменение — новая локаль, другой текст, дополнительный экран, ветка по ответу в квизе. - **Отвечайте на его вопросы**: он спрашивает, какие продукты разместить на экране, и не придумывает реальные цифры сам. ## Как это работает \{#how-it-works\} Всё, что создаёт навык, сначала попадает в локальный файл. Ничего не отправляется на дашборд до последнего шага. 1. **Настройка и аутентификация**. Навык устанавливает или обновляет [Adapty CLI](developer-cli-quickstart), если нужно, затем проверяет вашу авторизацию в Adapty и считывает ID приложения. Если вы не авторизованы, открывается браузер для входа, и навык ждёт завершения. 2. **Выберите или создайте флоу**. При редактировании инструмент загружает конфигурацию флоу и сообщает, что было найдено — экраны, локали, продукты и граф навигации — чтобы ошибочный флоу был обнаружен до внесения каких-либо изменений. Сначала создаётся резервная копия загруженной конфигурации. При создании нового флоу инструмент создаёт чистый флоу, а не генерирует поверх того, в котором уже есть контент. 3. **Проверьте конфиг**. Навык выполняет две локальные проверки файла и одну через Adapty. Локальные проверки подтверждают, что внутренние ссылки корректны и свойства сформированы правильно. `adapty flows config validate` затем запускает тот же сервис, который используется при публикации, — зелёный результат означает, что конфиг готов к публикации. Ни одна из трёх проверок ничего не сохраняет. 4. **Просмотр и итерации**. Навык рендерит каждый изменённый экран как скриншот и изучает его. Если вы предоставили референсное изображение, он сравнивает рендер с файлом поэлементно — цвет, шрифт, стиль иконок, пропорции — и устраняет найденные расхождения. Всё, что выглядит неправильно, возвращает навык к шагу 3, что стоит одного скриншота, а не сохранения. 5. **Подтвердите и сохраните**. Перезапись существующего конфига требует явного подтверждения. Навык покажет вам отрендеренный вид «до и после» для каждого затронутого экрана, перечислит изменения, которые не отображаются визуально, откроет один экран в браузере и укажет имя файла резервной копии. Только после этого он запишет изменения. ## После запуска \{#after-the-run\} Скилл сохраняет черновик. Чтобы показать его пользователям: 1. **Откройте флоу в Flow Builder.** Если флоу уже был открыт во вкладке браузера, обновите страницу — Flow Builder не подхватывает изменения, сделанные через CLI. 2. **Проверьте, что изменилось.** Adapty помечает флоу, который был **Published** до сохранения, как **Dirty**, и все участники вашей команды видят этот статус. Пользователи по-прежнему видят последнюю опубликованную версию. 3. **Протестируйте на реальном устройстве.** В статье [Предпросмотр флоу](paywall-device-compatibility-preview) описан процесс предпросмотра через QR-код в мобильном приложении Adapty. Протестируйте всё, что инструмент отметил как непроверенное — ветвление, переключатели и любые локали, отличные от той, которую он отрендерил. 4. **Опубликуйте.** Нажмите **Publish to Live** в правом верхнем углу Flow Builder. Флоу, не добавленный в [плейсмент](create-placement), не будет показан никому, а черновик нельзя добавить в плейсмент — поэтому сначала опубликуйте флоу. См. [Сохранение и публикация флоу](builder-save-publish). Если результат окажется неверным, восстановите его из резервной копии: навык создаёт копию конфига перед первым изменением и указывает имя файла в сообщении об одобрении. Попросите навык записать этот файл обратно или исправьте флоу вручную в Flow Builder. В любом случае сохранённый черновик никак не влияет на ваших пользователей. ## Примеры промптов \{#example-prompts\} Навык уже содержит команды, формат конфигурации и шаги верификации, поэтому в промпте не нужно ничего из этого указывать. Просто скажите, какой флоу, и что должно быть верно по завершении. #### Перевести пейвол \{#translate-a-paywall\} ``` Add Brazilian Portuguese to my "Summer 2026" paywall. Translate every localizable field, not just the headline, and tell me what you couldn't. ``` #### Собрать из дизайна \{#build-from-a-design\} ``` Build a new paywall flow from the "Winter promo" frame in our Figma file. Show me my products first and let me pick which ones go on it. ``` #### Добавить квиз с ветвлением \{#add-a-quiz-that-branches\} ``` Add a quiz screen before my paywall: "What's your main goal?" with three options, each routing to its own benefit screen, then on to the paywall. ``` #### Переписать текст \{#rewrite-copy\} ``` Rewrite the headline and CTA on my onboarding to be shorter and more direct. Keep the price variables working, and apply it to every locale. ``` #### Создать тестовый вариант \{#spin-up-a-test-variant\} ``` Copy my "Main paywall" into a new flow and make the monthly plan the preselected one. Leave the original alone. ``` #### Переделать под кампанию \{#re-skin-for-a-campaign\} ``` Re-theme my paywall flow to match the colors in ./design/spring.png. Copy and layout stay as they are. ``` #### Добавить экран \{#add-a-screen\} ``` Add a social proof screen between the quiz and the paywall in my activation flow — star rating and two testimonials. Ask me for the real numbers. ``` ## Передайте изображения Навык загружает изображение с вашего компьютера и подставляет полученный URL во флоу, так что вам не придётся добавлять медиафайлы в Flow Builder вручную. Ему нужен **путь к файлу**, а не картинка: когда вы вставляете или прикрепляете изображение в чат, AI-инструмент получает пиксели, но не файл, поэтому загружать нечего. Сложите ресурсы в папку на компьютере, затем укажите инструменту путь к ней: ``` The hero images are in ./design/paywall/. Use hero-calm.png on the first screen and the three icons in ./design/paywall/icons/ for the benefit rows. ``` Форматы и ограничения по размеру совпадают с ручной загрузкой во Flow Builder — см. [Изображения, видео и иконки](custom-media). Единственное исключение — SVG: такие файлы не загружаются, поэтому инструмент отрисовывает одноцветные глифы прямо в коде. Каждая загрузка добавляет отдельный ассет в медиатеку, а команды CLI для удаления ассетов нет, поэтому повторный запуск сборки оставляет дубликаты. Если указать имя файла, которого инструмент не найдёт, он спросит, а не подставит похожий. Неверный файл даст экран, который визуально выглядит корректно, но с неправильным изображением — и ничто в рабочем процессе это не поймает. ## Используйте своего агента \{#bring-your-own-agent\} В Flow Builder также есть [AI Editor](flow-ai-editor). Разница не в том, у кого больше возможностей — а в том, в чьей среде происходит работа. AI Editor — это агент Adapty, работающий на открытом вами экране. Скилл устроен иначе: ваш агент, ваша модель, ваши инструменты, а Adapty — один из инструментов, которым агент умеет пользоваться. Всё, к чему ваш AI-инструмент уже имеет доступ, идёт вместе с ним: ваш репозиторий, дизайн-файлы, MCP-серверы, ваши промпты и контекст. | | AI Editor | навык flow-generator | |---|---|---| | Чей агент | Adapty, в браузере | Ваш, в вашем терминале | | Что видит | Открытый экран | Всё, до чего может дотянуться ваш AI-инструмент | | Охват одного промпта | Один экран | Весь флоу — экраны, навигация, локали | | Локализация | Не предусмотрена | Добавляет локаль и заполняет все локализуемые поля | | Отмена | Один клик на промпт | Файл резервной копии и ваше подтверждение перед каждым сохранением | | Настройка | Не требуется | Adapty CLI и навык | Используйте AI Editor, когда вы уже в билдере и хотите изменить стиль экрана прямо перед собой. Используйте скилл, когда не хотите покидать свою среду, чтобы поработать с флоу. ## Что скилл не делает \{#what-the-skill-wont-do\} Скилл работает с вашими флоу как с активным контентом, поскольку опубликованный флоу обслуживает реальных пользователей. - **Публикация остаётся за вами**: в Adapty CLI нет команды publish, поэтому навык останавливается на сохранённом черновике. - **Перезапись требует вашего подтверждения**: сохранение полностью заменяет конфиг — частичная запись и откат невозможны. При подтверждении указываются название флоу, его ID, статус и файл резервной копии, созданной навыком перед редактированием. - **Параллельное редактирование прерывает запись**: каждая запись после первой отправляет временную метку `updated_at` конфига обратно в Adapty. Если коллега сохранил флоу в это время, Adapty отклонит запись, а не перезапишет его изменения. - **Удаление флоу выполняется только через дашборд**: в CLI нет команды delete, поэтому флоу, созданный навыком, останется до тех пор, пока вы не удалите его через дашборд. - **Реальные числа и ресурсы предоставляете вы**: рейтинги, количество отзывов, проценты скидок и цены в сторе никогда не придумываются. Если для паттерна нужны данные, которые вы не предоставили, навык запросит их или пропустит элемент и сообщит, что именно он сделал. :::note Чтение, валидация и превью ничего не стоят и ничего не меняют. Сохранение конфига — единственное действие, которое достигает вашего дашборда, и оно требует вашего подтверждения. ::: ## Ограничения \{#limitations\} #### Запуски занимают время \{#runs-take-time\} Навык валидирует и перерисовывает результат после каждого изменения — именно это защищает дашборд от сломанной конфигурации, но делает запуск медленнее, чем обычный ответ в чате. Небольшая правка завершается за несколько минут. Создание многоэкранного флоу с ветвлением занимает **от 10 до 40 минут**. Запустите задачу и вернитесь позже — не стоит ждать у экрана. #### Видео и кастомные шрифты загружаются вручную \{#videos-and-custom-fonts-stay-manual\} Навык загружает изображения, но не [видео](custom-media) и не файлы [кастомных шрифтов](using-custom-fonts-in-flow-builder). В обоих случаях он создаёт нужный слот и передаёт загрузку вам: - **Видео**: навык размещает медиаэлемент там, где должно быть видео, так что раскладка уже готова — просто подставьте файл в Flow Builder. - **Шрифты**: навык создаёт текстовые стили по вашему дизайну и привязывает их к шрифту-заглушке. Загрузите шрифт в Flow Builder и назначьте его этим стилям. #### Превью показывает один экран в одном состоянии \{#the-preview-renders-one-screen-in-one-state\} Страница превью навыка отображает один экран и не воспроизводит флоу целиком. Следующие вещи проверить в ней не получится. Тестируйте каждую из них на реальном устройстве — [Превью флоу](paywall-device-compatibility-preview) объясняет как: - **Навигация и ветвление**: кнопка с навигационным действием остаётся в превью на месте, поэтому условный маршрут не срабатывает. Каждый экран отображается отдельно. - **Тумблер и мультивыбор**: строка с тумблером и строка с мультивыбором отрисовываются в выключенном состоянии согласно своему значению по умолчанию. Строки с одиночным выбором и карточки продуктов отображают выбранное состояние. - **Любой язык, кроме того, которым отрисовывается**: превью игнорирует язык по умолчанию флоу и порядок списка локалей, поэтому визуально проверить перевод невозможно. Переключите локаль во Flow Builder и проверьте, не выходит ли текст за пределы контейнера. - **Всё, что определяется в рантайме**: реальные цены, валюта стора и пользовательский ввод. Переменная с ценой отображается как буквальный токен, который длиннее любой цены и может сдвигать текст под закреплённую кнопку — перекрытие исчезает, как только цена разрешается. - **Размеры экранов, которые страница не знает**: макет, корректность которого зависит от высоты области просмотра, нужно проверять на телефоне с небольшим экраном. ## Что дальше \{#whats-next\} - [Сохранение и публикация флоу](builder-save-publish) — завершите черновик, который оставил скилл. - [Распространённые проблемы](flow-common-issues) — что мешает флоу опубликоваться. - [Добавить локаль в Adapty Flow Builder](add-paywall-locale-in-adapty-paywall-builder) — та же работа по локализации вручную. - [Управление Adapty с помощью AI-агентов и инструментов разработки](manage-adapty-with-ai) — другие скиллы Adapty и AI-инструменты.