1

Introducción a Processing v1.5.1

Raúl Lacabanne – 2013 – v1.43

Los textos que veremos a partir de ahora se presentan son el resultado de un resumen de los tópicos presentes del libro: “Processing: A Programming Handbook for Visual Designers and Artists” de Casey Reas y Ben Fry. El mismo es un manual que introduce los conceptos de programación más importantes y se los aplica para enseñar cómo generar de imágenes sintéticas a artistas plásticos, diseñadores, entusiastas de la imagen y todos aquellos interesados en aprender esta temática.

Antes de Processing existió un antecedente importante: DBN.

Design By Numbers

Design By Numbers (DBN) fue creado en 1999 como una plataforma de introducción al diseño asistido por ordenador para diseñadores visuales y artistas. Conceptualizado por John Maeda en el ACG (Aesthetics + Computation Group) del MIT, quien cree que la calidad del diseño y arte de medios sólo puede mejorar a través del establecimiento de infraestructuras educativas en escuelas de arte y tecnología que fomenten la formación de individuos transdiciplinarios competentes.

Introducción a Processing v1.5+  Docente: Raúl Lacabanne

2

processing.org

Años más tarde emergió Processing. Processing es un lenguaje y un entorno de programación de código abierto basado en Java, de fácil utilización, diseñado como instrumento didáctico para la enseñanza y producción de proyectos multimedia e interactivos de diseño digital. Fue iniciado en 2001 por Ben Fry y Casey Reas. Processing es desarrollado por artistas y diseñadores como una herramienta alternativa al software propietario. Puede ser utilizado tanto para aplicaciones locales así como aplicaciones para la web.

Veamos a continuación cómo comenzar a trabajar con el mismo.

Introducción a Processing v1.5+  Docente: Raúl Lacabanne

3

Punto 1 – Elementos de sintaxis

Descarga y descompresión

Dirigirse a la siguiente URL: http://www.processing.org/download/ y descargar la versión apropiada a su sistema operativo. Se recomienda a los usuarios de Windows descargar la versión Windows (a secas) y no la versión Windows (Without Java).

Una vez descargado el archivo, descomprimirlo en alguna carpeta del disco rígido, ej: el escritorio. Esto quiere decir que el entorno de desarrollo Processing no necesita instalación.

A continuación abrirá la carpeta descomprimida, y para iniciar el entorno realizará doble clic en el archivo correspondiente al siguiente icono:

Comentarios

En Processing tenemos dos formas de realizar comentarios.

El primero es un comentario simple:

// esto es un comentario...// ...y esto también lo es

el segundo es un bloque de comentario:

/*estotambiénesuncomentario*/

Funciones

Las funciones permiten ejecutar algoritmos, es decir, obtener un resultado a partir de un o una serie de pasos lógicos y estructurados.

En general, el nombre de una función comienza en minúsculas y es seguido por un par de paréntesis.

Los elementos que se encuentran entre los paréntesis se llaman parámetros.

Ejemplo de funciones:

size(200, 200)

Introducción a Processing v1.5+  Docente: Raúl Lacabanne

4

background(102)

noCursor()

Sensibilidad a mayúsculas y minúsculas

Decimos que el lenguaje Processing es sensible a mayúsculas y minúsculas. Esto quiere decir que para Processing no es lo mismo escribir b que B. Por lo tanto tampoco es lo mismo escribir size() que Size().

Espaciado

Processing es flexible a los espaciados. Sin embargo se recomienda ser prudente con los mismos para que la lectura del código sea cómoda.

Instrucciones

Si utilizamos una metáfora del lenguaje humano, podemos entender a la instrucción como si fuera una oración.

Las instrucciones siempre se deben terminan con el signo punto y coma (;).

Dentro de una instrucción se pueden realizar muchas acciones. Algunas de ella son:• ejecutar una función,• definir una variable o array, • asignar un valor a una variable (o valores a un array),• construir un objeto

Ejemplo de un boceto que contiene un conjunto de instrucciones:

size(200, 200);  // Ejecuta la función size() con dos parámetrosbackground(102); // Ejecuta la función background() con un parámetronoCursor();      // Ejecuta la función noCursor() con ningún parámetro

Lectura recomendada

• Buioli, I. & Pérez Marín, J. "Processing: un lenguaje al alcance de todos", Autoedición, 2013, Introducción (pag. 4) y Unidad 1 "Estructuras: elementos del código" (pag. 6).

• Reas, C. & Fry, B. "Processing: A Programming Handbook for Visual Designers and Artists”, MIT Press, 2007, Capítulo “Structure 1: Code Elements” (pag. 17).

Introducción a Processing v1.5+  Docente: Raúl Lacabanne

5

Información complementaria

Utilización de la consola

// Para imprimir un valor – Uso de la función print() print(10); // Imprime 10 en la consola 

// Para imprimir un texto, coloque el mismo entre comillas print("processing"); // Imprime processing a continuación del dato anterior 

// Para imprimir en líneas separadas – Uso de la función println() println(10); // Imprime 10 en la consola y salta a una nueva línea println("processing"); // Imprime processing y salta a una nueva línea 

Función cursor() noCursor()cursor()

Sintaxis• cursor()• cursor(MODE)• cursor(image, x, y) 

Parámetros• MODE: Puede optar por ARROW, CROSS, HAND, MOVE, TEXT, WAIT 

• image (PImage): cualquier variable del tipo PImage 

• x (int): el punto activo horizontal del cursor 

• y (int): el punto activo vertical del cursor 

noCursor()

Introducción a Processing v1.5+  Docente: Raúl Lacabanne