Processing Desarrollo de Interfaces de Usuario

Processing cuenta con un entorno de desarrollo que está hecho para que cualquier tipo de usuario pueda incluir en sus proyectos una salida visual de información; se trata de un complemento ideal para Arduino y ESP8266. Además de obtener datos de sensores y manejar servos y motores, este lenguaje de programación brinda la posibilidad de crear interfaces y entornos visuales interactivos para trabajar mejor con Arduino y ESP8266. La gran diversidad de técnicas estudiadas en este documento abre para el lector un mundo de posibilidades creativas mediante Arduino y ESP8266. En este manual el lector encontrará un sinnúmero de prácticas que lo llevarán de la mano paso a paso por cada uno de los temas. Asimismo, en la primera página del libro se podrá observar un código de acceso para descargar gratuitamente material adicional de la web www.alfaomega.info.

VENTAJAS

• Cuenta con numerosas imágenes descriptivas de cada tema explicado.

• Todos los temas están expuestos mediante prácticas estudiadas detalle a detalle.

• A lo largo del libro aparecen recuadros con información complementaria.

• Contiene un código de acceso a una página web con contenido adicional.

CONOZCA

• El entorno de desarrollo de processing.

• Las variables y funciones de gestión de eventos para el manejo del teclado y el ratón en Processing.

• Las funciones de la librería Serial.

• En qué consiste y cómo funciona OpenCV para la visión artificial.

APRENDA

• A utilizar los comandos necesarios para trabajar con gráficos 3D.

• A establecer una comunicación entre Arduino y Processing.

• A utilizar la librería de elementos gráficos ControlP5.

• A desarrollar programas de realidad aumentada que integren información gráfica textual en tiempo real a las imágenes obtenidas de una cámara web.

DESARROLLE SUS HABILIDADES PARA

• Establecer comunicaciones entre Bluetooth y Arduino y entre Bluetooth y Processing.

• Establecer conexiones web con Arduino y Proccessing.

• Utilizar protocolos de IoT para establecer comunicación entre un móvil con acceso a Internet y cualquier dispositivo conectado a Arduino o ESP8266.

• Procesar imágenes con métodos de visión artificial que le permitan identificar caras u objetos, así como hacer un seguimiento de sus movimientos.

1. QUÉ ES PROCESSING 11

2. IDE PROCESSING 13

2.1 Instalación del IDE Processing 13

2.2 Manejo del IDE Processing 16

3. PROGRAMACIÓN CON PROCESSING 21

3.1 Funciones setup() y draw() 21

4. FUNCIONES GRÁFICAS 25

4.1 Gráficos elementales 25

4.1.1 Puntos 26

4.1.2 Líneas 31

4.2 Figuras geométricas 36

4.2.1 Rectángulos 36

4.2.2 Elipses 39

4.2.3 Arcos 40

4.2.4 Figuras geométricas personalizadas 41

4.2.5 Práctica: emoticono 42

4.3 Color 43

4.3.1 Práctica: semáforo 47

4.3.2 Práctica: emoticonos en color 48

4.4 Textos 51

4.5 Transformaciones 58

4.5.1 Traslación 58

4.5.2 Rotación 64

4.5.3 Escalado 66

4.5.4 Práctica: lupa 68

4.6 Matrices de transformación 70

4.6.1 Práctica: reloj analógico 71

4.7 Gráficos 3D 76

4.7.1 Transformaciones 3D 77

4.7.2 Figuras geométricas 81

4.7.3 Iluminación 84

4.7.4 Cámara 87

5. INTERACCIÓN CON EL RATÓN Y EL TECLADO 91

5.1 Uso del ratón 92

5.1.1 Práctica: pizarra electrónica 96

5.1.2 Práctica: control de movimiento 3D 97

5.2 Uso del teclado 101

5.2.1 Práctica: juego del frontón 105

5.2.2 Práctica: Juego de los ladrillos 113

