Generative works from Keith Peters, on his new Art from Code site.

As code literacy improves and coding tools like Processing and Flash make it easier to produce stunning visual results, the line between the coder/hacker and digital artist, and more conventional artists, is blurring fast. The next trend: networks and blogs on which people share not just their work, but the code behind it. The idea is old, but there’s no question the breadth of content and number of participants is expanding – and beginners are welcome, too.

The Flash Virtuoso, and Galleries vs. Code Repositories

Isometric waves, via Keith’s Flickr.

Keith Peters, aka BIT-101, has been instrumental in the Flash community in advocating digital art and animation. His books are clearly written and intuitive to non-programmers — despite their Flash basis, I’ve found them useful for my Processing experiments, too. And Keith has been busy of late. He’s got a second installment coming for his wonderful Making Things Move book, inspiring his isometric experiments pictured here, and he’s also launched a new site called “Art from Code.” (Various permutations of this theme come up regularly.)

I owe a huge debt to Keith, as I got into generative coding entirely through his books, before later going on to discover Processing.

Interestingly, the relationship between code and art is an imperfect one. Just open sourcing the code isn’t always practical. In a way, though, that makes the code even more beautiful — and sometimes sharing visual results can be just as interesting as sharing code. (It forces us to go back and try to reproduce the results, then get it all wrong, and wind up producing something original, often as a result of mistakes!)

Keith writes on his blog:

I want this site to be more about the images than an open source code repository. Not that I’m against sharing the code, but I don’t want that to be the focus here.

Two is that the code that has created most of the images here is ephemeral. I open up Flash or Flex Builder, start messing around, take some screen shots when something looks good, keep messing around and before long the code that resulted in the first image is long gone, having morphed into something else entirely. I may even leave it off in a completely broken state, or in some cases, if I’m working in Flash, I never even end up saving the FLA with the code in it. So 99% of the time, sharing the code that created image X is impossible.

Also, interestingly, Keith notes he often works with code directly on the timeline — something that’s not possible in Processing. (I’m personally guilty of making various unfair comparisons between Processing and Flash; the bottom line is, you might as well compare watercolor and oil paint. It doesn’t matter. They’re different. And I love that Keith works totally differently from the way I do.)

Keith does, however, promise some new graphics classes, and I’ll be very eager to translate them to the world of Processing, perhaps — again — imperfectly, resulting in something else. I’ll be watching and will let you know when there’s some code to go with the art.

The Open Processing Gallery, with Code

If “Art from Code” is intended as a gallery first, rather than a code repository, OpenProcessing is both, simultaneously. OpenProcessing is the work of Sinan Ascioglu, an NYU ITP student (I believe he has other contributors, as well). Sinan has also built OpenVisuals, a site dedicated to easily visualizing data in a consistent way, also using Processing:


OpenProcessing is a basic gallery with code for Processing sketches of all kinds. OpenVisuals goes one step further, providing a framework for data visualization — thus, it’s not only a gallery, but a platform on which you can quickly see the results of turning data into something onscreen. Because Processing sketches can be easily exported as embedded applets, you can immediately see live, real-time results on the webpage, while comparing the open-sourced code that makes it function.

With a variety of people contributing, part of the joy is seeing the range of expression, not just from experienced coders but newcomers, as well. It’s also encouraging to see there’s embed capabilities, so you could embed the uploaded results onto a blog entry or forum post.

For a similar framework for data visualization for Flash — though without the accompanying online community — see the open source Flare library. (Flash is not truly open source, but work can be done in Flash that is, of course.)

IBM Visual Communication Lab’s ManyEyes is a similar community built on working with data visualization, and makes some use of Flare. (It’s also a great data source for Processing projects and the like!) And for six degrees of Create Digital Motion, one of the team at IBM is Jesse Kriss, who built Processing-Max communications conduit MaxLink.

OpenCode, the Web Browser as IDE

Embedding applets and text code is one thing. Turning your browser into a live development environment is another. OpenCode takes the online gallery – code repository – community to its extreme conclusion, by allowing you to edit and run code live without leaving your browser. (Yes, that’s right — just in case you can’t be bothered to copy and paste into a Processing window.) With enough abstraction behind the scenes, it could eventually be made friendly to non-coders, too. Like OpenProcessing and OpenVisuals, the tool is built on the friendly, elegant, and lightweight Processing platform.


It’s a fascinating idea, and impressively, it works quite well. It could be just the beginning of what’s possible – imagine people wanting to work with data being able to use a couple of lines of live code, making modifications right in their browser, while libraries installed on the server abstract all the other functions behind the scenes. (And yes, Java-based libraries do work.)

Of course, cool as that is, somewhere along the line I think we actually lose some of what Keith (and others, like our visualist hero Robert Hodgin) have done. Wonderful as it is to be able to share code, it’s really the visuals that are themselves the payoff. I’d love to see visuals first, code second instead of the other way around.

