Colour Coding:
Music Notations in Colour
Graduation Project
p5.js + Adobe Creative Cloud
LASALLE College of the Arts
Singapore
See FI&LD for Singapore Design Week 2023 feature.
This project explores an alternative approach to musical notation, using colour as the primary visual language. Through a series of experiments spanning analogue mark-making, digital image-making, and generative coding, I explored different ways of translating sound into something that could be experienced visually.
Using p5.js, I developed a collection of generative compositions that challenged the conventions of traditional sheet music. Rather than prescribing exact notes and rhythms, each composition became an open visual score, inviting interpretation instead of instruction.
To bring the idea full circle, the final visual score was interpreted by a musician, transforming the colours and patterns back into sound. The result was a collaboration between design, technology, and performance, demonstrating how visual systems can become new ways of creating, reading, and experiencing music.
Balancing Technology & Creative Intuition
While the visual compositions were generated through code, the final piece only came to life when a musician interpreted them. There was no single "correct" way to read the colours or patterns. Instead, the musician brought their own perspective, turning a computational system into something expressive and deeply human.
That balance between technology and creative intuition became the heart of the project. Rather than replacing the role of the artist, the code became a starting point for interpretation, opening up conversations about authorship, collaboration, and the many ways music can be communicated.
Looking back, Colour Coding challenged me to think beyond conventional design outcomes. It showed me how design can become a bridge between disciplines, creating new ways for people to experience music through colour, interaction, and imagination.
P5.Amplitude Posters
Using live audio input and the Amplitude sound constructor in p5.js, I developed a generative system that responds to the dynamics of any piece of music or sound. As the audio changes, circular forms expand, contract, and shift in colour, creating unique compositions that visually capture the rhythm and intensity of each recording.
Rather than illustrating music literally, each poster becomes a visual interpretation of sound, turning something we hear into something we can see.
Series of posters