мини-приложение Telegram 7 шагов 5 млн токенов бесплатно

Каталог и заказы внутри Telegram: заявки не тонут в переписке

Человек листает каталог, нажимает «Оставить заявку», а вы видите её в списке со статусом. Сайт, сервер и программист не нужны.

без обещаний лишнего

Что бот делает, а что нет

Приложение закрывает работу с заявками. Всё, что снаружи, остаётся за вами.

✓ Делает

  • Показывает каталог: позиции с ценой, описанием и фото.
  • Принимает заявку: имя, товар, количество, комментарий.
  • Ведёт статусы: новая → в работе → закрыта.
  • Считает за день: сколько пришло и сколько открыто.
  • Напоминает о себе: уведомление приходит в чат.
  • Помнит клиента: прошлые заявки — в его карточке.

— Не делает

  • Не заменяет бухгалтерию: налоги и зарплаты — не сюда.
  • Не приводит клиентов: реклама остаётся вашей задачей.
  • Не требует сервера: хостинг и домен не нужны.
  • Не просит токен BotFather: хватает ссылки из бота.
  • Не продаёт данные: файл лежит у вас, а не в чужом кабинете.
  • Не спорит с вами: цены и тексты правите вы.

одна запись вместо десяти сообщений

Как выглядит заявка

Заявка №14 · Кресло офисное в работе
клиентМарина, @marina_k
товарКресло офисное · 2 шт
сумма12 400 ₽
оплатапредоплата 4 000 ₽
когдадоставка в пятницу, 14:00
созданасегодня, 09:42

Комментарий клиента: «Нужен светлый каркас, офис на третьем этаже». Всё написанное остаётся в заявке — историю переписки листать не нужно.

новая→ в работе→ закрыта

каркас приложения

Что войдёт в приложение

Набор расширяется словами: «добавь поиск по телефону». Ниже — база, с которой начинают почти все.

экран 1

Каталог или форма

Плитки позиций с ценой или короткая форма в четыре поля. Кнопка «Оставить заявку» на каждом экране.

экран 2

Список заявок

Свежие сверху, рядом статус, сумма и время. Фильтр по статусу, поиск, архив закрытых.

экран 3

Карточка заявки

Клиент, позиции, оплата и история переходов. Смена статуса — одно нажатие.

экран 4

Статусы

Новая, в работе, закрыта. Статус виден в списке, открывать заявку не нужно.

экран 5

Счётчики за день

Пришло, закрыто, висит. Цифры считаются сами после каждого действия.

экран 6

Тема Telegram

Светлая и тёмная тема, как в клиенте: приложение не выглядит чужим окном.

инструкция

Семь шагов — и приложение открывается в Telegram

Ниже настоящие экраны: жёлтые подсказки показывают, куда нажимать. Проходите по порядку.

1

Приложение установлено

Напишите боту слово «старт» — он пришлёт ссылку на приложение. Откройте её: это ваш рабочий кабинет.

Шаг 1: бот прислал ссылку, приложение установлено
Ссылка от бота — вход в ваш кабинет
2

Нажмите «Открыть веб-интерфейс»

Нажмите кнопку «Открыть веб-интерфейс» — откроется рабочая область, где вы описываете задачу и забираете результат.

Шаг 2: кнопка «Открыть веб-интерфейс» в приложении
Кнопка «Открыть веб-интерфейс» на стартовом экране
3

Нажмите «Создать проект»

Пустой экран — это нормально. Кнопка «Создать проект» открывает проект для вашего мини-приложения.

Шаг 3: пустой веб-интерфейс и кнопка «Создать проект»
Новый проект создаётся одной кнопкой
4

Впишите название проекта

Подойдёт рабочее имя: «Бот для telegram». Введите его и нажмите «Создать проект» — он появится в списке слева.

Шаг 4: поле названия проекта и кнопка «Создать проект»
Название можно поменять позже
5

Скопируйте промпт с этой страницы

Промпт лежит ниже, под кнопкой «Скопировать промпт». Вставьте его в поле сообщения проекта: Ctrl + V.

Шаг 5: промпт вставлен в поле сообщения, подсказка про Ctrl+V
Длинный текст вставляется целиком — так и нужно
6

Нажмите «Отправить» ↑

Кнопка отправки — круглая стрелка вверх справа от поля; можно нажать Enter. Бот примет промпт и начнёт задавать вопросы.

Шаг 6: кнопка «Отправить» со стрелкой вверх
Стрелка вверх справа — это и есть «Отправить»
7

Ответьте на 8–15 вопросов

Бот спросит, что вы продаёте и какие статусы нужны. Отвечайте обычными словами — в конце он отдаст готовый HTML-файл.

Шаг 7: бот задаёт вопросы о будущем приложении
Вопросы — про вашу работу, не про код

Что делать с готовым файлом

Откройте файл на телефоне: каталог и заявки сразу работают. Дальше правки делаются словами в том же чате — «добавь счётчик за неделю» — и вы получаете обновлённый файл.