6. INTEGRACIÓN ARDUINO-PROCESSING 121

6.1 Uso de la librería Arduino (Firmata) 123

6.1.1 Práctica: blink 127

6.1.2 Práctica: linterna inteligente 132

6.2 Gestión directa de las comunicaciones serie 136

6.2.1 Envío de datos desde Processing hacia Arduino 138

6.2.2 Envío de datos desde Arduino hacia Processing 142

6.2.3 Práctica: mando para el juego del frontón 151

6.2.4 Práctica: espejo 3D 159

6.2.5 Práctica: osciloscopio 168

6.2.6 Últimos consejos 175

7. LIBRERÍA DE ELEMENTOS GRÁFICOS CONTROLP5 177

8. COMUNICACIONES BLUETOOTH 189

8.1 Comunicaciones Bluetooth con Arduino 190

8.2 Comunicaciones Bluetooth con Processing 191

8.3 Práctica: estación meteorológica remota 197

9. COMUNICACIONES WEB 205

9.1 Comunicaciones web con ESP-01 207

9.1.1 Librería ESP8266WiFi 213

9.1.2 Cliente web 215

9.1.3 Servidor web 222

9.1.4 Práctica: consulta de la IP pública 228

9.1.5 Práctica: control de un led desde un navegador web 232

9.2 Comunicaciones web con Processing 237

9.2.1 Librería processing.net 237

9.2.2 Cliente web 238

9.2.3 Servidor web 242

9.2.4 Práctica: pizarra gráfica en red 245

9.3 Comunicaciones web con Arduino 251

9.3.1 Práctica: linterna web 252

9.3.2 Práctica: regulación web del nivel de luz 258

10. INTERNET DE LAS COSAS 269

10.1 Qué es MQTT 270

10.2 MQTT con WEMOS D1 272

10.3 MQTT con Processing 276

10.4 Práctica: control de una lámpara de 220 voltios por Internet 277

10.5 Práctica: alarma 291

10.6 Práctica: control de la calefacción desde un móvil 301

11. VISIÓN ARTIFICIAL 317

11.1 Qué es OPENCV 318

11.2 Instalación de OpenCV for Processing 319

11.3 Librería OpenCV for Processing 320

11.3.1 Clase PImage 321

11.3.2 Clase OpenCV 323

11.3.3 Clase Mat 325

11.4 Componentes de una imagen 326

11.5 Histogramas 332

11.6 Procesamiento de imágenes 335

11.6.1 Modificación del brillo y el contraste 335

11.6.2 Filtros basados en umbral 338

11.6.2.1 Filtro de umbral fijo 338

11.6.2.2 Filtro de umbral adaptativo 340

11.6.3 Filtros lineales 342

11.6.3.1 Filtro paso bajo 342

11.6.3.2 Filtro paso alto 345

11.6.3.3 Filtro Canny 347

11.6.4 Filtros morfológicos 350

11.6.4.1 Filtro de dilatación 350

11.6.4.2 Filtro de erosión 355

11.6.5 Comparación de imágenes 357

11.7 Detección de contornos 359

11.7.5.1 Bounding Box 363

11.7.5.2 Práctica: identificación de figuras geométricas 366

11.7.5.3 Práctica: contador de objetos 370

11.7 Detección facial 377

11.8 Captura de vídeo 381

11.8.1 Vídeo obtenido de una cámara 381

11.8.2 Vídeo procedente de un archivo 389

11.9 Procesamiento de vídeo 393

11.10 Realidad aumentada 397

11.10.1 Práctica: posicionamiento de figuras geométricas 398

11.10.2 Práctica: probador de sombreros virtual 403

11.11 Color tracking 409

11.12 Detección de movimiento 417

11.13 Visión artificial con Arduino 420

11.13.1 Práctica: mascota robótica 421

11.13.2 Práctica: clasificación de materiales 435

11.13.3 Práctica: alarma por movimiento 442