Learn to Program in Processing: A Language for Visual Designers
If you’re an artistic person in the 21st Century, you probably know that there’s a lot of potential for creativity with digital skills and programming. Would you be surprised to learn that there’s a programming language out there designed for you?
If you’re thinking, “But won’t I have to learn math and text manipulation before I can do anything visual?” Well, banish the thought!
Today I’m going to introduce you to a programming language that was created in 2002 with visual designers in mind: it’s called Processing.
This guide will cover what Processing is, why you should learn it, ways to get started, and ways to learn more.
I also interviewed Professor Casey Reas of UCLA’s Department of Design Media Arts, who is an artist and one of the co-creators of Processing. I reached out to Professor Reas for insights into what you can get out of Processing; where the language has been; and where it’s going in the future.
What is Processing?
Processing is a fully-functional programming language based on Java where the introduction is less “Hello World”, and more “Draw a smiley face”.
Programming has been taught for 4 or 5 decades through text and mathematical manipulation. For people who are visual artists, the idea of Processing is to start with a line on day 1 and start constructing visual space. The same things are learned: You learn about variables, modularity, functions and objects and arrays, but it’s all done through visual exploration, and the focus is on making images.
Programs created in Processing are called Sketches. Processing is a great place to start if you’ve ever wanted to create generative art (like in the video below), interactive design installations, data visualizations , or games. It’s also a great way to get your hands dirty making something cool with programming.
Great Reasons To Learn Processing
Processing is ideal for artists, designers, musicians and other creatives to explore, experiment, and develop their craft.
As Professor Reas says, over the past 20 years, the computer has become the most common tool in the arts, and it has largely replaced many traditional tools, such as the photographer’s dark room, and the pre-press process for printing.
As artists and designers have started using software as a primary part of their process, Processing allows them to go deeper and start to think about software not as mimicking these prior tools or processes such as a dark room or a drafting table. Writing code is a way of thinking about making something new and unique, and getting around some of the constraints of point-and-click software tools.
Processing is built on top of Java. You won’t have to make a big leap when tackling that or other programming languages later. The Arduino micro-controller bases its programming language on Processing too. If you decide that you want to make programs that control things in the physical world (eg. motors, speakers, screens) or react to things in the physical world (e.g. using sensors for temperature, pressure, light, etc), you’ll find that easy to pick up too.
For example, Prof. Reas introduced us to a woven piece created with Processing.
Software controls the loom, and the machine creates physical textiles in unique patterns based on the binary data that represents a dump of a computer’s physical memory.
Apart from that, as I mentioned earlier, you can create interactive visualizations and games while learning fundamental programming concepts.
As a career, Processing is ideal for exploring new ideas and designs, sketching and prototyping. Professor Reas goes on to explain the concept of a “Software Sketchbook”‘ here:
Processing is not only a professional production tool, it’s focused on learning and understanding. So it’s used a lot for sketching, and one of the main ideas for processing is that it’s a software sketchbook that you’re going to get ideas out of your head and into code in a way where you can take them to the next step. […]
Processing is used a lot by people who are experimenting, making their own tools, really trying to push things in interesting new conceptual and visual ways, but it’s not really used by the large conservative creative agencies.
Processing is also free, open-source, and well-documented — which makes it highly accessible.
Daniel Shiffman, author of Learning Processing and Assistant Arts Professor at the Interactive Telecommunications Program at New York University, gave MakeUseOf some of his reasons why Processing works well for his students:
1. You can just download and run it with no setup complications.
2. It has a compact and elegant API for drawing and graphics which is great for visual designers and artists.
3. It is easily extensible and can be used in all sorts of strange and creative ways.
Ways to Get Started
The best way to get good at something is to start taking active steps (no matter how tiny) right away — putting it off won’t do you any favours. If you’re with me, read on for steps you can start right now to learn to program in Processing. After that, I’ll show you pathways for more learning that includes books and courses you can check out, and experts to follow on social media.
You don’t need anything special to get started with Processing besides a computer with an Internet connection running Windows, Linux, or Mac. You don’t need any background knowledge in programming, but we’ve got a basic primer on programming concepts (and a second-part ) you should familiarize yourself with at some point if you’re teaching yourself.
Play With Existing Sketches
You can test Sketches created by others and even edit them to see how their behavior changes on OpenProcessing. It’s a great place to host your own creations to share with others. I recommend you check out some of the sketches on this list for some diversity.
Note: If you aren’t running Java on your computer, you won’t be able to play with these sketches. If you are, go have some fun and come back, I’ll wait.
Hello Processing! — A Sequence Of Video Tutorials
Daniel Shiffman is the upbeat educator in a roughly one-hour, high-quality sequence of video tutorials produced by the Processing Foundation. He talks about the things created with Processing, and gives you a chance to test out some simple code and see the drawings it produces, without having to download a thing.
Using the p5.js library is outside of the scope of this guide, but I thought you should be aware of it. With p5.js, you can convert your Sketches to integrate with websites, like this custom painting application called Neobrush that you can try for yourself.
As you can see, the app created in Processing by Chris Riebschlager, draws thousands of arcs between points chosen by mouse drags and clicks.
Just Dive In: Install Processing
Ready to program your own Processing Sketches? Hit up the Processing.org Download page and choose the version for your operating system (there are versions for Windows, Mac, and Linux). Extract the files from the archive folder and open the folder.
If you’re running Windows 64-bit , you should see a set of files that looks something like this when you run the Processing application file:
From here you can go to File > Examples to load up a set of complete Sketches that were pre-loaded with the program. Play with the examples and take a look at the code to get a sense of the structures common to Processing sketches.
Stay Updated: Evolutions in Processing
As you get involved with Processing, you’ll want to stay up to date with the upcoming changes. Casey Reas and Ben Fry are currently working on releasing Processing 3.0, the next version of Processing.
We’re working to have it do a good job of offering suggestions or gently pointing out potential problems and errors in the code. It’s largely about making a more friendly and informative environment for when people are writing software than before.
There’s much more to Processing that what you can do “out of the box”. The Processing community contributes Libraries that extend the functionality of the environment. Prof. Reas says.
The core of Processing is making interactive graphics. The libraries allow it to expand into computer vision, audio, and different kinds of interface components.
There are libraries for exporting PDF files, reading images from a camera, creating 3D images, to animating, sending SMS text messages, including weather data, creating typography, and much more.
The Libraries allow us to see how people want Processing to grow and develop. We’ve found, over time, that the most often used are the libraries that become essential and are folded into the main software.
Use The Handy Reference Guide
The last clue I want to leave you with is that programmers don’t start off knowing what all the existing functions are. They look them up, find out how they work, and then test them out. That’s where this References guide will come in handy for you.
Continue Your Learning…
I’ve rounded up many of the best low and no-cost ways to learn Processing with online tutorials, courses, and books.
Following the Processing champions on social media is a great way to get involved in the community, make connections, and discover things that will help you advance in programming faster than on your own. Read on to the end for a colourful roundup of 10 of the best social media accounts you should follow to stay up to date on the latest and greatest in Processing!
Tutorials are a great way to explore and see what others have created, and get insight into how to approach a problem.
Processing.org: The official site has its own collection of tutorials that will help you get into the programming mindset and learn to use the language. The tutorials cover beginner, intermediate, and advanced topics.
CreativeApplications.net: This is a fantastic place to look for creative Processing tutorials, too.
Plethora Project: If you want to explore a programming technique or want to follow a programmer who will show you the ropes, Jose Sanchez of the Plethora Project will show you the ropes in Vimeo screencapture videos as he codes from scratch.
Fun Programming:If you’re just looking to browse a collection of tutorials for inspiration (like drawing an animated rainbow, or programming roses), there are many simple tutorials here that you can check out.
The Best Online Courses You Can Take
There are many providers of free education online for a variety of skills, and programming in Processing is no exception.
Introduction to Programming with Processing: A straightforward course to learn programming taught by Lyndon Daniels. Download the free, Creative-Commons licensed materials. This course begins with an online design and layout program, includes a ‘Guess my Number’ game, and ends with a Social Commentary Visualization.
Coursera: The MOOC has couple of free courses that center around Processing, with no pre-requisites for success. Add them to a watch-list to take them in the future (with other classmates and content added each week, and the chance to earn a certificate), or you can take a past-session of the course if you just want to get started now.
Introduction to Computational Arts: Processing: A 5-week free, online course taught by professors from the State University of New York. You’ll learn the fundamentals of programming through Processing, featuring technical assignments, an artistic project, and the creation of an online portfolio of your digital art projects.
Creative Programming for Digital Media & Mobile Apps: A 6-week free, online course taught by professors from the University of London, using Processing to teach both technical skills and creative ways to apply those skills. It features examples from music, visual arts, and games.
Skillshare: Looking to learn to make Generative Art? Joshua Davis, Media Arts Director of Sub Rosa (a New York-based design & innovation agency) has two free SkillShare courses in Programming Graphics. The first is a beginners’ Introduction to Generative Art, and the second is an intermediate-level course in Generative Art Animation.
Lynda.com: If you’re keen on doing data visualization with Processing, have an account on lynda.com, Barton Paulson’s Interactive Data Visualization with Processing course will show you what you need to know.
Did you like Daniel Shiffman as an educator from the Hello Processing tutorial videos? He’s the author of a fantastic book called Learning Processing: A Beginner’s Guide to Programming Images. This book explains all programming jargon in an accessible way, with each chapter integrating creative exercises to build your programming ability.
For a comprehensive reference of Processing, look no further than Processing: A Programming Handbook for Visual Designers and Artists, a book written by Casey Reas and Ben Fry, the creators of the programming language.
Follow Experts On Social Media
I’ve put together a list of 10 key Twitter profiles that should help you stay updated with the latest in Processing. Follow them for their creative projects, and the tips that makes it easy for us all to learn.
Organizations Involved with Processing:
— Processing (@ProcessingOrg) July 27, 2014
— OpenProcessing (@openprocessing) March 8, 2013
Creators & Innovators of Processing: Casey Reas
Artists, Authors & Educators:
Daniel Shiffman is the author of Learning Processing
Follow the Top 10 Twitter List of Processing.org Influencers with a Click
To make it easier, I’ve included all 10 into a Twitter List for you. Follow the list all at once (or unfollow, if you find Processing isn’t for you).
What Will You Use Processing For?
Processing is a great way to not only dip your toes into programming, but also go beyond with its depth and flexibility.
Have you ever had an idea for something you’ve wanted to program? Will you give Processing a try? Let us know in the comments if this article helps give you confidence to take up programming today!
Know any other programming languages that work well for beginners interested in art and design?
This special series on specific skills aims to be a catalyst for personal development. We hope it sparks your search for new learning. Growth never ends…so do tell us about the self-improvement topics you would like to see us cover.