Дневник веб-разработчика

И снова «музыкальная» тема. На этот раз я решил углубиться в синтез звука и построить синтезатор. Данный синтезатор позволяет настраивать многие характеристики звука, фактически, таким образом, давая возможность создавать музыкальные инструменты, максимально приближенные к звучанию своих реальных или не реальных прообразов^*.

1. А если серьезно, звук «реальных» музыкальных инструментов очень сложный и синтезировать его сложно. Поэтому не стоит ждать чудес от моей поделки.

Продолжаю «музыкальную» тему. На этот раз я решил плотнее поработать с Web Audio API. В качестве цели я выбрал создание онлайн компрессора аудио-сигнала.

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

В идеале я надеялся получить полезное веб-приложение, которое можно использовать для настройки динамического диапазона аудиофайла. Фактически же приложение можно использовать только для обработки небольших файлов, так как я не смог реализовать «оффлайн» обработку (т.е. быстро обработать весь файл и скачать) многочасовых аудио-файлов. Web Audio API оказалось не предназначено для таких задач.

Задачу эту я все равно хочу решить. Поэтому продолжение следует…

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

Приложение использует Web Crypto API. Пользователь генерирует несколько секретных ключей (на клиенте), скачивает их в виде файла и хранит этот файл в безопасном месте локально на компьютере. Имея на руках секретные ключи, пользователь может добавлять пароли в менеджер. Все пароли, включая их описания и домены, которым они принадлежат, зашифрованы синхронным алгоритмом шифрования с использованием секретных ключей, хранящихся локально на компьютере пользователя. В базе данных на сервере все поля хранятся в таком зашифрованном виде.

Излишне было бы предупреждать, что пользоваться этим приложением не стоит.

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

Сервер приложения хранит аудиофайлы пользователя на Яндекс.Диске пользователя. При прослушивании аудиозаписи, файл записи передается потоком с Яндекс.Диска в браузер пользователя (Яндекс.Диск предоставляет api.

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

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

Вот принцип работы этого приложения: вы подключаете MIDI-клавиатуру к компьютеру (или планшету) и запускаете упражнение в приложении. Приложение предоставляет подсказки по нажатию клавиш и соответствующих пальцев. Кажется, получилось достаточно полезное приложение. Но стать

Приложение реализовано с использованием библиотеки OSMD и программы для авторов музыки MuseScore. Работает следующим образом. Записываем ноты упражнения в MuseScore, экспортируем в music xml формат. Парсим этот формат с помощью OSMD и получаем последовательность «правильных» MIDI событий и номера пальцев. Далее слушаем MIDI события с пользовательского ввода через Web MIDI API и сравниваем пользовательские события с ожидаемыми событиями. Страница с нотами рендерится также библиотекой OSMD.

Реализация этого приложения заняла довольно много времени, примерно полгода. Результаты первых итераций пришлось полностью переписывать. Например, сначала я использовал формат MIDI для входных файлов, но он оказался слишком ограниченным для нужд данного приложения. Поэтому я принял решение перейти на формат MusicXML, который позволяет передавать нотную запись, MIDI-события и аппликатуру. Еще одним фактором, который повлиял на сроки реализации, было отсутствие у меня знаний в области музыки (знания подтягивал в процессе работы над приложением). В целом я доволен результатом. Думаю, что еще буду делать веб-проекты в области музыки.

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

И вот здесь на помощь приходит веб-приложение для скриншотов, доступное на любом компьютере с подключением к интернету. Оно предоставляет одинаковый интерфейс на всех компьютерах, независимо от операционной системы. И именно эту проблему решает приложение “edit”.

Приложение реализовано с использованием Canvas API. Undo/Redo функционал реализован с помощью стека отдельных canvas’ов. Реализация заняла один выходной день.