(Here’s the .swf version.) There was a lot of nice feedback. Random people would spot it and exclaim, “That’s awesome!”
Things I learned from this experience:
Keep it obvious. The tiny bright spot in the corner of the video is an LED sign displaying a phone number. Anyone who called was treated to this soundscape:
Guess how many people called? … Zero! By my estimation, the typical art-walker gazed at the Math+Heart graphics for a few seconds, hardly enough time to notice the tiny phone number.
A different approach would be a phone-centric interactive, such as Mall of America: A Toll Free Audio Exhibition. Their phone number is displayed in massive yellow lettering! The back-end could be developed with Twilio, or a similar group that provides interactive phone service.
Don’t expect 60 FPS from Flash’s display list. Ultimately, I did achieve 60 FPS on one of my computers (with the occasional dropped frame, alas) but I invested an unhappy amount of time, fiddling & optimizing, to reach that point. (Flash’s OpenGL graphics, a.k.a. Stage3D, are more performant. But I didn’t attempt this, for fear of texture memory issues.)
Motion design tips. The mathematical glyphs are essentially large particles, which enter at random speeds. This “swarm” felt best when the random speeds ranged between 50% and 100% of some maximum value. Any ranges wider than 50% broke the cohesive effect, and felt sloppy.
I experimented with randomizing the easing equations, for instance the rotation could twist at either an exponential or quartic rate. This was surprisingly frustrating to watch. The glyphs behave almost like a unified fluid, so it hurts when they move according to different rules.
Also bad: Using different tween times & delays for the four properties: X, Y, scale, and rotation. I tried using tweens to look like a phantom hand was hurriedly slapping the glyphs down on the canvas. This felt weaker than the smooth, unified motion that was used in the final version.
To achieve movement that was both organic and emotive, I could have tried filming myself acting out the motion with slips of paper, then traced that motion. (Or developed rules to mimic that motion. It could work! Maybe!)
Simple variations can be very effective. The space packing algorithm has two modes. It switches between packing space that’s visible on the screen, and packing a larger space including a region below the bottom edge. When it switches to the second mode, it suddenly has a tall, uncluttered space to fill. The result is a texture that constantly varies between tight square-shaped glyphs, and taller ones. The contrasting modes look good!