Driving with ambient media

A lot goes on when you drive a car. Your attention needs to be clear and fixed on the road, your mirrors, and whatever is happening around you. Moreover, the surrounding environment can be hectic with cars honking, traffic, pedestrians. It is a zone of constant, centered attention, and for some can be quite stressful. 

Yet, the car itself is also filled with ambient media. Take the dashboard as an example.  The dash can tell you about the gas level, how many miles per hour you’re driving, whether a door is open… but most of this information is calculated and shown in the background. You can bring bits of information to the center of your attention when you need to access it – say when you enter a zone with a lower mph and have to adjust. Alternatively, the car will bring information to your attention if something is wrong, like when a door has been improperly closed.

Contrasted with the video game example discussed in the Weiser and Brown article, the user experience is entirely different. Rather than balancing ambient or calm media with attention-grabbing media, these games barrage the user with information as a means to keep them engaged, excited and at times, overwhelmed. The car could display information in a way more akin to the video game – showcasing metrics more in your line of sight, or using sound to keep the user more abreast of the state of their car when everything is running smoothly. However, by maintaining this balance, car designers are making a choice about where the driver’s focus should be prioritized – on the road.

Midterm Project Proposal, Molly/ Sasha

Emergency wearable device idea

Molly Mahar, Sasha Volkov

 

TUI Proposal:

We propose creating a small, wearable device to be used in emergency situations. The goal of the device is to have a means of contacting the authorities in the event of an act of violence or failure of health, even if one’s phone is inaccessible. The device would act as a small, independent token (with a distant embodiment) that could communicate with a user’s phone, presumably via bluetooth. We have identified 3 potential target users of this device: students, domestic abuse victims and the elderly.

 

Example Use Case:

A female student is walking home late at night. She has her device setup to send an alert with a location via text to her roommate if she clicks it twice. Someone mugs her, they take her phone and start hitting her. She taps her device twice and it starts recording (which 911 can hear somehow) and sends her location and an emergency message to her roommate. She is recovered shortly, and the muggers are potentially on camera and has audio evidence.

 

Things we may want the token to do:

  • Accept/recognize a pattern-based pressure or safe word input (a secret handshake)
  • Record sound (for evidence)
  • Send an emergency notification including the user’s GPS coordinates to 911 and others of their choosing (preset)
  • Emit an audio or visual output to scare someone off or attract attention (ex: car alarm)
  • Allow access to info stored in an app/controlled through an app

 

Questions this brings up:

  • Should it just be a token or a container? In other words, do we store the data locally, in the cloud, or does it auto-transmit to authorities/ a trusted person?
  • How does this work if you’re separated from your phone? How much distance would we have available?
  • Would information be routed through central servers which actually send the call/information?
  • What are the privacy concerns here, if any?
  • Where can you can wear it? Is it waterproof?
  • How do we account for battery life?
  • What does it look like? Noun metaphor for elderly, versus ‘none’ metaphor for the other two populations?
  • What is the shape/size of the token, given certain demographic interests?

Going beyond the tangible

The first ‘UI’ I thought of after reading Fishkin’s article was an interactive art installation. I visited the PACE gallery in Menlo Park earlier this summer and witnessed a beautiful exhibit titled “Flowers and People – Dark”. In this exhibit, the computer powering it is continually rendering blossoming flowers in real time. What makes this work a TUI is that the interaction between the user and installation drives the animation. As the user approaches the wall, flowers will begin to blossom in greater quantities in front of them. As a result, the animation is always unique.

This is a atypical TUI as it is not tangible. Yet according to Fishkin, it would be considered an environmental form of embodiment. It was only after reading his four levels of the embodiment characteristic that I realized the installation was in fact a TUI, helping me rethink my entire interaction with it.

His explanation of metaphor where he asks “is the system effect of a user action analogous to the real-world effect of similar actions” (p. 349) also added to the fantasy of what I experienced in the exhibit. Approaching a flower and it blossoming is something fantastical, but when thinking of it in terms of metaphor, it managed to further enhance the work. The artist has pushed beyond what is real and expected, and crossed over into whimsy and fairy tale. By thinking of how the work fits into Fishkin’s taxonomy and recognizing the elements of metaphor and embodiment, I was able to better appreciate it and the artist.

