openpencil/packages/docs/ru/programmable/ai-chat.md
Danila Poyarkov b9753aa016
docs: sync translations with documentation changes since v0.15.1 (#886)
Eleven translated pages changed in English since the last release without
matching updates: system requirements, the Lint tab, AI chat diff tools,
collaboration with agents, design JSX imports and export fidelity,
Storybook and live-app export, lint fixes, page navigation, and Checking
Designs. Bring de, es, fr, it, pl, and ru up to date, add the sections
the abridged translations lacked where a change landed, use each
language's UI labels, and point the export page at documents list.
2026-10-04 16:38:35 +00:00

9 KiB
Raw Blame History

title description
Чат с ИИ Встроенный помощник с более чем 90 инструментами для создания и изменения дизайна.

Чат с ИИ

Нажмите ⌘J или Ctrl + J. Помощник умеет создавать фигуры, менять стили и компоновку, работать с компонентами и анализировать документ.

Настройка

  1. Откройте панель чата.
  2. Нажмите значок настроек.
  3. Добавьте модель и настройте поставщика, идентификатор модели, учётные данные и возможности.
  4. Сохраните модель и назначьте её для роли Design agent.

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

Поставщики

Поставщик Модели Настройка
OpenRouter Claude, GPT, Gemini, DeepSeek, Qwen и другие Ключ API с openrouter.ai
Anthropic Claude Sonnet 4.6, Claude Opus 4.6 Ключ API с console.anthropic.com
OpenAI GPT-5.3 Codex, GPT-4.1, o3, o4-mini Ключ API с platform.openai.com
Google AI Gemini 3.1 Pro, Gemini 3 Flash Ключ API с aistudio.google.dev
Z.ai GLM-5.1, GLM-5, GLM-4.7 и семейство GLM-4.5 Ключ API из документации Z.ai
MiniMax MiniMax M3, M2.7, M2.7-highspeed, M2.5, M2.1 Ключ API с platform.minimax.io
Совместимый с OpenAI Любая конечная точка в формате OpenAI API Собственные базовый URL и ключ; можно выбрать Completions API или Responses API
Совместимый с Anthropic Любая конечная точка в формате Anthropic API Собственные базовый URL и ключ

Отдельный сервер и подписка OpenPencil не требуются: запросы отправляются поставщику напрямую с вашим ключом. В браузере действуют правила CORS поставщика. Разные развёртывания моделей также по-разному поддерживают потоковые вызовы инструментов. Результаты проверок и инструкции находятся в разделе Совместимость поставщиков и моделей BYOK.

Внешние подключения MCP

В настольной версии агенты ACP могут использовать доверенные удалённые серверы Model Context Protocol. Откройте Настройки → Подключения MCP, добавьте именованную конечную точку Streamable HTTP, при необходимости сохраните токен Bearer и включите подключение.

Токен хранится в настроенном хранилище учётных данных, а не в обычных настройках, и загружается только при запуске сеанса ACP.

Удалённый сервер должен работать через HTTPS. Для локальной разработки разрешены адреса обратной петли через HTTP. Включайте только сервер, которому доверяете: его инструменты могут читать внешние данные и выполнять действия с переданными учётными данными. Встроенный сервер MCP для дизайна подключается автоматически.

Возможности

Помощник использует более 90 инструментов:

  • Создание: фреймы, фигуры, текст, компоненты и страницы; JSX для сложных макетов.
  • Стиль: заливки, обводки, эффекты, прозрачность, радиусы углов и режимы наложения.
  • Компоновка: автоматическая компоновка, сетка, выравнивание, интервалы и размеры.
  • Компоненты: создание компонентов, экземпляров и наборов, управление переопределениями.
  • Переменные: создание и изменение переменных, коллекций и режимов, привязка к заливкам.
  • Запросы: поиск объектов, селекторы XPath, чтение свойств, получение списка страниц, шрифтов и выделения.
  • Проверка: get_jsx, diff_create и diff_jsx для структурных различий, diff_visual для попиксельных различий, describe для анализа структуры, роли объекта и возможных проблем дизайна.
  • Анализ: палитра, типографика, интервалы и повторяющиеся группы.
  • Экспорт: PNG, SVG и JSX с классами Tailwind; визуальная проверка через export_image.
  • Векторы: логические операции и изменение контуров.

Визуальная проверка

После создания или изменения дизайна помощник может вызвать export_image, получить снимок результата и сопоставить его с исходным запросом. Так обнаруживаются проблемы компоновки, отсутствующие элементы и неверные цвета. Инструмент diff_visual, который включён по умолчанию, сравнивает изменённый объект с эталонной копией и возвращает изменившиеся пиксели и область, поэтому помощник может убедиться, что правка не вышла за пределы цели.

Примеры запросов

  • «Создай карточку с заголовком, описанием и синей кнопкой».
  • «Сделай одинаковый радиус углов у всех кнопок на этой странице».
  • «Какие шрифты используются в этом файле?»
  • «Замени фон выделенного фрейма на градиент от синего к фиолетовому».
  • «Экспортируй выделенный фрейм в SVG».
  • «Найди все текстовые объекты с размером шрифта меньше 12».
  • «Опиши роль выделенного компонента».
  • «Покажи JSX этого фрейма».

Советы

  • Перед запросом выделите нужные объекты: помощник видит выделение.
  • Точно указывайте цвета, размеры и положение.
  • В одном сообщении можно изменить несколько объектов.
  • Пока идёт ответ, можно смотреть другие страницы: помощник продолжает работать на той странице, где было отправлено сообщение, а его предпросмотры появятся, когда вы вернётесь. Пока вы на другой странице, чат сообщает, с какой страницей работает помощник, и предлагает кнопку Перейти к странице. Если помощник сам переключает страницу, ваш вид следует за ним.
  • Если результат не подходит, используйте отмену.
  • После каждого вызова инструмента компоновка пересчитывается автоматически.