What’s that sound?


For my final MA project I‘ve been exploring creative coding as a way to push the boundaries of traditional poster design. The result is an audio-reactive poster campaign that promotes Bristol’s sonic identity and draws attention to noise pollution.

The campaign consists of posters in different screen formats, all built using javascript, which are responding to live audio input. Through this interactive approach, soundscapes become the driving factor of the design. Thus, the very essence of the concept emerges visually. A website, which can be accessed by scanning the integrated QR code on the posters, provides further background information.
Sound is a fundamental part of our cities. It contributes to the vibrancy and urban identity of a place, as well as the health and wellbeing of its citizen. Unfortunately, sound is often overlooked or simply overshadowed by noise. Soundscapes need to get more attention, in order to tackle the problem of urban noise pollution. Only the appreciation of the acoustic environment can give us the resources to improve the orchestration of urban soundscapes.

Without any sound, the poster’s key visual is constantly circulating around the canvas. The incoming audio signal affects the position of each ellipse and pushes each element into a grid across the canvas. When the audio input stops, the ellipses bounce back and continue rotating.

The concept of the visuals is based on the fragile appearance of soundscapes. The black ellipses are constantly changing and moving, which makes every frame and iteration unique. It plays with the idea that soundscapes are also dynamic experiences. Every sound is appearing in the moment and can disappear every second, and so are the moving elements.

The colour palette used for posters, website, and other assets, is inspired by the colours of Bristol itself. Because the camapign is specifically designed for Bristol, it was important for me to pick colours, which are reflecting the urban identity and are part of the cityscape.

Audio-reactive poster campaign
Creative Coding (P5.js)
Final MA Project, Graphic Arts
Concept and Execution: Sophia Link