Dimming and scales

Components:

  • Arduino Uno
  • Breadboard
  • 3x potentiometers
  • 3x LEDs (red, green, blue)
  • 3x 220Ω resistors
  • 18x wires
  • 1 USB cable
  • 1 Mac computer


Option 2:

I added my three pots to the breadboard, such that each pot was synced up with an individual LED, and to digital pins in the arduino. This round of code allows for each pot to control the brightness of a single LED. Note that because analogRead reads analog voltage (max value of 1023), while analogWrite writes a digital voltage (max value of 255), we have to divide the analog value by 4 to map to digital.

Photo of LEDs with different levels of brightness


CODE:

int potPin1 = A0;
int potPin2 = A2;
int potPin3 = A3; // Analog input pin that the potentiometer is attached to
int potValue1 = 0;
int potValue2 = 0;
int potValue3 = 0; // value read from the pot
int blueLed = 9; 
int redLed = 10;
int greenLed = 11; // PWM pin that the LED is on. n.b. PWM 0 is on digital pin 9
 
void setup() {
 // initialize serial communications at 9600 bps:
 Serial.begin(9600);
 // declare the led pin as an output:
 pinMode(blueLed, OUTPUT);
 pinMode(redLed, OUTPUT);
 pinMode(greenLed, OUTPUT);
}
 
void loop() {
 potValue1 = analogRead(potPin1);
 potValue2 = analogRead(potPin2);
 potValue3 = analogRead(potPin3); // read the pot value
 analogWrite(blueLed, potValue1/4);
 analogWrite(redLed, potValue2/4);
 analogWrite(greenLed, potValue3/4); // PWM the LED with the pot value (divided by 4 to fit in a byte)
 Serial.println("hello"); // print the pot value back to the debugger pane
 delay(10); // wait 10 milliseconds before the next loop
}



Extra Credit:

Each LED is are hooked up to its own Pot, which is plugged into analog pins.  This code turns the red LED on first, followed by the blue and then green, with the green then turning off first, then the blue, and back to the red turning on and off in an ascending and descending sequence, similar to playing musical scales on a piano. Each LED’s pot determines how quickly that LED will blink, which allows for the creation of interesting patterns.

Watch the ascending and descending light sequence!


CODE

int sensorPin1 = A0;
int sensorPin2 = A2;
int sensorPin3 = A3; // select the input pin for the potentiometer
int redledPin = 13;
int blueledPin = 8;
int greenledPin = 12;// select the pin for the LED
int sensorValue1 = 0;
int sensorValue2 = 0;
int sensorValue3 = 0; // variable to store the value coming from the sensor

void setup() {
 // declare the ledPin as an OUTPUT:
 pinMode(redledPin, OUTPUT);
 pinMode(blueledPin, OUTPUT);
 pinMode(greenledPin, OUTPUT);
}

void loop() {
 // read the value from the sensor:
 sensorValue1 = analogRead(sensorPin1);
 sensorValue2 = analogRead(sensorPin2);
 sensorValue3 = analogRead(sensorPin3);
 
 // turn the ledPin on
 digitalWrite(redledPin, HIGH);
 // turn the ledPin off:
 delay(sensorValue1);
 digitalWrite(blueledPin, HIGH);
 delay(sensorValue2);
 digitalWrite(greenledPin, HIGH);
 delay(sensorValue3);
 
 digitalWrite(greenledPin, LOW);
 delay(sensorValue3);
 digitalWrite(blueledPin, LOW);
 delay(sensorValue2);
 digitalWrite(redledPin, LOW);
 delay(sensorValue1);
}

Beyond the canvas: Apple iPad

McCullough argues that hands are all about skilled learning – an underrated form of knowledge developed out of habit and practice. It’s a physical and experiential knowledge, found in actions like drawing or typing. In these moments, particularly when the hand is the tool of the mind to create forms of art like drawings, paintings or written works, it becomes clear that the two are connected. He also discussed the deskilling that has taken place as a result of the advancement of technology (ex: data entry jobs). 

