Form follows Music: The Bach-Project

Published by Tim on Tuesday September 20, 2022

Last modified on January 25th, 2024 at 14:06

It was Christmas 2010 or 2011 (i don’t remember it exactly), when I was visiting the family of my then girlfriend. They were all highly musical: her grandfather was active as a music composer and her grandmother had written and published several educational books about playing the lyre. One evening we were all sitting together in the living room by the fireplace and they wanted to play a piece by Johann Sebastian Bach (a chorale called “Jesu, Joy of Man’s Desiring”, BWV Cantata 147 ) on the piano and lyre. I hadn’t thought anything of it at all, but when they started playing, my breath caught in my throat. I had heard and played a lot of beautiful music in my life: I was mainly interested in electronic music and jazz. But this piece in this situation pushed me into the armchair and immediately made me freeze in a melancholic feeling of humility to face the magnificence of the world. I had never heard or experienced anything like it, and at that moment I decided to learn music by Johann Sebastian Bach on the piano.

I did some research on how best to approach the subject and quickly learned that the no less beautiful piano piece “Prelude in C” (BWV 846) is very popular with beginners. It is one of the best known pieces of music ever. In the city library in Münster, where I was studying at the time, there was not only an overwhelming selection of music books, but also a small theater hall with a grand piano on the stage, which could be rented for 3 euros per hour for practicing. I spent many hours there over a long period of time trying to play the piece.

Me, trying to play the Prelude in C (2013)

I never became a very good pianist. I lacked patience and the leisure to learn the notation. Looking back, though, I know that wasn’t the point for me either. I was interested in the way Bach had composed and which weaving patterns were found in this music. and how they worked. So in 2010 I developed a small book project in which I attempted to visualize the musical structures of the Preulude in C with shapes and colors, which I find quite difficult to do with manual means. It was to take a few more years until I had the right tool at hand in 2018, after I had intensively studied Creative Coding and Processing.

On a website I found the MIDI notes of the piece and shortly thereafter a converter tool with which I could turn the notes into a tidy data set of numbers. Here I have to mention that the exciting thing about the prelude in C is that its linear and monophonic characteristics make it ideal for storing in a simple array, or list, rather than requiring extensive conversion and manipulation. The data became the basis of a series of experiments that I published on my website and on social media, however the project soon disappeared back into the drawer until 2022, when I had the idea to design a workshop on the subject.

In September, I was able to test the format for the first time with a diverse group of art students, software developers and hobbyists. Since they were mostly beginners in creative coding, almost all of them had never worked with Processing before, the results were archaic and rudimentary, yet they appeared magical and mysterious. Why? Because the generative forms express something concrete, something very emotional. Generative design allows abstract data to be transformed into images, animations, and even objects, which in some way are inherent to Bach’s music. Even if the music is not immediately recognizable in the results, they are representatives of Bach’s beautiful, spherical music.

Seen in this light, a piece of Bach’s music can be used in many different ways. It can create artwork of any form, or patterns that can be part of a visual identity in graphic design or part of an architecture. The enormous range of possibilities is simply amazing.

Over the last few months I have developed an online course on this subject, in which I have tried to explain the specific principles of music visualization of Bach’s Prelude as clearly and simply as possible. Using a few examples, I show how to distribute and arrange the data in your sketch, and then assign visual parameters to them.

The release of the course is planned for the beginning of October 2022.

I’ve realized that Bach’s music is enwrought with cryptic patterns and mathematical equotations. How would these patterns look like, if i could visualize them? That was the initial question that has persuaded me to begin “The Bach-Project”, an exploration of visual structures in music.

The “Prelude in C” is a sequence of 545 notes, condensed to 34 bars with 16 notes each. All notes get played in a arpeggio-like, regular rhythm. This special structure qualifies the piece to be displayed in a two-dimensional grid where each cell represents one note.

Here i applied a shade of grey to each note in the C-Major-scale, beginning with white for the C and closing with black for the B.

I really liked the simple idea of developing visual equivalents to the musical data. I’ve experimented with pitch-controlled rotations, randomness and complex shapes.


A growing list of Tools for Graphic Design, built with Processing or p5.js

Hi! In this post I’ll collect case studies and direct links to tools that people have built with p5.js and […]

The 128kb Framework and its Aesthetic Characteristics

One day in early 2024 I started to experiment with a new idea. I wrote down a set of rules […]

Lena Weber about her collaboration with A. G. Cook

Lena: This 10-minute visualiser for A. G. Cooks album teaser featuring my python archive generator, is one of my favourite […]

My new writing project “downgrade” is live

Hey folks, I hope you are doing great! You may have already read one or two of my essays that […]

Join the 128kb challenge!

Instagram, Twitter, TikTok… All the main platforms that technically have the required features to connect emerging communies for Creative Coding […]

Computer Cursive by Tay Papon Punyahotra

One of the first exercises I assign to my students in my seminars is called “Random Compositions”. Basically, it’s quite […]

A custom Mockup Tool, built with Processing (updated)

For my students at Elisava, I have created a new version of my mockup-tool. You need two different files for […]

Preview: When Computers create Collages

2023-12-01 Today I want to share with you a first prototype that will be the basis for a new course […]