disseny d'interacció: arduino

20
Grau en Multimèdia Curs 2013/14 – 2 n Semestre Disseny d'Interacció PAC2 – Arduino Autor Jordi Zango Novell [email protected] Data de lliurament 25/04/2014

Upload: jordi-zango-novell

Post on 09-Jan-2017

228 views

Category:

Technology


0 download

TRANSCRIPT

Page 1: Disseny d'interacció: Arduino

Grau en Multimèdia Curs 2013/14 – 2n Semestre

Disseny d'InteraccióPAC2 – Arduino

Autor

Jordi Zango [email protected]

Data de lliurament

25/04/2014

Page 2: Disseny d'interacció: Arduino

Índex

1. Objectiu.............................................................................................................3

2. Procés...............................................................................................................4

2.1.El disseny a obtenir....................................................................................4

2.2.Els components..........................................................................................4

2.3.Fase 1. Sensor de so més un LED............................................................5

2.4.Fase 2. Afegir LEDs i establir llindars de so...............................................6

2.5.Fase 3. Afegir LEDs per a condicions de poca llum...................................8

2.6.Fase 4. Afegir sensor LDR.......................................................................10

2.7.Fase 5 i última. Incorporar Ethernet Shield..............................................13

2.8.Vídeo del disseny.....................................................................................17

2.9.Vista del disseny final...............................................................................18

3. Conclusió........................................................................................................19

4. Fonts...............................................................................................................20

5. Llicència..........................................................................................................20

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 2

Page 3: Disseny d'interacció: Arduino

1. Objectiu

1. ObjectiuL'objectiu principal d'aquest treball és aprofundir en el disseny i realització d'unprojecte d'electrònica digital, orientat a resoldre tasques senzilles.

El disseny a desenvolupar es farà amb Arduino i ha d'incorporar l'ús d'un mínimde dos sensors i un actuador.

El prototip s'haurà de realitzar emprant la placa de proves (protoboard) i s'ha dedocumentar esquemàticament el conjunt amb l'eina Fritzing.

A més de documentar el procés en aquest document, també s'haurà de penjarun vídeo on es vegi el disseny en funcionament (a la plataforma Vimeo).

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 3

Page 4: Disseny d'interacció: Arduino

2. Procés

2. ProcésDonat que fins trobar-me amb aquesta assignatura no coneixia Arduino, m'hasemblat que el millor era afrontar aquest projecte en etapes successives peranar aconseguint petites parts funcionals i no seguir endavant fins que cadauna d'elles sigui operativa.

D'aquesta manera em serà més fàcil entendre el que estic fent i depurarpossibles errors.

2.1. El disseny a obtenir

El que em proposo fer és un circuit que respongui al so ambiental. D'aquestamanera, he pensat emprar tres LEDs (verds) que s'encendran en funció delnivell de so que es capti, tot i emprant tres trams o llindars per activar-los deforma successiva i de menys a més volum.

Tanmateix, vull incorporar un sensor de llum de manera que, a més dels LEDsprincipals de color verd, s'encenguin altres tres més de color vermell en casque la llum ambiental no superi un llindar determinat.

És a dir, hi haurà 3 LEDs verds que s'encendran o no en funció del volum delso d'ambient i 3 LEDs vermells que també faran el mateix però només en casque gairebé s'estigui a les fosques.

Finalment, i tenint en ment explorar alternatives de cara al projecte final del'assignatura, he decidit també experimentar per a veure com establircomunicació entre l'Arduino i un ordinador.

2.2. Els components

Aquesta és la llista de components que he emprat:

• 1 placa Arduino UNO rev.3• 1 protoboard• 1 cable connexió USB• 3 LEDs de color verd• 3 LEDs de color vermell• 6 resistències de 470 Ohms• 1 resistència de 1K Ohms• 1 sensor LDR (sensor de llum)• 1 sensor de so• 13 cables de connexió• 1 Ethernet Shield

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 4

Page 5: Disseny d'interacció: Arduino

2. Procés

2.3. Fase 1. Sensor de so més un LED

Per a comprovar com funciona el sensor de so, primer implemento un circuitamb aquest sensor i només un LED que s'activarà al sobrepassar un llindar devolum.

int led = 8;int llindar = 400;int volum; void setup() { Serial.begin(9600); pinMode(led, OUTPUT); } void loop() { volum = analogRead(A0); if(volum>=llindar){ digitalWrite(led, HIGH); } else{ digitalWrite(led, LOW); }}

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 5

Page 6: Disseny d'interacció: Arduino