With the advent of TUIs like the iPad, the pendulum has begun to swing in the opposite direction. The connection between mind and hand has been reestablished to allow skilled actions and processes (like drawing with one’s finger or the Apple Pencil), thereby transforming its surface into a digital piece of canvas. The goal of such devices, evidenced in their iconography, naming conventions and app designs, is to replicate the real world in a digital environment. Given these affordances and new UIs, the hand has once again become a necessary and skillful tool.

apple drawing

A new look on milk and coffee

Description:

I used the example code (_3_LED_Fading.txt and Serial_LED.txt) for this lab. The fading code faded one LED color in and out and into the next, forming the effect of new colors like purple and green.

Once that was tested and completed, I adjusted the serial LED code to accept user inputs via the Serial Monitor to adjust the brightness of each LED. Each r, g or b in the Serial Monitor now represents 10% of the possible brightness (255) of each LED. For example rrr = (3/10*255). As a diffuser, I used an old small milk bottle and stuffed it with 2 coffee filters to diffuse the light from the LEDs. The effect was pretty rad.


Components:

  • 1 Arduino
  • 1 Breadboard
  • 3 LEDs (b,r,g)
  • 3 Resistors (220 ohms)
  • 4 connecting wires
  • 1 USB cable
  • 1 Laptop
  • 1 Milk bottle
  • 2 Coffee filters

Code:

_3_LED_Fading

// Output
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

// Program variables
int redVal = 255; // Variables to store the values to send to the pins
int greenVal = 1; // Initial values are Red full, Green and Blue off
int blueVal = 1;

int i = 0; // Loop counter
int wait = 18; // 50ms (.05 second) delay; shorten for faster fades
int DEBUG = 0; // DEBUG counter; if set to 1, will write values back via serial

void setup()
{
pinMode(redPin, OUTPUT); // sets the pins as output
pinMode(greenPin, OUTPUT);
pinMode(bluePin, OUTPUT);
if (DEBUG) { // If we want to see the pin values for debugging…
Serial.begin(9600); // …set up the serial ouput on 0004 style
}
}

// Main program
void loop()
{
i += 1; // Increment counter
if (i < 255) // First phase of fades
{
redVal -= 1; // Red down
greenVal += 1; // Green up
blueVal = 1; // Blue low
}
else if (i < 509) // Second phase of fades
{
redVal = 1; // Red low
greenVal -= 1; // Green down
blueVal += 1; // Blue up
}
else if (i < 763) // Third phase of fades
{
redVal += 1; // Red up
greenVal = 1; // Green low
blueVal -= 1; // Blue down
}
else // Re-set the counter, and start the fades again
{
i = 1;
}

analogWrite(redPin, redVal); // Write current values to LED pins
analogWrite(greenPin, greenVal);
analogWrite(bluePin, blueVal);

if (DEBUG) { // If we want to read the output
DEBUG += 1; // Increment the DEBUG counter
if (DEBUG > 10) // Print every 10 loops
{
DEBUG = 1; // Reset the counter

Serial.print(i); // Serial commands in 0004 style
Serial.print(“t”); // Print a tab
Serial.print(“R:”); // Indicate that output is red value
Serial.print(redVal); // Print red value
Serial.print(“t”); // Print a tab
Serial.print(“G:”); // Repeat for green and blue…
Serial.print(greenVal);
Serial.print(“t”);
Serial.print(“B:”);
Serial.println(blueVal); // println, to end with a carriage return
}
}
delay(wait); // Pause for ‘wait’ milliseconds before resuming the loop
}

Serial_LED

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;
float colorVal;

int redPin = 11; // Red LED, connected to digital pin 9
int greenPin = 9; // Green LED, connected to digital pin 10
int bluePin = 10; // Blue LED, connected to digital pin 11

