You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository was archived by the owner on Jul 29, 2023. It is now read-only.
Ramo: Diseño de interfaz electrónica mediante Arduino (AUD5I022-1)
61
-
_____
62
-
## Etch a Sketch o Telesketch
63
-
Es un juquete para dibujar en vase a dos ejes (X e Y) inventado en 1959 por el francés André Cassagnes (23 de septiembre de 1926 – 16 de enero de 2013) quien en un principio le dio el nopmbre de "Pantalla Mágica" y que fue comercializado por primera vez en Estados Unidos con el nombre de Etch-A-Sketch por Ohio Art Company en 1960 y en España por Borrás. "la Pantalla Mágica". Tras la pelicula de Toy Story se volvió a popularizar.
Conectar dos cables desde Arduino.Uno a la primera protoboard (1PB):
88
-
+ 5V a canal positivo +
89
-
+ GND a canal negativo -
90
-
Conectar dos cables más para transpitir la corriente a la segunda protoboard (2PB). Esto puede no ser necesario dependiendo del tamaño de la protoboard a utilizar
91
-

92
-
93
-
#### Paso 2:
94
-
95
-
Acoplar tres potenciometros, dos los extremos de cada protobard (controles de el eje X y el eje Y) y uno extra más cerca del centro (para controlar el grosor de linea).
96
-
Cada potenciometro va conectado con 3 cables.
97
-
+ Canal positivo conectado a pin1 potenciometro (fila 1 y 20 en 1PB y fila 26 en 2PB)
98
-
+ Canal negativo conectado a pin3 potenciometro (fila 5 y 24 en 1PB y fila 30 en 2PB)
99
-
100
-
Desde Arduino.Uno
101
-
+ A0 conectado al pin2 potenciometro del eje X (fila 3 en 1PB)
102
-
+ A1 conectado al pin2 potenciometro del eje Y(fila 28 en 2PB)
103
-

104
-
(foto de los Potenciometros de eje X e Y aislados)
105
-
+ A2 conectado al pin2 potenciometro del grosor (fila 22 en 1PB)
106
-

107
-
(foto Potenciometro del grosor de linea aislado)
108
-
109
-
#### Paso 3:
110
-
111
-
Acoplar pulsador a protoboard, resistencia y conectar cables a respectivos pines:
112
-
113
-
+ Canal positivo de protoboard a pin superior
114
-
+ Digital 8 de Arduino.Uno a pin inferior
115
-
+ Resistencia entre pin inferior y canal negativo de protoboard
116
-

