Cascade: CSS to sound live coding system

Cascade: CSS to sound live coding system(raphaelbastide.com)

60 points by tarball 4 years ago | 8 comments

lgvld 4 years ago |

Example videos here (not so impressive, right?): https://peertube.swrs.net/video-channels/cascade/videos

Here is an interactive example: https://raphaelbastide.com/cascade/demos/cursor.html

And here is a schema describing how sound is mapped to graphics: https://raphaelbastide.com/cascade/website/img/poster.svg (e.g. probability of sound is mapped to opacity of the HTML element).

What a weird/unexpected way of producing music. Does not look so handy, but still it’s interesting if you already know CSS.

tarball 4 years ago | |

Initiator of the project here. Let me add a bit of context: The goal of cascade is to explore and map graphic possibilities offered by the DOM and CSS to sound (positions, nesting, animation, dev tools editing…). That explains the weird results, it is an experimental project mixing live-coding, sound notation and love for web standards, that will never sound like commercial music, as the limitations are important and fundamental to the exploration. This video shows several demos, illustrating my point : https://peertube.swrs.net/videos/watch/33e7c76d-775f-4e1b-88...

rvnx 4 years ago | | |

The spinning rectangle with the 4 inner circles in the video is really fascinating :) Congrats for the creativity!

lgvld 4 years ago | | |

Thank you for the thorough explanation! Sorry if I sounds blasé, that’s actually quite of an innovative project (but still I want to call it weird). ;-)

The video is very interesting, btw. But!.. the examples don’t show how interactive it can be (and the results are fucking brutalist; looks a bit like living Kandinsky paintings), related to other audio/live coding interfaces I bookmarked recently (not comparable at all):

http://100r.co/site/orca.html

https://supercollider.github.io/

https://sonic-pi.net/

https://www.purrdata.net/

Congrats!

buremba 4 years ago | |

It's creative indeed!

suyash 4 years ago |

cool!