{"id":14293,"url":"\/distributions\/14293\/click?bit=1&hash=05c87a3ce0b7c4063dd46190317b7d4a16bc23b8ced3bfac605d44f253650a0f","hash":"05c87a3ce0b7c4063dd46190317b7d4a16bc23b8ced3bfac605d44f253650a0f","title":"\u0421\u043e\u0437\u0434\u0430\u0442\u044c \u043d\u043e\u0432\u044b\u0439 \u0441\u0435\u0440\u0432\u0438\u0441 \u043d\u0435 \u043f\u043e\u0442\u0440\u0430\u0442\u0438\u0432 \u043d\u0438 \u043a\u043e\u043f\u0435\u0439\u043a\u0438","buttonText":"","imageUuid":""}

Как устроены Telegram-боты и почему это отличное решение для запуска продукта

У вас еще нет бота? Тогда мы идем к вам! Весной этого года я запустил Telegram-бот Plum. Было желание разобраться, как устроены боты в Telegram, но оказалось, что я сделал стартап с MVP за 15 тысяч рублей.

Узнайте из чего состоят телеграм-боты и какие они имеют плюсы и минусы.

Бот состоит из двух вещей – бэка и фронта

Бэк – то что не видит юзер, код вашего бота. Тут вы ограничены только своей фантазией и скилами разработчика.

Бэк можно написать на любом языке, например на Python – это популярное решение, позволяющее снизить bus-фактор до безопасных значений.

Телеграм не хранит и не обрабатывает данные вашего бота. Инфраструктура бэка лежит на ваших плечах. Можно использовать Amazon для данных и Heroku для запросов. В нашем случае содержание бэка обходится ~2000 рублей в месяц, но у нас количество запросов перевалило за несколько миллионов, в более простых случаях будет дешевле.

Фронт – это то, что видит пользователь у себя в телеграме, попадая в «чат» с ботом. В решениях для фронта вы ограничены тем набором интерфейсных элементов, которые зашиты в телеграм, а именно:

  • Inline кнопки
  • Reply кнопки
  • Кнопка меню
  • Pop-up сообщения
  • Текстовые сообщения и изображения
  • Текстовые сообщения и изображения отправленные юзером
  • Шаринг сообщений своим контактам
  • Веб-страницы открываемые в pop-up

Все эти блоки, как элементы лего из которых можно сложить множество комбинаций. Мы используем все эти элементы в нашем боте и с каждым из них есть свои грабли на которые мы наступили за вас.

Inline кнопки

Кнопки, которые видны под сообщениями в чате называются Inline. Их можно нагородить в различных конфигурациях, хоть калькулятор из них собрать.

Инлайн кнопки могут менять текущее сообщение, как бы заменяя его или вызвать новое.

Инлайн кнопки лучше скрывать после вызова нового сообщения т.к. ваш юзер может сломать активный сценарий кнопкой из предыдущего сценария.

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

Reply кнопки

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

Данные кнопки не могут менять сообщение в чате, но могут вызывать новое.

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

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

И тут кроется главная задница – как их снова открыть? Есть лайфхаки из серии отправить юзеру новое сообщение вызвав клавиатуру, но главный способ – чтобы юзер нажал на 4 квадратика возле кнопки отправки сообщения. Самый кек, что эти кнопки тоже иногда по неведомым причинам пропадают.

Как вы можете догадаться очень много юзеров на данном этапе забивают и отваливаются, даже если им регулярно объяснять про существование этих кнопок.

Я не рекомендую использовать эти кнопки пока эти баги имеют место.

Кнопка меню

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

Pop-up сообщения

Хорошее решение для предупреждений и инфо сообщений не нарушающее активный сценарий.

Текстовые сообщения и изображения

Бот может слать текст, изображения или все вместе.

Тут важно знать – нельзя отправить несколько изображений с текстом + инлайн кнопками в одном сообщении. Инлайн кнопки дружат только с сообщениями в которых одна картинка.

Текстовые сообщения и изображения отправленные юзером

Юзер может слать любой текст или изображение и бот обработает их, как команду.

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

Шаринг сообщений своим контактам

