Processing

posted 02/13/08 by Rick Webb

We love Processing. What is Processing? Let’s ask Wikipedia:
Processing is an open source project initiated by C.E.B Reas and Benjamin Fry, formerly of the Aesthetics and Computation Group at the MIT Media Lab. It is “a programming language and integrated development environment (IDE) built for the electronic arts and visual design communities”, which aims to teach the basics of computer programming in a visual context, and to serve as the foundation for electronic sketchbooks. One of the stated aims of Processing is to act as a tool to get non-programmers started with programming, through the instant gratification of visual feedback. It is a language that builds on the graphical side of the Java programming language, simplifying features and creating a few new ones.[1]
Robert began experimenting with Processing nearly at the beginning, what with MIT being across the river from us and all. Okay, maybe not the very beginning. Details are fuzzy in my brain cuz I was doing other things. Maybe by 2003 robert was goin’ for it, though. What was it that motivated him to make the switch from Flash? If I remember at the time, I think the directness of the syntax appealed to him. Robert had clear ideas in his head a firm grasp of math, but most languages weren’t optimized toward the visual realm. They were optimized for making software, and I think that made a big difference for him. But then again, let’s let him chime in himself! Rick’s not fooling anyone by trying to pretend he was paying enough attention to these things in that year.
Says Robert :
One afternoon in June of 2006, I threw my hands in the air and said no more. No more Flash banner ads. No more Flash mini sites. No more Flash video players. Enough already! Now what?

After talking it over with my business partners at The Barbarian Group, it was settled. I dont have to do any more Flash work if I don’t want to, but I would have to do something. Processing. Thats what I will do. Never mind the fact that no client had asked us to create something using this lesser known beta application. All we have to do is create interesting work that we are passionate about and before long, word will get out.
Ah how things have progressed! Processing’s all grown up and we get all sorts of requests for it these days. Yay Ben Fry and Casy Reas! Thank you.

1 Processing (programming language) Wikipedia entry), Friday, April 4, 2008

Here are some recent posts from our employees about Processing:

JS1K 2012 Entry – Heart Strings

I submitted my first ever JS1K competition entry. Really, my first javascript or any kind of programing contest entry. And I’ll admit that it was quite a challenge too. It was like a putting together a jigsaw puzzle that you have extra pieces to. For my entry, I decided to take something that I worked on previously and rework it into something that fit the theme and into the 1024 byte limit. The theme for this year was love, so what I did was reworked the spider webs explorations that I had previously worked on into a heart shape and simplified it a bit. I also stripped out anything that wasn’t pure javascript. In the process, I was able to reduce my demo from 25K (not including the processing and toxiclibs js libraries) down to 1022 bytes.

Charlie’s Web

A few months ago, I started having this little fascination with spider webs. I was just wondering how they work and how they were built. At the same time, I befriended a little spider that made its home on the driver’s side mirror on my car, called Charlie. Charlie was great and he hung around for a few weeks and taught me a good bit about spider webs. For one thing, they’re very strong. Each strand that’s created is reinforced by the next strand. Sometimes strands double up. Sometimes he even misses a connection. Sometimes he creates this y-shaped connection. Unfortunately Charlie is dead. Or he ran away.
To show what I learned, I started this little processing sketch to just see if I could make a simple spider web. The math for making some sort of simple perfect spider web isn’t hard, but it’s also not that interesting to look at either. As perfect as some spiderwebs look, there is a actually a lot of variation to them. They are an example of what a lot of generative artists always look to replicate from nature, the balance between the predictable and the random.
Once I got the web working in processing, I had an idea to use my webs in the context of an html site, which meant I would have to move it to Javascript. I’ve kind of avoided javascript for a while, but more recently wanted to explore it a bit, so this served as the perfect first javascript project. I originally started by just exporting the processing sketch as a processing js sketch. It didn’t wuite work since I was using the toxiclibs library for the physics environment. Even if it did work as I thought it should, I feel like it would have been cheating. So instead, I went through some javascript canvas tutorials by Keith Peters and restructured the project as pure javascript. I still ended up using processing js for the canvas drawing and I also ended up finding a version toxiclibs that was ported to javascript. The major difference with that was that I had to target the specific toxi namepsace when using any part of the toxiclibs library. No biggie.
Go here and play with it a bit. It’s not perfect, but I’ve got some other things I want to explore and need to move on. I don’t plan on abandoning it altogether though. I’d like to go in and add some dimension to it and bring it into the more efficient 3d environment of webgl. Also, I’d like to explore and push the webs farther in a more interesting direction visually. It’s also begging to have some more interactivity brought to it. Hopefully this will end up making it into some other project in the future.
As a disclaimer, I’m not much of a web front end kind of guy. I’ve from the world of flash and just like to make pretty looking stuff. From what I’ve found, this is slow as hell in firefox, but plays reasonably well in chrome. Let me know if you have any comments on how to improve this. All comments are welcome. I think.
Originally posted at http://www.thegrego.com/2011/12/06/charlies-web/