void setup() {
pinMode(redPin, OUTPUT); // sets the pins as output
pinMode(greenPin, OUTPUT);
pinMode(bluePin, OUTPUT);
Serial.begin(9600);
analogWrite(redPin, 80); // set them all to mid brightness
analogWrite(greenPin, 80); // set them all to mid brightness
analogWrite(bluePin, 80); // set them all to mid brightness

}

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’ ) {
colorVal = strlen(serInString);
colorVal = (colorVal/10*255); // the number of times you type r, g or b defines the brightness (% of)
if (colorVal>255)
{ // need a way to turn off our colors
colorVal = 0;}
Serial.print(“setting color “);
Serial.print(colorCode);
Serial.print(” to “);
Serial.print(colorVal);
Serial.println();
serInString[0] = 0; // indicates we’ve used this string
if(colorCode == ‘r’)
analogWrite(redPin, colorVal);
else if(colorCode == ‘g’)
analogWrite(greenPin, colorVal);
else if(colorCode == ‘b’)
analogWrite(bluePin, colorVal);
}

delay(100); // wait a bit, for serial data
}

//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++;
}
}

Hi! (in Morse Code)

Description


I used an Arduino with a red LED. I changed the code to light up in a “hi” pattern using Morse Code (… ..). The lights would blink 4 times rapidly (1/5 second on, 1/5 a second off) with a second pause, followed by blinking twice rapidly (1/5 second on, 1/5 second off). I uploaded the code and made sure that it has changed.

Components


  • 1 Arduino
  • 1 LED
  • 1 Resistor (220Ω)
  • 1 Breadboard
  • 1 Macbook Pro
  • 2 jumper cables

Photo


FullSizeRender (1)

Code


modified 31 Aug 2016
 by Sasha Volkov
 */

// the setup function runs once when you press reset or power the board
 void setup() {
 // initialize digital pin 13 as an output.
 pinMode(13, OUTPUT);
 }

// the loop function runs over and over again forever to spell out "hi" in Morse Code
 void loop() {
 digitalWrite(13, HIGH); // turn the LED on (HIGH is the voltage level)
 delay(200);
 digitalWrite(13, LOW); // turn the LED off by making the voltage LOW
 delay(200);
 digitalWrite(13, HIGH); // turn the LED off by making the voltage LOW
 delay(200);
 digitalWrite(13, LOW); // turn the LED off by making the voltage LOW
 delay(200);
 digitalWrite(13, HIGH); // turn the LED off by making the voltage LOW
 delay(200);
 digitalWrite(13, LOW); // turn the LED off by making the voltage LOW
 delay(200);
 digitalWrite(13, HIGH); // turn the LED off by making the voltage LOW
 delay(200);
 digitalWrite(13, LOW); // turn the LED off by making the voltage LOW - long pause
 delay(1000);
 digitalWrite(13, HIGH); // turn the LED off by making the voltage LOW
 delay(200);
 digitalWrite(13, LOW); // turn the LED off by making the voltage LOW
 delay(200);
 digitalWrite(13, HIGH); // turn the LED off by making the voltage LOW
 delay(200);
 digitalWrite(13, LOW); // turn the LED off by making the voltage LOW - long pause
 delay(1000);

}

A watch first, smart watch second

My dad bought me my first watch when I was 15. It was small, silver, and fit perfectly on my wrist. It was also one of the few gifts I received from him before he passed, so I cherished it. Every time I looked down at that watch, it acted as a small reminder of him. It fell off about 10 years later, but to replace the watch felt like I was moving forward without him.

This year, I decided the time was right, and opted for a smart watch. What I found was that most smart watches seem to be a watch second, and ‘smart’ first. The Apple Watch for example is saddled with apps that are hard to select (fat finger syndrome) and buzz constantly. The original intent of it being a watch felt lost, irrelevant.

I came across the Withings watch (pictured below) and instantly fell in love. Why I felt this way was clarified by the Dourish reading, where he posits “tangible computing is exploring how to get the computer ‘out of the way’ and provide people  with a much more direct – tangible – interaction experience.” (p.16). The Withings watch’s UI is all watch. It tells time. Yet, the unobtrusive second circle tracks my steps and works with an app behind the scenes to store data about my sleep and health. It is minimalist, simple, elegant, yet powerful.

Tangible interaction, as Dourish writes, is a means of exploiting “the ways we experience the everyday world” (p.17). My new watch is the embodiment of an analog user wanting more, without giving up the ability to look at my wrist and instantly know the time.