Вы можете привязать к инлайн кнопке действие шаринга. Мы используем это для фукнции «рассказать друзьям».

Веб-страницы открываемые в pop-up

Это может быть страница оплаты, правил сервиса или нечто большее.

Теперь можно приступать к прототипированию

Разработку бота стоит начать с прототипирования, это позволит избежать интерфейсных ошибок и сэкономить на разботке.

Вы можете использовать любой удобный вам инструмент. Я делал прототипы в Фигме, отрисовав все элементы телеграма. Это позволило лучше понимать занимаемое место на экране и удобство интерфейса.

Еще чуть-чуть и готово

Остается обсудить прототипы и ТЗ с разработчиком, завести нового бота через папу ботов, поделиться API токеном и дождатся, когда код будет написан и ваш бот оживет: )

Так же заведите отдельного тестового бота и проверяйте новые сбороки на нем, прежде чем выкладывать что-то на боевого бота.

Так почему бот, а не веб/нативное приложение?

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

Ограничения возможностей фронта очень дисциплинирует и помогает придумать изящные решения при минимальных средствах выражения. Вы попросту не сможете прикрутить ничего лишнего.

Разработка ботов стоит недорого, первую версию своего бота я собрал за 15 т.р, а это был полноценный тиндер, только для одежды. К слову сейчас мы уже делаем мобильное приложение, и только фронт нам стоил больше 150 т.р.

Скорость разработки. Вам не нужно думать о фронте, только бэк, это в разы ускоряет разработку и позволяет быстро проводить множество экспериментов.

Вы видите никнеймы ваших юзеров – это мгновенный выход на CustDev. Достаточно написать пользователям в телегу и узнать много нового о своем продукте.

Вы легко интегрируетсь в жизнь пользователей. Им не надо ставить отдельное приложение, достаточно нажать в отдельном чате кнопку «Cтарт». После чего вы всегда на виду у юзера – ваш продукт маячит в списке чатов одного из самых популярных приложений на его телефоне.

Главные минусы

Интерфейсные ограничения могут быть и минусом. Телеграм и сложные продукты с трудом совместимы. У вас будут отваливаться юзеры не осилившие логику работы вашего бота.

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

Выход на зарубежный рынок. Телеграм не популярен в англоговорящих странах и в целом нет полноценной открытой статистики использования телеграмма в разных странах.

Нестандартный подход: гибрид бота и веб-приложения

Многие минусы телеграм бота можно решить сделав гибрид.

Бот будет использоваться для авторизации, пуш уведомлений и пересылки юзера на веб-сайт, где вы уже точно мало ограничены в своих фантазиях.

Это позволит вам легко собрать контакты юзеров и быть у них всегда перед глазами.

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

Резюмируя – боты это дешевый инструмент для быстро запуска продукта и проверки его жизнеспособности. А для многих сервисов это может стать и вовсе основной платформой.

И запомните, вы делаете не бота, а сервис на платформе телеграма. Это фраза дает +100 очков в глазах собеседника: )

Если у вас остались вопросы, пишите комменты или мне на Facebook.

0
4 комментария
Кирилл Ларин

Heroku уже использовать не вариант - они закрыли бесплатные тарифные планы, а российской карточкой их не оплатить (только если есть забугорная карта). Лучше попробовать на Российском аналоге развернуть - облаке Amvera.ru. Там развертывание через Push в GIT есть как и в Heroku.

Ответить
Развернуть ветку
lewdmila pavlova

Получается, бот - это больше, чем просто робот-говорилка, которая задает тебе вопросы по порядку и отвечает на твои в меру своей умности?

А в других мессенджерах (том же Whatsapp) тоже так можно?

Ответить
Развернуть ветку
Михаил Ивлев
Автор

Да, на телеграм-боте можно собрать полноценно приложение.
Whatsapp как раз больше про говорилки, он явно более ограничен в интерфейсных решениях.

Ответить
Развернуть ветку
NIKITA ZHEMANOV

🔥 Спасибо за структурность информации. Вы у меня первые в выдаче по запросу "элементы интерфейса телеграм" 👍

Ответить
Развернуть ветку
1 комментарий
Раскрывать всегда