2. Procés

2.4. Fase 2. Afegir LEDs i establir llindars de so

Un cop comprovat el funcionament del sensor LDR amb un LED, afegeixo dosLEDs més i estableixo tres marges de llindar de so per a que s'encenguinprogressivament.

int ledVerd1 = 8;int ledVerd2 = 9;int ledVerd3 = 10;int llindar1 = 300;int llindar2 = 600;int llindar3 = 900;

int volum; void setup() { Serial.begin(9600); pinMode(ledVerd1, OUTPUT); pinMode(ledVerd2, OUTPUT); pinMode(ledVerd3, OUTPUT); } void loop() { volum = analogRead(A0); if(volum>llindar1){ digitalWrite(ledVerd1, HIGH); } else{

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 6

Page 7: Disseny d'interacció: Arduino

2. Procés

digitalWrite(ledVerd1, LOW); }

if(volum>llindar2){ digitalWrite(ledVerd2, HIGH); } else{ digitalWrite(ledVerd2, LOW); }

if(volum>llindar3){ digitalWrite(ledVerd3, HIGH); } else{ digitalWrite(ledVerd3, LOW); } }

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 7

Page 8: Disseny d'interacció: Arduino

2. Procés

2.5. Fase 3. Afegir LEDs per a condicions de poca llum

Incorporo els LEDs vermells per a que s'encenguin conjuntament amb els decolor verd.

int ledVerd1 = 8;int ledVerd2 = 9;int ledVerd3 = 10;int ledVermell1 = 11;int ledVermell2 = 12;int ledVermell3 = 13;int llindar1 = 300;int llindar2 = 600;int llindar3 = 900;

int volum; void setup() { Serial.begin(9600); pinMode(ledVerd1, OUTPUT); pinMode(ledVerd2, OUTPUT); pinMode(ledVerd3, OUTPUT); pinMode(ledVermell1, OUTPUT); pinMode(ledVermell2, OUTPUT); pinMode(ledVermell3, OUTPUT);

} void loop() {

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 8

Page 9: Disseny d'interacció: Arduino

2. Procés

volum = analogRead(A0); if(volum>llindar1){ digitalWrite(ledVerd1, HIGH); digitalWrite(ledVermell1, HIGH); } else{ digitalWrite(ledVerd1, LOW); digitalWrite(ledVermell1, LOW); }

if(volum>llindar2){ digitalWrite(ledVerd2, HIGH); digitalWrite(ledVermell2, HIGH); } else{ digitalWrite(ledVerd2, LOW); digitalWrite(ledVermell2, LOW); }

if(volum>llindar3){ digitalWrite(ledVerd3, HIGH); digitalWrite(ledVermell3, HIGH); } else{ digitalWrite(ledVerd3, LOW); digitalWrite(ledVermell3, LOW); } }

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 9

Page 10: Disseny d'interacció: Arduino

2. Procés

2.6. Fase 4. Afegir sensor LDR

Afegeixo el sensor de llum (LDR) i separo l'activació dels LEDs vermells per aque es doni només quan la llum estigui per sota d'un llindar determinat (afosques).

/*Disseny d'interaccioPAC2 - ArduinoUniversitat Oberta de CatalunyaCurs 2013-2014, 2n Semestreper Jordi Zango Novell*///Definicio de constants//========================================//LEDs verdsconst int ledVerd1 = 8;const int ledVerd2 = 9;const int ledVerd3 = 10;

//LEDs vermellsconst int ledVermell1 = 11;const int ledVermell2 = 12;const int ledVermell3 = 13;

//Sensorsconst int sensorSo = A0;const int sensorLlum = A2;

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 10

Page 11: Disseny d'interacció: Arduino

2. Procés

//Llindars per a lectures analogiquesconst int llindarSo1 = 192;const int llindarSo2 = 195;const int llindarSo3 = 197;const int llindarLlum = 100;

//Variables globals//=================int volum; //Per a lectura del soint llum; //Per a lectura de la llum

//Rutina de inicialitzacio//=========================void setup() { //Iniciar lectura port serial , a 9600 baudis Serial.begin(9600); //Definicio de modes per als pins dels LEDs pinMode(ledVerd1, OUTPUT); pinMode(ledVerd2, OUTPUT); pinMode(ledVerd3, OUTPUT); pinMode(ledVermell1, OUTPUT); pinMode(ledVermell2, OUTPUT); pinMode(ledVermell3, OUTPUT); }

