Using a GUI to Control Processing Output with ControlIP5, Firmata via Serial

The Fab Academy Assignment

• Write a user interface for an input &/or output device

I created this simple interface to control turning on and off an LED that is attached to a microcontroller via the serial port on my Mac. I wanted to see if I could get the ControlIP5 (used to create the GUI), Firmata and serial libraries working together before I tried using more complex hardware. I intend to experiment with driving multiple servos and possibly tinkering with bluetooth using the NXT library as an “cheap” way (it’s “cheap” because I already own the Mindstorms hardware) to play around with bluetooth without buying additional bluetooth modules.

The Interface: Default / Initial State:

The interface is simple – the Turn On button turns the light on and the Turn Off button turns it off.

Here’s the Processing code:

/*-------------------------------------------------------------------
 * Fab Academy -- Module 09: Interface Programming
 *--------------------------------------------------------------------
 * Assignment: Write a user interface for an input &/or output
 * device.
 *--------------------------------------------------------------------
 * Purpose:  This program is a test to get the controlIP5, Firmata,
 * and serial libraries working together through the serial port.
 * This program uses a simple button GUI interface to turn on / of an
 * LED.
 *--------------------------------------------------------------------
 * Anna Kaziunas France - 30 March 2010
 * Combined / Modified example code from:
 * controlIP5 buttons example (included the library download)
 *------------------------------------------------------------------*/

import processing.serial.*;
import cc.arduino.*;
import controlP5.*;

ControlP5 controlP5;
// we have to use controlP5.Button here since there
// would be a conflict if we only use Button to declare button b.
controlP5.Button b;
Arduino arduino;

// Variables
int ledPin = 11;
int buttonValue = 0;
int myColor = color(0);

void setup() {
  arduino = new Arduino(this, Arduino.list()[2], 57600);
  arduino.pinMode(ledPin, Arduino.OUTPUT);
  size(640,480);
  smooth();
  frameRate(30);
  controlP5 = new ControlP5(this);
  controlP5.addButton("Turn_On",255,200,80,100,70);
  controlP5.addButton("Turn_Off",0,200,160,100,70);
  println(Arduino.list());
}

void draw()
{
  background(myColor);
  fill(buttonValue);
  rect(20,20,width-40,height-40);
}

public void controlEvent(ControlEvent theEvent) {
  println(theEvent.controller().name());

}

// function buttonA will receive changes from
// controller with name Turn_On
public void Turn_On(int theValue) {
  println("a button event from Turn_On: "+theValue);
  myColor = theValue;
  arduino.digitalWrite(ledPin, Arduino.HIGH);
}

// function buttonB will receive changes from
// controller with name Turn_Off
public void Turn_Off(int theValue) {
  println("a button event from Turn_Off: "+theValue);
  myColor = theValue;
  arduino.digitalWrite(ledPin, Arduino.LOW);
}

Skills Learned

• I learned how to find, utilize and manipulate additional Processing libraries that enabled me to create a simple user interface from a computer to a physical object (LED).

Tools Used

• Processing, ControlIP5 & Firmata libraries
• Arduino ATTMega, LED