Kepler Family Life Spans

Family Lifespan Project

Kepler Family Life Spans is my first original data visualization using processing. Since the summer, I’ve been more interested in processing as a tool, data visualizations and generative art as well as my own genealogical history. So naturally, I wanted to figure out some way to visualize some of my family data. This project enables you to select a year starting with the earliest birth year that I have for my ancestors that I have a birth date and death date for. For each year, you can see the average life span for my family at that point all the way up to 2011. When a person dies, their representation goes red and stops progressing in age.

With this little project, my goals were to learn how to integrate data into processing, use the geni.com API to grab my genealogical data, and create something that was visually interesting. Because I was concentrating so much on the data aspect, it ended up not being as visually interesting as I planned on, but now I’m better equipped with the “how”, so that next time, I can concentrate on the cool factor a bit more.

As for the some interesting conclusions that I’ve come to, you can see the expected rise in average life span, thank goodness. In fact, the oldest person that has passed away was this year, with my grandmother at 96 years old. Also in the recent years, I thought it was interesting to see a 10 year gap in new babies, where with a family where I have cousins almost as old as my parents and as young as their mid 20s, I thought that there would be a baby born every year or two. Of course this data probably isn’t all that interesting to anyone outside of my family, so that brings me to what I plan on doing from here.

Since this data comes from what I’ve included in my geni.com account, I plan on making my work public so that other people can plug in their geni credentials so that they can come to their own conclusions. And with that, I will also need to make a javascript version or app so that people can actually use it. I also hope to figure out ways to improve on this and keep it updated as well as continue exploring how to visualize this data in interesting ways. I’m sure that there are more fun and interesting conclusions that can be found from this data too.

In the next post, I’ll go into what went into making this and what I learned from the process.

Cinder!

We are incredibly excited to announce that Cinder (formerly known as Flint) has now officially been released into the wild as an open source project. As described on the main page at libcinder.org, “Cinder is a community-developed, free and open source library for professional-quality creative coding in C++.”
So why did we do this, you might ask? Well, it originated as a solution to a fairly kludge-y work-flow we were using to create music visualizers. We were basically designing in Processing, porting to C++ and testing; repeat. At one point we even considered developing a magic-box type macro that would convert a Processing sketch into C++ and then to an iTunes visualizer. I had also coded a basically blank iTunes visualizer that piped FFT data to processing. Good times, but not ideal. At all.
Instead, we started an internal project codenamed ‘Flint ’ (not only because we liked the name, but because the namespace sounded cool: fli::Surface, etc). The project had two main goals:
First, when we needed to be in C++ (for iTunes plug-ins etc.) we wanted to have our creative coders be able to make things directly in C++. It needed to be approachable. For a while, we called this “The Robert Case” after Robert Hodgin, who was a driving force in making a ton of amazing stuff here at TBG.
Second, we wanted to make sure that any approachability enhancements did not prevent the more hardcore developers from doing the “bare-metal” programming. That was the “AFB Case” after Andrew Bell, who wrote the majority of Cinder here, and has been writing C++ code for ever.
We’ve used various incarnations of Cinder on projects like the augmented reality issue of Esquire Magazine, a music visualizer for Relentless, and Magnetosphere, as well as several internal experiments.
I would also like to reiterate some things that we’ve said in the FAQ of libcinder.org. One, we cannot say enough great things about Processing. It’s not only a great way to dip your toe into the waters of creative coding, but also a powerful platform for doing advanced and amazing things. Another incredible project out there is openFrameworks, which is led by some amazingly talented people and has a great community surrounding it.
I am so glad that we were able to make Cinder open source. Andrew and I both expected a certain amount of internal resistance attempting to do so (a lot of hours went into this!), but that resistance never materialized. We have been the beneficiaries of too many open source projects to list, and we all felt that giving back was the only move we could feel good about.
Check out the cinder website here: http://libcinder.org
Grab the source here: http://github.com/cinder/Cinder