три пути

Сколько это стоит

Сравниваем порядок величин и то, что остаётся у вас в руках. Точные суммы зависят от подрядчика и тарифа.

Сравнение способов получить мини-приложение с каталогом и заявками
Что сравниваем Нанять разработчика Купить подписку Собрать самому
Деньги десятки тысяч рублей ежемесячный платёж за доступ 0 ₽ за сборку и 5 000 000 токенов
Срок недели брифов и согласований быстро, но по чужому сценарию один разговор сегодня
Правки новое ТЗ и новая очередь заявка в поддержку и ожидание словами: «добавь доставку»
Кому принадлежит результат студии, пока не выкупите код сервису, пока платите вам: HTML-файл на вашем устройстве
Лимиты по договору и часам по тарифу на функции только ваш запас токенов

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

аргументы

Пять причин собрать самому

Не про экономию на спичках, а про контроль над инструментом.

  1. ЭкономияСчёт от студии и месячная подписка заменяются бесплатной сборкой: 5 млн токенов на первую версию и правки.
  2. Приложение принадлежит вамФайл лежит на вашем телефоне и компьютере: доступ никто не отключит за неоплату.
  3. Правки словами«Сделай статус “ждём оплату”» — и через минуту у вас новый файл, без переписки с подрядчиком.
  4. Не нужно ждать разработчикаСвободные полчаса — уже достаточный повод что-то улучшить, а не повод встать в очередь.
  5. Нет лимитов тарифаСотый товар, второй сотрудник и отчёт за месяц не переводят вас на следующий план.

промпт

Текст, который нужно вставить в проект

Скопируйте целиком — кнопка ниже. Дальше бот задаст вопросы о вашей работе; отвечайте обычными словами.

Ты — senior product designer, UX-архитектор и frontend-разработчик. Помоги человеку без технических знаний собрать мини-приложение для Telegram: каталог, заявки, статусы. Он не должен проектировать базу данных — это твоя работа.

Сначала короткий опрос на понятном языке (8–15 вопросов, с вариантами ответов): что продаёте или какие услуги оказываете; как человек выбирает позицию; какие поля нужны в заявке; как сейчас принимаете заказы (переписка, блокнот, таблица); по каким этапам идёт работа (например: новая → в работе → закрыта); что важно видеть сразу после открытия; нужны ли уведомления и счётчики за день. Не спрашивай про фреймворки, базы данных и архитектуру. После ответов коротко перескажи, что понял, и приступай.

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

Экраны: каталог или форма заявки с ценой и кнопкой «Оставить заявку»; список заявок с фильтром по статусу, поиском по имени и архивом; карточка заявки с позициями, комментарием, оплатой и историей; счётчики за день (пришло, в работе, закрыто). Статусы: новая → в работе → закрыта, сменяются одним нажатием. Уведомление о новой заявке показывай внутри приложения и дублируй сообщением в чат.

Дизайн: самостоятельно выбери цельную систему — аккуратная типографика, понятная иерархия, единые компоненты, hover/focus, адаптив от 360 px. Учти тему Telegram: светлая и тёмная, системный шрифт, безопасные отступы, крупные зоны нажатия. Никакого визуального шума и декоративных цифр.

Технически: один HTML-файл, CSS и vanilla JS внутри, localStorage как хранилище, без backend, сборщиков и npm. Внутри файла раздели слои: storage → сущности → фичи → компоненты → экраны → навигация. После любого изменения данные сохраняются и интерфейс перерисовывается сразу, без перезагрузки.

Добавь небольшой набор реалистичных демо-данных и кнопку «Удалить тестовые данные» (с подтверждением, одноразово). Предусмотри пустые поля, битые данные в localStorage, удаление связанных записей, закрытие модальных окон по Escape и по клику на фон.

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

Ответ — полный готовый HTML-файл, без «вставьте этот фрагмент». Все дальнейшие правки — тоже полным файлом.

Моя задача: мини-приложение «Каталог и заявки» внутри Telegram.

вопросы

Что обычно спрашивают перед стартом

Это полноценный бот, которому нужен сервер?

Нет. Приложение — один HTML-файл, который открывается внутри Telegram и хранит заявки в памяти браузера. Пока страница открыта, каталог и список работают без интернета, а данные в чат отправляет сам Telegram.

Придётся ли регистрировать бота в BotFather и получать токен?

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

Где я увижу новую заявку?

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

Можно ли принимать оплату прямо в боте?

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

Что будет, когда заявок станет сто или пятьсот?

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

Сколько токенов уйдёт на сборку и правки?

На первую версию уходит небольшая часть бесплатных 5 000 000 токенов, остальное остаётся на доработки. Каждая правка — короткое сообщение и новый файл. Точный расход виден после каждой сборки.

следующий шаг

Заявки из переписки — в каталог со статусами

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

Открыть бота и собрать приложение 5 млн токенов бесплатно · без сервера и подписки · результат — ваш файл