Музыкальный Дата-Арт

Визуализация создана во время и после Дата арт Воркшопа, проводимого Натальей Киселёвой в январе 2026 года.

Задача состояла в том, чтобы получить постер с Дата-Артом, созданным по выбранной песне либо мелодии.По-желанию можно было для визуализации взять песню на свой вкус, но до ЗУМа обязательно скачать mid(MIDI)-файл и mp3, чтобы использовать не заготовку спикера, а своё.

Далее,

1 mid-файл превращали в csv с помощью скрипта в Collab.

2 Обрабатывали датасет в Google Sheets и/или в Excel. Здесь важно "завернуть данные в круг", получить значения для колонок X и Y с помощью функций cos() и sin(), что является основой визуала.

3 Затем создание Дата-Арта. Я использовала Power BI, пробовала rawgraphs и Tableau. Это самый творческий этап, т.к. можно настраивать цветовую палитру, в Power BI ещё и экспериментировать с размером маркера.

4 Однако самая магическая часть — превращение в p5js csv-файла в Дата-Арт с наложением mp3. Без выбора цветовой палитры.

© У данного алгоритма есть автор. Более детально не расскажу.

Воркшоп доступен ссылке

Я выбрала песню, с которой у меня многое связано.

✴ Свои готовые варианты собрала в Figma.

Готовые вариаты Дата-Арта в разных инструментах
Готовые вариаты Дата-Арта в разных инструментах

Далее отдельно визуализация в BI инструментах.Интересный момент,один и тот же исходник Power BI и p5js превращают в круг расположенный зеркально и с поворотом в 180 градусов.Это корректируется в Figma.

Визуализация в Tableau

В этом инструменте круг располагается так, что начало/нонец песни относительно максимума по оси Y сдвинут против часовой стрелки на 90 градусов.Для визуализации используется Circle

Поcтер доступен ссылке

Пример Дата-Арта в Tableau
Пример Дата-Арта в Tableau

Визуализация в Power BI

За основу берётся Bubble chart (Пузырьковая диаграмма)В категорийный признак взят параметр "Высота ноты (pitch)"

Дата-Арт в Power BI
Дата-Арт в Power BI

Визуализация в rawgraphs

Он-лайн редактор. На сайте визуализация не сохраняется, только возможность скачивания. Скачать можно файлы различного формата в том числе и svg для удобства дальнейшей обработки в Figma.Есть возможность настраивать цвет и размер кружка. За основу берётся Bubble chart (Пузырьковая диаграмма).В категорийный признак взят параметр "Высота ноты (pitch)"

Дата-Арт в rawgraphs
Дата-Арт в rawgraphs

Всем интересных активностей!

Начать дискуссию