Demo: http://thomastai.com/markovchain/
Introduction
For this week’s project, we were asked to create a project that explored aspects of rhythm. Since we had been exploring Markov chains in class, I decided to create an interactive experience around it. I wanted to create a natural interface that could allow the user to change the probabilities of notes in real time. Notes and probabilities are represented as a graph, with directed edges with probabilities and vertices with sound file names. I created a version with drums and violin just to hear what it would sound like.
Implementation
While I had first thought about using p5.js, I quickly switched to a different library for data visualization. I found a javascript library called vis.js which allows me to create interactive graphs. However, the type of data structure that Tone.JS uses is different from the one that vis.js uses, so I had to create code that could convert the object with nested dictionaries into two separate arrays for nodes and edges. I also added a play and pause button as a workaround for audiocontext blocking the initial call on some devices. While the concept is easy, coding it was more challenging than I expected. There are some issues that need to be fixed, such as probabilities not summing up to one and the tone.js loop randomly stopping every once in a while. If I were to work on it in the future, I would add images, make it more aesthetically pleasing, and add more sound files.
Video