Так выглядит экран: прогресс, варианты, карточка зерна и заявка.
Сколько это стоит
Три счёта за один и тот же квиз
Разница не в вопросах, а в том, кому достаётся результат.
Что сравниваем
Нанять разработчика
Купить подписку
Собрать самому
Деньги
Десятки тысяч рублей за работу под ключ и отдельная смета на правки
Ежемесячный платёж за доступ к чужому сервису
Ни рубля: 5 млн токенов на старте
Срок
Недели переписки, согласований и очереди
Быстро, но сначала разбираетесь в чужих настройках
Один вечер: промпт и 8–15 ответов боту
Правки
Новый вопрос — новое письмо и новая смета
Только то, что разрешено тарифом; свои поля — в платном пакете
Фраза в чате: «замени вопрос про молоко»
Кому принадлежит результат
Исходники у подрядчика, у вас — готовый экран
Аккаунт и все ответы исчезают вместе с подпиской
Вам: один HTML-файл на вашем диске и домене
Таблица прокручивается →
Суммы разные, поэтому здесь нет цен и названий. Важно другое: за доступ к своему квизу платить не нужно.
Пять причин собрать самому
Почему квиз стоит делать своими словами
Кофейне не нужна команда разработки. Нужен инструмент, который не забирает файл себе.
1
Экономия
Смета студии и платёж за подписку заменяются стартовым лимитом. Пяти миллионов токенов хватает на сборку, переделку и версию под сезонный сорт.
2
Приложение принадлежит вам
На выходе — HTML-файл, а не аккаунт в чужом сервисе. Его можно положить на домен или хранить в папке.
3
Правки словами
Не нужно объяснять, где находится поле. Пишете боту «добавь вопрос про воронку» — и получаете файл с прежней логикой подсчёта.
4
Не нужно ждать разработчика
Новая ветка появляется через несколько минут после вашей фразы, а не после согласования спринта. Проверить её можно с телефона.
5
Нет лимитов тарифа на функции
Ветвление, подсчёт, карточка результата, сбор контактов и статистика — не платные модули, а части одного файла. Добавить шестой вопрос или второй результат можно в любой момент, и стоимость не изменится.
Что будет в квизе
От «посоветуйте что-нибудь» до заявки
Квиз помогает там, где совет по кофе заканчивается молчанием. Три ситуации и шесть деталей, которые вы получите.
Дайте что-нибудь не кислоеРасплывчатая просьба превращается в среднюю обжарку с шоколадным профилем.
А чем эти двенадцать отличаются?Двенадцать пакетов на полке — двенадцать причин уйти без покупки. Пять вопросов сужают выбор до зерна.
Посоветуйте кофе в перепискеДвадцать сообщений и фото полки заканчиваются тишиной. Ссылка на квиз — результатом и контактом.
Вопросы
Варианты вместо пустого поля
Кислотность, плотность, молоко, способ заварки. Гость нажимает кнопку, а не формулирует.
Логика
Ветвление
Любитель кислинки уходит к эфиопии, поклонник шоколада — к Бразилии. Лишние вопросы скрыты.
Логика
Подсчёт баллов
Каждый ответ добавляет очки по трём шкалам. Результат выбирается по сумме, без случайной рекомендации.
Результат
Карточка зерна
Название, обработка, вкусовые ноты и способ заваривания. Кнопка заявки — рядом.
Заявка
Сбор контакта
Имя, телефон или Telegram. Экран заявки помнит выбранный профиль, поэтому ответ сразу по делу.
Аналитика
Статистика прохождений
Сколько начали, сколько дошли и какие вкусы просят чаще. Видно, где квиз теряет гостя.
Инструкция из 7 шагов
Семь шагов до своего файла
Экраны сняты в приложении. Промпт для пятого шага — в блоке ниже.
1
Приложение установлено
Напишите боту «старт» и перейдите по ссылке. После установки появится плитка приложения.
Шаг 1: приложение на месте.
2
Нажмите «Открыть веб-интерфейс»
На стартовом экране выберите зелёную кнопку Открыть веб-интерфейс. В браузере удобнее вставлять длинный промпт и следить за сборкой.
Шаг 2: кнопка «Открыть веб-интерфейс».
3
Нажмите «Создать проект»
Откроется список проектов. Справа сверху — кнопка Создать проект. Проект хранит файлы и историю переписки.
Шаг 3: создаём новый проект.
4
Впишите название и нажмите «Создать проект»
Название нужно для порядка. Подойдёт «Квиз: кофе». Впишите его и подтвердите кнопкой Создать проект.
Шаг 4: поле названия и подтверждение.
5
Скопируйте промпт с этой страницы и вставьте в поле сообщения
Нажмите «Скопировать промпт» ниже, вернитесь в проект и вставьте через Ctrl+V. Промпт длинный — вставляйте целиком.
Шаг 5: промпт в поле сообщения.
6
Нажмите «Отправить» ↑
Кнопка со стрелкой справа от поля или клавиша Enter. После отправки бот перечитает задачу и задаст уточняющие вопросы.
Шаг 6: кнопка «Отправить» ↑.
7
Ответьте на 8–15 вопросов бота
Бот спросит, кто проходит квиз, какие сорта вы продаёте и что спрашивать. Отвечайте словами — в финале получите готовый HTML-файл.
Шаг 7: отвечаем на вопросы бота.
Промпт
Готовый текст для бота
Промпт уже адаптирован под кофе: вкусы, ветвление, подсчёт баллов, карточка зерна и заявка. Менять ничего не нужно — детали бот уточнит сам.
prompt · квиз подбора кофе
Ты — senior product designer, UX-архитектор и frontend-разработчик. Помоги человеку без технических знаний собрать квиз подбора кофе: гость отвечает на несколько вопросов о вкусе, получает рекомендацию зерна и оставляет контакт.
Сначала задай мне 8–15 простых вопросов обо мне и моей кофейной точке, с вариантами ответов: кто проходит квиз (новичок, любитель, профессионал), где я его размещу (сайт, Telegram, ссылка в переписке), сколько сортов в линейке и какие у них вкусы, что спрашивать в конце (телефон, Telegram, e-mail), куда должны попадать заявки, нужны ли уведомления в чат, какие цифры я хочу видеть в статистике. Не спрашивай про фреймворки, базы данных и архитектуру. После моих ответов коротко перескажи, что понял, и сразу собирай приложение.
Спроектируй сущности: вопрос, вариант, ветка, результат, лид. Статусы прохождения: старт → вопросы → результат → заявка. Экраны: стартовый экран с обещанием результата, экран вопроса с прогрессом, экран результата с карточкой зерна, экран заявки, список прохождений с фильтром по статусу.
Логика: выбор варианта сразу открывает следующий вопрос; ветвление по ответам (кислинка ведёт к эфиопии, плотный шоколад — к бразилии, молоко добавляет вопрос о жирности); скрытый подсчёт баллов по шкалам кислотность, плотность, сладость; результат выбирается по сумме баллов и показывается с названием зерна, обработкой, вкусовыми нотами и способом заваривания. Кнопка «Назад» возвращает на шаг, «Начать заново» очищает прохождение с подтверждением. Если гость не оставил контакт, прохождение сохраняется со статусом «без заявки» — его можно дособрать.
Дизайн: выбери сам цельную систему под кофейную тему — крупная типографика, тёплый фон, один акцентный цвет, скругления 16–20 px, заметные кнопки, состояния hover и focus, адаптив от 360 px. Никаких иконок-шрифтов и внешних картинок: только CSS и текстовые подписи. Не используй декоративные цифры и визуальный шум.
Технически: один HTML-файл, CSS и vanilla JavaScript внутри, localStorage как хранилище, без backend, сборщиков и npm. Внутри файла раздели слои: storage → сущности → логика ветвления и подсчёта → компоненты → экраны → навигация. После любого действия данные сохраняются и экран перерисовывается сразу, без перезагрузки. Добавь 3–4 демо-прохождения с разными результатами и кнопку «Удалить тестовые данные» с подтверждением.
Предусмотри пустые поля, битые данные в localStorage, удаление прохождения, закрытие окон по Escape и по клику на фон. Перед выдачей сам пройди сценарии: старт, ответы по обеим веткам, результат, заявка, возврат назад, перезагрузка страницы, экран с телефона. Исправь найденное сам.
Ответ — полный готовый HTML-файл, без «вставьте этот фрагмент». Все дальнейшие правки тоже присылай полным файлом.
Моя задача: квиз подбора кофе для моей кофейни и продажи зерна.
Кнопка копирует весь текст. Вставьте его в проект через Ctrl+V и нажмите «Отправить» ↑.
Вопросы и ответы
Что спрашивают перед стартом
Справится ли кофейня без человека, который разбирается в вёрстке?
Да. Внешний вид задаётся словами: «крупная типографика, тёплый фон, один акцент». Бот соберёт адаптивный экран, а цвет поправит фразой в чате.
Что делать, когда в линейке появился новый сорт?
Напишите в тот же проект: «Добавь в результат Эфиопию с нотами жасмина и персика». Файл пересоберётся, а логика подсчёта и заявки останутся.
Где хранятся контакты гостей и не потеряются ли они?
Имя, контакт, выбранный профиль и время попадают в список прохождений. Данные лежат в браузере на вашем устройстве, поэтому важные заявки дублируйте в заметки.
Придёт ли мне сообщение, когда кто-то пройдёт квиз?
Уведомления в Telegram добавляются отдельной просьбой в проекте. Если они не нужны, оставьте статистику: она покажет начала, дошедших до результата и контакты.
Насколько длинным может быть квиз, чтобы его не закрывали?
Для подбора кофе хватает пяти–семи вопросов: на телефоне это около полутора минут. Ветвление добавляет уточнения желающим точнее.
Как показать квиз гостям: ссылкой или прямо на сайте?
Готовый файл — обычная страница. Её размещают отдельным адресом на своём домене и ведут туда ссылку из меню, Telegram или переписки.
Первый гость может пройти квиз сегодня
Откройте бота, получите установку и 5 миллионов токенов, отправьте промпт — и к вечеру у вас будет собственное приложение.
