База данных

Интерактивные страницы, приложения и анимация

Артефакты — это живые результаты, которые Modelyx собирает в боковой панели рядом с чатом: веб-страницы, мини-приложения, дашборды, анимированные баннеры, 3D-сцены, диаграммы и векторная графика. Вы сразу видите рабочий Preview, дорабатываете результат запросами на изменения, а затем скачиваете исходник или публикуете публичную ссылку.

Типы артефактов

Тип Для чего
HTML-страница Лендинги, анимированные баннеры и первые экраны, вёрстка писем, страницы-слайды
React-компонент или мини-приложение Калькуляторы, формы, дашборды, интерактивные инструменты
SVG Логотипы, иконки, простые иллюстрации
Диаграмма Mermaid Блок-схемы, оргструктуры, схемы процессов и структур
Markdown Форматированный текст, например брифы и чек-листы
Код Фрагменты кода и скрипты для копирования

Скилл Artifacts включён по умолчанию, так что достаточно просто попросить нужный результат.

Что можно создать

  • Лендинги и страницы товаров, которые можно проверить до передачи разработчику.
  • Дашборды и графики по вашим данным, интерактивные прямо в браузере.
  • Калькуляторы, квизы и формы, которые работают в браузере.
  • Анимированные баннеры и первые экраны с движением и переходами.
  • 3D-сцены, которые работают в браузере, например вращающийся товар или интерактивный фон.
  • Интерактивные презентации: страницы-слайды, которые листаются по клику.
  • SVG-логотипы и иконки в чистом векторе.
  • Диаграммы процессов, воронок и структуры команды.

Изображения из чата

Изображения, которые вы сгенерировали или загрузили в чат, можно разместить на странице — например, главную картинку на лендинге или фото товаров в разделе каталога. Сначала сгенерируйте визуал, затем попросите Modelyx собрать страницу вокруг него. См. Генерация и редактирование изображений.

Preview, Code и доработка

Переключайтесь между Preview, чтобы пользоваться результатом, и Code, чтобы посмотреть исходник. Чтобы что-то изменить, скажите, что именно: «сделай шапку закреплённой», «добавь тёмную тему», «замедли анимацию». Просите Modelyx обновить тот же артефакт — так у вас будет одна развивающаяся версия, а не несколько копий. В каждом ответе — один артефакт.

Экспорт

  • Download сохраняет исходный файл для любого типа: HTML, TSX, SVG, Mermaid или Markdown.
  • У SVG-артефактов также есть Download as PNG, Download as SVG и Copy as Image.
  • HTML- и React-артефакты не экспортируются в PNG, GIF или видео. Для статичного баннера используйте генерацию изображений. Для векторного логотипа или иконки попросите SVG-артефакт.

Publish создаёт публичную ссылку на снимок артефакта: «Anyone with the link can open this artifact.» Нажмите Copy URL, чтобы поделиться ею с тем, у кого нет аккаунта Modelyx, — например, с клиентом, который проверяет лендинг, или с командой, которая открывает дашборд.

  • По ссылке открывается та версия, которую вы опубликовали. После новых изменений нажмите Publish this version, чтобы обновить её.
  • Счётчик просмотров показывает, сколько раз открывали ссылку.
  • Unpublish отключает ссылку.

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

Пример запроса
Сделай лендинг для студии йоги в Алматы: первый экран с картинкой, которую ты сгенерировал выше, таблица расписания, 3 карточки с ценами, форма обратной связи. С адаптацией под мобильные.
Пример запроса
Сделай анимированный первый экран для финтех-приложения: тёмный фон, парящие 3D-карты, заголовок «Плати в одно касание», кнопка с призывом к действию.
Пример запроса
Нарисуй SVG-логотип для «Northwind Coffee»: простая гора и кофейное зерно, два цвета, должен читаться в размере 32 px.

Ограничения

  • Один артефакт на ответ.
  • HTML- и React-артефакты экспортируются только как исходный код, не как изображения или видео.
  • Опубликованная ссылка — это снимок; изменения появляются только после Publish this version.