Recitation 8: Serial Communication by Alexander Cleveland

Introduction

The goal of this recitation was to first create an etch-a-sketch game through the use of processing and Arduino combined. In part 2, I also used processing and Arduino in tandem to create musical sounds based on the positioning of the mouse. In order to begin the process for part 1, I used the provided folder that sends multiple values from Arduino to processing for both my Arduino and Processing sketches. In this particular project, I hope to gain a broader understanding of how I can manipulate different variables within the project. By this I mean that I don’t just want to do the minimum, but I want to go beyond that and push the boundaries if I have time to do so. All code that I mention throughout this documentation can be viewed in the “My code” section at the bottom of this document.

Part 1

In order to begin this part, I first needed to physically set up my breadboard and Arduino by plugging in two different potentiometers to the board. These two potentiometers were to serve as my controls for the etch-a-sketch once the final process was in motion. For now, I assigned these two potentiometers in Arduino coding as serial.print (sensor 1) and serial.print(sensor 2) with comma lines in between. During this, I also assigned each sensor value to the correlated analog value (in this case A0 and A5) under void loop. Through these steps, my Arduino code was set and ready to use processing as a canvas. For the processing portion of this step, I also used Arduino to processing under the multiple values folder to facilitate the process of connecting the code with the physical board. To create this, I first inserted my port # [6] and also created 2 number values defined at the beginning of my code. These two values correlated with the 2 sensor values I had created in Arduino to link with the two potentiometers I had. After doing so, I created an ellipse ( ellipse(sensorValues[0], sensorValues[1], 150, 150); ) so become the base of the etch-a-sketch. After, I ran the processing sketch and used the potentiometers to control the x and y orientations on my screen which created a messy picture. A video of the process can be viewed below.

Part 2

The objective of part two was to create a musical instrument using techniques from Arduino and processing combined together. For the physical portion, I just need a buzzer to convey the sound of my instrument. In the draw portion of processing I inserted high and low notes to correlate with different sections of the canvas. To split the canvas in half and have each note correlate with one side of it. To do this, I created (mouseX > width/2) which said whenever I move the mouse to a select side, the note (high or low) would play on that side. To send a value to the Arduino, I also created the same code (mouseX > width/2) along with the high and low notes. Somehow the video I recorded that day has become lost within my computer so while I cannot give a comprehensive video of the project, I can provide this picture of the setup. Essentially, when I would move my mouse to one side of the screen it would make a high pitched note. And when I would move my mouse to the opposite side of the screen, a low pitched sound would play on the speaker as a result. 

Reflection

In both projects, my code and process went as planned. So far as smoothness goes, this was my most successful recitation. Unfortunately, I did not get to further work with my projects and manipulate their variables as planned. In my off time, I plan to further pursue the musical project to an extent and possibly include it in my final project. I think for my project, it could be a useful tool when hovering or clicking on things on the screen. Seeing as the basis of my project so far is allocated on processing and involved with sound, this is an extremely useful skill to have for the future. 

My code

Part 1 Etch-a-sketch

Arduino code:

// IMA NYU Shanghai
// Interaction Lab
// For sending multiple values from Arduino to Processing


void setup() {
  Serial.begin(9600);
}

void loop() {
  int sensor1 = analogRead(A0);
  int sensor2 = analogRead(A5);

  // keep this format
  Serial.print(sensor1);
  Serial.print(",");  // put comma between sensor values
  Serial.print(sensor2);
  Serial.println(); // add linefeed after sending the last sensor value

  // too fast communication might cause some latency in Processing
  // this delay resolves the issue.
  delay(100);
}

Processing code:

// IMA NYU Shanghai
// Interaction Lab
// For receiving multiple values from Arduino to Processing

/*
 * Based on the readStringUntil() example by Tom Igoe
 * https://processing.org/reference/libraries/serial/Serial_readStringUntil_.html
 */

import processing.serial.*;

String myString = null;
Serial myPort;


int NUM_OF_VALUES = 2;   /** YOU MUST CHANGE THIS ACCORDING TO YOUR PROJECT **/
int[] sensorValues;      /** this array stores values from Arduino **/


void setup() {
  size(500, 500);
  background(0);
  setupSerial();
}


void draw() {
  updateSerial();
  printArray(sensorValues);
  ellipse(sensorValues[0], sensorValues[1], 150, 150);
  
  

  // use the values like this!
  // sensorValues[0] 

  // add your code

  //
}



void setupSerial() {
  printArray(Serial.list());
  myPort = new Serial(this, Serial.list()[6], 9600);
  // WARNING!
  // You will definitely get an error here.
  // Change the PORT_INDEX to 0 and try running it again.
  // And then, check the list of the ports,
  // find the port "/dev/cu.usbmodem----" or "/dev/tty.usbmodem----" 
  // and replace PORT_INDEX above with the index number of the port.

  myPort.clear();
  // Throw out the first reading,
  // in case we started reading in the middle of a string from the sender.
  myString = myPort.readStringUntil( 10 );  // 10 = '\n'  Linefeed in ASCII
  myString = null;

  sensorValues = new int[NUM_OF_VALUES];
}



void updateSerial() {
  while (myPort.available() > 0) {
    myString = myPort.readStringUntil( 10 ); // 10 = '\n'  Linefeed in ASCII
    if (myString != null) {
      String[] serialInArray = split(trim(myString), ",");
      if (serialInArray.length == NUM_OF_VALUES) {
        for (int i=0; i<serialInArray.length; i++) {
          sensorValues[i] = int(serialInArray[i]);
        }
      }
    }
  }
}

Part 2 Musical Instrument:

Arduino code:

// IMA NYU Shanghai
// Interaction Lab
// This code sends one value from Processing to Arduino 

import processing.serial.*;

Serial myPort;
int valueFromArduino;


void setup() {
  size(500, 500);
  background(0);

  printArray(Serial.list());
  // this prints out the list of all available serial ports on your computer.
  
  myPort = new Serial(this, Serial.list()[6], 9600);
  // WARNING!
  // You will definitely get an error here.
  // Change the PORT_INDEX to 0 and try running it again.
  // And then, check the list of the ports,
  // find the port "/dev/cu.usbmodem----" or "/dev/tty.usbmodem----" 
  // and replace PORT_INDEX above with the index number of the port.
}


void draw() {
  // to send a value to the Arduino
  if (mouseX > width/2) {
    myPort.write('H');
  } else {
    myPort.write('L');
  }
}

Processing code:

// IMA NYU Shanghai
// Interaction Lab
// This code sends one value from Processing to Arduino 

import processing.serial.*;

Serial myPort;
int valueFromArduino;


void setup() {
  size(500, 500);
  background(0);

  printArray(Serial.list());
  // this prints out the list of all available serial ports on your computer.
  
  myPort = new Serial(this, Serial.list()[6], 9600);
  // WARNING!
  // You will definitely get an error here.
  // Change the PORT_INDEX to 0 and try running it again.
  // And then, check the list of the ports,
  // find the port "/dev/cu.usbmodem----" or "/dev/tty.usbmodem----" 
  // and replace PORT_INDEX above with the index number of the port.
}


void draw() {
  // to send a value to the Arduino
  if (mouseX > width/2) {
    myPort.write('H');
  } else {
    myPort.write('L');
  }
}