Epitrochoids in ClojureScript
I started reading a book called Generative Art a few weeks ago. One of the very first exercises is to draw the points on a circle using trig functions instead of a higher-level “draw circle” function. You then randomize the input values as you plot the circle in order to make the artwork more interesting.
The resulting picture immediately reminded me of my favorite After Dark screen saver module – Rose, by Ben Haller. Rose drew images that felt natural and predictable, but with just enough randomness to keep your interest piqued. I found that to be a great combination for tricking your brain into paying attention to something else when what you really wanted it to do was solve some complex problem for you.
Jack Eastman, the original creator of After Dark, said something similar in an interview he did a few years ago:
I had done Monte Carlo simulations in my physics work and knew how to produce random numbers in various distributions. I think that was an important idea – we had these little movies, but you couldn’t predict them. … With After Dark you could just zone out and watch for a long time.
I always wanted to understand how Rose worked and I could tell that this drawing-circles-with-trig-functions thing was very close to the mark. Next step: ClojureScript, a little bit of math, and lots of experimentation.
But first…
Maybe you like to have dessert first, or maybe I need to break up this wall of text. Either way I think that I should jump to the end and let you play with my interactive epitrochoid demo:
That’s not exactly like Rose, but at least we’re in the same family. The biggest missing piece is the slow randomization of input values that make Rose so interesting. Playing with the settings manually is still fun though, especially the number of points! I continue to be surprised by how many variations you can get out of the same R, r, and d values.
Have you clicked on that “Show Wireframe” button yet? If not, click away and then let’s talk about epitrochoids…
Epiwhatnow?
I knew from working through the exercises in Generative Art that applying periodic mutations to the parametric equation for a circle would get me closer to Rose, but I couldn’t figure out the right mutations and/or web searches in order to tie everything together.
That was when I decided to track down the original author of Rose, Ben Haller. Ben was very helpful and responded right away with some tips. He pointed me at the concept of Ptolemaic epicycles which then led to an article on epicycloids. The diagrams on that Wikipedia page looked very close to what I was trying to achieve. A note on the page mentions that epicycloids are a subset of epitrochoids, so to cover all of the bases I figured that I would implement an epitrochoid generator.
As you may have discovered by playing with the settings of the generator, an epitrochoid is produced by rolling one circle around the circumference of another (fixed) circle. You extend a radial from the center of the rolling circle and plot the points traversed by the terminus of the radial. Wolfram MathWorld has a page on epitrochoids that shows the continuous series of points that are produced by an epitrochoid.
I don’t remember Rose drawing lines though, so I chose to draw a fixed number of points and then advance those points around the epitrochoid over time. The “RPM” setting controls how quickly the rolling circle orbits the fixed circle and effectively controls the speed at which each individual point moves along the epitrochoid.
From Processing to ClojureScript
The examples in Generative Art are in the Processing programming language, which I installed and played with in order to focus on the art and not the programming. Processing is obviously very powerful, but it is overkill for drawing circles and I was spending most of my time translating my knowledge of other programming languages into Processing. Ironically my lack of familiarity with Processing was forcing me to focus on the programming instead of the art, so I decided to switch to a language that I had (slightly!) more familiarity with – Clojure.
I also wanted the result of this project to be easy to share and easy for other people to interact with. Doing something with the HTML5 Canvas element seemed like the way to go and would also give me a chance to play with ClojureScript. The result is this web page, which should work on a wide variety of (modern) devices.
ClojureScript turned out to be the perfect choice for this project. I was able to throw things together quickly and see the results immediately. That experience kept me excited about the project and ultimately allowed me to evolve my prototype into a lightweight framework for building interactive artwork. Probably the part that I am most proud of is the work that I did to grow and modify the entire (browser-based!) program from the REPL without ever having to reload the web page.
I plan to publish a series of articles that dive into my interactive art framework, mondrian, as well as the conventions that I have settled on for non-stop, reload-free development of ClojureScript applications. Expect to see both articles within the next few days. In the meantime, feel free to read ahead by exploring the GitHub repository for mondrian (the framework) and La vie en cloj (the mondrian-based epitrochoid generator). Both repositories will probably make a bit more sense if you wait for the next article though.
Finally, I hope you enjoy playing with the epitrochoid generator as much as I have. There is something hypnotic about the patterns that it produces and, just like with Rose, I find that staring at them helps with even the toughest programming problems. :)