Arduino-Processing Serial Communication

Over the last few weeks I’ve been messing around quite a bit with the Processing programming language. I was drawn to it initially because it is a close cousin to the Arduino language and programming environment (which is based on Processing), so naturally I wanted to find a way to combine the two in a project.


What I had in mind, of course, was an outlandishly-complicated, full-screen Processing user interface, with dials and button and knobs and sliders and big maps and graphs of data readouts and a little videoport showing the view from the Kinect-based eyes of some hardy Arduino-powered robot as it trundled bravely into the caldera of a smoking volcano.

But alas, I thought it would be better to start small — with one little graphical slider control, one Arduino, and one LED. The slider would command a brightness level for the LED, serial communication would do the talking, and pulse-width modulation (PWM) would do the legwork. In my quest for the ultimate ready-made user interface, however, I did stumble across the awesome-looking and fully-featured controlP5 GUI library for Processing.

controlP5 GUI Library

Arduino Setup

As you can see in the video, I used an Adafruit Boarduino and a breadboard for this little experiment, and both are great!, but neither are necessary. You need to have your Arduino plugged into your PC’s USB port (or serial, if you’re old school), and you need to have an LED and an appropriate resistor plugged into Pin 9 (or any PWM pin) and GND on the board (pictured below). That’s it!

Arduino LED Setup

Software Setup

You’re going to be running both the Arduino and Processing development environments side-by-side, so be careful not to confuse one for the other. Open the SliderSerial_Arduino sketch (download it below) in the Arduino environment, and open SliderSerial_Processing in Processing.

Arduino and Processing

If you don’t already have the controlP5 GUI library for Processing, download that as well and install it in your Processing Libraries folder (should be in the same directory where all your sketches are saved — see below for help installing libraries).

Upload the Arduino sketch to your Arduino board, then run the Processing sketch. A small window should open, revealing the slider control, which should control the brightness of the LED.

Serial Communication

If the Processing sketch doesn’t work the first time, you may need to make a small adjustment to properly locate the port to which your Arduino is connected. In the Processing sketch, look for this code block and follow the instructions in the comments:

// =======================================================
// =======================================================

// to which your Arduino is connected.

// SEE THE LIST of available ports in the black debugging
// section at the bottom of the Processing window. (It will
// appear after the first time you run the sketch.

//   [0] "COM1"
//   [1] "COM3"
//   [2]  etc...
// or like this on a Mac:
//   [0] "/dev/tty.usbserial-somenumbers"
//   [1] "/dev/tty.usbserial-othernumbers"
//   [3]  etc...

// TYPE THE NUMBER (inside the brackets) of the desired
// port after the equals sign.

int serialPortNumber = 0;

// =======================================================

Quick Reference Checklist

  1. Download and install the Arduino software.
  2. Download and install Processing.
  3. Download the controlP5 GUI Library for Processing.
  4. Install the controlP5 library. (Here’s how.)
  5. Download the SliderSerial_Arduino sketch.
  6. Download the SliderSerial_Processing sketch.
  7. Configure your Arduino and LED as pictured above.
  8. Open SliderSerial_Arduino in your Arduino software environment.
  9. Open SliderSerial_Processing in your Processing environment.
  10. Upload SliderSerial_Arduino to your Arduino.
  11. Run SliderSerial_Processing and make sure the LED will dim with the slider.
  12. If it works, congratulations! If not, try changing the serialPortNumber variable as described above.

I hope this little project helps people get Arduino and Processing working together. This code could be the jumping off point for bigger things and I think Processing is a natural choice for interfacing Arduinos with PCs. Enjoy!


2 responses to “Arduino-Processing Serial Communication

Leave a Reply

Please log in using one of these methods to post your comment: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s