This is a quick little audio visualizer I put together with Processing and the ESS Sound Library. The audio spectrum is analyzed with an FFT and spectrum bands are plotted as vertical bars. The Waveform is drawn over the bars in white, adding a lot of interest to the image. To create the fading effect of the object a transparent, white rectangle is drawn over the whole sketch instead of using a background. Previous frames are left on the screen and are slowly covered up by white.
To create an interesting color scheme each bar is colored based on its own height and its neighbors. Combined with the overlapping shapes a broad range of tones and hues is created.

I’ve been working for a while on this project with Stem Cell Resources for the new cell exhibit at the Maryland Science Center. The exhibition, including the Stem Cell Map and some other fun interactive works, opened yesterday and was received very well. If you’re in Baltimore its worth checking out. Developing this project has a been a great opportunity to do some great educational work with some great people. I enjoy being able to maintain a connection with the sciences despite focusing myself on art, and I always love creating data visualizations.
The Map is scripted in Actionscript 3 and takes all the data from an xml file exported from a spreadsheet making it easy to update. The research is broken down into three categories and each location is colored accordingly and scaled based on the number of facilities. It’s displayed on a large touchscreen in the exhibit and will also soon be online.

Most of the time I have been dedicating to working with Processing has recently been taken up by a larger project. It’s been very exciting for me, but less conducive to blogging both because it’s a larger project, and because I’ve been doing a lot of learning for the project. The piece is an interactive map for an upcoming exhibit for the Maryland Science Center and will be on a large touchscreen. It’s a great project for me as I love data visualization and science.
The application is scripted in Action Script 3. I was originally thinking of using Processing, but I wasn’t happy with how it was handling some things i needed it to do. So far I’m very happy with the choice. Flash is quite a tough beast to work with but I’m impressed with how quickly it parses the sizeable xml file with all the data and also how smoothly it renders all the graphics. I’ve also had to do quite a bit of learning about xml. With a bit of work I have the flash file reading xml directly exported from a spreadsheet editor, making it very easy to be updated.
I’ll write more when the project is finished. I still have to do some work building the interface and making the interaction a little more fluid. The applet will also be available online as well as in the exhibit. For now here are a few images of other visualization methods I’ve been playing with.


The next step in my Wikipedia project is to create a static map of the entire site (more than 2.5 million pages). I’m not entirely sure how large the image will be, but judging by small scale renders the vector file should be no more than a two or three hundred megabytes. This is huge, but to be honest not as large as I expected. I’m building a new script which will not render any of the pages on the screen and will run autonomously, first getting the data, then organizing it, modifying placement to prevent overlapping text, and finally exporting a PDF file. Hopefully I can build the script to sacrifice time for a lack of power so I can use computers currently available to me.
WikiWeb is a piece created in Processing which creates a live, interactive visualization of Wikipedia. I’ve rescripted aspects of the code to make it run a little better and also added a better user interface, hopefully making it easier to use. The new version includes a toolbar of possible actions and a help and reset button. Any feedback on the changes or the project in general is very much appreciated.

I’ve been working for a while on a project I have named WikiWeb. Coding in Processing I built a program which generates a live, interactive visualization of Wikipedia. The applet works by downloading the source code for each page. The html is passed through a function which detects all the internal links and creates a new object for each. It also creates new link objects connecting the new pages with their parent and for any other pages which are linked. The applet also opens up pages in a new window, making it functional as well as fun.
I’ve built a site to house the project with some more information, however this post will serve as an area for comments about the project. The site employs spry JavaScript framework for some smooth effects.
proudly powered by wordpress v2.8 & jquery javascript library.
View all resources in the colophon.
website & all work creative commons by-nc anthony mattox (2007-09)
pragmatically validated xhtml 1.0 transitional & css thanks w3c