Соберите рабочий прототип приложения с ИИ и покажите его людям
Прототип стоит делать, когда он отвечает на вопрос, на который не ответит макет: понимает ли человек сценарий, когда ему приходится самому им пользоваться? Anticode пишет рабочее приложение по вашему описанию, заполненное образцами данных с соответствующей пометкой, и тестировщик может открыть его на своём телефоне. Здесь разобрано, что прототипировать, как это описать и где заканчиваются возможности прототипа, работающего в одном браузере.
Почему рабочий прототип говорит больше, чем макет
Статичные экраны проверяют, нравится ли людям внешний вид. Проверить, могут ли люди этим пользоваться, они почти не позволяют: тестировщику приходится представлять, что происходит после каждого нажатия, и ведущий сессии в итоге пересказывает продукт вслух. Кликабельный прототип, который действительно реагирует, убирает этот пересказ. Тестировщик вводит текст в настоящее поле, видит, как меняется настоящая сумма, и получает настоящее пустое состояние, когда удаляет последний элемент. Его замешательство относится к вашему дизайну, а не к пробелам прототипа.
Меняются и вопросы, которые можно задать. С макетом вы спрашиваете «стали бы вы этим пользоваться?», и люди вежливо отвечают. С работающей вещью можно дать задание («добавьте смену на следующий вторник и посмотрите, как изменятся ваши часы за неделю») и наблюдать, где человек запинается.
Решите, что должен доказать прототип
Прежде чем что-либо описывать, запишите один-два вопроса, на которые должен ответить тест. Так сборка останется небольшой, а сессии — сфокусированными. Типичные вопросы:
- Понимание: понимают ли люди за несколько секунд, для чего нужен главный экран?
- Основная задача: могут ли они без подсказок выполнить ту единственную работу, ради которой существует продукт?
- Неудобный момент: что происходит на границе, в которой вы не уверены: пустой список, ошибка, которую нужно отменить, длинное имя, которое переносится?
- Готовность: после использования поменяли бы они свою нынешнюю таблицу, блокнот или приложение на это?
Всё, что не служит этим вопросам, можно выбросить или сымитировать. Страница настроек, которую никто не откроет за двадцатиминутную сессию, — потраченные впустую усилия, как бы легко её ни было сгенерировать.
Как описать его для Anticode
Опишите в нескольких предложениях человека, задачу и экраны и скажите, как должны выглядеть образцы данных. Например: «Прототип приложения для обмена сменами для команды кафе. Экраны: график на эту неделю, запрос на обмен сменой и список открытых запросов. Используй восемь вымышленных сотрудников и реалистичную неделю. Пометь всё как демо-данные». Architect отвечает коротким планом (название, экраны, стиль, функции) и может задать до трёх вопросов там, где ответ меняет сборку, к каждому с вариантами ответа, которые можно нажать.
Когда вы выбираете Build it, модель пишет всё приложение одним HTML-документом, и вы можете смотреть, как появляется код. Новые сборки приложений также можно, когда доступен этот сервис проверки, открыть в браузере без интерфейса на ширине телефона и ноутбука, сделать снимки экрана и прокликать, а найденные ошибки отправляются обратно на исправление.
Пусть имитация будет честной
Приложения Anticode работают в песочнице без доступа к сети, поэтому всё, для чего обычно нужен сервер, имитируется внутри страницы: другие пользователи — вымышленные люди, «отправленные» сообщения попадают в локальный список, а экран входа принимает что угодно. Там, где это важно, приложение помечает такие данные как демо-данные. Не скрывайте эти пометки во время тестирования. Тестировщики, которые думают, что пользуются живой системой, принимают другие, более рискованные решения, чем те, кто знает, что перед ними модель, а на этом этапе вам нужна обратная связь второго рода.
Сохраняется то, что приложение записывает в браузер самого тестировщика. Если человек добавил три элемента, закрыл вкладку и вернулся на следующий день, элементы на этом устройстве останутся. Этого достаточно для дневникового исследования на неделю, если каждый тестировщик пользуется одним телефоном или ноутбуком.
Проведение сессий и изменение сборки
- Опубликуйте прототип на его адресе anticode.dev и отправьте тестировщикам ссылку. Ничего устанавливать не нужно.
- Заинтересованным лицам вместо этого отправьте ссылку для клиентского просмотра: они могут открыть текущий предпросмотр без аккаунта и оставить комментарии, привязанные к разделу. По умолчанию ссылки действуют 14 дней, и их можно отозвать.
- После каждого раунда просите изменения простыми словами («перенеси кнопку обмена на каждую карточку смены»). Последние сохранения хранятся в истории версий (их число зависит от тарифа), так что можно показать первый и третий раунды рядом или вернуться назад.
Что не проверить прототипом в одном браузере
Чётко понимайте границу. Прототип в песочнице работает на одном устройстве за раз, поэтому с ним нельзя проверить:
- Всё, что происходит между людьми: настоящие уведомления, общие списки, двое тестировщиков, видящих изменения друг друга.
- Настоящий вход, права доступа или восстановление аккаунта.
- Живые внешние данные, платежи или функции ИИ внутри приложения (их можно только сымитировать заранее заданными ответами).
- Производительность на реальных объёмах данных или медленных сетях.
Если идея выдержала тестирование, экспорт в Next.js — шаг к настоящему продукту. Он доступен для сборок приложений и даёт стандартный проект на App Router и TypeScript с Postgres через Prisma, входом по электронной почте, ролями клиента и сотрудника и разделом администратора. Это отправная точка, которую будет развивать разработчик, а не готовое многопользовательское приложение, и его можно отправить в выбранный вами репозиторий GitHub. Что в него входит, описано в руководстве по экспорту в Next.js. Если вам нужны рабочие многопользовательские функции без написания кода, no-code-инструмент с собственным бэкендом может подойти лучше, чем оба варианта.
Частые вопросы
Это генератор прототипов приложений с ИИ или инструмент для дизайна?
Он создаёт рабочий код, а не фреймы на холсте. Вы получаете настоящее приложение в браузере, что подходит для юзабилити-тестирования; если команде дизайнеров нужны макеты с точностью до пикселя, используйте вместе с ним инструмент для дизайна.
Могут ли тестировщики пользоваться им на телефонах?
Да. Опубликованное приложение — это веб-страница, которая работает в браузере телефона, и всё, что оно сохраняет, остаётся на этом телефоне.
Могу ли я увидеть, что ввели тестировщики?
То, что они сохранили внутри приложения, — нет: это остаётся на их устройстве. Если добавить форму для отзывов или обратной связи, эти заявки придут вам на почту и в личный кабинет.
Становится ли прототип настоящим приложением?
Он может стать отправной точкой. Экспорт в Next.js превращает его в проект с базой данных и входом, на основе которого разработчик может строить дальше.