Что такое Telegram Web App?
Это компактные веб-приложения, которые открываются внутри Telegram. Они основаны на функции ботов — автоматизированных чатов, которые помогают пользователям с самыми разными задачами. От оплаты подписок на онлайн-сервисы до заказа продуктов на дом.
Telegram Web App — это чат-бот, внутри которого живет полноценная веб-платформа. Допустим, у вашего бизнеса есть адаптивный сайт с мобильной версией. С помощью технологии TWA, можно разместить его внутри телеграм-бота и расширить охват аудитории.
Сегодня почти каждый второй житель России пользуется Telegram. По данным Mediascope, в среднем каждый день в мессенджер заходит 47% жителей страны. Так что у TWA большой потенциал по привлечению аудитории. А еще такие приложения можно быстро выпустить на рынок, сэкономив на полноценной разработке.
Кому пригодится Telegram Web App?
Спойлер: практически любому бизнесу. Но особенно полезны TWA будут для компаний в этих отраслях.
E-commerce
Если собираетесь запустить онлайн-маркетплейс, Telegram Web App станет отличным дополнением. Пользователи смогут заходить в ваш интернет-магазин через чат-бот в мессенджере — им даже не придется регистрироваться. Простой онбординг поможет клиентам быстро оформить заказ, а вам — повысить выручку.
Финтех
Telegram — полезный инструмент для продвижения финансовых продуктов. Некоторые финтех-компании даже используют Telegram как основную платформу. Например, крипто-токен Notcoin запустился в формате игры Telegram Web App, в которой пользователи зарабатывают виртуальные монеты за каждое касание экрана. Эти токены можно вывести на сторонний кошелек или конвертировать в обычную валюту.
Рестораны
Благодаря технологии TWA, в Telegram теперь можно заказать доставку еды, не выходя из приложения. Рестораны используют этот формат, чтобы привлечь новых клиентов и повысить конверсии.
Telegram Web Apps позволяют отправлять пользователям push-уведомления внутри мессенджера, чтобы мотивировать их сделать новый заказ, рассказать об акциях и скидках, а также для информирования во время выполнения заказа.
Сервисы для онлайн-бронирования
Например, TWA дают пользователям возможность записаться на прием к стоматологу и провести оплату, не выходя из мессенджера. Так что, если ваш бизнес предлагает клиентам услуги по расписанию, мини-приложение поможет упростить процесс бронирования и оплаты.
Разработка Telegram Web App за 5 шагов
Итак, вы решили создать веб-приложение в Telegram. Давайте разберем ключевые шаги разработки и запуска TWA проекта.
1. Анализ рынка и постановка целей
Перед тем, как создавать TWA, стоит определиться с проектными целями. Для этого нужно сперва изучить рынок. Посмотрите на конкурентов, которые уже запускали мини-приложения в Telegram. Изучите, как устроены их боты: какие функции можно скопировать, а какие стоит улучшить или реализовать иначе.
Еще нужно определить целевую аудиторию и их потребности. От этого будет зависеть набор функций вашего TWA-продукта. Например, если вы хотите запустить криптокошелек в Telegram, подумайте, на кого он будет рассчитан — на новичков или на опытных инвесторов?
2. Создание UI/UX дизайна
Во втором шаге создаем UI/UX дизайн для веб-приложения. Он должен быть адаптивным — подстраиваться под всевозможные размеры и разрешения экранов. Поскольку большинство людей заходят в Telegram со смартфонов, важно уделить дизайну мобильной версии побольше внимания. Но и про десктопные устройства забывать не стоит.
3. Создание и настройка бота
Теперь создаём бота в Telegram через BotFather — «крестного отца» всех ботов. Пользователи будут открывать мини-приложение именно через наш чат-бот. Запускаем BotFather, отправляем команду “/newbot” и вводим название для нового бота.
4. Разработка веб-приложения
Пришло время писать код для приложения: с этим поможет опытная команда веб-разработчиков. Но, перед тем как начинать писать код, важно правильно подобрать технологии для разработки — фреймворки, базы данных и облачные платформы.
Основой стеков для создания веб-приложений, почти всегда становится JavaScript. Это универсальный инструмент, с помощью которого можно разрабатывать сайты любой сложности, всё что требуется — это подобрать правильный фреймворк под ваши потребности. После этого, дело останется за малым 😀
5. Запуск Telegram Web App
После того как мы разместили веб-приложение на сервере, нужно связать его с телеграм-ботом, созданный в третьем шаге. Для этого заходим в чат с BotFather и в настройках указываем полную ссылку на сайт.
TWA-приложение готово! Пора его рекламировать. Самый дешевый способ — размещать платные объявления в телеграм-группах, в которых состоят ваши потенциальные клиенты. А чтобы еще больше повысить видимость приложения, опубликуйте его в стороннем магазине TWA — например, в Telegram Apps Center.
Сколько стоит разработка Telegram Web Apps?
Здесь все зависит от типа приложения и количества фич. Давайте посмотрим на примерные цены самых популярных видов Telegram Web Apps:
Маркетплейсы
Если хотите запустить интернет-магазин в Telegram, итоговая цена будет зависеть от сложности. Например, маркетплейс с минимальной системой заказов и интеграцией одной платежной системы, будет стоить относительно дешево. А если интегрировать его с десятками сторонних сервисов и внедрить многоуровневое шифрование — цена сильно возрастет.
💰 Примерная стоимость разработки: 12 000 000 рублей
Игры
С играми похожая ситуация — чем больше фич, тем выше стоимость. Среднее игровое приложение будет стоить дороже, чем базовый интернет-магазин, но приложению с геймификацией будет проще удержать пользователя. Особенно если внедрить поддержку криптовалют, как это сделали Hamster Kombat и SEED App — одни из самых популярных TWA.
💰 Примерная стоимость разработки: 15 000 000 рублей
Мы в Purrweb поработали над игровой платформой на основе блокчейна. Клиент из Сингапура хотел запустить продукт в нише Web3, который сочетает игры с функциями криптокошелька. Наша задача — потрудиться над полноценным веб-приложением и придумать для него запоминающийся визуальный стиль.
Мы разработали дизайн для главной игры в приложении — пазла «2048». А еще — задизайнили криптокошелек, логотип и интерфейс платформы.
Криптокошельки
Криптокошельки — один из самых прибыльных видов TWA. Стоимость разработки такого мини-приложения будет зависеть от количества поддерживаемых валют и платежных интеграций.
💰 Примерная стоимость разработки: 17 000 000 рублей
Мы разработали Broex — мобильный криптокошелек с минималистичным интерфейсом. Он поддерживает разные типы валют и позволяет быстро обмениваться виртуальными монетами. Мы создали интуитивно понятную систему навигации, внедрили селектор валют и фильтры. Итог: Broex запустился в формате полноценного кроссплатформенного приложения.
Плюсы и минусы Telegram Web App
Теперь давайте разберем главные достоинства и недостатки Telegram Web App:
👍 Плюсы | 👎 Минусы |
Низкая стоимость разработки. Запустить TWA гораздо дешевле и быстрее по сравнению с полноценным веб-приложением. Все потому, что Telegram Web Apps проще разрабатывать — особенно если у вас уже есть готовый сайт. | Ограниченный охват аудитории. Пока что не вся аудитория Telegram пользуется TWA. Эти приложения появились недавно, поэтому у них ограниченный охват. Но их с каждым месяцем становится все больше, так что рост аудитории не заставит себя ждать. |
Увеличенный клиентский трафик и конверсии. Ваш бот останется в списке чатов пользователя после первого запуска. Благодаря этому TWA позволяют повысить конверсии и эффективно удерживать клиентов. | Зависимость от платформы Telegram. TWA полностью зависят от инфраструктуры Telegram. Поэтому если мессенджер станет недоступен, это повлияет и на ваш чат-бот. |
Упрощенный онбординг. Пользователям не нужно регистрироваться или скачивать сторонние приложения — все работает внутри Telegram. | Ограниченная функциональность по сравнению с PWA. TWA не такие продвинутые, как PWA (Progressive Web Apps). Если перегрузить его кучей функций, то и работать оно будет медленнее. |
Бесплатные push-уведомления. Компании могут бесплатно отправлять клиентам пуши прямо в мессенджере. Рассылки уведомлений помогут напомнить пользователям о продукте и повысить конверсии. | Невысокий потолок производительности. Web Apps в Telegram открываются во внутреннем браузере мессенджера. Поэтому их производительность ограничена, и оптимизировать их зачастую сложнее, чем обычные веб-приложения. |
Успешные примеры Telegram Web App
Давайте посмотрим на лучшие примеры телеграм-ботов, которым удалось быстро набрать большую аудиторию:
Hamster Kombat
Hamster Kombat — пожалуй, самое известное TWA-приложение. Вот как оно работает: пользователь заходит в чат-бот, нажимает на хомяка и получает виртуальные монеты за каждое нажатие. Внутриигровые награды разработчики обещают конвертировать в криптовалюту с реальной рыночной ценностью.
Приложение стало массовым благодаря своей простоте: все, что требуют от игрока — это нажимать на экран. Этот подход оправдал себя: аудитория игры уже превысила отметку в 150 миллионов человек.
Notcoin
Notcoin, как и Hamster Kombat, относится к жанру крипто-кликеров. Пользователи нажимают на экран и получают цифровую валюту. Приложение основано на блокчейн-сети TON, которую запустил сам Telegram. Токены Notcoin уже можно продавать и покупать на биржах — 1200 монет оцениваются примерно в $10.
Подводя итоги
Технология Telegram Web Apps позволила платформе обзавестись функциями, которые пригодятся любому бизнесу — от маркетплейсов до ресторанов.
Telegram Web App можно использовать и как полноценную платформу, и как дополнительный источник клиентского трафика. А еще такое приложение позволит проверить спрос на продукт без лишних затрат на разработку. Если хотите создать Telegram Web App, поделитесь с нами деталями проекта через форму внизу страницы. Мы ответим в течение 48 часов и поможем подобрать бюджет для проекта.