Веб-приложение ·

Закрытое приложение для аудио-практик психолога

Психолог раздавала практики через мессенджеры — клиентки теряли файлы и прогресс. Собрали закрытое приложение с плеером, счётчиком прослушиваний и входом через соцаккаунты.

С чем пришли

Привет! Расскажем про одно из наших недавних коммерческих приложений — закрытый портал для аудио-практик психолога. Это полностью рабочий коммерческий продукт, уже живущий у клиента. Имя эксперта и название продукта остаются за кадром по договорённости.

Наш клиент — психолог с онлайн-практикой: авторские гипнопрактики, медитации, психодиагностики. Контент есть, клиентки есть, запрос понятный: нужно закрытое пространство, куда клиентки приходят слушать практики в удобное время.

Главная боль была не техническая, а пользовательская. Аудио по мессенджерам и облачным папкам — это свалка голосовых. Клиентка не понимает, что уже слушала, что нет. Эксперт не понимает, работают ли люди с материалом вообще. А каждая новая практика — это снова цепочка пересылок: одной, второй, третьей, и кто-то обязательно напишет «скинь ещё раз, не могу найти».

Это не курс. Это хаос.

Что было сложно:

  • Контент закрыт — только для своих клиенток, без публичного доступа
  • Дизайн индивидуальный и минималистичный: ничего, что отвлекает от самой практики
  • Нужно слушать на телефоне с убранным в карман или перевёрнутым экраном: выключился экран — аудио играет
  • Клиентка должна видеть свой прогресс, чтобы ощущать движение
  • Новая практика появляется у всех клиенток сразу — без повторных пересылок

Когда клиентка не видит своего прогресса — она не чувствует, что работает. Приходит ощущение «я ничего не делаю», даже если практики идут каждый день.

Страница входа с кнопками Google и Яндекс
Весь вход — два знакомых аккаунта на выбор: ни форм, ни придумывания пароля, ни письма с подтверждением.

Что сделали

Мы собрали закрытое веб-приложение с каталогом практик, встроенным плеером и автоматическим учётом прослушиваний. Открывается прямо в браузере телефона — без установки, без магазинов. Внутри — авторизация через Google и Яндекс, история прослушиваний для каждой клиентки и плеер, который не прерывается при выключенном экране.

Обычный вопрос здесь: а зачем собственное приложение, если есть готовые платформы для курсов? Ни одна коробочная платформа не умеет правильно работать с плеером на мобильном — именно там, где клиентки и слушают. Плюс подписка, чужой бренд и дизайн под шаблон. Мы взяли мощность стандартных инструментов там, где они реально хороши — OAuth-вход через Google и Яндекс, облачное хранилище для аудио, — и написали кастомную логику там, где это критично: поведение плеера на телефоне, честный счётчик прослушиваний, закрытость каталога.

Приложение живёт на собственном сервере клиента в Docker-контейнере — это его площадка, без ежемесячной дани и риска, что завтра платформа поменяет правила или поднимет тариф. Весь каталог, история прослушиваний клиенток и ключи к сервисам остаются у клиента — наружу не уходит ничего. Цифровой актив, который принадлежит эксперту.

Вход без барьеров

Аудитория нашего клиента — женщины, которые пришли за практикой, а не за очередным паролем. Регистрация с придумыванием логина — это барьер. Письмо с подтверждением — ещё один. На каждом таком шаге часть людей просто уходит.

Решение простое — две кнопки: войти через Google или Яндекс. Оба аккаунта уже есть у подавляющего большинства. Вход построен на стандартном проверенном механизме — OAuth: клиентка нажимает знакомую кнопку, подтверждает доступ в привычном окне Google или Яндекс, и оказывается в каталоге. Никаких форм, никаких паролей, никакого «забыли пароль — восстановите по email». Зашла один раз — сессия живёт семь дней: при следующем визите приложение откроется без повторного запроса.

При этом приложение остаётся закрытым: попасть внутрь может только тот, кого эксперт направил по ссылке. Случайный человек из поиска внутрь не попадёт — просто потому что ссылки нигде публично нет.

Каталог категорий аудио-практик на главной странице
Каталог после входа: тематические категории практик, визуальный минимализм — ничего лишнего между клиенткой и нужным ей аудио.

Плеер, который работает на телефоне

Это самая нетривиальная часть. Гипнопрактики и медитации слушают лёжа, перед сном, на прогулке. Телефон убирают в карман или кладут экраном вниз. Стандартное поведение браузера в этот момент — поставить аудио на паузу.

Представьте: клиентка ложится, запускает практику, убирает телефон под подушку — и звук обрывается в середине медитации. Звучит как мелочь — пока сам не словишь такой обрыв на четвёртой минуте, когда уже начал расслабляться. Это не просто неудобно — это ломает сам смысл практики, где непрерывность критична.

