![](https://adpass.ru/wp-content/uploads/2024/06/2151408dd2bdd4b7f114436aa07e058c_17193099702573.png)
Trainet World: как мы разрабатывали спортивную экосистему и почему она выведет тренировки на новый уровень
К нам в Пиробайт обратились заказчики — группа спортсменов, проживающих на территории ОАЭ. У них появилась идея создать приложение для проведения тренировок в режиме онлайн, которое устраивало бы и спортсменов, и тренеров, предлагающих свои услуги онлайн. Основная концепция будущего сервиса на данный момент является революционной: онлайн тренировки в видео формате, где и тренер, и атлет видят друг друга и общаются в режиме реального времени во время выполнения упражнений. У них уже было готово свое видение проекта, наработки дизайна и огромное количество идей, которые очень хотелось использовать.
Trainet world from Info Pyrobyte on Vimeo.
Аналитика
Проект поступил в студию с уже готовыми наработками. Перед поиском команды программистов заказчики самостоятельно провели аналитику, написали первый вариант ТЗ и сделали структуру в формате блок-схемы. У них уже было примерное видение готового приложения и его аудитории.
![](https://adpass.ru/wp-content/uploads/2023/11/image-dc95f962-06d7-4c3f-adf1-e347750a8103-1176x691.jpg)
Часть документации мы адаптировали под удобные для себя форматы. В частности изменения коснулись структуры. Блок-схема в виде скриншотов будущего приложения выглядит красиво, но может быть неудобной для программистов из-за запутанности и неочевидности некоторых взаимосвязей.
На основе той структуры, что нам прислали, мы сделали свою — более простую для восприятия. Дизайнеру и разработчику опираться на неё удобнее, ведь на изображениях не всегда видно, куда ведут те или иные разделы.
ВячеславАналитик Pyrobyte
![](https://adpass.ru/wp-content/uploads/2023/11/image-b32fde7a-5a30-407b-955e-93f7950cf93b-1176x456.jpg)
Опрос целевой аудитории
Для лучшего понимания проекта мы провели опрос среди атлетов и тренеров. Это помогло понять будущих пользователей сервиса и доработать его.
Среди пожеланий со стороны тренеров чаще всего упоминалось:
-
Удобное взаимодействие с атлетом и отслеживание его параметров для создания индивидуального курса тренировок;
-
Реклама услуг в рамках одной площадки;
-
Прозрачная система вознаграждений и легкий вывод денежных средств на счет или карту банка;
-
Создание шаблонов тренировок и их использование в работе;
-
Возможность регулировать количество свободных дней в календаре.
Спортсменам в первую очередь оказались интересны:
-
Простота записи на тренировки;
-
Календарь с возможностью передвинуть или отменить занятие;
-
Заниматься по индивидуальной программе;
-
Выбирать тренера на основе оценок и отзывов;
-
Выбирать спортивное направление;
-
Делиться опытом и результатами занятий;
-
Получать обратную связь от тренера после занятий;
-
Возможность отменить занятие и вернуть деньги.
Анализ на соответствие правилам маркетплейсов
После сбора информации от целевой аудитории мы провели анализ на соответствие приложения правилам App Store и Google Play, чтобы в дальнейшем успешно пройти модерацию. Подробнее о важности этого исследования и требованиях сторов мы уже рассказывали ранее.
![](https://adpass.ru/wp-content/uploads/2023/11/image-bdca7b90-2934-4b83-b7bb-689626c014f0-1176x623.jpg)
На основе анализа мы выяснили, что проект может не пройти модерацию. Это было связано с его спортивной направленностью и элементами социальной сети. Для успешной публикации приложения в сторах мы внесли некоторые изменения:
-
Поскольку в Трайнет есть своя социальная сеть с пользовательским контентом, сделали кнопку «пожаловаться». Жалобы также можно оставить на клуб, событие или команду;
-
Добавили текст, предупреждающий о травмоопасности упражнений;
-
Изменили текст в сообщении о доступе к галерее пользователя;
-
Убрали рейтинг пользователя.
Оценивать риски и выявлять проблемные места лучше до начала разработки. Ведь если модераторы не пропустят приложение, придется вносить в него изменения, а это лишние затраты по деньгам и времени.
АлександрCEO Pyrobyte
Задача
Основная задача сервиса — создать комфортную экосистему для онлайн тренировок, которая выведет взаимодействия между тренером и атлетом на новый уровень, а также объединит любителей спорта по всему земному шару.
Под словом «экосистема» мы имеем в виду многофункциональное приложение. В Трайнет входят не только тренировки по видеосвязи, но и элементы социальной сети с возможностью обмениваться опытом в блогах и личных сообщениях. А также создавать клубы, команды и вступать в них.
Решение
1. Дизайн
Как уже говорилось ранее, проект поступил к нам уже с готовыми наработками. Заказчики выработали фирменный стиль и на его основе сделали первую версию дизайна.
![](https://adpass.ru/wp-content/uploads/2023/11/image-8efb8f99-eadb-4f0e-9eec-ced0c68f442e-1176x1042.jpg)
В его основу легли контрастные цвета и большое количество акцентов. Такая стилистика характерна для западного разработчика, но пользователям из России может быть непривычна. Поэтому мы приняли решение его откорректировать.
Когда мы получили дизайн, мы провели ревью и выписали в Excel таблицу все предложения. Из ста строк семьдесят были приняты почти сразу. Двадцать мы обсуждали некоторое время с заказчиком и убедили в необходимости изменений. Десять оставили как есть.
АртемДизайнер Pyrobyte
Во время работы над дизайном мы:
-
Сохранили фирменный стиль, но сгладили визуальные и смысловые акценты;
-
Исправили логические ошибки в расположении интерактивных элементов;
-
Исправили элементы, которые неправильно отображались и настроили их работу;
-
Улучшили юзабилити приложения, сделали его интуитивно понятным;
-
Сделали элементы дизайна универсальными для всех платформ.
![](https://adpass.ru/wp-content/uploads/2023/11/image-9d2a49be-6b7d-4f6e-9723-064bfa5f3d93-1176x630.jpg)
2. Взаимодействие тренера и спортсмена
Нам не сразу удалось настроить удобную схему взаимодействия тренера и атлета на этапе бронирования занятия. Рассматриваемый изначально вариант оказался слишком громоздким и не мог гарантировать на 100%, что тренировка состоится.
В самом начале работы мы рассматривали следующую схему взаимодействия: атлет покупает тренировку, выбирает любое время в календаре. Потом тренер либо подтверждает бронь, либо отклоняет. Выяснилось, что при такой системе бронирования стороны могут просто не договориться между собой, а это недопустимо.
ВячеславАналитик Pyrobyte
Сейчас процесс выглядит следующим образом:
-
Атлет выбирает тренера, указывает свои параметры;
-
Выбирает в календаре тренера дату и время, доступные для бронирования;
-
Оплачивает занятие, сумма резервируется системой до проведения занятия;
-
Тренеру приходит информация о спортсмене и оповещение об изменениях в графике в виде push-уведомления.
-
В назначенное время и день тренер и атлет проводят занятие и только после этого деньги зачисляются на счет тренера.
![](https://adpass.ru/wp-content/uploads/2023/11/image-b913d742-94b4-437c-b56a-ecd7ee9fa7cf.jpg)
3. Возможности тренера
В экосистеме Трайнет для тренеров предусмотрен личный кабинет. Он имеет ряд полезных опций, которые могут использоваться в процессе работы. Рассмотрим их поближе.
![](https://adpass.ru/wp-content/uploads/2023/11/image-808bf395-e76d-453a-b3ee-23aba50f89f7-1176x1176.jpg)
Отслеживание финансов: баланс, сумма, доступная к выводу на банковский счет, последние зачисления
![](https://adpass.ru/wp-content/uploads/2023/11/image-57fbf0e9-0280-4349-b799-6678048da8e3-1176x751.jpg)
Отслеживание показателей спортсменов и создание персональных тренировочных программ на их основе
Инструменты для дополнительной рекламы и продвижения своих услуг, ведение личного блога. Постами из него можно делиться как внутри приложения, так и в других соц. сетях при помощи ссылки.
4. Возможности для спортсменов
Если для тренера в первую очередь нужно следить за программой тренировок, доходами и параметрами спортсменов, то для атлетов важной составляющей является социальная активность. Возможность поделиться своими успехами и найти клуб по интересам мотивирует к развитию не меньше, чем изменения показателей на графике.
![](https://adpass.ru/wp-content/uploads/2023/11/image-3088ed6c-2aa6-453f-991f-4c8dfbe46106-1176x751.jpg)
В рамках развития внутренней социальной сети мы ввели в приложение:
-
Групповые и персональные чаты для обмена сообщений с возможностью поделиться результатами занятий и сделать ссылку на событие/пост внутри приложения;
-
Клубы и команды, объединяющие спортсменов для совместных тренировок и участия в соревнованиях;
-
Спортивные события;
-
Ленту для просмотра новых записей участников, на которых пользователь подписан;
-
Возможность вести собственный блог;
-
Просматривать, оценивать и комментировать посты и профили других пользователей;
Также из полезных функций можно выделить:
-
Возможность делиться своими спортивными достижениями: грамотами, медалями, участием в соревнованиях;
-
Редактирование расписания;
-
Отслеживание прогресса своих показателей;
-
Поиск тренировок по параметрам: стоимости, виду спорта, типу тренировки;
-
Удобная система бронирования через календарь.
5. Полезные фичи
В процессе работы над приложением мы выполнили ряд задач для улучшения пользовательского опыта. Главными функциями приложения являются:
Календарь. Календарь в нашем случае — одна из основополагающих опций. Календарь нужен атлету для бронирования и отслеживания занятий, а тренеру — для отслеживания и настройки своего расписания. Мы также сделали возможность отмечать в нем спортивные мероприятия и настраивать регулярные занятия.
Видеосвязь. В отличие от многих других сервисов Трайнет предполагает использование видеосвязи с тренером как альтернативу тренировкам по заранее записанным роликам. Такой подход помогает:
-
Наладить контакт между тренером и атлетом в процессе занятий;
-
Отслеживать правильность выполнения упражнений и давать обратную связь во время их выполнения;
-
Контролировать состояние атлета в процессе тренировки.
![](https://adpass.ru/wp-content/uploads/2023/11/image-72918750-fd33-4b42-b9e8-8867b9277ec0-1176x588.jpg)
Для внедрения видеосвязи в приложение мы использовали библиотеку agora_rtc_engine и видео сервис Agora IO.
У Agora есть официальная библиотека для работы с Flutter. Выбор этого сервиса помог избежать проблем с интеграцией. Работает связь по следующей схеме: при начале тренировки со стороны одного из участников Agora создает комнату и отправляет ее ID на сервер. Когда к занятию присоединяется второй участник, сервер проверяет ID комнаты для этой тренировки и подключает его к звонку.
ДмитрийFrontend-разработчик Pyrobyte
В пакете библиотеки есть только видеосвязь. Чтобы функция корректно работала и гармонично вписалась в приложение, мы сделали:
-
Дизайн в фирменном стиле Trainet;
-
Экраны, на которых атлет разговаривает с тренером;
-
Элемент загрузки, если один человек ещё не подключился;
-
Кнопки для отключения/включения звука, микрофона, кнопку смены камеры с фронтальной на основную.
6. Технологический стек
Для создания приложения мы использовали PHP, Laravel, MySQL 8, Docker, Node JS на бэкенде и Flutter, Dart, MobX, Firebase на фронтенде.
Это наиболее популярный набор технологий для бэкенда на PHP. Мы умеем его готовить, а на случай сложных ситуаций по всем инструментам есть документация и множество ресурсов с рецептами от других разработчиков.
КириллBackend-техлид Pyrobyte
Laravel содержит все необходимое для решения подавляющего большинства задач PHP бэкенда, а также позволяет в процессе работы подключить дополнительные библиотеки. Кроме того фреймворк значительно облегчает интеграцию приложения со сторонними сервисами.
Flutter позволяет видеть результаты изменения кода в реальном времени. Он обладает целым набором виджетов, которые облегчают разработку, тестирование и позволяют создать красивое приложение с оригинальным пользовательским интерфейсом.
Заключение
Trainet стал для нас интересной задачей. Благодаря тесному сотрудничеству с заказчиком, мы смогли разработать экосистему, которая позволит заниматься с тренером из дома.
![](https://adpass.ru/wp-content/uploads/2023/11/image-aafb0a8d-2989-4874-b8ba-9912d3519826-1176x418.jpg)
Приложение опубликовано в Google Play и App Store. Уже сейчас его можно скачать, зарегистрироваться и записаться на первую тренировку.
Мы сделали классный сервис, объединяющий любителей спорта со всего света и позволяющий заниматься даже вне спортивного зала. А чтобы их опыт становился лучше, мы не прекращаем техническую поддержку проекта и уже держим в голове идеи для дальнейшего его развития.
Лучшее в блогах
Вам понравится
![](https://adpass.ru/wp-content/uploads/2024/06/2151408dd2bdd4b7f114436aa07e058c_17193099702573.png)
![](https://adpass.ru/wp-content/uploads/2024/04/2b72b50e1a85e4c27500d3b57d26c75c_17128273154388.png)
В рамках объединения с крупнейшим российским оператором наружной рекламы — Группой Russ — Wildberries объявляет о запуске нового совместного рекламного сервиса — кликаут. Он позволит запускать кампании рекламодателям, не представленным на Wildberries. При таком формате рекламы пользователи направляются напрямую на внешние сайты — это даст возможность брендам нарастить рекламные охваты и конечные продажи.
![](https://adpass.ru/wp-content/uploads/2024/07/oblozhka3-22.jpg)
![](https://adpass.ru/wp-content/uploads/2023/03/ea2e7152e45e9b015b49cad4bc6b1c4d_16800073909569.png)
![](https://adpass.ru/wp-content/uploads/2024/03/bbb268f5a55f65fe9ea67fd9053de2d6_17117044309483.png)