Author: Linh Tran

Cascade is a web-based live coding environment introduced by Raphaël Bastide in 2021. It transforms built-in CSS and HTML in web browsers into a tool for creating sound and visuals. Since Cascade is entirely browser-based, no additional setup or external modules are required, users simply reference the core scripts in an HTML file and/or a CSS file to get started.

How it works?

Cascade generates sound and visuals based on the shapes and positions of elements on a webpage. Each property of an element (such as width, height, and position) influences specific musical attributes. For instance, the width-to-height ratio represents the number of beats and steps, following Godfried Toussaint’s Euclidean rhythm distribution. This integration of web design with music encourages users to think about both the visual aesthetics and how they contribute to sound production. As I tried it by myself, it was quite difficult to come up with a meaningful visual along with a good sound. However, thanks to the CSS properties, the animations are interpreted in real-time allowing more dynamic visuals.

c.add('width:10vh; height:30px; background:cyan; top:80vh;')

For example, the above line allows to add a div into the body so that it has width of 10vh and height of 30px. The background is cyan which will be match with the according instrument set by Cascade. The vertical position (top: 80vh) adjusts the note pitch, making the note higher and louder.

Why Cascade?

Cascade offers a gentle learning curve for those familiar with web development, as it introduces no new language or syntax beyond standard CSS and HTML. This makes it an accessible entry point for newcomers to live coding while providing a creative playground for experienced developers. It also fosters collaboration between performers and audiences. Performers can modify, see, and listen in real-time, while audiences can watch and listen to the evolving performance.

Cascade bridges the gap between web development and live coding, making it a powerful tool for exploring sound through visual design. It allows users to combine or learn both disciplines simultaneously. Every design decision affects the resulting sound, prompting a thoughtful approach to composition and layout. This blend of sound and visual design invites users to experience the intersection of aesthetics and music in new and exciting ways.

Demo

Link (in case the preview does not work)

Citation

“Cascade.” Raphaelbastide.com, 2025, raphaelbastide.com/cascade/#cascade-pool-collab-mode. Accessed 13 Feb. 2025.

‌

Music originates from the human body. Every clap of the hands and stomp of the feet creates a rhythm, and these natural rhythms have inspired the development of instruments such as the snare drum and bass drum. Furthermore, the variations in pitch and frequency of notes mirror the complexity of human emotions, allowing music to carry and convey feelings that the audience can intuitively understand. Because music is born from the body and has the ability to transmit the abstract essence of human experience, I believe it comes alive through both those who create it and those who listen to it.

What makes music feel even more alive is the behavior we attribute to it. For instance, the slight delay between the bass drum and snare drum may stem from the natural coordination differences between our hands and feet, yet we accept this as an inherent quality of musical rhythm. Each performer is unique, and as a result, the same piece of music can be played in ways that evoke entirely different emotions. In this sense, music takes on the personality of the musician, becoming a deeply personal and expressive form of art. Thus, music serves as a powerful medium for self-expression in today’s world.

“To define something is to stake a claim to its future, to make a claim about what it should be or become,” said David Ogborn.

Viewing live coding as a performance rather than merely a code display, defining it too strictly could limit its creative potential. Imposing rules or confining them within a strict definition might restrict the freedom and diversity coexisting in live coding. In the creative field, as projects take on different forms and styles, I believe that leaving “live coding” undefined allows for more possibilities to emerge and evolve in real-time, during live performances.

That said, my own interpretation of live coding is that it is a space where code is alive and constantly evolving. The code transformation can grow or end, and the performance can be a solo performance or an interactive experience with the audience. It is “alive” in the sense that it changes dynamically before the audience’s eyes, but it is also static in a way, like a painting, where the computer is the canvas, and each line of code is a brushstroke. This dual nature makes live coding an exciting side of art for both developers and audiences, shaping it into a unique live performance and an artistic experience.