Emacs is designed for fast, highly customisable manipulation of text. ASCII animation requires manipulating text at a sufficient speed that it appears animated. Emacs is also used by a number of performers to live code musical & visual performances (and many other things). Where the audience can see the code in emacs and hear it.
In my live coding performances as Repl Electric I’ve used emacs animations to augment emacs with more feedback for the performer and a chance to destroy the order and structure the programmer has spent the entire performance building. Reminding us that we are looking at thoughts expressed through code that seem magical but are ultimately nothing more than text.
Maybe something akin to the creation and destruction of Sand Mandalas.
Framework for Emacs Animation
Zone Mode is an Emacs plugin which provides a framework for screensaver like animations.
Importantly it allows us to turn on an animation using our current code buffer as input and to terminate the animation, returning to the original code on a key press. So we can safely mangle the text knowing we can also return to safety. Well so far I’ve always found it to be safe but there is a small risk as mentioned in the zoning warning:
A nice property of taking our buffer as input is we are never quite sure what text will be there and hence the properties of the animation.
Example: Uppercase all letters
A simple function that finds non-whitespace in the buffer and tries to uppercase the char. It knows nothing about the zoning framework, its just a plain old function that operates on the active buffer.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22
The animation in all its glory:
We can override all other zoning programs and just specify our zone-fn. When we activate zoning our animation will be run.
1 2 3
Zoning mode comes with lots of example animations that are good starting points:
Open Sound Control Protocol Based animation
OSC is a handy protocol for sending data between networked devices using url like endpoints. Emacs has a plugin to run an OSC server (http://delysid.org/emacs/osc.html). Hence if we have some kind of beat signal we could send a message to Emacs and in turn it could render changes based on our musics timing.
With my Overtone setup for Repl-Electric I have the following flow of OSC messages:
Within Emacs setup an OSC server and define two call backs which change the color of the window face number
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40
In Overtone/Clojure the sending signal:
Heres a little demo with the brackets and window number changing colour based on the Overtone beat.
Which means our emacs animations can start to change to the beat of the music…
Sound in ASCII
Now that we have ways to animate and to connect audio data with emacs we can go a little further (way too far) and start to visualise the data about our sound in ASCII.
From Overtone or SuperCollider we can create a synth which tracks the peak and power of an audio signal. It sends us messages back with the data which we then forward on as OSC messages to Emacs.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22
And in our emacs OSC server:
1 2 3 4 5 6 7 8 9
Repl Electric Emacs animations
All my Emacs animations are used to conclude the performance. Heres lies the source code, some screenshots and tricks & tips that made the animations possible.
Here’s a demo of all the Repl Electric animations discussed in action:
End of Buffer
In this animations the text gets slowly broken up with white spaces and then like the wind, blows the characters away. Sometimes words are ripped apart as they blow in the wind (if we get lucky).
Two main phases:
Injection of spaces. This starts to distort the text while keeping it readable. It provides a way to increase the effect of expanding whitespace in the next stage.
Transforming whitespace into lots of whitespace. A Regex matches whitespace and replaces it with a randomly increasing amount of whitespace. Which leads to the effect of the characters of the code blowing away. I spent a while trying to improve the speed of this phase and Regexs proved to be the fastest way.
If we move the text fast enough soft word wrapping means the text appears to re-enter from the left side of the screen and eventually disappear out of the buffer. Without soft wrapping we get a horrible jitter as emacs moves back and forth between left and right side of the buffer.
A couple of other tricks/tactics used:
- Continually incrementing integer. Useful for injecting movement or using sin/cos fn with a continuous value.
- Perserving the syntax highlighting of the original code in an attempt to maintain some of the meaning of the code.
This was my first animation and was based heavily on
It randomly picks a single character and moves it down the screen until it hits another letter or exits the screen.
When running Emacs + Overtone + OpenGL, Emacs starts to slow down so part of the challenge was ensuring the animation ran as fast as possible.
A nice property of this is that as the OpenGL shaders shutdown, the speed of the animation increases and the code destroys itself more quickly.
This animations attempts to simulate the effect of waves using line wrapping and mixing deletions with insertions of different sizes to create lines that seem to move at different speeds.
While it may seem silly to bend Emacs to do things it was never intended to do, it’s an important part of discovering for yourself how you want your tools to work. Not just doing what you are expected but breaking them apart and discovering for yourself how you want to use them.