Мы решили это явно: как только клиентка нажимает Play, экран перестаёт гаснуть автоматически — телефон можно положить рядом и слушать. Если экран всё же выключить вручную — воспроизведение продолжается в фоне, а в шторке уведомлений видно название практики и кнопки управления. Как Spotify или любой подкаст-плеер: убрал телефон в карман — голос звучит. Это штатные механизмы браузера — именно поэтому работает надёжно, без костылей, на любом телефоне.

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

Плеер в шторке уведомлений при заблокированном экране
При заблокированном экране в шторке видно название практики и кнопки управления — как у любого музыкального приложения.

Засчитывание прослушивания

Наш клиент поставил условие с самого начала: клиентка должна видеть, что работает. Не просто «что-то слушает» — конкретное число, сколько раз обратилась к каждой практике.

Механика простая и честная. Клиентка нажимает Play — в шапке плеера появляется обратный отсчёт. Ровно через 5 минут непрерывного воспроизведения счётчик увеличивается, и на экране появляется уведомление «Прослушивание засчитано». Почему именно 5 минут, а не сразу по нажатию Play? Клик — это ещё не работа. Пять минут непрерывного воспроизведения — это значит, что клиентка реально слушает практику, а не открыла и закрыла. Повторные нажатия Play в той же сессии счётчик не накручивают: таймер запускается один раз за сессию и не сбрасывается при паузах.

История прослушиваний хранится в SQLite — компактной встроенной базе данных прямо на сервере клиента. Для закрытого приложения одного эксперта это правильный выбор: не нужен отдельный сервер базы данных, всё приложение остаётся одним лёгким блоком, а резервная копия — это просто копия одного файла. Меньше движущихся частей — меньше что ломается.

Счётчики видны в двух местах: на странице каждой практики и в списке категории рядом с каждым названием. Практики, к которым клиентка ещё не обращалась, отмечены меткой «Ждет вас».

Счётчик прослушиваний и уведомление о засчитанной практике
Счётчик прослушиваний и уведомление 'Прослушивание засчитано': клиентка видит свою историю и знает, что работа идёт.

Контент в руках эксперта

Первое наполнение каталога мы взяли на себя — эксперт присылала аудио и описания, мы сразу расставляли всё в нужном виде. Так быстрее и точнее на старте: эксперт занимается смыслом практик, а не воюет с интерфейсом.

Описания поддерживают форматирование: выделение, списки, разбивку на части. Аудио-файлы хранятся в облачном хранилище — отдельно от самого приложения. Добавить или поменять файл можно не трогая код.

Как это развивалось

Проект прошёл через две итерации, каждая — ответ на конкретный запрос.

  1. Первый запуск — базовое приложение: вход через Google и Яндекс, каталог, плеер, учёт прослушиваний. База данных накапливает историю для каждой клиентки. Автоматический бэкап каждое воскресенье в три ночи — новая копия создаётся по расписанию, старые файлы чистятся автоматически.

  2. Доработка плеера — подключение реального контента сразу выявило главную проблему: на мобильных устройствах аудио прерывалось при блокировке экрана. Решено полностью: фоновое воспроизведение, управление из шторки уведомлений, удержание экрана включённым во время практики. Добавлен обратный отсчёт и визуальное подтверждение засчитывания.

Что изменилось

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

Ощущение движения появилось само собой. Клиентка открывает список практик и видит свою историю — к чему обращалась часто, что ещё не пробовала. Это мотивирует возвращаться, а не откладывать.

Для эксперта изменилось то, как живёт контент. Раньше каждая новая практика — цепочка пересылок: одной, второй, третьей, и обязательно кто-то напомнит. Теперь мы добавляем аудио и описание один раз — и практика сразу появляется у всех клиенток в каталоге. Есть одно место, куда можно отправить клиентку. Там всё на месте.

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

Задел на будущее

Проект запустился как закрытое пространство с бесплатным доступом для клиенток эксперта. Платные практики уже заложены в логику — часть каталога можно сделать доступной только после покупки, остальное оставить открытым. Это не требует переделки с нуля: нужный уровень разграничения доступа уже предусмотрен в устройстве приложения.

Второй вектор — мобильное приложение в магазинах. Сейчас сайт уже работает на телефоне как родное приложение: его можно добавить на главный экран, и он откроется без адресной строки браузера. React-основа для этого уже есть — именно такая архитектура позволяет в дальнейшем выпустить приложение в Play Market или App Store, не переделывая всё с нуля. Тогда у клиенток появится привычная иконка на главном экране, а само приложение будет выглядеть как самостоятельный продукт.

Третий вектор — собственный редактор каталога. По мере роста числа практик эксперт сможет добавлять и обновлять материалы напрямую, без обращения к разработке. Структура данных этому не препятствует: практики лежат в простом и понятном виде, нужно только построить над ними удобный интерфейс с предпросмотром карточки и загрузкой аудио.

Похожая задача?

Напишите нам прямо сейчас, постараемся вам помочь.