Write an application that interfaces a user with an input and/or output device that you made
Group Assignment
Compare as many tool options as possible. view page
Learning Outcomes
Interpret and implement design and programming protocols to create a Graphic User Interface (GUI).
Individual Assignment
This weeks assignment is to create interfaces to my boards using serial communication. I decided to use Processing to create the interface. I first downloaded the application from this link https://processing.org/download/ and followed the instruction from https://processing.org/tutorials/gettingstarted/ for installing the application.
Interfacing with Processing
Processing is a flexible software sketchbook and a language for learning how to code within the context of the visual arts. First I tried learning the basics of the application by trying out a simple program. So for this purpose I used my Hello Eco Board I made during the ELECTRONICS DESIGN week.
Using Arduino I made a program to print '1', '2', '3' & '4' Arduino Code
My next step is to set up a serial communication to connect the Hello Echo Board, which sends out '1', '2', '3' & '4' to an example serial code in Processing. To find the example codes go to File > Examples. In the folder libraries you’ll find a Serial Library. I first used the SimpleRead library.
Then the simple read code will appear on the screen.
I changed the portname to the corresponding port where I have connected the board to the PC, and aso the baud rate.
After the seting up the right port. The program checks, reads, if there’s data coming from the serial port. It read the data and stores it in val, which is a integer defined on top of the program. In this part I also added a print line. This time I added println(val); to double check what my code is receiving
I connected my Hello Eco Board and run the code.
As you can see the result gave numbers 49, 50, 51, 52, these are the ASCII values corresponding to 1, 2, 3, 4 respectively. To create a visual representation of the communication between my board and processing. I edited the given code in a very simple way.
import processing.serial.*;
Serial myPort; // Create object from Serial classint val; // Data received from the serial portvoidsetup()
{
size(200, 200);
myPort = new Serial(this, "/dev/ttyUSB0", 9600);
}
voiddraw()
{
if ( myPort.available() > 0) { // If data is available
val = myPort.read(); // read it and store it in valprintln(val);
}
background(255); // Set background to whiteif (val == 0) { // If the serial value is 0,fill(0); // set fill to black
}
if (val == 49) { // If the serial value is 49,fill(255, 200, 200); // set fill to pink
}
elseif (val == 50) { // If the serial value is 50,fill(0, 200, 200); // set fill to turquoise
}
elseif (val == 51) { // If the serial value is 51,fill(127, 0, 0); // set fill to red
}
elseif (val == 52) { // If the serial value is 52,fill(0, 200, 0); // set fill to green
}
else { // If the serial value is not 0,fill(204); // set fill to light gray
}
rect(50, 50, 100, 100);
}
I connected my Hello Eco Board and ran the code.
Setting up serial communication with my Presence Board
I wanted to make an interface that display the readings from the ultrasonic sensor on the presence board I made during the INPUT DEVICES week.
I used the processing code made by Nadine Tuhaimer for creating the interface. I made small modifications in the code to make the interface size bigger, and I also added colours to the interface. Processing code
import processing.serial.*;
Serial commPort; // The serial por // horizontal position of the graphfloat distance = 0;
String distance_measured;
voidsetup () {
// set the window size:size(800, 400);
//set the port to 4 cause that's the arduino port//set the baud rate to 9600
commPort = new Serial(this, "/dev/ttyUSB0", 9600);
// don't generate a serialEvent() unless you get a newline character:
commPort.bufferUntil('\n');
}
voiddraw () {
background(0); //color the backgound to blackstroke(204, 100, 0); //set the outline of the rectagle fill(127,0,0); //set the color redrect (50,150,700, 80); //draw a rectangle with these dimensions and x,y coordinates //draw triangle pointerstroke(204, 102, 0); //set the outline of the rectaglefill(0,200,0); //set the color greenrect(50,150,distance,80); // draw another rectangle but with height differing depending on the distance measuredtextAlign(CENTER);
text("Distance="+ distance_measured, 380, 100); // write the distance measured
}
void serialEvent (Serial commPort) {
// get the ASCII string:
distance_measured = commPort.readStringUntil('\n');
if (distance_measured != null) {
// trim off any whitespace:
distance_measured = trim(distance_measured);
// convert to an int and map to the screen height:
distance = float(distance_measured);
println(distance);
distance = map(distance, 0, 500, 15, 2000); // map the distance measured depending on the size of the rectangle I drew
}
}