//Bucle principal//===============void loop() { //Lectures analogiques volum = analogRead(sensorSo); llum = analogRead(sensorLlum); //Mode depuracio //Serial.println(volume); //delay(100); /* En cada tram, si es supera el llindar de so, encendre el LED verd corresponent al tram i (en cas de no haver-hi prou llum) tambe el LED vermell */ //Primer tram de so if(volum>llindarSo1){ digitalWrite(ledVerd1, HIGH); if (llum<llindarLlum) digitalWrite(ledVermell1, HIGH); } else{ digitalWrite(ledVerd1, LOW); digitalWrite(ledVermell1, LOW); }

//Segon tram de so if(volum>llindarSo2){ digitalWrite(ledVerd2, HIGH);

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 11

Page 12: Disseny d'interacció: Arduino

2. Procés

if (llum<llindarLlum) digitalWrite(ledVermell2, HIGH); } else{ digitalWrite(ledVerd2, LOW); digitalWrite(ledVermell2, LOW); }

//Tercer tram de so if(volum>llindarSo3){ digitalWrite(ledVerd3, HIGH); if (llum<llindarLlum) digitalWrite(ledVermell3, HIGH); } else{ digitalWrite(ledVerd3, LOW); digitalWrite(ledVermell3, LOW); }}

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 12

Page 13: Disseny d'interacció: Arduino

2. Procés

2.7. Fase 5 i última. Incorporar Ethernet Shield

Finalment, afegeixo l'Ethernet Shield. En aquest cas, per tractar-se d'un shield,només cal encastar el shield damunt de l'Arduino i tornar a fer les mateixesconnexions que ja havia fet.

Les modificacions més importants tenen a veure amb el programari, on s'ha dedefinir la connexió de l'Arduino com si es tractés d'un servidor web i configurarla pàgina HTML a mostrar.

/*Disseny d'interaccioPAC2 - ArduinoUniversitat Oberta de CatalunyaCurs 2013-2014, 2n Semestreper Jordi Zango Novell(versio ampliada amb Ethernet Shield)*///Llibreries a incloure//=====================#include <SPI.h>#include <Ethernet.h> //Definicio de constants//======================//LEDs verdsconst int ledVerd1 = 8;const int ledVerd2 = 9;const int ledVerd3 = 10;

//LEDs vermellsconst int ledVermell1 = 11;const int ledVermell2 = 12;const int ledVermell3 = 13;

//Sensorsconst int sensorSo = A0;const int sensorLlum = A2;

//Llindars per a lectures analogiques

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 13

Page 14: Disseny d'interacció: Arduino

2. Procés

const int llindarSo1 = 192;const int llindarSo2 = 195;const int llindarSo3 = 197;const int llindarLlum = 100;

//Temps de refresc per al servidor webconst int tempsRefresc = 1;

//Variables globals//=================int volum; //Per a lectura del soint llum; //Per a lectura de la llum

//Configuracio de MAC i IP//========================byte mac[] = { 0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED };IPAddress ip(192,168,2,11);

//Inici de libreria Ethernet server amb el port 80 (port HTTP per defecte)EthernetServer server(80);

//Rutina de inicialitzacio//=========================void setup() { //Iniciar lectura port serial , a 9600 baudis Serial.begin(9600); //Definicio de modes per als pins dels LEDs pinMode(ledVerd1, OUTPUT); pinMode(ledVerd2, OUTPUT); pinMode(ledVerd3, OUTPUT); pinMode(ledVermell1, OUTPUT); pinMode(ledVermell2, OUTPUT); pinMode(ledVermell3, OUTPUT);

//Iniciar la connexio Ethernet i el servidor Ethernet.begin(mac, ip); server.begin(); Serial.print("IP local del servidor "); Serial.println(Ethernet.localIP());}

//Bucle principal//===============void loop() { //Lectures analogiques volum = analogRead(sensorSo); llum = analogRead(sensorLlum); //Mode depuracio //Serial.println(volume); //delay(100); /* En cada tram, si es supera el llindar de so, encendre el LED verd corresponent al tram i (en cas de no haver-hi prou llum)

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 14

Page 15: Disseny d'interacció: Arduino

2. Procés

tambe el LED vermell */ //Primer tram de so if(volum>llindarSo1){ digitalWrite(ledVerd1, HIGH); if (llum<llindarLlum) digitalWrite(ledVermell1, HIGH); } else{ digitalWrite(ledVerd1, LOW); digitalWrite(ledVermell1, LOW); }

