D&D Records
Тихая витрина независимого лейбла: радио, которое запускается само, каталог из 99 релизов и 2 243 песен, офлайн-библиотека для дороги и видео-журнал вместо ленты.
Сайт и PWA-приложение музыкального лейбла: онлайн-радио, каталог из 99 релизов и 2 243 треков, офлайн-библиотека и видео-журнал. Роль студии — концепция, арт-дирекшн, UX/UI, дизайн-система, анимация и реализация.
Видео-прогулка по экранам: вход, главы-дисциплины, магазин и хранилище.
- Бренд
- Независимый лейбл двух авторов из разных стран
- Формат
- Сайт + PWA-приложение на домашнем экране
- Каталог
- 99 релизов, 2 243 песни, пополняется каждую неделю
- Хостинг
- Музыка остаётся на SoundCloud, видео — на YouTube
- Аудитория
- Слушают ночью, в наушниках, в дороге и офлайн
- Язык
- Русская поэзия и международное звучание одновременно
У лейбла было всё, кроме дома. Музыка жила на одной платформе, видео на другой, живопись на третьей. Слушатель, влюбившийся в один трек, физически не мог найти второй: через тридцать секунд стриминг подставлял чужого артиста. Человек терялся ровно в тот момент, когда был максимально расположен к лейблу.
Цели- 01Перестать терять уже влюблённого слушателя — не «сделать красивый сайт»
- 02Ввести в оборот весь каталог, а не два-три трека из чужих подборок
- 03Превратить случайного слушателя в постоянного через установленное приложение
- 04Поднять воспринимаемую ценность музыки до уровня коллекционного артефакта
Ограничения — не оправдание, а аргумент: они объясняют, почему решение выглядит именно так.
- Некоммерческий авторский проект: никаких рекламных блоков, поп-апов и агрессивных CTA — доверие единственная валюта.
- Каталог огромный и растёт еженедельно: контент не может обновляться руками дизайнера.
- Архив не переносится — существующие площадки нужно обернуть, а не мигрировать.
- Двое авторов в разных странах, никогда не стоявших в одной комнате: это не биография, а смысл бренда.
- Слабый интернет, самолётный режим, погасший экран — обычные условия прослушивания.
- Смешанная языковая аудитория: русские тексты и англо-немецкое звучание.
«Тихая витрина»: не музыкальный сервис, а поздний вечер в винильном магазине, где вы единственный посетитель. Звук раньше интерфейса, тишина как материал, ничего лишнего в кадре.
Первый экран: эфир идёт до того, как человек что-то нажал
Радио, которое запускается само
- Задача
- Не терять человека на входе, где обычно стоит выбор «с чего начать».
- Ограничение
- Любой экран выбора — самый дорогой шаг в конверсии.
- Решение
- Главный экран — не афиша, а уже играющее радио. Треки идут вперемешку по всему каталогу, поток изолирован: играет только музыка лейбла и не останавливается ни на одном переходе.
- Эффект
- За первые пять минут слушатель слышит три разных релиза вместо одного альбома подряд.
Плеер закреплён под шапкой и живёт над роутингом
Кликабельно всё, не кричит ничто
- Задача
- Увеличить число точек входа в каталог, не добавляя визуального шума.
- Ограничение
- Тон бренда исключает кнопки «Слушать» и «Купить сейчас».
- Решение
- Навигация вшита в сами объекты: пластинка ведёт в альбом, обложка справа — в релиз. Ни одной отдельной кнопки воспроизведения.
- Эффект
- Меньше интерфейса на экране и при этом больше переходов в каталог.
Каталог: обложка важнее подписи
Каталог как архив, а не как маркетплейс
- Задача
- Показать 99 релизов так, чтобы каждый читался как вещь, а не как строка склада.
- Ограничение
- Обложки — авторская живопись, их нельзя прятать под подписи и бейджи.
- Решение
- Сетка построена вокруг обложки: она главный герой, подписи уходят на второй план, цвет появляется только под курсором.
- Эффект
- Ручная обложка работает доказательством, что за музыкой стоит человек, а не конвейер.
22 песни в оригинальном качестве, прямо от лейбла
«Masters for the Road» — офлайн-библиотека
- Задача
- Дать причину установить приложение и не удалять его.
- Ограничение
- Слушают в дороге и в самолёте: интернета может не быть вовсе.
- Решение
- Избранные мастер-файлы кэшируются на устройство и играют без сети и с погасшим экраном, с обложкой на локскрине.
- Эффект
- Раздел, которого нет у стримингов такого масштаба, — и постоянный слушатель вместо случайного.
Visual Journal: у каждой песни есть лицо
Видео-журнал
- Задача
- Удерживать внимание минутами, а не секундами.
- Ограничение
- Клипы живут на YouTube и не должны тащить за собой чужие превью.
- Решение
- Клипы собраны в отдельный раздел «песни, ставшие маленькими фильмами»: тихие карточки, внутренний плеер, без агрессивных обложек.
- Эффект
- Второй канал входа с YouTube и заметно более длинная сессия.
Двое, никогда не стоявшие в одной комнате
«О нас» как аргумент, а не биография
- Задача
- Сделать бренд пересказываемым одной фразой.
- Ограничение
- Личная история легко превращается в скучный раздел «о компании».
- Решение
- История двух авторов из разных стран вынесена в самостоятельную главу с портретом и двумя дверями — в её мир и в его.
- Эффект
- Готовый пресс-повод и причина отправить ссылку другу.
Сохранено на домашний экран, играет с погасшим экраном
Телефон — не уменьшенный сайт
- Задача
- 80–90 % слушателей приходят с мобильного.
- Ограничение
- Все действия должны попадать в зону большого пальца.
- Решение
- Мобильная версия проектировалась как основная: плеер всегда закреплён, обложка занимает первый экран, приложение ставится на домашний экран с собственной иконкой и заставкой.
- Эффект
- Лейбл получает место на телефоне слушателя, а не строку в закладках.
Система экранов: интро, радио, каталог, журнал, двери авторов
Живая система вместо разового макета
- Задача
- Выпуск альбома не должен требовать дизайнера.
- Ограничение
- Каталог пополняется еженедельно и уже превышает две тысячи треков.
- Решение
- Дизайн подключён к существующим площадкам: новые релизы и клипы появляются на сайте автоматически.
- Эффект
- Ноль оплаченных правок на релиз и запас прочности системы на 500 релизов вперёд.
- ×Не переносили архив с платформ-хостингов: обернули существующий, без риска потерять статистику.
- ×Не добавляли рекламу и платную подписку — музыка остаётся бесплатной и без баннеров.
- ×Не делали ярких кнопок «Слушать»: действие убрано совсем, музыка уже играет.
- ×Не выводили длинные тексты на главную — каждый абзац отодвигает первый звук.
- ×Не строили альбомную очередь по порядку: поток перемешан, чтобы работал весь каталог.
#0B0705
Графитовая ночь — база экрана
#2A150E
Тёплая тень винила
#C9A227
Золото акцента: эфир, лайк, ссылки
#E8DCC8
Тёплый пергамент для текста
#7A3B2E
Бордовое свечение фона
- Заголовки и названия релизов
- Cormorant — антиква с крупным кеглем и воздухом
- Разряжённые капсы и статусы
- Cormorant / letter-spacing 0.28em
- Основной текст и подписи
- Гуманистический гротеск малого кегля
- Больше минут на слушателя: экран выбора убран, чужие артисты из потока исключены, сессия не прерывается.
- Возврат вместо трафика: установленное приложение и офлайн-библиотека переводят гостя в постоянного.
- Каталог начал работать целиком, а не двумя-тремя треками из чужих подборок.
- Ценность вместо цены: ручные обложки, крупная антиква и тишина позволяют продавать физику и лицензии без скидок.
- История, которую пересказывают: двое авторов, никогда не стоявших в одной комнате.
- Нулевая стоимость поддержки: автообновление каталога, ни одной правки на релиз.
Проект живёт в сети — можно посмотреть вживую
Смотреть сайт ↗