Processing and P5
Guest blog post by @BlueAppaloosa for the #EdTechBridge series in support of Computer Science Education Week. Join us for our weekly chat Wednesday night at 7pm EST. This week (December 10) our topic is #HourOfCode.
It’s often said that programming and art don’t mix. That programmers cannot be artists, and artists cannot be programmers. The goal of Processing and P5 is to bring the art and programming together, so art can be made with code. Processing and P5 are very similar, in fact P5 was inspired by and modeled after Processing. Since Processing has been around longer and I’ve used it more I’m going to talk about it more directly, but the two provide very similar functionality. The major difference between Processing and P5 is that Processing is built on Java, and P5 is built on JavaScript. Despite the similarity in naming, Java and JavaScript are not the same language and are actually quite different. Processing uses Java syntax and features, while P5 uses JavaScript syntax and features. Processing creates stand-alone applications, and P5 creates programs that run in a web browser. Both Processing and P5 use very similar syntax (barring their language differences) and provide nearly identical functionality (again, based on their base language). The main thing that Processing/P5 gives you is a library of functions that make it very easy to draw stuff on the screen. If you’ve ever worked with pure Java, you probably know how much code you have to write just to be able to draw a circle on the screen. In Processing, drawing a circle takes one line. You can also draw other simple shapes, as well as images, with ease. In short, the amount of time, effort, and programming know-how it takes to make visual things happen in Processing is very minimal. Processing also provides simple functions for handling user input, file i/o, transforms, audio, fonts, and more. All of this is possible in regular old Java, it’s just a lot more complicated.
That’s all it takes to draw a circle to the screen.
The Processing editor also does some nice things for you, that simplify running and building your programs. You can run your code with a button press, like any good IDE. If there are errors or other command line output, it will show up at the bottom. Processing will try to help you with errors by offering some suggestions. You can also build stand-alone executables for Windows, Mac, and Linux, again, with a button press. (You’ll want to check the “Embed Java” box if you are unsure that your end users will have Java installed on their machines.) P5 doesn’t have an editor at the time of this writing, although it’s in the works. However, running P5 sketches merely means opening the “index.html” file in you favorite web browser, as opposed to the sometimes painful process of turning a Java program into an executable.
Not all the error messages are so helpful, but it tries to tell you what you might have done wrong.
As Processing is targeted towards artists and beginners, it has a lot of great tutorials, examples, and books. These are generally easy to understand, and get you making rather neat stuff fairly quickly. This is one of the things I really like about Processing; you’re not just moving things around the screen for no reason, you can actually make *real* programs that do *real* things. And it’s presented in a way that approachable for people who don’t already self-identify as programmers. Anybody can do it. There are also a number of libraries that can be plugged in to Processing to do other neat things. (There are fewer for P5, as it hasn’t been around as long.) You can listen to internet traffic, explore computer vision, play with a physics engine, and experiment with signal processes. All of these are fairly complex topics, but are made accessible through Processing.
Flocking, in Processing.
In addition to being approachable to novices, Processing is powerful enough for more advanced users too. I find myself using it for prototypes as well as complete projects, because of how quickly I can get things happening. You can also use regular old Java in Processing, or bring Processing into your regular Java programs. I’ve spent a lot of time working out ideas in Processing, even if the eventual plan is to use them somewhere else. Lately I’ve been experimenting with P5, mainly because I’m more interested in building web programs than stand-alone programs right now. Which one is right for you may depend a bit on where your interests lie.
Processing can also be used for games and other projects. More complex projects require more code, which is why this has multiple tabs up there.
All in all, I like Processing and P5 because they are both flexible, and powerful, and are useful to an advanced user as well as a novice. This means I will actually *use* them for my own projects as well as teaching, which has all sorts of benefits. (I find drag-n-drop coding slow and frustrating, so I never use it for personal projects.) Both Processing and P5 are available for free, and run on Windows, Mac and Linux. I have a slight preference for P5 these days, because I’m more interested in building games and applications that can be played online. I’m hardly abandoning Processing though, as I still use it for prototyping and experimenting. These are both text-based languages, which means you (or your students) will need to become comfortable with syntax errors and the like. However, if you’re comfortable with that, Processing or P5 are great coding tools.
Originally published at digitalkirin.blogspot.com on December 10, 2014.
Digital Kirin is an exploration of topics relating to game design. Topics sometimes include books/articles I’ve read, games I’ve played, games I’ve made, as well as my ramblings on whatever seems important at the time.
