О проекте

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

Задача

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

Большой экран

Главный экран почти целиком занят атмосферной фотографией, а в её центре — режим Stream с четырьмя вариантами: Work, Study, Chill и Sleep. Достаточно выбрать занятие, и музыка начинает играть. Кнопка «Change image» позволяет сменить фоновое изображение. Ниже — лента «Continue listening» с плейлистами, к которым пользователь уже обращался.

Внизу экрана постоянно закреплён плеер: обложка, название плейлиста и текущий трек, кнопки управления, дизлайк и лайк, а справа — трансляция на другое устройство, таймер и настройки звука. Таймер особенно важен для режима Sleep.

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

Мобильная библиотека

В мобильной версии главным разделом стала библиотека с тремя вкладками: Tracks, Playlists и Visuals. Список треков — компактный: название, исполнитель, иконка загрузки и лайк. Иконка загрузки показывает состояние: идёт ли скачивание и сохранён ли трек на устройстве. Текущий трек отмечен значком воспроизведения, а над нижней навигацией закреплён мини-плеер с названием активного стрима.

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

Результат

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