Вайрфреймы
Добро пожаловать
Область Вайрфреймов позволяет визуально проектировать и прототипировать макеты вашего интерфейса. Создавайте вайрфреймы для планирования структуры вашего приложения перед написанием кода. При первом открытии Вайрфреймов вы увидите экран приветствия с карточкой Создать Вайрфрейм для начала работы, или используйте кнопку + Новый Вайрфрейм в правом верхнем углу.
Ключевые возможности
Manual Design
Создавайте вайрфреймы вручную с помощью визуального редактора холста — перетаскивайте компоненты для проектирования экранов.
AI-Powered Generation
Опишите, что вы хотите и let AI генерировать wireframe documentation и фреймы для you автоматически.
Voice Input
Используйте встроенный microphone button или middle-click to dictate your wireframe description с voice.
Wireframe to Code
Когда ваш вайрфрейм будет готов, отправьте его непосредственно на генерацию кода — от дизайна к рабочему коду в одном бесшовном процессе.
Создание вайрфрейма
Нажмите Создать Вайрфрейм или + Новый Вайрфрейм, чтобы открыть диалог создания. Вы введёте название, выберете целевую платформу (Мобильная, Десктоп или Веб), напишете описание вайрфрейма и выберете между режимами Вручную или С помощью ИИ.
Поля настройки проекта
Title
Дайте вашему проекту вайрфрейма имя, чтобы вы могли идентифицировать его позже в списке вайрфреймов.
Platform
Выберите целевую платформу — Мобильная, Десктоп или Веб — для адаптации макета вайрфрейма и ограничений.
Description
Опишите, что вы хотите создать. Это используется режимом на базе ИИ для генерации документации и кадров. Поддерживается голосовой ввод через кнопку микрофона.
Mode
Выберите «Вручную» для перехода непосредственно в редактор холста или «На базе ИИ», чтобы ИИ сгенерировал документацию и кадры для вас.
Ручной режим
Когда вы выбираете вкладку Вручную и нажимаете Создать, вы попадаете прямо в редактор холста вайрфреймов, где можете сразу приступить к созданию экранов. Это лучший вариант, когда у вас уже есть чёткое представление о дизайне и вы хотите полный контроль с самого начала.
Когда использовать ручной режим
У вас есть конкретный дизайн, и вы хотите создать его самостоятельно.
Вы хотите быстро набросать предварительный макет, прежде чем доработать его.
Вы предпочитаете полный контроль над каждым элементом с самого начала.
Режим на базе ИИ
Когда вы выбираете вкладку С помощью ИИ, появляются дополнительные опции. Вы можете ввести или продиктовать описание, при необходимости определить отдельные кадры, выбрать предпочтительную модель ИИ из выпадающего меню вверху, а затем нажать Сгенерировать, чтобы ИИ создал документацию вайрфрейма за вас.
Как это работает
Введите детали
Заполните заголовок, выберите платформу и напишите описание вашего проекта.
Определите кадры (необязательно)
Переключитесь на вкладку «Определить кадры», чтобы указать отдельные экраны или виды, которые вы хотите сгенерировать с помощью ИИ.
Выберите модель ИИ
Выберите предпочитаемую модель ИИ из выпадающего списка (например, Claude Code, Opus 4.6).
Генерация
Нажмите «Генерировать» для запуска генерации документации ИИ. Проект вайрфрейма появится в вашем списке, пока документация создаётся.
Создание кадров
Когда документация будет завершена, вы можете начать генерацию каждого отдельного кадра из редактора вайрфреймов.
Улучшение с помощью ИИ
В режиме С помощью ИИ нажатие кнопки Улучшить с ИИ открывает диалог, позволяющий улучшить ваше описание с помощью ИИ. Это берёт то, что вы написали в поле описания, и улучшает его в соответствии с вашими инструкциями — делая его более подробным, структурированным или полным перед генерацией вайрфрейма.
Параметры улучшения
AI Model
Выберите модель ИИ для улучшения вашего описания (например, Claude Code, Opus 4.6).
Enhancement Instructions
Опционально предоставьте конкретные инструкции о том, как ИИ должен улучшить описание. Поддерживается голосовой ввод.
Enhance Description
Нажмите для запуска улучшения. ИИ перепишет и улучшит ваше описание на основе вашего ввода и инструкций.
Генерация документации
После нажатия Сгенерировать в режиме С помощью ИИ ваш проект вайрфрейма появляется в списке вайрфреймов со статусом Генерация документации.... ИИ создаёт структурированную документацию для вашего проекта на основе заголовка, платформы, описания и определённых вами кадров.
Что происходит дальше
Генерация документации
AI создатьs a structured document defining каждый screen, компонент, и layout based on your description.
Frame Generation
Когда документация будет завершена, вы можете открыть вайрфрейм и начать генерацию каждого отдельного кадра из редактора.
Доработка
После генерации кадров вы можете вручную настроить, добавить или удалить компоненты в редакторе холста для тонкой настройки дизайна.