Cascade

Self-described as “a live coding parasite to Cascading Style Sheets”, this live coding platform is built on top on of CSS, one of the main elements of any webpage. As CSS is a styling language, and Cascade uses CSS as input for creating music, this creates a very nice side effect — you get the visuals as part of creating the audio.


How it works

How is used to CSS to create music? Simply put, some key CSS properties were chosen to be interfaced with sound. Those specific CSS properties were chosen because they have strong graphical effects, and have little dependencies with other CSS properties. For example, background-color impacts the visuals heavily, so it is chosen. Font-size is not a good candidate for this purpose because it can be reliant on parent properties ( em/rem font sizes ) and it does not affect the visuals much.

A summary picture of the documentation is attached below.



Limitations

At first use, I enjoyed how the audio/visuals tied-in so easily with each other. Unlike what we had to do in Hydra/TidalCycles, there is no need for separately creating each element. By just creating a beat that sounded decent, I also had a bonus of the visuals already being created for me, and it’s synced with the music.This was both a boon and a limitation. As the audio is directly dependent on the visuals, it meant you are limited in what you want to express and you are tied-in to what options are available in Cascade. As it uses CSS as an interface, it meant that if you want to create some complex visuals you will have to perform some complicated DOM manipulations on your own to create something that other live coding platforms offer in a single function.

Slides ( accessible only to NYU emails! )

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>