afiq shubi din







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.

Colour Coding explores the possibilities of experimental musical notation using colour as the primary visual element. Through a series of experiments that range from analogue input to generative code, speculative forms of musical notation are created that push the boundaries of traditional score design. This project illustrates a series of outcomes that may offer a new way for musicians, composers or even the average person to read music.

Outcomes from the generative experiments on p5.js were compiled and re-intepreted by a musician. The final piece is a contemporary approach to music making/intepretation.





Colour Coding represents an innovative and thought-provoking exploration of the symbiotic relationship between colour and experimental musical notation. The project endeavours to forge uncharted territory within musical composition and visualisation by delving into various methodologies encompassing analogue design inputs and generative code. This unique endeavour challenges the conventional paradigms of traditional score design, breathing fresh air into an age-old practice.

At its core, the project seeks to harness the evocative power of colour as a primary vehicle for conveying intricate musical nuances. The project exemplifies a harmonious convergence of these two domains in an era where artistic expression is increasingly intertwined with technological capabilities. The project starts with implementing Adobe Illustrator to transcribe music and transitions towards using the sound constructor on p5.js to engender a mesmerising tapestry of vibrant patterns that transcend the boundaries of auditory and visual senses.What sets this project apart is the melding of computational prowess with human artistry. The transformation of these visually captivating patterns into musical notations by a skilled musician injects an element of subjective interpretation, infusing the final piece with an organic, human touch. This synergistic fusion of technology and musical expertise bestows a multi-dimensional quality upon the project's outcome, enriching it with layers of complexity and depth.

In a broader context, Colour Coding can revolutionise how musicians, composers, and enthusiasts engage with and comprehend music. By redefining the syntax of musical notation, it paves the way for novel avenues of interaction and engagement, democratising access to musical appreciation and creation. As the project's final piece comes to fruition, it tantalisingly hints at the limitless possibilities that lie at the crossroads of art, technology, and innovation.




P5.Amplitude PostersSeries of posters depicting audio translations in the form of circular shapes printed across the canvas. Using the audio input and ‘Amplitude’ sound constructor on p5.js, these shapes together with how it is coloured are printed according to the soundwaves of any music or sound transmitted!



Vibrant patterns as music notations
Series of posters
Series of posters illustrating various ways code can determine the complexity and details of music making. Created on p5.js, the vibrant patterns are developed according to the soundwaves of any music or sound transmitted! Layout and colour range were also tested in the series to challenge how we can comprehend colours and modular patterns as musical notations!
Prev