Кейс - TG магазин вещей с Poizon

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

Поэтому, они остановились на идее бота-калькулятора в ТГ для расчета стоимости на основе ссылки на товар.

Я изучил Poizon и предложил им сделать полноценный магазин с прямой интеграцией к их внутреннему API.

Сегодня узнаем, что из этого получилось и сколько это стоило...

Техническое решение

Само приложение создано на Bubble и состоит из пользовательской части, которая встроена в Telegram Web App, и админки для управления заказами. База данных сделана на Supabase, как и во всех моих последних проектах.

Для общения Web App с сайтом я доработал плагин Жени и добавил ряд дополнительных функций.

Плагин был выложен в стор и набрал уже сотню установок

С помощью плагина я могу:

показывать/скрывать нативную кнопку "Назад"
отлавливать событие нажатия кнопки и производить навигацию по сайту
открывать ссылки с Instant view, не закрывая приложения
получать информацию о пользователе (id, username, name) - id используется для аутентификации
получать параметры запуска приложения - позволяет создавать диплинк на определенный товар

Единственная вещь, которая не получилась, это получение фото пользователя - ссылка на фото просто не отдается Telegram'ом. Решением было создание отдельного сценария для бота с получением фото через кастомный API call getUserProfilePhotos в Make.

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

Тут прямая ссылка на клиента

Тут сквозная ссылка на чат с клиентом в админке

ChatApp

Для общения с пользователями через бота в режиме одного окна я выбрал сервис Chatapp.

Его особенности:

Telegram позволяет вешать только 1 вебхук на бота, поэтому все сообщения проходят через приложение
Приложение позволяет делать небольшие автоматизации - я пересылаю сообщения на свой вебхук в Make, где обрабатываю их (отправляю уведомления, отсылаю автоматические ответы)
Приложение встраивается через embed прямо в админку с открытием нужного чата в карточке клиента - таким образом много менеджеров могут общаться с клиентами через одного бота

Можно общаться с клиентами и просматривать данные об их заказе в одном окне

Poizon

Самой сложной частью оказалась интеграция с Poizon. Poizon имеет два отдельных продукта - сайт для США и мобильное приложение в Китае.

Ни один из продуктов не имеет публичного API, но использует внутренний.

Изначально, я нашел человека с готовым API для США и думал строить решение на его основе. Но в процессе человек слился и я решил попробовать расковырять API сам.

К сожалению, детали решения являются своего рода конкурентным преимуществом, поэтому ограничусь только тем, что мне это удалось 😉

Функционал каталога скопирован с сайта и позволяет искать по ключевым словам и создавать сложные фильтры

Продукт менеджмент

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

Для успешного развития продукта я добавил запись пользовательских сессий через Hotjar и логи для основных событий. Эти данные позволяют анализировать продвижения пользователей по воронке и улучшать их пользовательский опыт.

Каждый тип логов имеет свои данные, поэтому для их хранения используется поле с типом JSON

Эпилог

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

Стоимость проекта составила $4к, что на самом деле является очень маленькой ценой за такое решение, но зато я получил отличный опыт и приобрел полезные знакомства.

Ставьте лайк и подписывайтесь, чтобы прокачиваться в no-code вместе со мной