1. Начало работы и управление проектами

• Авторизация: Вход в систему происходит по электронной почте. После авторизации вы попадаете в основное окно редактора.
• Боковая панель (Сайдбар): Находится слева. Доступна по иконке бургер-меню или свайпу. Здесь вы можете создавать новые проекты (кнопка «Новый проект»), переключаться между существующими, а также переименовывать или удалять их. Каждый проект — это отдельный сайт со своей историей чата и файлами.

2. Работа с ИИ-Ассистентом (Чат)

• Выбор модели ИИ: В настройках проекта (иконка шестеренки) или в самом чате (в зависимости от ваших настроек) вы можете выбрать модель нейросети. По умолчанию установлена оптимальная модель (например, deepseek/deepseek-v4-flash), но для более сложных задач, где требуется продуманная логика, рекомендуется переключаться на версии Pro.
• Постановка задач (Промпты): В нижней панели чата пишите, что необходимо сделать. Пример: "Сделай красивый блок с тарифами, 3 колонки, центральная выделена, темная тема". Нейросеть сгенерирует код и сразу отобразит его в режиме реального времени на холсте справа.
• Отмена действий: Если результат вам не понравился, вы можете нажать кнопку «Отмена» над холстом предпросмотра, чтобы вернуть сайт к предыдущему состоянию.

3. Редактирование блоков сайта

Справа отображается предпросмотр вашего сайта (холст). Наводя курсор на любой блок, вы увидите панель управления этим блоком:

• Стрелки вверх/вниз: Перемещают блок по странице.
• Иконка корзины: Удаляет блок.
• Иконка кода (Редактор кода): Открывает окно ручного редактирования HTML/CSS/JavaScript. Внесите изменения и нажмите «Сохранить» — предпросмотр обновится автоматически благодаря функции горячей перезагрузки.
• Выбор блоков: Вы можете отмечать блоки галочкой, чтобы применять ИИ-команды только к ним (например: "Поменяй цвет фона в выделенном блоке").
• Массовая замена (Найти и заменить): Инструмент для быстрой замены текстов, цветов или классов сразу по всему сайту или в выделенном фрагменте.

4. Работа с файлами и медиа

• Галерея файлов: В верхней панели есть доступ к загруженным файлам (иконка скрепки). Сюда можно загружать свои изображения (логотипы, фотографии), после чего копировать их ссылки и просить ИИ вставить их на сайт или вставлять вручную через редактор кода.
• Генератор изображений (Grok): Приложение поддерживает встроенную систему генерации изображений по текстовому описанию — ИИ сам нарисует нужную графику и добавит ее в галерею проекта.

5. Публикация и SEO

• Настройки SEO: В разделе публикации можно задать мета-теги для поисковых систем: заголовок страницы (Title), описание (Description) и ключевые слова (Keywords).
• Публикация: После завершения работы нажмите на кнопку «Опубликовать». Вы можете привязать свой собственный домен или получить короткую публичную ссылку на готовый рабочий лендинг, которым сразу можно делиться.

Рекомендации по использованию

1. Дробите задачи: Нейросети работают эффективнее, если просить их делать сайт по частям. Не пишите "Сделай сайт автосервиса целиком". Лучше начните: "Сделай шапку для сайта автосервиса с логотипом, меню и номером телефона", а затем: "Теперь добавь ниже блок с тремя нашими главными услугами".
2. Экономьте время ручным редактором: Если ИИ сделал отличный блок, но ошибся в одной букве или цвете кнопки, быстрее нажать на иконку «Редактор кода» и исправить слово вручную, чем просить ИИ переписывать весь блок.
3. Сохраняйте удачные версии: Пользуйтесь инструментом отмены и чаще проверяйте, как выглядит код. Приложение сохраняет историю изменений, но при сильных экспериментах лучше создать копию проекта (если это предусмотрено вашим процессом работы).
4. Указывайте стилистику и технологии: Внутри платформа использует Tailwind CSS. При общении с ИИ используйте фразы вроде "Сделай с помощью классов Tailwind", "Сделай скругленные углы и градиент", чтобы получить более современный дизайн.
5. Внешние скрипты: Вы можете просить ИИ добавлять счетчики метрики, виджеты чата или другие JavaScript решения — приложение умеет корректно обрабатывать JS в специально отведенных для этого блоках скриптов.