Прототип интерфейса до дизайнера и без него
Предмет
Что здесь работа, а не файл
Прототип нужен, чтобы проверить требование до того, как гипотеза постареет в очереди к дизайнеру. Здесь три экрана и мобильный вид: сводка, допущения, готовый файл. Прототип кликается — вкладки переключаются, кнопка ведёт на следующий экран.
Прототип: сводка, допущения, готовый файл
Третий экран и мобильный вид
- 1
Экран «файл готов»
Что человек получает: ссылка, срок жизни, две кнопки формата и порог малой группы
- 2
Тот же смысл на 390 пикселях
Одна цифра, одна кнопка: на телефоне проверяется не красота, а понятность
Критерий приёмки: по чему работа считается сделанной
| Один экран — один вопрос | Если экран отвечает на два вопроса, он отвечает на оба плохо |
|---|---|
| Текст внутри, а не в описании | Прототип проверяют чтением: подписи должны быть настоящими, не «текст текст» |
| Мобильный вид сразу | Половина проверок проваливается не на десктопе, а на телефоне — и это видно только на телефоне |
Как идёт работа
- 1
Взять требования
Из ТЗ: что должно быть на экране и какой критерий приёмки
- 2
Собрать первый экран
Что человек увидит: одна главная цифра, один вывод, одно действие
- 3
Добавить проверку
Экран допущений: откуда взялась цифра — то, что обычно прячут
- 4
Сделать мобильный вид
Тот же смысл на 390 пикселях: без мелких чисел и лишних кнопок
- 5
Проверить на человеке
Показать трём-пяти пользователям и записать, где они останавливаются
Открыть результат
Агент делает. Вы решаете.
| Агент собирает прототип | Экраны, подписи, состояния, мобильный вид — из требований, за час |
|---|---|
| Агент показывает состояния | Пусто, ошибка, загрузка — там, где обычно забывают и потом переделывают |
| Дизайнер доводит вид | Прототип не заменяет дизайн: он проверяет смысл и порядок, а не красоту |
| Вы решаете, что проверять | Какую гипотезу ломает этот экран — решение продакта, а не инструмента |
Подключения
Что подключим
Статус каждой системы назван честно: обещание — с условием и сроком
Задачи и бэклог
подключим: доступ к порталу задач, срок — два дня; прототип приходит задачей дизайнеру
Файлы
подключим: доступ к папке, срок — день; прототип и кадры лежат у вас
Мессенджер
подключим: бот в рабочем чате, срок — день; прототип показывается в чате, а не письмом
Аналитика
подключим: доступ к счётчику, срок — два дня; после релиза видно, что экран дал
Данные
Откуда берутся цифры
Требования
Экраны собираются из требований, а не из вкуса
Реальные подписи
Тексты кнопок и подсказок — из интервью, словами пользователей
Данные кейса
Цифры на экране — из расчёта, чтобы прототип не выглядел пустым
Записи проверок
Где человек остановился и что спросил — главный результат прототипа
Как проверить
Проверка прототипа за минуту
Покажите первый экран человеку не из команды и спросите, что он получит. Если ответа нет — экран не отвечает на свой вопрос. Затем откройте на телефоне: если числа мелкие или кнопок больше двух, мобильный вид не сделан. И найдите экран с ошибкой — его отсутствие значит, что прототип показывает только хороший путь.
Развилка: три пути и их последствия
| А: показать прототип трём пользователям | День работы — и понятно, где ломается смысл; цена: небольшая задержка |
|---|---|
| Б: отдать сразу дизайнеру | Быстрее по календарю, но если смысл неверный — переделка дороже |
| В: проверить на себе | Бесплатно, но команда уже знает замысел и не увидит проблему |
Границы
Что агент не делает
Прототип не заменяет дизайн и не заменяет разработку: он проверяет смысл и порядок. Он не доказывает, что фича нужна — это вопрос исследования. Он не показывает реальные данные, если их нет в доступе: на экране стоят цифры кейса, и это помечено. И он не становится готовым продуктом: перенос в код — отдельная работа.
Возражения
Что обычно спрашивают до входа
У нас есть дизайнер, зачем прототип
Чтобы дизайнер не тратил неделю на смысл, который ещё не проверен
Прототип на HTML — это же разработка
Это проверка: одна страница, без сервера, без данных, выбросить не жалко
Пользователи не поймут прототип
Понимают, если на экране настоящие слова. Проблема обычно в подписях, а не в прототипе
Частые вопросы
Сколько экранов нужно
Столько, сколько вопросов у человека: обычно 3–5. Больше — уже не прототип, а макет
Когда прототип не нужен
Когда требование очевидно и проверяется цифрой. Тогда прототип — трата дня
Что делать с результатом проверки
Правку требований, а не картинки: если человек не понял, виноват текст
Можно ли показать клиенту
Да, и это полезнее финального дизайна: клиент говорит о смысле, пока он ещё дешёвый
Куда дальше
Соседние компетенции
ТЗ на фичу и user stories
Откуда берутся экраны и критерии приёмки
CustDev: инсайты из интервью
Слова пользователей, из которых пишутся подписи
A/B-тест и метрики продукта
Как проверить, что экран дал эффект, а не только понравился
- Рубли без VPN
- Договор с ИП
- Данные в России
- Чтение по умолчанию
- Токены в подарок
Роли
Принесите требования — заберёте кликающийся прототип
Агент соберёт три экрана и мобильный вид с реальными подписями и состояниями.