Смарт ТВ-приложение для локального оператора: сделали продукт, который не уступает крупным стримингам. Кейс «Игра Сервис»

О проекте и клиенте

«Игра Сервис» — региональный провайдер из Красноярска. Они предоставляют интернет, телевидение и услуги видеонаблюдения для жителей всего края. 

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

Цель — повысить удобство для пользователей и стать конкурентнее на фоне других ТВ-сервисов.

У «Игра Сервис» уже была серверная часть с API. Наша задача заключалась в том, чтобы создать клиентскую часть и надежно «сшить» ее с бэкэндом. Такой формат работы нам хорошо знаком: мы умеем подключаться к готовым решениям и работать в связке с инхаус-разработчиками. В случае с «Игра Сервис» мы синхронизировались с бэкэнд-командой клиента, чтобы обеспечить бесшовную интеграцию и высокое качество финального продукта.

Работаем поэтапно

На старте договорились, что идем поэтапно. Сначала — минимально жизнеспособный продукт (MVP) с базовой и полностью рабочей функциональностью. Затем — расширение возможностей, улучшение пользовательского пути и реализация дополнительных сценариев.

Наши задачи

На этом проекте перед нами стояли несколько задач:

• Спроектировать интерфейс под Смарт ТВ приложение. 
• Разработать с нуля клиентскую часть под несколько платформ: Android TV, Samsung и LG. 
• Провести интеграцию с готовым бэкэндом. 
• Подготовить необходимую документацию и APK-файл для инхаус-команды клиента. 

Дизайн: вызовы и решения

Смарт ТВ — это не веб и не мобильное приложение. Здесь у пользователя в руках не мышка и не сенсор, а пульт. А значит, привычные интерфейсные паттерны не работают. Выпадающие меню? С пульта их прокликать сложно. Бесконечные скроллы? Утомительно. Интерфейс должен быть предсказуемым, с четким фокусом и минимальным числом шагов.

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

Что мы учли:

Мы понимали: аудитория у сервиса очень разная. В том числе — пожилые пользователи и те, кто неуверенно чувствует себя в цифровой среде. Интерфейс должен быть простым, интуитивным и дружелюбным. 

Финальный дизайн понравился клиенту. Мы заранее заложили место под будущие функции: онлайн-кинотеатры, новые разделы и дополнительные категории. Структуру не придется менять заново, когда продукт будет расти.

«Игра Сервис» — не первый наш проект для Смарт ТВ. Весь накопленный опыт по дизайну таких приложений мы обобщили в статье «Как задизайнить приложение на смарт-ТВ: 7 советов, проверенных на практике».

Помогаем бизнесу расти

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

Получить бесплатную оценку проекта

Получить бесплатную оценку проекта

Пользовательские сценарии и функции ТВ-приложения 

Приложение проектировалось как полноценный инструмент для просмотра ТВ и управления услугами, но в первой версии (MVP1) реализовали только базовый набор функций — чтобы быстрее выйти в релиз и собрать обратную связь.

Авторизация и регистрация

Пользователь входит по номеру телефона — это привычный для клиентов «Игра Сервис» способ. Мы адаптировали его под Смарт ТВ:

• максимально сократили количество шагов;
• сделали крупные поля и читаемые подсказки;
• реализовали автоматическое определение формата номера и оформили ошибки (например, если не приходит СМС).

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

Совместно с командой клиента мы стабилизировали работу API и упростили структуру входа: теперь даже пользователь с минимальным цифровым опытом сможет авторизоваться без проблем.

Главная страница

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

• кнопку «Каналы», «Видеонаблюдение», «Онлайн-кинотеатр»;
• кнопку с настройками и профилем — с доступом к балансу и услугам.

Быстрые переходы позволяют добраться до нужного экрана за два-три клика с пульта.

Каталог телеканалов

Раздел, с которым пользователь работает чаще всего. В нем заложена вся логика поиска и фильтрации:

• поиск по названию канала;
• фильтрация по жанру (новости, спорт, детское и т. д.);
• быстрый просмотр информации о передаче (название, время начала);
• переход к просмотру в один клик.

Во втором релизе добавим функция хронологии просмотра и возможность добавить канал в «Избранное». 

Управление услугами

Здесь пользователь может:

• посмотреть текущий тариф;
• узнать баланс счета;
• подключить или отключить услуги — например, видеонаблюдение, доступ к премиум-каналам и т.д.

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

Видеонаблюдение

Это важная функция «Игра Сервис» и довольно популярная услуга у клиентов. Если у пользователя есть доступ к домофонии или камерам в районе, он может:

• посмотреть трансляции с камер прямо на ТВ;
• быстро переключаться между камерами;
• в будущем — просматривать записи (эта функция в планах).
  

Список камер, привязанных к адресу, и переключение между ними появятся во втором релизе. Мы заложили в интерфейс масштабирование — чтобы потом можно было добавить историю просмотра, сортировку по типу камер (например, подъезд / двор / дорога), доступ к архиву.

Нужно быстро выпустить первую версию продукта?

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

Связаться

Связаться

Сложности и как мы с ними справились

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

Работа с нестабильным API. По API фронтенд получает нужные данные от сервера. Мы запрашиваем, например, список телеканалов, а сервер присылает ответ: что показать, как назвать, какие иконки и так далее. В нашем случае API часто вел себя непредсказуемо:

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

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

Поведение плеера на разных платформах. У каждой ТВ-платформы своя специфика: где-то плеер не поддерживает нужные форматы, где-то нестабильна работа с фокусом, где-то нельзя управлять отдельными элементами во время воспроизведения. Чтобы не писать отдельные версии с нуля, мы:

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

Результаты и планы

Клиент получил современное, удобное и стабильное Смарт ТВ-приложение. Мы завершили первую итерацию, и передали заказчику сборку для публикации в сторы. Сейчас проект готовится к релизу: проходят финальные тесты и оформление на платформах Android TV, Samsung и LG.

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

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

Нужен удобный, современный дизайн, который работает на ваш бизнес?

Команда Purrweb готова помочь. Уже более 10 лет мы создаем UI/UX-дизайн для веб-сервисов, мобильных приложений и Смарт ТВ — и знаем, как превратить идею в продукт, который понятен, красив и приносит результат. Оставьте заявку — обсудим вашу задачу, разберемся в деталях и предложим оптимальное решение.

Почему Purrweb 

✅ Сильная экспертиза в дизайне. У нас за плечами 550+ проектов в самых разных сферах: от IoT и EdTech до стримингов и маркетплейсов. Мы умеем не просто рисовать красиво, а делать интерфейсы, которые работают на пользователя и на бизнес.

✅ Закрываем любые дизайн-задачи. В команде — UI/UX-дизайнеры, графические и моушн-дизайнеры, 3D-специалисты. Создаем интерфейсы, айдентику, анимации, иллюстрации и 3D-модели — все, что нужно вашему продукту.

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