(Make sure you have good headphones/speakers -- the more you stay with the sound, the more layers you will notice)
And read the section on keyboard controls below if you want to play with it yourself (also available by pressing '
In the browser we functionally generate a Cantor Set fractal. With the final iteration we create a wavetable and load it into a web audio AudioBufferSourceNode, sonifying the fractal.
We have 8 buffer nodes, allowing us to play multiple fractals at once, leading to interesting iterations between sequences. The buffers for each node can be updated with new fractals while playing, so there are no gaps in the playback, and the buffers stay in phase.
Our Cantor set algorithm is slightly more flexible than the traditional one, as rather than completely removing sections, we attenuate them, which means we can generate richer sounds. The number of segments and iterations we can have is unlimited, but our interfaces (both GUI and hardware) only provides control for up to 8 segments, and we've found that with this many it becomes too expensive to generate more than 15 or so iterations.
For a pattern of “1, 0.5, 1” the first three iterations are like so:
1.0 1.0 0.5 1.0 1.0 0.5 1.0 0.5 0.25 0.5 1.0 0.5 1.0
- Web Audio API
- Web MIDI
- HTML5 Canvas
- Brunch build system
And for extra fun: a Novation Launchpad and a Novation Launchcontrol XL.
First, install node.js. If you're on OSX and use brew
you can install with
brew install node.
git clone https://github.com/AVUIs/cantor-dust.git # Clone the project cd cantor-dust # Enter the project directory npm install # Download required node modules
npm start # And then navigate to http://localhost:3333/
You can try out a development version of Cantor Dust at avuis.github.io/cantor-dust.
Note that this is untested on anything other than recent Chrome and Firefox browsers, so YMMV.
And make sure you first have a look at the section on keyboard controls below.
1-8 Focus on the nth fractal generator down/up Alternatively, shift the focus with the cursor keys j/k ... or with VI keys
All operations below effect the focused generator.
Additionally, for those marked with (A) or (S):
- (A): pressing the Alt key applies this operation to all the generators except the focused one.
- (S): Pressing the Shift key applies this operation to ALL generators.
q/a Increase/Decrease the value of the first pattern slice w/s Increase/Decrease the value of the second pattern slice e/d Increase/Decrease the value of the third pattern slice r/f Increase/Decrease the value of the forth pattern slice x Reset all pattern slices c Copy the focused pattern v Paste the copied pattern i Invert the focused pattern [ Decrease the number of iterations (min: 1) ] Increase the number of iterations (max: 8) , Decrease the playrate (by 1/sqrt(2)) (A), (S) . Increase the playrate (by sqrt(2)) (A), (S) m Reset the playrate to 1/8 (A), (S) p Reset the phase to 0 (A), (S) - Decrease the volume (A), (S) = Increase the volume (A), (S) 0 Toggle mute (A), (S) l Toggle scanline on/off (S) Shift-\ Cycle between visual themes Shift-s Save overall state to URL (to copy, share, revisit, etc)
There are in fact two working audio engines in the current implementation: the original based on native webaudio, and a new one based on gibberish.js.
The original implementation doesn't support playback position reporting (ie no scanning lines) and can only run on google chrome because of the way it is implemented. However, it produces the better sound.
The implementation based on gibberish.js runs on multiple browsers and provides playback position feedback. However, the sound quality needs more work.
You can try them both:
- Solarized by Ethan Schoonover
- Pantone - Color of the Year, (2000-2015) by Pantone
- 20th Century Color Palettes by Decade by THagler
Copyright © 2015 Louis Pilfold and Berkan Eskikaya. All Rights Reserved.
Licence yet to be decided upon. If you are interested in using or working on this project, please open an issue requesting that we pick a licence. :)