Процесс создания сайта лейбла Digital Om Productions

6 ноября 2015 · Даниил Соколовский

Дизайн Процессы Веб-разработка

Digital Om Production — музыкальный лейбл, расположенный в Индии и Непале. Лейбл выпускает современную электронную танцевальную музыку в стилях Progressive и Psychedelic Trance, а также работает как букинг-агентство для своих артистов.


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

Изучаем рынок, смотрим сайты других лейблов:

Сайты других лейблов

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

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

Схема сайта

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

Размышляем: «прежде чем купить музыку, слушатели захотят ознакомиться с фрагментом. Значит нужна возможность выкладывать сэмплы».

Вместо того, чтобы писать собственный аудиоплеер, что потратило бы немало времени, решаем использовать API сервиса SoundCloud, лидера в области облачного хранения музыки. Для клиента такой вариант оказался удобным — лейбл активно пользуется Саундклаудом, на его страничке больше шести тысяч подписчиков.

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

Размышляем: «Так, сверху — большие и яркие кнопки, ссылки на магазины, где продаётся музыка. Но что если добавить на сайт альбом, который еще не вышел? Что будет вместо кнопок?».

Решаем сделать пунктирный контур с надписью «Forthcoming» (грядущий релиз). Эта надпись будет автоматически выводится, если дата выхода альбома будущее число, значит менеджеру сайта не придется менять её вручную.

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

Продумывая такие мелочи, тем временем, рисуем остальные страницы и разделы: главную, артисты, контактную информацию и другие.

Не забываем и про страницу ошибки 404 (это когда пользователь случайно попадает на несуществующую страницу, например, когда ошибается в написании адреса): чтобы зашедшему сюда пользователю не было скучно, размещаем небольшую историю о том, что такое «Ом».

Отдельные макеты делаем для мобильной версии сайта:

Собираем все макеты, готовим презентацию и показываем клиенту:




Клиенту всё очень нравится. Приступаем к вёрстке, программированию, скриптам, настройке панели администрирования, словом — к сбору рабочего сайта из картинок.

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

Сайт сделан в студии за 4 недели. Поддерживается и наполняется сотрудниками лейбла. Выражаем благодарность владельцу лейбла Нишану за горячий интерес к проекту.

О проекте

Разработка сайта лейбла Digital Om

в проектах студии

Читайте также

Принцип управления проектами

Принцип управления проектами

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

19 августа 2015
Когда ничего не подошло

Когда ничего не подошло

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

23 июня 2015
Как создавать и запускать успешные проекты

Как создавать и запускать успешные проекты

Избранные цитаты из книги «Getting Real».

22 июля 2015