OpenCode is in pre-alpha state, the work of Kyle Buza and Takashi Okamoto at the MIT Media Lab. I love their tagline – “This is so alpha, you won’t even want to use it™.” So consider it a work in progress. (I met Kyle and Takashi in Boston earlier this year; very nice, talented guys! Kyle earns extra points as the creator of chiptune externals for Max.)

Perhaps the MIT and NYU projects will meet somewhere in between. I propose a conference somewhere on the Amtrak route between the two cities — Mystic, Connecticut, perhaps?

What’s Next?

Flash and Processing are really ideal for these applications, because of their accessibility, and the fact that they can run online and produce immediate visual results. But, powerful as I think data visualization can be, I don’t think the future of this is limited to infographics. The superset is clearly art. And the networks like those above are only likely to multiply and grow.

So, artists, what would your ideal community look like? What sorts of sharing features would you want in a tool like Processing, or on the online side? Or is there a point where you actually don’t want to see / share code, preferring to focus on the actual artistic result?

  • Pingback: links for 2008-08-18 « Jay’s blog()

  • Moses

    I studied painting and programming. Those who want to combine the two need to study both. There seems to be a lack of interest from programmers in going through the basic drawing, color and painting training. It shows.

  • I don't know that that's necessarily true. I think code is its own medium, as paint or drawing and sculpture. I absolutely agree that you benefit from coming from that background — but a lot of people doing code work now *do* come from a fine arts background. If *that* doesn't show, it's likely because it can take some time to wrap your head around code as a medium.

    Also, on the digital music side, we have people coming from very different backgrounds, too — from a classical music background to people who came up in tech. I think having that range of backgrounds is perfectly okay. That's not devaluing the traditional training at all — on the contrary, I think it's incredibly valuable — just that there are many, many ways of combining trainings.

  • juno

    i don't think these is art( what is art in this moment) is more like visual puzzles

    maybe it can be use in advertising or maybe can be integrated in an art project if it will have an ideea or a concept but now most of these codes are just generative drawing

    you forgot to mention nodebox and openframeworks

  • mgers

    Nodebox and OpenFrameworks aren't mentioned because they don't have the same relationship to the browser that Flash and Processing (Java) do, which is the whole point.

    I'm excited to see these types of discussions being put out in the open. Experiencing algorithmic art in a highly shareable and malleable context that the browser provides is only going to get better and more exciting. This is just the beginning of something much larger.

  • Well, in fairness, you could have an online gallery of OpenFrameworks on Nodebox stuff in this way (though I don't think one like this currently exists) — that is, you don't *have* to have the actual applets visible in the browser, though it certainly does help!

    But yes, indeed, the major advantage of Java and Flash as platforms is Web delivery, which makes sharing more immediate.

  • moses, maybe you havent visited recently… oh they do, they do.

  • Pingback: Create Digital Music » Sound Design Recipes, in Blog Form()

  • Hey Everyone,

    Thanks for mentioning OpenProcessing and OpenVisuals. Seeing your feedback shows me that I am on the right path on these two projects. I just wanted to give you a status info, so that you might want to give me some directions on the issues that I am having.
    The big issue is, it is just me working on these projects, and I cannot find time lately to improve OpenProcessing (not even mentioning OpenVisuals..) Just some personal issues (apartment and job hunt in NYC), but I am hoping to make the improvements right after I can settle down. I can definitely see a great use of OpenProcessing, especially in academia. I have many improvements on my mind. So I would love to hear if there would be anyone interested in helping me or giving me feedback on some parts of the website.
    OpenVisuals was a good idea, but sadly I saw that it takes much more effort to gather people under visualization concept. The idea was to get visualization developers together, and make their viz works working with any dataset. Functionality is there, however there are two issues that I had; First is that there are only little number of processing-visualization people to make such a thing happen. Second is the way we approach visualizations; when we create a visualization, we think data-specific. Creating a visualization that would not be data specific (kind of old Excel charts, which would work with most kind of data) is not the idea behind those great infoviz stuff we see lately.

    So, in short, OpenVisuals is kind of suspended for now, and OpenProcessing will be there, and be improved, as soon as I find time and help on this project.

  • For data visualization geeks in the house… The New York Times has just opened its Visualization Lab:


  • Software is just another blank piece of paper. I love the idea of building models or motion sculptures restrained by some rules that can be defined by a user and then letting them go and see what happens. I find that the action is often more exciting than the final result. I love mobiles and how they fluctuate from order to disorder. I think that is sort of what I was trying to capture in addition to simple pleasure with the Flash based toys and gallery pieces:

    Have fun!

  • Pingback: 8oinks — Blog — Open Processing and sharing()