В Telegram
- Бот в BotFather: имя, описание, аватар
- Привязка приложения к боту
- Кнопка меню, которая открывает приложение
- Сообщения: подтверждение клиенту, заказ вам
УслугиTelegram Mini App для бизнесаКак сделать Mini App
Как сделать Mini App
Как сделать Mini App
Как сделать Mini App в Telegram: что настроить в самом мессенджере, что собрать за его пределами, как запустить и что решить ещё до кода.
- Всё индивидуально
- Вход через Telegram
- Вам хватит одного примера
Просто напишите, а дальше я сам. Посчитаю задачу без оплаты.
Кофе Зернобот
Вчера
Ваш капучино готов! Заберите на кассе.
Спасибо!
Сегодня
Кофе заранеебез очереди · с 08:00Доброе утро! Закажите кофе заранее и заберёте без очереди.
Зерно на Подолесегодня в 09:12
Что приготовить?
Елена · +380 67 ··· ·· 12из Telegram
ОплаченоЗерно на Подоле · в 09:12
как устроен Mini App
Как создать Mini App в Telegram: из чего он состоит
Mini App (его ещё называют Telegram Web App) это веб-страница, которую Telegram открывает внутри чата. Поэтому создание состоит из двух половин: бот в Telegram и веб-часть за его пределами. Бота регистрируют в BotFather, официальном боте Telegram для создания ботов. Там же к нему привязывают ваше приложение.
Веб-часть состоит из самих экранов: каталог, корзина, запись или кабинет. Её размещают на хостинге, чтобы у неё был постоянный адрес. Потом этот адрес ставят на кнопку меню в чате бота, и клиент открывает приложение одним касанием, ничего не устанавливая.
Дальше идёт то, что делает Mini App удобнее сайта. Вход через Telegram: приложение сразу знает, кто это, без паролей и регистрации. Оплата в том же окне через платёжного провайдера, договор с которым заключаете вы. И бот рядом, который подтверждает заказ и напоминает.
Последний шаг это тесты на настоящих телефонах, iPhone и Android, а также на компьютере: кнопка, экраны, оплата, сообщения вам. Только после этого приложение готово принимать заказы.
Гордей Фисун · обновлено
две половины
Как сделать мини-приложение в Telegram: что где настраивается
Часть настроек живёт в самом Telegram, часть на хостинге. Обе должны быть на ваших аккаунтах.
Вне Telegram
- Веб-часть: экраны каталога, корзины или записи
- Хостинг с постоянным адресом
- Где хранятся заказы: таблица или панель
- Подключение платёжного провайдера
перед запуском
Как запустить Telegram Mini App без сюрпризов
Перед запуском сам прохожу каждый пункт, потому что от них зависит первое впечатление клиента.
Сначала телефон
Большинство клиентов открывает приложение с телефона. Поэтому экраны делаю и проверяю сначала там, а уже потом на компьютере.
Светлая и тёмная тема
У кого-то Telegram тёмный, у кого-то светлый. Приложение берёт тему мессенджера, поэтому рядом с чатом не выглядит чужим.
Без регистрации
Telegram сам передаёт, кто открыл приложение. Отдельная регистрация с паролем здесь только отпугивает людей.
Оплата проверена
Прохожу оплату от кнопки до вашей карты, чтобы первый клиент не наткнулся на ошибку.
Подтверждение в чате
После заказа клиент получает подтверждение в том же чате, а вы сам заказ в Telegram.
без кода
Что решить, прежде чем создавать Mini App
Один реальный пример заказа
Распишите один настоящий заказ от первого касания клиента до момента, когда он у вас. По нему видны все нужные экраны и ничего лишнего.
Аккаунт, где будет жить бот
Бот и приложение должны быть на вашем аккаунте с первого дня. Тогда код, доступы и клиенты остаются у вас, что бы ни случилось.
Платёжный провайдер
Если клиенты будут платить в приложении, договор с платёжным провайдером заключаете вы. Деньги идут напрямую вам, а я подключаю путь оплаты.
Куда приходят заказы
Решите, где вам удобно их видеть: в Telegram, в таблице или в простой панели. И кто на них отвечает.
Живое демо
Оформите заказ в несколько касаний
В демо настоящий рабочий код. Соберите корзину, закажите и посмотрите, что в ту же секунду придёт вам.
от примера до запуска
Как я создаю Mini App: четыре шага
Вам не нужно разбираться в BotFather или хостинге. Нужен только один настоящий пример заказа, остальное на мне.
Ваш пример заказа
Пишете в Telegram, хоть голосовым, что должно делать приложение и для кого. Задаю несколько вопросов.
Список экранов
Расписываю экраны и что будет на каждом. Вы правите строку в списке, а не готовый экран, и так дешевле.
Сборка частями
Собираю приложение и бота сразу на вашем аккаунте. Вы открываете его со своего телефона и видите результат частями.
Кнопка в чате и старт
Подключаю оплату и проверяю её вплоть до вашей карты, потом ставлю приложение на кнопку меню бота. С этого момента оно принимает заказы.
5,0 · 37 отзывов
- Вы решаете, двигаться ли дальшеПосле каждого этапа можете остановить проект. Оплачиваете только выполненные и принятые этапы. Предоплату за неначатые возвращаю.
- Деньги назад, если сделаю не то, что в ТЗЕсли объём не тот, что согласовали, возвращаю оплату этапа. Без споров.
Вопросы
Вопросы о создании Mini App
Как сделать Telegram Mini App, если я не программист?
Разбираться в BotFather, хостинге или коде не нужно: от вас один реальный пример заказа и решение, куда должны приходить заказы. Бота, экраны, оплату и запуск Mini App делаю я, и всё это стоит на вашем аккаунте.
Как сделать мини-приложение в Telegram-боте, который уже есть?
Mini App привязывается к существующему боту и открывается с кнопки в его чате. Сначала я смотрю код бота и прямо говорю, что выгоднее: дописать его или собрать заново.
Как запустить Mini App в Telegram, чтобы клиенты его открыли?
Mini App открывается с кнопки меню в чате вашего бота, так что клиенту достаточно написать боту или перейти по ссылке на него. Устанавливать ничего не нужно: приложение работает внутри Telegram на iPhone, Android и компьютере.
Что подготовить к первому разговору о Mini App?
Достаточно одного настоящего заказа (от первого касания клиента до момента, когда он у вас) и понимания, будут ли клиенты платить прямо в приложении. Технические подробности к первому разговору о Mini App готовить не нужно.
Чем Telegram Web App отличается от Mini App?
Ничем: Telegram Web App это другое название Mini App, мини-приложения, которое открывается прямо в чате. Создаётся оно так же: бот, веб-часть, кнопка меню и тесты.