Скриншот вместо технического задания: что нейросеть не сможет угадать?

Скриншот хорошо передаёт расположение элементов, но не объясняет, что происходит после клика. Если попросить нейросеть сделать приложение «точно как на картинке», она будет вынуждена придумать состояния, права и ошибки. Полезнее использовать изображение как начало требований, явно выделяя неизвестное.

В Чатиуме можно сделать редактор требований по экрану: загрузить картинку, подтвердить видимые элементы и ответить на вопросы о поведении. После этого встроенному помощнику будет проще собрать осмысленное приложение.

Три слоя, которые нельзя смешивать

Первый слой — наблюдение: поле, подпись, кнопка, таблица. Второй — возможное поведение: кнопка, вероятно, сохраняет форму. Третий — неизвестное: кто может сохранять, какие значения допустимы и что происходит при конфликте.

Если все три слоя записать как готовые требования, приложение получит случайные решения модели. Иногда они окажутся удобными, но пользователь не сможет отличить собственный замысел от догадки.

Пример: таблица сотрудников

На условном экране видны имя, роль, статус и кнопка «Пригласить». Можно уверенно описать столбцы и положение кнопки. Но неизвестно, отправляется ли приглашение сразу, можно ли отменить его и кто имеет право менять роль.

После ответов появляется спецификация поведения. Например: приглашать может администратор, повторный запрос не создаёт дубль, статус «ожидает» меняется после принятия. Эти правила уже можно проверять в работающем приложении.

Как подготовить изображение

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

Для состояния ошибки полезен отдельный скриншот. Один «идеальный» экран редко показывает загрузку, пустой список и неуспешное сохранение. Эти состояния можно описать словами, если изображений пока нет.

Короткий вызов Qwen в Чатиуме

imageUrl — доступный для обработки адрес разрешённого пользователю изображения. ctx передаёт платформа. done и failed — зарегистрированные обработчики app.function, проверяющие caller.type === 'plugin' && caller.appSlug === 'start'.

import { startCompletion } from '@start/sdk'

const { completionId } = await startCompletion(ctx, {
  model: 'qwen/qwen3.8-flash',
  system: 'Раздели видимые элементы, предположения и вопросы о поведении.',
  messages: [{ role: 'user', content: [
    { type: 'text', text: 'Подготовь основу требований по этому экрану.' },
    { type: 'image', source: { type: 'url', url: imageUrl } },
  ] }],
  onCompletionCompleted: done,
  onCompletionFailed: failed,
})

Метод возвращает ID задачи. Текст разбора приходит позже в обработчик завершения, после чего приложение показывает его рядом с исходником. Код не создаёт приложение автоматически — он готовит материал для согласования требований.

Как передать результат в разработку

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

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

Частые вопросы