Clastic music web application (2022)

clastic app

The Clastic Music web app is an interactive application where images are rendered in real time and react to music and human input. The app is result of a collaboration between visual artist Eduardo Pérez and myself.

Some time ago, Eduardo and I were working on an A/V presentation for a show at Mutek Montréal. We didn’t know at the moment, but that show turn up to be the Clastic Music record. A few months into the pandemic, we came up with the idea of making an interactive release so that people could enjoy and play with the A/V show at home.

We took the footage and sound recorded during the show, generated a series of patches using the Hydra synth (awesome JS library by Olivia Jack, check it out!), and designed human-computer interaction patterns so that people like you were able to control the generated visuals.

In the webapp, the nine tracks of the Clastic music record have different video synthesizer patches that you can interact with by moving the mouse around. The images also react to the music in real time. To enjoy it, select a track from the bottom of the page and play with the video synthesizer while you listen to the music.

The Clastic music app works best in Firefox and Chrome. iOS devices and Safari are not currently supported.

We hope you like it!

Guayo & Gabriel

Open the app!

PS: You can also check the open-source code repository here.

Credits

Composed and produced by Gabriel Vigliensoni.

Hydra visualizations by Eduardo Pérez Infante.

Concept design and cover by Antonia Hernández.

Mastered by Rupert Clervaux.

Web application built with Hydra Synth by Olivia Jack

Video footage recorded during MUTEK 2020, Montréal.

Big thanks to:

Mar Colasso, Daniela Cross and Delfina, Rebecca Fiebrink and Oscar, Ichiro Fujinaga, Claudine Hubert, Esteban Maestre, Louis McCallum, Alan Mongeau, Néstor Nápoles, Andrés Poblete, Evan Savage, Samuel Thulin, Santiago Uribe, Marc-Pierre Verge, Lizzie Wilson, AAS, CIRMMT, FRQSC, MIMIC project, and MUTEK Montréal.