EN Обсудить задачу
Обсудить задачу

Кейс · Торговля · Разработали для «Кровельного центра»

Фирменное радио компании: эфир в браузере, в приложении и в автомобиле

Собственная радиостанция бренда с веб-плеером, приложением для iPhone и CarPlay: прямой эфир, избранное, расписание программ и резервная дорожка, которая включается сама, если связь пропала.

Как устроено: эфир, сервер, веб-плеер, приложение, слушатель

  1. Эфир

    поток станции и названия треков

  2. Сервер

    расписание, кэш, статистика

  3. Веб-плеер

    два концепта, две темы

  4. Приложение

    iPhone, CarPlay, резерв без сети

  5. Слушатель

    в офисе, дома и в дороге

Интерактивный прототип

Эфир, избранное, настройки — как в приложении

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

Концепт

Плитка эфира и три вкладкиГрафит: только музыка

Нажмите Play, чтобы включить эфир. Сердечко сохраняет песню в избранное.

Кровельный центррадио
Прямой эфир

Прямой эфир

в эфире
радиоХорошая музыка. Каждый день.

Love Tonight

Shoby, Fijy, Lindal

Музыка здесь. Нажмите Play

Слушать эфир

Система экрановКлючевые экраны и состояния. Статичные превью на демоданных.

  • Прямой эфир01

  • Избранное02

  • Настройки03

  • Таймер сна04

  • Задача

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

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

    Нужно было

    • Слушать радио на сайте, в телефоне и в машине
    • Не терять эфир при плохой связи
    • Статистика и диагностика для команды радио

    Получилось

    • Веб-плеер и приложение для iPhone и CarPlay
    • Резервная дорожка вместо тишины при обрыве
    • Статистика прослушиваний — в панели сотрудников

Что сделали

  • Веб-плеер в двух концептах

    Два визуальных концепта, тёмная и светлая темы, фон, который подстраивается под обложку трека. Экраны эфира, избранного и настроек; плеер проверен в браузерах на разных движках.

  • Приложение для iPhone и CarPlay

    Нативное приложение с теми же концептами. В автомобиле эфир открывается сразу на экране «Сейчас играет», меню CarPlay переключает режим, есть таймер сна.

  • Резерв без интернета

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

  • Расписание программ

    Дневная сетка программ с автоматическим возвратом к эфиру в заданное окно. Детектор следит за границами и не обрывает начатую передачу.

  • Статистика и диагностика

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

  • Выпуски с уведомлением команды

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

  • Что получилось

    • Радио звучит одинаково в браузере, на телефоне и в автомобиле — в фирменном стиле компании.
    • Эфир не прерывается от плохой связи: слушатель слышит резервную дорожку, а не тишину.
    • Команда видит статистику прослушиваний в той же панели, что и показатели сайта.
    • Веб-плеер доступен, приложение проходит внутреннее тестирование перед публикацией в App Store.

    Статусы — на октябрь 2026 года.

Расскажите, что сейчас приходится делать вручную

или напишите напрямую

Например: менеджеры вручную переносят заявки из почты в CRM — хотим это автоматизировать.

Бюджет

Отвечаем в течение часа в рабочее время: пн–пт с 9:00 до 20:00 по Москве. Если нужно быстрее — позвоните или напишите напрямую, контакты выше.