Lab 2: Digital I/O with Arduino Boards

Ryan Qiao
4 min readSep 15, 2021

--

Ryan Qiao. Professor Kimiko Ryokai. Tangible User Interfaces, Fall 2021

Description

In this lab, we explored some of the digital features of the Arduino Board. Specifically, we learned about:

  1. Pulse Width Modulation (PWM) “fakes” analog behavior using digital signals.
  2. Serial communication with the laptop allowing for greater design flexibility.

In the homework portion of the assignment, apart from improving the code to allow better control of the lights based on user input, we designed and prototyped a diffuser for the lights. I enjoyed playing with materials of different textures and defusing abilities and seeing how their interaction with the light varies.

PART 1: FROM BLINKING TO FADING

I started with the LED circuit for the “Blinking LED” Assignment and moved the controlling wire from Pin 13 to Pin 9. I then loaded the example code from the Arduino Sketchbook (File‐>Examples‐>Analog‐>Fading). The light starts to fade!

PART 2: FADING 3 LEDs

I extended the circuit so that it includes 3 LEDs according to the given diagrams.

The thing I noticed here is how the wires leaving the negative end of the LEDs are connected together by the ground column of the breadboard that’s indicated by the blue line.

PART 3: SERIAL COMMUNICATIONS

In this step, I explored Arduino’s Serial Communication feature. I followed the code provided in the assignment and read through each line to make sure I understand what’s going on.

HOMEWORK PART 1

In this part of the homework, I got to play with materials of various textures and physicalities and to observe how they interact with the RGB lights. In the beginning, I tried out things such as Mason jars and water cups, but the 3 lights still looked separated. So I went to look for something with a rougher surface and thus more diffusing power. With this in mind, I found a piece of lace cloth that diffused the lights a lot more while also adding dimensions to it. I folded the lace cloth several times and although the thicker the material the dimmer the light, the thickness of the material provides a smoother diffusion.

HOMEWORK PART 2

I change the code so that I can control the RGB values with multiple key presses. For example, pressing ‘r’ 5 times will set the brightness to 50% (or brightness = 127), and pressing ‘r’ 10 times will set it to 100% (or brightness = 255)

Components Used

  • Arduino
  • Breadboard
  • Wires
  • 3 LEDs (red, green, blue)
  • Resistors (220Ω)
  • Diffuser (lace cloth and glitter backdrop)

Code

/* 
* Serial RGB LED
* ---------------
* Serial commands control the brightness of R,G,B LEDs
*
* Command structure is "<colorCode><colorVal>", where "colorCode" is
* one of "r","g",or "b" and "colorVal" is a number 0 to 255.
* E.g. "r0" turns the red LED off.
* "g127" turns the green LED to half brightness
* "b64" turns the blue LED to 1/4 brightness
*
* Created 18 October 2006
* copyleft 2006 Tod E. Kurt <tod@todbot.com
* http://todbot.com/
*/
char serInString[100]; // array that will hold the different bytes of the string. 100=100characters;
// -> you must state how long the array will be else it won't work properly
char colorCode;
int colorVal;
int redPin = 9; // Red LED, connected to digital pin 9
int greenPin = 10; // Green LED, connected to digital pin 10
int bluePin = 11; // Blue LED, connected to digital pin 11
float redVal = 0;
float greenVal = 0;
float blueVal = 0;
void setup() {
pinMode(redPin, OUTPUT); // sets the pins as output
pinMode(greenPin, OUTPUT);
pinMode(bluePin, OUTPUT);
Serial.begin(9600);
analogWrite(redPin, 0); // set them all to 0
analogWrite(greenPin, 0); // set them all to 0
analogWrite(bluePin, 0); // set them all to 0
Serial.println("control the RGB values with multiple key presses. e.g., pressing ‘r’ 5 times will set the brightness to 50% (or brightness = 127)");
}
void loop () {
// clear the string
memset(serInString, 0, 100);
//read the serial port and create a string out of what you read
readSerialString(serInString);

colorCode = serInString[0];
if( colorCode == 'r' || colorCode == 'g' || colorCode == 'b' ) {
Serial.print("setting brightness ");
Serial.print("of ");
Serial.print(colorCode);
Serial.print(" to ");
serInString[0] = 0; // indicates we've used this strings
switch (colorCode) {
case 'r':
redVal = getVal(redVal);
analogWrite(redPin, redVal);
break;
case 'g':
greenVal = getVal(greenVal);
analogWrite(greenPin, greenVal);
break;
case 'b':
blueVal = getVal(blueVal);
analogWrite(bluePin, blueVal);
break;
}

}

delay(100); // wait a bit, for serial data
}
// get the value of the light from the user input
float getVal (float light) {
float val;
if (light == 255) {
val = 0;
} else {
val = light + 25.5;
}
Serial.print(val / 2.55);
Serial.print("%");
Serial.println();
return val;
}
//read a string from the serial and store it in an array
//you must supply the array variable
void readSerialString (char *strArray) {
int i = 0;
if(!Serial.available()) {
return;
}
while (Serial.available()) {
strArray[i] = Serial.read();
i++;
}
}

Videos

--

--

Ryan Qiao
0 Followers

I’m a second year MIMS student at UC Berkeley. My focus is in product management, and my interests are in HCI, arts + tech, and entrepreneurship.