Mondrian Sequencer

Ryan Monro

Every time I see Piet Mondrian's art I think to myself, "Hey, somebody should make a sequencer or drum machine that looks like that." Then in mid-2018 it occurred to me that I should make one. After six months of thinking about it I hammered this together with React and ToneJS.

Installation

If you want to run this locally:

1. Install Node
2. You'll probably need nvm too
3. Clone this repo (the green 'Clone or Download' button)
4. Go to the mondrian directory
5. npm install to install the packages
6. npm start to start the development server

Or you could check out the...

Live Demo

Have a listen here. You'll need headphones to hear the lowest notes.

Instructions

• the sequencer plays from left to right
• each row represents an octave
• more rows can be added or subtracted with the edge buttons at the top and bottom, or by swiping vertically on mobile
• each row contains a number of tiles
• tile width determines note length
• tile colour determines the pitch
• a white tile plays a rest
• tiles can be added or subtracted from rows using the edge buttons at the left and right of each row, or by swiping left and right on mobile
• the board can be randomised at any time with the randomise button
• auto mode is enabled by default, and randomises the whole board every 4 bars
• using the edge buttons you can create sequences that wouldn't be generated by the app randomly

Musical Notes

In most of his geometric works from 1919-1921 Mondrian used five colours – red, yellow, blue, grey and black – plus white. That was a clear sign to me that I should use a pentatonic scale, which was fortunate because it's pretty hard to play something that doesn't sound good with that scale. Most of Mondrian's works from this period also have consistent vertical lines through the whole piece, which in this app would result in the subdivisions being the same for all the octaves. I was too excited to hear random 5-against-4 to stick to that restriction, though, so each row can have two, three, four, five, six or eight notes. I left seven out because 7-against-anything tends to sound like something went wrong with the timing. As for the synth sounds, pure sine waves is what I started with, and every time I tried a different sound I just didn't like it as much. So for now it's still sine waves all the way down.

This project was bootstrapped with Create React App.