designinginteractivespaces

[designinginteractivespaces]

Course materials:

https://www.sensory.cc/ciid-summer-2018

[designinginteractivespaces]

Course survey

http://ciid.dk/cph2018w3ws2/

[designinginteractivespaces]

Today before lunch

———————————————— 09:30 - 10:00 - Overview for the day 10:00 - 12:30 - Prepare the Space for the exhibit / Make Video / Share Work

Making Videos: * Create an Overview of the project * Capture genuine / spontaneous interactions * Show the touchpoint of the interaction * Reveal the magic / technology * SEND: Google Photos / YouTube / Vimeo link

Share your process and your work: https://airtable.com/shrlqbHZipG7LNQgX

[designinginteractivespaces]

We are meeting between 9:30 to 10:00.

[designinginteractivespaces]

View this post on Instagram

A post shared by pier dr (@pierdr)

[designinginteractivespaces]

View this post on Instagram

A post shared by pier dr (@pierdr)

[designinginteractivespaces]

This is the code used to connect all the phones in the classroom, like we did yesterday. import controlP5.*;

import websockets.*;

import tramontana.library.*; import controlP5.*;

ArrayList<Tramontana> nodes; String ipAddrs[] = {"192.168.12.121","192.168.12.119","192.168.8.117","192.168.8.95","192.168.10.195","192.168.10.92","192.168.12.75","192.168.14.56","192.168.12.112","192.168.14.95","192.168.10.114","192.168.8.116","192.168.12.133","192.168.12.155","192.168.12.90","192.168.14.74","192.168.10.60","192.168.8.187","192.168.12.116"};

ControlP5 cp5;

void setup() {  size(560,200);  nodes = new ArrayList<Tramontana>();  class tramontanaStartTask extends java.util.TimerTask {      PApplet app;      String ipAdd;      ArrayList list;      public void setupTask(PApplet app,String t, ArrayList list) {        this.app = app;        this.ipAdd = t;        this.list = list;      }      public void run(){          list.add(new Tramontana(app,ipAdd));      }  }  for(int i=0;i<ipAddrs.length;i++)  {      nodes.add(new Tramontana(this, ipAddrs[i]));      nodes.get(nodes.size()-1).subscribeTouch();  }

 cp5 = new ControlP5(this);  cp5.addButton("play")     .setValue(128)     .setPosition(20,100)     ;  cp5.addButton("takePicture")     .setValue(128)     .setPosition(120,100)     ;  cp5.addButton("takePictureFront")     .setValue(128)     .setPosition(220,100)     ;  cp5.addButton("subscribe")     .setValue(128)     .setPosition(320,100)     ; }

void draw() {

} public void play(int theValue) {  color c = color(random(255),random(255),random(255));

 for(int i =0;i<nodes.size();i++)  {    nodes.get(i).setColor((int)red(c),(int)green(c),(int)blue(c),255);  } } public void takePicture(int theValue) {  color c = color(255,random(255),random(255));

 for(int i =0;i<nodes.size();i++)  {    nodes.get(i).setColor((int)map(i,0,1,0,255),(int)map(i,0,1,255,128),(int)map(i,0,1,255,0),255);    nodes.get(i).takePicture();  } } public void takePictureFront(int theValue) {  color c = color(255,random(255),random(255));

 for(int i =0;i<nodes.size();i++)  {    nodes.get(i).setColor((int)map(i,0,1,0,255),(int)map(i,0,1,255,128),(int)map(i,0,1,255,0),255);    nodes.get(i).takePicture();  } } public void subscribe(int theValue) {  color c = color(255,random(255),random(255));

 for(int i =0;i<nodes.size();i++)  {    nodes.get(i).setColor((int)map(i,0,1,0,255),(int)map(i,0,1,255,128),(int)map(i,0,1,255,0),255);    nodes.get(i).takePicture();  } } void onTouchDownEvent(String ipAddress, int x, int y) {  for(int i =0;i<nodes.size();i++)  {    if(nodes.get(i).ipAddress.equals(ipAddress))    {      nodes.get(i).setColor(0,0,0,0);    }  } }

void onTouchEvent(String ipAddress, int x, int y) {  int index = 0;  for(int i =0;i<nodes.size();i++)  {    if(nodes.get(i).ipAddress.equals(ipAddress))    {      nodes.get(i).setColor(255,255,255,255);      index = i;       break;    }  }  for(int i =1;i<nodes.size()/2;i++)  {    int frontIndex = (index-i<0)?nodes.size()+(index-i):index-i;    int backIndex =  (index+i>=nodes.size())?index+i-nodes.size():index+i;    //235  149  122      //66  157  213      nodes.get(frontIndex).setColor((int)(map(i,0,nodes.size()/2,235,66)),(int)(map(i,0,nodes.size()/2,149,157)),(int)(map(i,0,nodes.size()/2,122,213)),255);    nodes.get(backIndex).setColor((int)(map(i,0,nodes.size()/2,235,66)),(int)(map(i,0,nodes.size()/2,149,157)),(int)(map(i,0,nodes.size()/2,122,213)),255);

 } }

[designinginteractivespaces]

View this post on Instagram

A post shared by pier dr (@pierdr)

[designinginteractivespaces]

How might we... ?

How might we use the ____ to ____ with _____ ?

How might we create ____with___to____ ?

How might we showcase ____ with ____ in order to _____ ?

[designinginteractivespaces]

Sketch #4

import websockets.*; import tramontana.library.*;

Tramontana device1; Tramontana device2;

void setup() {  device1 = new Tramontana(this, "10.12.14.92");  device2 = new Tramontana(this, "10.12.10.183"); } void draw() {

} void keyPressed() {  //device1.makeVibrate();  device1.setColor(0,255,0,10);  device2.setColor(0,255,0,10); }

[designinginteractivespaces]

Follow - Rain

int FOLLOW = 0; int RAIN = 1; int state = FOLLOW;

int x=0, y=0;

float posY1 = random(0,height/2); float posY2 = random(0,height/2); float posY3 = random(0,height/2); float posY4 = random(0,height/2);

float posX1 = random(0,600); float posX2 = random(0,600); float posX3 = random(0,600); float posX4 = random(0,600);

void setup() {  size(600,600); } void draw() {  background(242,180,242);  if(state == FOLLOW)  {    rectMode(CENTER);   ��rect((mouseX+x)/2,(mouseY+y)/2,30,30);    x = mouseX;    y = mouseY;  }  else if(state == RAIN)  {      rect(posX1,posY1,10,10);      posY1 = posY1 +1;      rect(posX2,posY2,10,10);      posY2 = posY2 +1;      rect(posX3,posY3,10,10);      posY3 = posY3 +1;      rect(posX4,posY4,10,10);      posY4 = posY4 +1;  }  saveFrame(); } void keyPressed() {   if(key=='a')   {     state = RAIN;      posY1 = random(0,height/2);       posY2 = random(0,height/2);       posY3 = random(0,height/2);     posY4 = random(0,height/2);   }   else if(key == 'b')   {     state = FOLLOW;   } }