//Segon tram de so if(volum>llindarSo2){ digitalWrite(ledVerd2, HIGH); if (llum<llindarLlum) digitalWrite(ledVermell2, HIGH); } else{ digitalWrite(ledVerd2, LOW); digitalWrite(ledVermell2, LOW); }

//Tercer tram de so if(volum>llindarSo3){ digitalWrite(ledVerd3, HIGH); if (llum<llindarLlum) digitalWrite(ledVermell3, HIGH); } else{ digitalWrite(ledVerd3, LOW); digitalWrite(ledVermell3, LOW); } //Mostrar info des del servidor EthernetClient client = server.available(); //Escoltar a clientes entrants if (client) { //Cas que es connecti un client al servidor Serial.println("Nou client connectat"); boolean currentLineIsBlank = true; //Marcador per a enviar resposta des del servidor while (client.connected()) { //Repetir iteracio mentre hi hagi cap client connectat if (client.available()) { char c = client.read(); Serial.write(c); //Imprimir pel port serial la peticio del client (caracter a caracter) if (c == '\n' && currentLineIsBlank) { //Enviar resposta a una peticio del client quan aquesta ha finalitzat // Resposta del servidor client.println("HTTP/1.1 200 OK"); //Enviar capçalera de resposta HTTP estandar client.println("Content-Type: text/html"); client.println("Connection: close"); //Tancar connexio despr´s d'enviar la resposta client.print("Refresh: "); //Refrescar automaticamente la pagina cada 5 segons client.println(tempsRefresc); client.println();

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 15

Page 16: Disseny d'interacció: Arduino

2. Procés

client.println("<!DOCTYPE HTML>"); //Tipus de document //Info en format HTML client.println("<html>"); client.println("<head>"); client.println("<title>DI-PAC2-Arduino</title>"); client.println("</head>"); client.println("<body>"); client.println("<h1>Disseny d'Interacci&oacute;</h1>"); client.println("<h2>PAC2 - Arduino</h2>"); client.print("<p>IP local del servidor: "); client.print(Ethernet.localIP()); client.println("</p>"); client.print("<ul><li>Volum del so: "); client.print(volum); client.println("</li>"); client.print("<li>Nivell de llum: "); client.print(llum); client.println("</li>"); client.print("<li>Temps de connexi&oacute;: "); client.print(millis()/1000); //Temps de funcionament en ms client.println(" segons</li></ul>"); client.println("<p>Jordi Zango Novell (Curs 2014-2014, 2n Semestre)</p>"); client.println("</body>"); client.println("</html>"); //Etiqueta HTML finaldel document break; } if (c == '\n') { //En cas que el caracter sigui un salt de linia currentLineIsBlank = true; //Peticio finalitzada, es respon a la peticio en proper cicle } else if (c != '\r') { //Si el caracter no es un retorn de carro (peticio no finalitzada) currentLineIsBlank = false; //Seguir escoltant la peticio } } } delay(1); //Espera per a donar temps al navegador per a rebre les dades client.stop(); //Tancar la connexio Serial.println("Client desconnectat"); Serial.println(); }}

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 16

Page 18: Disseny d'interacció: Arduino

2. Procés

2.9. Vista del disseny fnal

Per a claredat i atès que l'ús de l'Ethernet Shield no és rellevant per a lesconnexions fetes, s'omet la representació d'aquest en la representació gràficadel circuit.

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 18

Page 19: Disseny d'interacció: Arduino

3. Conclusió

3. ConclusióCom ja he comentat, no coneixia Arduino abans de començar aquestaassignatura i, la veritat, ha estat per a mi tot un descobriment.

Em sembla una eina perfecta per a testejar tot el que té a veure amb lainteracció, amb límits marcats només per la nostra pròpia imaginació.

Ha estat molt divertit començar a conèixer el seu funcionament i ha esdevingutun element motivador per a noves experiències i idees que vaig tenint sobre lamarxa, mentre faig aquest treball.

M'ha servit per a començar a plantejar un parell de dissenys entre els que triarper a la pràctica final.

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 19

Page 20: Disseny d'interacció: Arduino

4. Fonts

4. FontsArduino. The Arduino Playground. [en línia]. http://playground.arduino.cc/ [data de consulta: 21/04/2014]

Vilanova Ángeles, Santiago. (2011). Dispositius electrònics. Barcelona: FUOC

5. LlicènciaAquest treball és obra de Jordi Zango Novell, amb llicència Creative CommonsAtribució-NoComercial-CompartirIgual BY-NC-SA 3.0 Unported.

Disseny d'Interacció - PAC2per Jordi Zango Novell ([email protected]) 20