Your browser does not support the canvas tag.

Week 1
Maker Faire September 22nd or 23rd. We goin' or what?

Today we will play as many of these as we can:

Write a review for the next class about one of the games that touches on these topics. Download Arduino and Processing onto your laptops. Try to get the hello world Arduio sketch running. If you can't get it going don't worry, we'll do it in class.
Using Processing to control an Arduino using Firmata

The Arduino is a wonderful little cheap microcontoller. You can upload programs to it and then have it run independently of the computer, or you can use it as an input/output breakout box and leave it attached to the computer. Our class will focus on the second method, using a library called "Firmata". Firmata acts as a conduit between the arduino and Processing and it allows us to easily address the ports on the arduino. The advantage is that once we have the arduino running with Firmata loaded on it we do not need to work in the arduino programming environment. The disadvantage is that setup can be a bit confusing. Hopefully this page makes things a little easier.

The steps described are for a mac, but the process on a PC should be largely the same.

Step one

Download and install the latest versions of Processing and Arduino. If you have the programs already, make sure you have a recent version.

PC users - I used the "Windows app", not the windows installer and it worked great. Windows installer should work as well though.

NOTE: there's a new way to use the browser to write code that seems to work as well. You need to "agree" to an awful lot, but it all seemed pretty reasonable. If you want to use to browser instead of downlaoding the app I'm fine with that, but be prepared for me to tell you to download the app anyways. :/

Step Two

testing the arduino
  1. Open the Arduino software
  2. Plug the arduino into the computer with a USB cable. A little LED light should turn on the arduino showing that it has power.
  3. Go under examples - Basic - blink. Upload to the arduino. If the led next to pin 13 starts blinking, it works!
Step Three

Uplaoding Firmata
  1. Open the Arduino software
  • Plug the arduino into the computer with a USB cable. A little LED light should turn on the arduino showing that it has power.
  • Go file – Examples – Firmata - StandardFirmata
  • Go Tools – Board and make sure the right board is selected.
  • Go Tools – Serial Port and select the correct Serial port. It should be /dev/tty.usbserial on the mac or COM3 (or higher) on the PC. If it's not there ask yourself if you did step two?
  • Go File – Upload to IO Board. Two LED's on the arduino should blink on and off, telling you that it's uploading. It should only take a few seconds.
  • if it doesn't work - check out the arduino help page.
  • Quit the Arduino programing environment. (not absolutely necessary but I find the processing screen to look so similar that I start writing in the wrong place by accident)
  • Step Four

    "Hello World". There is a small LED on the Arduino that is "tethered" to pin 13. Set pin 13 to HIGH and the led turns on, set it LOW and it turns off. You can insert the long leg of an LED into digital pin 13 on the Arduino, and the short leg into GND, (the hole right next to it). The power on most pins are too great for an LED, but 13 is an exception, it has a resistor built in.

    Open Processing and Copy/Paste the code below into a new sketch.

    import processing.serial.*; // accesses the serial library
    import cc.arduino.*; // accesses the arduino library
    Arduino arduino; // creates a variable called arduino
    int ledPin = 13; // a variable for the pin on the arduino
    int counter = 0; // a variable for timing; 
    boolean onoff = true; // a variable that is either true or false   
    void setup() {
      for (int i = 0; i < Arduino.list ().length; i ++) {
        println(i + "  " + Arduino.list()[i]); // prints your USB bus
      arduino = new Arduino(this, Arduino.list()[13], 57600); // sets our variable "arduino" to the actual arduino
      arduino.pinMode(ledPin, Arduino.OUTPUT);// sets port 13 to output
    void draw() {
      counter ++; // adds 1 to the varaible counter with each loop
      if (counter > 20) { // checks the condition of counter 
        onoff = !onoff; // the !changes the state from true to false or false to true. 
        counter = 0; // reset our counter to zero
      if (onoff == true) { // check the state of our boolean
        arduino.digitalWrite(ledPin, Arduino.HIGH); // light goes on
      } else { // if the boolean is false 
        arduino.digitalWrite(ledPin, Arduino.LOW);// light goes off

    Press Run (command-R)
    Hooray, a blinking light, what joy.
    For further reference, here's a reference with info about the firmata library, it includes all the methods used to talk to the arduino from processing.


    The arduino can be both Analog or digital, and both input and output. Next up, digital input (buttons). Push buttons require some circuit building, you need to add a "pull-down" resistor, so the signal is either high or low.
    In the picture below and left a breadboard is used to lay out the circuit. A breadboard is a quick way of making electronic connections without having to solder everything. It's not a long term solution, but in the short term it's a great way to test circuits and avoid soldering. Breadboards are wired differently, but the ones we are using all work the same. The diagram shows which rows and columns are "common" (meaning they are all attached together).

    A word about resistors.
    Resistors have colored bands on them which designate how much current they "resist" - they are not all the same. First, locate the end with either a gold or silver ring - this ring designates how precise the resistors are. Next, start at the opposite end of the resistor of the gold or silver band. Each color represents a number for the first two bands, and the third band is a multiplier. So the third band is the largest determining factor of size of the resistor. The resistor drawers are all labeled by the color of the third band. In the case of the button we do not need to worry too much as long as we the resistance is not too high. here's a handy website for looking up resistors.

    Make sure your wire is going into the pin #2.

    import processing.serial.*;
    import cc.arduino.*;
    Arduino arduino;
    int buttonPin = 2;
    void setup() {
      size (300, 300);
      for(int i = 0; i < Arduino.list().length; i ++){
        println(i + "  " + Arduino.list()[i]); // prints your USB bus
      arduino = new Arduino(this, Arduino.list()[13], 57600); 
      arduino.pinMode(buttonPin, Arduino.INPUT);// sets port 2 to input
      arduino.digitalWrite(buttonPin, 1); // optional line to turn on the internal pullup resistors
    void draw() {
      if (arduino.digitalRead(buttonPin) == 0) { // if the button is not pressed
        fill(255, 200, 0); // turn yellow
      } else { // otherwise
        fill(0, 200, 255); // turn blue
      triangle ( 20, 20, 250, 80, 60, 280);

    Next, combine the two codes so a light turns on when you push the button!

    Make a one button game. Use a videogame button or make a button or find a button just don't use the tiny crappy ones that come in the kits - they suck.
    Read Homo Ludens through page 14 in the text and be prepared to talk about it in class next week.