117
-
(foto del pulsador aislado)
118
-
Finalmente todo el circuito armado debería lucir se la siguiente manera:
// Utilizado para Evaluación Final del Electivo Mención I y S: Diseño de interfaz electrónica mediante Arduino
132
-
// Estudiantes Valentina Fuentes, Silvana Olivares y Pilar Vergara
133
-
// Profesor Aaron Montoya y Ayudante Ignacio Passalacqua
134
-
// Código de arduino trabajado en clases 02/06/23
135
-
// Basado en rl códig proporcionado por Trevor Shannon
136
-
// Para que el Etch a Sketch funcione se necesita de:
137
-
// Hardware:
138
-
// + Arduino uno
139
-
// + 2 Protoboard
140
-
// + 3 potenciometros
141
-
// + Pulsador
142
-
// + Resistencia de 220R
143
-
// + 5 cables rojos
144
-
// + 5 cables verdes
145
-
// + 1 cable blanco
146
-
// + 1 Cable azul
147
-
// + 2 amarillos
148
-
// Software:
149
-
// + Arduino IDE
150
-
// + Processing
151
-
152
-
153
-
//Codigo de arduino trabajado en clases 02/06/23
154
-
int potX;
155
-
int potY;
156
-
//agregamos un boton para reiniciar el dibujo
157
-
int borrar;
158
-
//agregamos una nueva variable que genera un rango en el grosor de la línea
159
-
int grosorLinea;
160
-
161
-
void setup() {
162
-
Serial.begin(9600);
163
-
}
164
-
165
-
void loop() {
166
-
potX = analogRead(A0);
167
-
potY = analogRead(A1);
168
-
grosorLinea = analogRead(A2);
169
-
// estamos seteando el grosor de la línea, para esto ocupamos la función de MAP
170
-
grosorLinea = map(grosorLinea, 0, 1023, 1, 10);
171
-
borrar = digitalRead(8);
172
-
Serial.print(potX);
173
-
Serial.print("");
174
-
Serial.print(potY);
175
-
Serial.print("");
176
-
Serial.print(grosorLinea);
177
-
Serial.print("");
178
-
Serial.println(borrar);
179
-
delay(50);
180
-
}
181
-
```
182
-
183
-
+### En Arduino:
184
-
Se establecen las variables:
185
-
+ potX / para almacenar el valor del eje X
186
-
+ potY / para almacenar el valor del eje X
187
-
+ borrar / para reiniciar el dibujo
188
-
+ grosorLinea / variable del grosor de línea
189
-
190
-
#### Void setup
191
-
Se inicia la comunicación serial en 9600 Baudios.
192
-
193
-
#### Void Loop
194
-
A las variables se le asignan los valores de pines análogos específicos ya mencionados y grosorLinea se mapea para poder redefinir el rango de 0-1024 para dejarlo en 1-10 (para tener 10 valores de linea distintos).
195
-
196
-
197
-
## Codigo para Processing:
198
-
```java
199
-
// Etch a Sketch
200
-
// Utilizado para Evaluación Final del Electivo Mención I y S: Diseño de interfaz electrónica mediante Arduino
201
-
// Estudiantes Valentina Fuentes, Silvana Olivares y Pilar Vergara
202
-
// Profesor Aaron Montoya y Ayudante Ignacio Passalacqua
203
-
// Código de arduino trabajado en clases 02/06/23
204
-
// Basado en el código proporcionado por workshopweekend
205
-
// Para que el Etch a Sketch funcione se necesita de:
206
-
// Hardware: // + Arduino uno // + 2 Protoboard
207
-
// + 3 potenciometros
208
-
// + Pulsador
209
-
// + Resistencia de 220R
210
-
// + 5 cables rojos
211
-
// + 5 cables verdes
212
-
// + 1 cable blanco
213
-
// + 1 Cable azul
214
-
// + 2 amarillos
215
-
// Software:
216
-
// + Arduino IDE
217
-
// + Processing
218
-
219
-
importprocessing.serial.*;
220
-
221
-
Serial port;
222
-
String serialInterface ="COM4";
223
-
int lastX =-1;
224
-
int lastY =-1;
225
-
int x;
226
-
int y;
227
-
int borrar =0;
228
-
int grosorLinea =1;
229
-
String nextXY="";
230
-
231
-
void setup() {
232
-
size(512, 512);
233
-
background(255);
234
-
port =newSerial(this, serialInterface, 9600);
235
-
port.bufferUntil('\n');
236
-
}
237
-
238
-
239
-
void draw() {
240
-
//ahora el boton para reiniciar la pantalla del sketch
241
-
if (borrar ==1) {
242
-
background(255);
243
-
}
244
-
String[] parts = splitTokens(nextXY);
245
-
//separamos la informacion que está llegando en tres datos
246
-
if (parts.length >=3) {
247
-
// está epartido en dos porque el canvas es de 512px, y los valores del potenciometro son el doble (0 a 1024)
248
-
//esto se puede solucionar con un mapeo, que sirve para setear nuevos rangos del potenciometro
249
-
x = int(parts[0])/2;
250
-
y = int(parts[1])/2;
251
-
grosorLinea = int(parts[2]);
252
-
borrar = int(parts[3]);
253
-
// print(borrar);
254
-
//aca estamos creando la linea a partir de los dos datos
255
-
if (lastX >=0&& lastY >=0) {
256
-
strokeWeight(grosorLinea);
257
-
line(x, y, lastX, lastY);
258
-
}
259
-
lastX = x;
260
-
lastY = y;
261
-
}
262
-
}
263
-
//pulsador para reiniciar el dibujo
264
-
//la pantalla vuelve a blanco
265
-
void mouseClicked() {
266
-
background(255);
267
-
}
268
-
//acá recibimos la información con la que vamos a hacer la linea de dibujo.
269
-
void serialEvent(Serial p) {
270
-
nextXY = p.readString();
271
-
print(x,y, grosorLinea);
272
-
print("\n");
273
-
274
-
}
275
-
276
-
```
277
-
+### En Processing
278
-
Nuevamente establecemos las misma variables que en Arduino.
279
-
#### Void setup
280
-
Se establecem las dimensionesel canva y el color del fondo.
281
-
#### Void Draw
282
-
Se dan las indicasiones para que el pulsador permita borrar lo anteriormente hecho.
283
-
Se separa la información que llega en tres datos.
284
-
Se establecen los límites de la línea (X, Y) con respecto al canva dado que los datos del potenciómetro duplica el tamaño del canva.
285
-
Se crea la línea con los dos datos que indican el grosor y la posición.
286
-
#### Void mouseClicked
287
-
Permite que al apretar el botón el fondo del canva vuelva a ser blanco.
288
-
#### Void serialEvent
289
-
Se recibe la información con la que vamos a hacer la línea de dibujo.
290
-
291
-
292
-
## Referentes y recursos adicionales
293
-
294
-
Para este proyecto ocupampos varios referentes y recursos adicionales para generar ambos códigos.
295
-
### Codigos basado en:
296
-
[Etch-a-Sketch por Workshop Weekend](http://workshopweekend.net/arduino/projects/etch_a_sketch)
297
-
298
-
Y una mencion especial a Paz Castro [Pabecy](https://github.com/Pabecy/clase-09-proyecto-mitad-semestre)
299
-
#### Recursos adicionales:
300
-
[PROCESSING: 3.12 Definir el grosor de linea: strokeWeight()](https://www.youtube.com/watch?v=LCjvERxDCxY) x Air Room [Enero 2016]
301
-
302
-
[Clase 04 - Comunicación serial y BotónPulsador](https://github.com/disenoUChile/aud5i022-2023-1/tree/main/clases/clase-04) x montoyamoraga [Abril 2023]
303
-
304
-
[Clase 05 - Potenciometro](https://github.com/disenoUChile/aud5i022-2023-1/tree/main/clases/clase-05) x montoyamoraga [Abril 2023]
305
-
306
-
307
-
## Concluciones y aprendizajes
308
-
- Logramos trabajar e integrar dos programas, arduino y processing para crear el juguete de nuestros sueños de infancia, desde que vimos toy story quisimos jugar con un etch a sketch.
309
-
- Integramos lo aprendido en clases para modificar los códigos encontrados en Internet y agregar un pulsador para borrar la pantalla y un potenciador para modificar el grosor de línea
310
-
- La mayor dificultad para nosotras fue el trabajar con processing, materializar nuestras ideas en códigos funcionales, como el código para modificar el espesor de línea.
311
-
312
-
Los mayores logros son:
313
-
- Crear un circuito funcional con potenciometros y pulsadores
314
-
- Obtener respuestas y cambios digitales a través de inputs análogos.
315
-
- Lograr una interfaz responsiva a las variables de grosor de linea y reinicio
316
-
317
-
Otras cosas en tener en cuenta son las modificaciones que hicimos como equipo (grosores de línea distintos y el reset)
318
-
Las cuales en un principio iban a ser diferentes ya que teniamos en mente cambiar el color de línea y el de fondo , pero para no sobrecargar la interfaz física de la protoboard con muchos pulsadores, decidimos
319
-
solo un potenciómetro más (para el grosor) y pulsador (reset).
0 commit comments