Introduction: Processing Tools for Arduino

About: I just love making stuff...and working out!

There are many ways to control your Arduino. Many many many ways. These can be through another Arduino, buttons, potentiometers, R/C, and more. One really cool way is through the computer. There are also a bunch of ways to accomplish this. An easy way is to use Processing. Processing is a program that can be found at

The Processing environment should look familiar because the Arduino IDE was based off of it. It is based off of Java so its fairly easy to learn if you don't know it. You can find examples in the application or on the site.

In the instructable I will show you different programs made with Processing that will be able to control the Arduino.

I will first show you each of the programs and then some Arduino code that will be able to take the data and read it.

Let's get started!

Step 1: Stuff Needed


1. Processing


3. The USB cable used for the Arduino


1. A lot of time

2. A brain

3. Your sidekick(your dog)

Step 2: Setup

Take the USB cable and plug it in the Arduino. Then the computer. You're done!

Step 3: The 1st Program...The Buttons

This program is 4 buttons that will send a command to the Arduino to let it know when a button was pressed. As you can see I have it set up with 4 directions for a robot I made(which might be my next instructable). If you would like more about the code just ask :)

import processing.serial.*;
Serial port;

void setup(){




port = new Serial(this,Serial.list()[0], 9600);}

void draw(){


rect(0,0, width/4, height);



fill(200, 0,0);

rect(100, 0, width/4, height);




rect(200,0,width/4, height);



fill(55,100, 23);

rect(300, 0, width/4, height);



mouseOver(); }

void mouseOver(){


if( mouseX > 0 && mouseX < 100){

if(mouseY > 0 && mouseY < height){

println("1st rectangle");

port.write("1"); }}

if(mouseX > 100 && mouseX < 200){

if(mouseY > 0 && mouseY < height){

println("2nd rectangle");


if(mouseX > 200 && mouseX < 300){

if(mouseY > 0 && mouseY < height){

println("3rd rectangle");


if(mouseX > 300 && mouseX < 400){

if(mouseY > 0 && mouseY < height){

println("4th rectangle");


Step 4: The Second Program...mouse Control!

This program takes the position of the mouse in a direction and sends it as a command to the Arduino. This was made for the robot I've made, but I haven't had a chance to test it. Any questions about the code may be asked in the comments :)

void setup(){



rect(200,200, width/3, height/3);





triangle(200,200,0,300,200,400); }

void draw(){

mousePos(); }

void mousePos(){

if(mouseY > 0 && mouseY < 200){


if(mouseY > 400 && mouseY < 600){


if(mouseX > 0 && mouseX < 200){

if(mouseY > 200 && mouseY < 400){

println("Left");}} if(mouseX > 400 && mouseX < 600){

if(mouseY > 200 && mouseY < 400){

println("Right");}} if(mouseX > 200 && mouseX < 400){

if(mouseY > 200 && mouseY < 400){

println("Stop");}} }

Step 5: The Third Program... Scroll Bars!!!

My third and final processing program takes input from two scroll bars and then send the position to the Arduino. It can probably used in place of a potentiometer for input reasons. You press a to send the input from the top bar and then s for the input from the bottom. If you happen to have questions please direct them below to the comments :)

import processing.serial.*;
Serial port;

int ss1;

int ss2;

HScrollbar hs1, hs2;

void setup(){




port = new Serial(this, Serial.list()[0], 9600);

hs1 = new HScrollbar(0,height/2+100,width,25,25);

hs2 = new HScrollbar(0,height/2-100,width,25,25); }

void draw(){


float s1 = hs1.getPos();

float s2 = hs2.getPos();

ss1 = int(s1 * 1.4);

ss2 = int(s2 * 1.4);








if(key=='s'||key=='S'){ port.write(ss2);}} }

class HScrollbar {

int swidth, sheight;

float xpos, ypos;

float spos, newspos;

float sposMin, sposMax;

int loose;

boolean over;

boolean locked;

float ratio;

Class HScrollbar (float xp, float yp, int sw, int sh, int l) {

swidth = sw;

sheight = sh;

int widthtoheight = sw - sh;

ratio = (float)sw / (float)widthtoheight;

xpos = xp;

ypos = yp-sheight/2;

spos = xpos + swidth/2 - sheight/2;

newspos = spos;

sposMin = xpos;

sposMax = xpos + swidth - sheight;

loose = l; }

void update() {

if (overEvent()) {

over = true; }

else {

over = false; }

if (mousePressed && over) {

locked = true; }

if (!mousePressed) {

locked = false; }

if (locked) {

newspos = constrain(mouseX-sheight/2, sposMin, sposMax); }

if (abs(newspos - spos) > 1) { spos = spos + (newspos-spos)/loose; } }

float constrain(float val, float minv, float maxv) {

return min(max(val, minv), maxv); }

boolean overEvent() {

if (mouseX > xpos && mouseX < xpos+swidth && mouseY > ypos && mouseY < ypos+sheight) {

return true; }

else { return false; } }

void display() {



rect(xpos, ypos, swidth, sheight);

if (over || locked) {

fill(0, 0, 0); }

else {

fill(102, 102, 102); }

rect(spos, ypos, sheight, sheight); }

float getPos() {

return spos * ratio; } }

Step 6: The Arduino Side

The Arduino code is much simpler. This program just takes the data and displays it for us to see it.

char x;

void setup(){


void loop(){


x =;


Step 7: Troubleshooting....

There is only a few problems that will arise. Coding problems and then hardware problems.

If you have a coding problem check over the code.One problem may be when you're uploading. Never have the processing sketch open while putting the code in the Arduino. Plus we are all human and we make mistakes so I might've messed something up. If so and you can't find any way to fix it just ask around.

If its a hardware problem it might be the USB cable that connects the Arduino to the computer. If its not that it might be the Arduino. If you can't solve this you can also just ask around.

Step 8: Thank You

This is my third instructable and I plan on many many more. Please give me suggestions! Sometimes it gets boring having to wait until i get an inspiration to do something. And I'm sorry for it being so long since I've made an instructable!