Robert Hodgin

It is with a mixture of proudness, sadness, and well-wishing that we would like to announce that Robert Hodgin, one of the founding partners of The Barbarian Group will be stepping down as a managing partner, and leaving the full-time employ of TBG at the end of this month. The Barbarian Group doesn’t expect Robert’s departure to have any impact on its business, for reasons we’ll describe in a moment, but Robert definitely leaves his mark on the company and will be missed.
Robert has been with us since the first meeting of the founding partners in Benjamin’s loft in late 2001. He was one of the first generation of groundbreaking Flash artists, and was instrumental in establishing TBG’s creative and executional chops, nurturing the first group of creatively and technically savvy flash artists that helped TBG rise to prominence in 2002 and 2003.
Through the years, Robert has transitioned from Flash to other technologies, most notably becoming an early adopter and proponent of Processing. He also moved out to San Francisco, and helped us set up shop on the west coast. Of late, Robert has been participating in the development of new technical frameworks within TBG, most notably with Cinder, our in-progress C++ visual development framework, on which Robert will still continue to work. Robert has also pursued his technical art relentlessly, blogging his experiments both on our blog and on his highly acclaimed personal blog, Flight404.com.
Robert’s work continues to be groundbreaking, innovative, and unlike anything anyone else is doing (except, of course, for those who have been, shall we say, heavily influenced by Robert). It is also the work of an artist, and not the work that people often wish to engage a full professional services company for. Our new arrangement with Robert allows him to pursue projects that he couldn’t previously pursue, while still giving TBG access to Robert’s unique skills when the situation calls for it. We’re excited, Robert’s excited, and there are probably a million potential clients of Robert’s that can afford to hire him now that are very excited as well.
So please join us in wishing Robert good luck in his future endeavors. He’ll be blogging soon about the transition and we’ll post that here as well. Then we encourage you to follow his future work at www.flight404.com. Farewell, sir!

Flint C++ Tools

There have been a few mentions of our internal C++ library (codenamed Flint) around the web over the last week or two. Over the years we’ve had opportunities to work on some really interesting installation projects and data visualizations, and along the way we decided it would be a good idea to use some common bootstrapping, so that we can get the art side of things rolling a whole lot faster. That bootstrapping has turned into a somewhat larger scale library that makes it easy to do a whole lot of amazing things that used to take us a good deal of time to get working. It goes all the way from simply creating windows and draw-able contexts, to shaders, VBOs, and the once-feared (for me) Quaternion.
At the moment, Flint is very much in Alpha. We haven’t made any plans to release it to the public, but we also haven’t made any plans to not release it either (apologies for the double negative). We should have more news in the upcoming months, as we add necessary features and fine tune everything. We highly recommend checking out OpenFrameworks and Processing if you’re interested in doing high-end graphics or other interactive projects.
Oh, and if we do decide to release Flint, leave a comment and we’ll try to get you on the beta. Again, we still don’t know what the future holds, so no promises ;).

ruby-processing

I have a habit of picking up new things to try when I want to do things I could accomplish with the tools already at my disposal. This weekend, I spent a bit of time with ruby-processing . It runs everything in Ruby, and uses JRuby as a bridge to run Processing. I used it to visualize some data about web developers after parsing the original .xsl file into .tsv files and cleaning up the data using Python. Im going to do quite a bit more work on the visuals above, but I wanted to put in a good word for ruby-processing now.

The first thing that I liked was that I wasnt writing Java, a language lots of people seem to hate on, the source of which hate I am coming to understand as I learn about other languages. Rubys syntax is cleaner, even if it seems strange at times (welcome home@,$,and:prefixes).

The next big improvement over vanilla Processing was writing the code inside of TextMate. This isnt inherent to ruby by any means; I could probably write Java inside of TextMate. However, ruby-processing made it really easy to launch sketches I was working on, and also to edit them in real-time.

I also spent some time messing around with field on Saturday. It looks like really exciting software, with a lot of promise. Unfortunately, it bogged down and became unusable while running through the examples on their site. Ill probably give it another go, but ruby-processing is letting me make what I want to for now (and thats what is really important).

Passing arguments to Processing sketches

I recently received an email asking about how to pass arguments when launching a processing sketch from the command line. I hadn’t ever done such a thing, but after some poking came up with an easy, though not exactly robust, solution. This example sets the value of the r, g, and b variables and uses [...]