Музыкальные паблики по-новому, или как я Public Radio делал
Это единственный пост про проект Public Radio в хабе «Я пиарюсь». Причина простая: этот пост совершенно, никаким образом не технологический. Просто не знаю, в какой хаб лучше поместить этот пост.Я пишу его скорее для самого почти полугодичной давности, когда положил в долгий ящик, а потом чуть не забросил этот проект. Для таких же, как я — людей, которые по каким-то причинам, жизненным обстоятельствам перестали работать над каким-то прекрасным проектом, и вот-вот махнут на него рукой. Я довел Public Radio до логической точки, до сегодняшнего первого релиза благодаря, пожалуй, в том числе какому-то везению, которое поставило меня на ноги, но именно такая статья, наверное, помогла бы мне тогда, если бы мне не так сильно повезло.Остальные публикации пойдут в «веб-разработку», «javascript» и так далее: мне есть много что рассказать о начинке моего «радио», но начать большой рассказ о нем я очень хочу именно с лирики и просто истории того, как я все это делал.
Чтобы вы понимали, о чем я говорю: Public Radio — это специализированный плеер для музыкальных пабликов в Вконтакте. Как сказала моя хорошая подруга, один из первых тестеров этого приложения — «last.fm с подборками от теплых ламповых человеков, а не от бездушных роботов». Собственно, это абсолютно точное описание: last.fm дает достаточно точные подборки по твоим вкусам, но это действительно «группы, похожие на те, что вы слушаете». Но есть одно НО: множество групп, похожих на те, что я слушаю, и множество тех, что меня приведут в восторг, не совпадают. Я вот за неделю использования Public Radio с удивлением для себя самого понял, что мне очень даже нравятся некоторые представители отечественной альтернативной сцены (например, Пионерлагерь Пыльная Радуга) — хотя всегда слушал несколько другую музыку.
Самое большое спасибо я, конечно, хотел бы сказать тем людям, которые каждый день выкладывают в подобные сообщества хорошую музыку — на четыре-пять часов воспроизведения ежедневно. Без вас бы ничего не получилось, ребята!
Появление идеиНачну издалека, еще до того момента, как мне пришла вообще в голову идея радио.
Я сильно увлекаюсь музыкой. Не в том плане что в том же самом ВК у меня написано «йа миламан», а в том плане, что с одной квартиры на другую со мной переезжает набор качественной акустики с АЧХ типа «смерть соседям», две гитары (акустика и электро) и виниловый проигрыватель с коллекцией пластинок.И я не люблю рекомендательные сервисы типа last.fm. По моим ощущениям — они слишком бездушные, что ли. Ты слушаешь одну группу, тебе говорят «смотри, парень, вот тебе такая же группа, слушай и их тоже». Слушаешь и понимаешь, что да, это абсолютно то же самое. Примерно как «попробуй этот бутерброд с сыром, сыр тут другой, но он по вкусу такой же, как ты только что ел».
Поэтому я предпочитал слушать онлайн-радиостанции типа Channel X. На него, честно говоря, наткнулся случайно — искал саундтрек из GTA, и оказалось, что реально есть такая онлайн-станция, очень качественная.
Со временем открыл для себя еще и такую вещь, как музыкальные паблики в ВК. Это сообщества, куда выкладывают музыку определенного формата — объем выкладываемого контента может доходить до 6–8 часов воспроизведения за сутки. Например, в моих группах есть паблик про пост-грандж, и есть паблик про new retro wave. Иногда это просто новости музыки (альтернативная сцена, или классический рок). Есть паблики фортепианных каверов на известные песни, есть паблики инструментальной музыки. В общем, музыка абсолютно на любой вкус.Их крайне приятно слушать, правда, большинство из них своим форматом предполагает вдумчивое прослушивание: выкладываются альбомы, выкладываются подборки, в итоге — в режиме «играть все» раз в полчаса относительно резко сменяется музыкальный стиль. К тому же очень часто бывает ощущение дежа вю, если слушать паблики ежедневно. «Я же уже слушал этот альбом!».
Тем временем я еще на старом месте работы запустил фановый проект GTA V radio. Сначала сделал просто для себя плеер mp3-файлов, вытянутых с трекера, потом остальные захотели сделать из этого промо-проект.
В моей голове сложилось два и два, и я решил сделать маленький челлендж для себя самого: хоть сколько-то полноценное приложение, размещенное на github.io (читай, без бэкэнда вообще). Получилось, и через четыре дня заиграл прототип, который уже можно было слушать.Он который находил музыкальные группы из групп пользователя. Алгоритм был простой, как валенок: берем последние 20 постов, если в них есть хотя бы 20 треков — значит, это можно сыграть. Как ни странно, эта простая логика оказалось эффективной.
Прототип загружался минут пять, после чего появлялось 5–10 групп (сколько наберется), которые реально можно было включить и запустить этот самый рандом с условиями. Рандом был хитрый: он выбирал треки по возможности из тех, что не играли, а если таких не было — по определенной логике брал их тех, что играли давно. До сих пор хочу усложнить, поставив условие — не воспроизводить одного и того же исполнителя подряд, и никак не доходят руки пока, куда больше других задач по проекту.
Собственно, во времени загрузки и была первая проблема: API вконтакта не позволяло выполнять более трех запросов в секунду, так что все это превращалось в веселейший квест: запросить список групп, затем запросить посты для каждой из группы. У среднего пользователя может быть пара сотен групп, а в итоге — это растягивалось (с иногда всплывающими проблемами с ошибками таймаутов и прочим весельем) на минуты. Естественно, это утомляло.
Да, это можно было слушать (что и делал я и мои друзья), но для полноценного, гхм, развития и продвижения это было крайне неэффективно.К тому же 5–10 групп выглядели крайне одиноко, и безумно хотелось добавить какие-то рекомендации, но с таким быстродействием это было бы нереально. Хотя музыка с этого радио у меня дома играла нон-стоп.
Долгий ящик События происходили примерно полгода назад, в мае 2014 года, после чего в связи с рядом обстоятельств в жизни я решил отложить Public Radio. Иногда наличие еды в холодильнике все же важнее проектов для души, увы.
Да, я тогда покинул прежнее место работы. На лето я попал в одно довольно занятное место бэкэнд-разработчиком на ноде, и за два месяца там на меня напала жуткая апатия: было ощущение, что меня взяли на деньги сеньора, но при этом на позицию джуниора. Никакого доверия, много си-стайл кодинга (костяк разработчиков — бывшие сишники). Я уже было начал думать, что разработка — это не мое. Апофеозом был момент, который помню до сих пор:
-В этом js-модуле есть баг, найди.через пять минут:-Баг в этом участке кода, как он работает — без понятия, но кроме как в нем бага быть не должно. Его можно запустить на такие две строки: …-Это замкнутый список с указателем, я его сам писал, оставь так, ищи баг. Это для перформанса.через десять минут:-Я заменил на предложенный код, замерил быстродействие, процессор просаживается на сотые доли процента, расход памяти такой же, баг ушел.-Нет, оставь этот код, ищи баг.через четыре часа:-Я нашел баг, был плюс вместо минуса в одном месте.-Нууу, окей. Я же говорил что список работает.
Сейчас это воспринимается даже смешно, но тогда я почему-то начал на полном серьезе задумываться о том, что к разработке у меня не лежит душа, что это не мое, и что это не то, чем мне стоит заниматься. Я даже начал прокручивать вариант с тем, чтобы достать с полки диплом инженера-судоводителя. Действительно, отсутствие эффективной деятельности угнетает и подавляет. Оглядываясь назад — я понимаю, о чем вообще говорят, когда говорят «дают тупую работу, чтобы ты сам тупел». Я стремительно тупел, я словно забывал все то, что умел, и терял желание что-либо делать. Я терял даже уверенность в себе и своих действиях, да настолько, что до сих пор периодически у лифта возвращаюсь и проверяю, закрыл ли я дверь. Проходит, конечно, но периодически до сих пор бывает.
К счастью, ребята от меня с моими умными идеями там устали, похоже, так же, как и я от них, и мы распрощались. Это отдельная смешная история, но я ее рассказывать не буду.
Я уже перестал тогда видеть в программировании торжество интеллекта, и начал, честно говоря, просто искать место, где можно удобно примостить пятую точку и получать приличные деньги за свои знания. Дальше была еще одна смена места в попытках примостить пятую точку куда потеплее, но в сентябре я вышел на какой-то стабильный ритм в жизни, впервые за черт знает сколько лет. В голове словно все стабилизировалось, и руки сами потянулись к Public Radio. Не потому что даже так интересно было запустить проект уже, а потому что была возможность обкатать те технологии, которые я не мог обкатывать в основном месте работы.
Самое интересное, что та самая уверенность в себе и своих решениях возвращалась именно благодаря тому, что я делал это самое радио.Я много спорил с друзьями о том, как оно должно работать, больше всего споров вначале было про то, что нельзя пропустить трек и перейти к следующему. Технически это было возможно, конечно же, но идеологически — нет. Если тебе не нравится «станция» — выбирай другую, а не ищи на ней то, что тебе понравится. Попытка найти то, что нравится в гадости, когда рядом есть что-то, что может понравиться сразу, сродни какому-то мазохизму. По крайней мере на мой взгляд. Это был, кстати, еще один аргумент в копилку качественной рекомендательной системы.
Заодно тогда же, в сентябре, я увидел новую концепцию material design от гугла, и она зацепила, как в свое время зацепил Metro UI, в связи с чем я решил стилизовать приложение под нее. Не уверен, что получилось, но по крайней мере смена дизайна прошла хорошо.Если пост читают фронтэнд-разработчики, то я объясню, чем же так вкусно было для меня возиться и «выпускать пар» — как в плане технологий, так и в плане UX.
Немножечко frontend-porn: браузеры: ie11+ (и то потому что у меня winPhone), хром-фф последниеJavascript: ES6/traceur; MVVM: vue.js; Шаблонизация: Jade; Стили: Stylus; build system: gulp + browserify + gulp (как именно это — это для одной из следующих статей)API: VK.com. Musicbrainz, coverartarchive, last.fm — отложено до следующих релизов по ряду причин.Из временно выпиленного функционала: шейдерный эквалайзер для фона (нативные вызовы, без библиотек), нейронная сеть на brain.js в web worker для персонализации рекомендаций (надеюсь добавить во втором релизе).
Если вы разбираетесь во фронтэнде, то я думаю, что вы понимаете, насколько это заманчиво выглядит.А если вы разбираетесь в бэкэнде — увы и ах, тут нет бэкэнда. ВООБЩЕ. Это не приложение с бэкэндом на апях, это не приложение даже с удаленными сервисами для хранения данных типа firebird. Максимум, что используется, кроме API Вконтакта и музыкальных сервисов — это localStorage и indexedDB на клиенте. Public radio — это настоящее client-side веб-приложение. У меня даже не стоит на сервере ничего кроме nginx. Это ведь в самом начале была просто еще одна ачивка в мою копилку: сделать взрослое серьезное приложение, которое можно развернуть на github.io. К сожалению, из-за last.fm придется делать какой-то бэкэнд: их api не поддерживает CORS, а друзья уже просят о его поддержке.
Для меня же это было сродни ковырянию под автомобилем — оно не будет ездить так, как надо, но сам процесс доводки доставляет удовольствие.Просто игра ума и торжество аккуратности. То, что делаешь для себя — стараешься шлифовать, не хочется сделать гадость. Поэтому сидишь и часами медитируешь, как сделать правильно. Это правда было сродни психологической разрядке.
Нет, оно «ездило» бы, рано или поздно, но я совершенно не разбираюсь в раскрутке и продвижении приложений, а потому я скорее всего сделал бы ровно то же самое, что и со многими моими другими проектами — опубликовал бы и забыл.
Возрождение И тут в моей истории произошел еще один небольшой поворот: я уехал на скалы на полторы недели. Просто отдохнуть от всего, окончательно стабилизировать мозги, побыть подальше от электроники. И вот как раз там осознал, что я правда хочу поделиться созданным мной проектом с как можно большим количеством народа: все-таки у меня вышло аккуратное приложение, которое по-настоящему цепляло меня и многих моих друзей.
А значит — зацепило бы и многих других людей.
А что еще важнее — я смог бы доказать себе, что я могу создавать веб-проекты, которые работают, ездят, и которые по-настоящему нравятся другим. Нет, никакой коммерческой цели не было как тогда, так и сейчас, просто хотелось сделать хороший проект.
Неделю назад я вернулся, начал хреначить (иначе не скажешь), а заодно и взял домен publicradio.io.
И сегодня я могу сказать, что у меня есть первый релиз Public Radio. Да, там нет многого функционала, который я хотел бы в нем видеть: нет умной строки поиска, которая бы подсказывала станции для друзей, определенных исполнителей или других станций. Нет сложного социального взаимодействия. Нет аналитики и персонализации для владельцев групп. Нет даже банально удаления не нравящихся тебе групп из списка. Но оно работает, оно играет музыку, рекомендует мне то, что я с удовольствием слушаю, лайкаю и добавляю в «мои группы». Это то, без чего я не мог видеть это «долбаное радио» (да, был период, когда я называл его именно так и никак иначе).
Я работаю над ним по ночам, по выходным, и я искренне счастлив, каждая минута работы с ним по-настоящему доставлет мне удовольствие, особенно когда возишься с ним под музыку, которая играет из него же.
Знаете, я только сейчас осознал, что я пришел в большую коммерческую веб-разработку ровно два года назад. 20 октября 2012 года я начал работать на первом месте из тех, что указаны у меня в резюме, до сих пор почему-то помню эту дату.Наверное, это символично: начинать третий год работы в веб-разработке, запуская свой собственный проект. Некоммерческий, действительно фановый, такой проект, который нравится мне самому и который мне хочется развивать.
Наверное, у кого-то возникнет мысль «а в чем прикол? почему так долго делать? Да я это на коленке за неделю сделаю».
Я не буду спорить, сделаете. Я сам первую версию собрал за четыре дня, как я уже говорил.А так долго… Два слова: быстродействие и рекомендации. Причем быстродействие как в плане работы с API, так и с рендером.Если честно, получение данных можно было бы сделать в 2 раза быстрее, я его специально снизил сейчас: ВК отвечает через jsonp, который парсится как javascript, в режиме максимальной утилизации VK Api получалось, что 3 раза в секунду браузер парсил скрипты размером до 2 МБ каждый. Браузер, что логично, на это время подвисал, и даже дергался звук.
С рекомендательным движком — это отдельная история, которой я посвящу целый пост, там тоже станет понятно, как именно я подбирал оптимальную логику совпадений.
А пока что я просто хочу поделиться тем, что я сделал, и мотивировать других людей: не опускайте руки. Если вы считаете, что создаете что-то прекрасное, доведите до конца. Неважно, будет ли кто-то этим пользоваться или нет, вы сами будете получите удовольствие от того, что вы создали, что вы действительно довели до конца, вы увидите, как то, что появилось в вашей голове, живет, как ваша мысль матеарилизовалась под вашими же руками, и это бесценно.
Что дальше? Дальше я буду развивать проект — если людям он понравится, конечно. Правда, мне жутко не хватает времени — так что если кто-то хочет присоединиться, я только за. Я был бы рад видеть в команде Public Radio еще одного фронтэндщика и дизайнера, который хотел бы попробовать себя в Material Design.
Конечно, напишу 4 или 5 статей на Хабр про набор технологий, как и обещал выше. Мне правда есть о чем сказать — начиная от шейдеров (вот два, которые я сделал специально для Public Radio, но пока что не внедрил, долго объяснять причины, честно говоря: www.shadertoy.com/view/XsBSDW, www.shadertoy.com/view/XsBXDW) или построением веб-приложения как конечного автомата поверх генераторов es6 — и заканчивая простейшей рекомендательной системой и теми тонкостями, с которыми я столкнулся при ее создании на коленке.Первую статью — про gulp+browserify+gulp, я надеюсь, я опубликую уже в среду.
Public Radio не станет коммерческим проектом, по крайней мере пока это мой проект.
Честно говоря, я не знаю, как мне продвигать его, и я искренне надеюсь на то, что мне просто повезет, и он станет сколько-то виральным. Я буду связываться с владельцами небольших пабликов и предлагать добавить их в список рекомендуемых: сейчас берутся первые 500 пабликов по слову music, парсятся, расчитываются по жанру и так далее — если создать каталог с жанрами, это значительно убыстрит и улучшит работу сайта — за размещение ссылки на радио (радио поддерживает ссылки на паблики, например, publicradio.io/? shantrock), и, возможно, публикацию поста о радио. Если у кого-то есть хорошие идеи по развитию проекта — я буду рад услышать их, равно как и полезные комментарии.
Очень хотелось бы сделать мобильное приложение с кэшированием аудио — чтобы слушать «радио» в дороге или в метро, где лимитированный трафик (эта зараза может сожрать до 50 мб в минуту, особенно во время загрузки).
Но пока что у меня лично в планах сегодня вечером просто включить мою любимую станцию на Public Radio, собрать друзей, и отметить запуск моего первого полноценного веб-проекта.
Всем спасибо. Надеюсь, вам понравится Public Radio.
