Introducción a Processing

Introducción

En este recurso se presenta el programa Processing. Se presentan sus orígenes, el contexto en el que se desarrolló, recursos y enlaces para ver ejemplos, aprender y ampliar las posibilidades de éste.

¿Qué es Processing?

Como dice de forma simple y clara la página oficial, se trata de un lenguaje de programación de código abierto para gente que quiere crear imágenes, animaciones e interacciones. Inicialmente desarrollado como software para crear bocetos de trabajo y enseñar los principios de la programación en un contexto visual, Processing ha evolucionado hacia una herramienta de producción profesional. Hoy hay decenas de miles de estudiantes, artistas, diseñadores, investigadores y aficionados que usan Processing para aprender, hacer prototipos y producir proyectos a diario.

Características del lenguaje:

• Gratuito y de código abierto.
• Generación de programas interactivos con salida en formatos 2D, 3D y PDF.
• Integración con OpenGL para usar aceleración 3D.
• Compatible con GNU/Linux, Max OS X y Windows.
• Los proyectos se pueden ejecutar como applets de JAVA en la red.
• Más de 100 librerías que extienden el potencial del programa con sonido, vídeo, visión por computador y más…
• Bien documentado y varios libros disponibles.

Contexto: del diseño gráfico en papel al “diseño computacional”

Es evidente que no es lo mismo hacer un diseño en papel que hacerlo para un dispositivo móvil. Asimismo, es evidente que la tecnología afecta nuestro modo de trabajar, pues hoy podemos hacer ciertas cosas que antes no podíamos, pero también tenemos un contexto mucho más complejo y más acelerado que condiciona la calidad de nuestro trabajo.

En la década de los 80, la aparición del ordenador personal con su interfaz gráfica, junto con programas para la generación de carteles, ilustraciones, retoques fotográficos y dibujos empezó a provocar cambios en el sector de las artes gráficas. Surgieron diseñadores gráficos que se adaptaron a las nuevas herramientas, así como retractores que lo consideraron un peligro para la disciplina. También surgieron un grupo creciente de diseñadores que tuvieron su primer contacto con la disciplina mediante los ordenadores, o más específicamente mediante el uso de las interfaces de los programas.

En todo este creciente maremoto de cambios provocados por las nuevas tecnologías en los 90, un personaje un tanto peculiar planteó una serie de postulados que influyeron en los actuales creadores de Processing.org. Estamos hablando de John Maeda, actual director del Rhode Island School of Design, ganador de prestigiosos premios de diseño gráfico y considerado un gurú en el ámbito del diseño y la tecnología.

John Maeda, japonés-americano, estudió computación en el prestigioso MIT, pero se doctoró en diseño en la escuela de arte de la Universidad de Tsukuba. Este recorrido cruzado entre ciencias computacionales y diseño gráfico ayudó a Maeda a convertirse en pionero en diseño computacional.

El éxito de herramientas como QuarkXpress, Photoshop o Freehand recayó en que usaron analogías, metáforas e iconos que mimetizaron las herramientas que ya usaban los diseñadores (tijeras, pluma, lupa… ). Estas metáforas son muy prácticas para aquéllos que ya conocen el oficio del diseñador gráfico y quieren ir más rápido con una nueva herramienta pero, como apuntó Maeda, quizás limita la imaginación y las posibilidades que la computación nos brinda. Así pues, entre 1995 y 1999 Maeda publicó Reactive Books (veas el siguiente vídeo expicativo): cinco libros dedicados a explorar las fronteras del diseño en papel y el diseño en pantalla. Maeda nos habla con melancolía del papel, de la textura, de lo que se ha perdido con las nuevas tecnologías, pero también nos habla de las nuevas posibilidades que se abren al usar la computación en el diseño. En cada libro hace una propuesta gráfica y presenta un programa interactivo reflexionando así a nivel teórico-práctico sobre los fundamentos de la interactividad (el tiempo, el teclado, el ratón, el sonido y la webcam/vídeo). En ellos se habla de las distancias entre el papel y la interactividad, pero a su vez se juega con la relación que existe entre una y otra, creando páginas con diseños hechos mediante programación y buscando en la pantalla la calidez y textura del papel.

En 1999 crea un programa para enseñar los fundamentos de la programación/computación a diseñadores gráficos. Se trata de DBN (Design By Numbers), un sencillo programa con una ventana para escribir código de forma simple y usando un léxico parecido al de los diseñadores, y otra ventana para ver los resultados. Así consigue acercar a los diseñadores el mundo de las matemáticas y viceversa y a su vez, le permite ilustrar a sus alumnos el potencial del diseño computacional.

El nacimiento de Processing.org

Casey Reas y Benjamin Fry, autores de Processing.org, estudiaron con John Maeda en el MIT y conocieron de primera mano DBN y las teorías de Maeda. De hecho, el propio Reas confiesa en su blog que no habría Processing sin DBN. Para ellos, ver un programa tan simple, compatible con la red y a su vez estructurado para aprender y compartir el código fue clave. Así pues, respetando el trabajo de Maeda, iniciaron el proyecto de código abierto Processing.org.

El 2001, dentro del grupo de investigación de Aesthetics and Computation del MIT Media Lab, publicaron la primera versión de este lenguaje junto con un sencillo entorno de programación (IDE). El objetivo inicial de sus autores fue, continuando con el legado de DBN, mejorar el rendimiento y facilitar a artistas y creadores el poder hacer bocetos (sketches) de forma ágil y rápida, para después desarrollar con otros lenguajes sus proyecto.

La comunidad de artistas encontró en Processing una herramienta para experimentar con visuales interactivos, similar a Flash pero huyendo de las metáforas, mucho más orientada al código y pensada para hacer los primeros pasos en programación. La comunidad de programadores encontró una plataforma fácilmente extensible mediante librerías, bien documentada y activa. Estos dos hechos, junto con la excelente labor de profesores y profesionales que lo usan, han provocado que Processing se esté convirtiendo en una herramienta de referencia para el diseño computacional y el arte generativo.

Estamos a punto de ver el lanzamiento de la versión estable 2.0 que promete mejoras en el rendimiento 3D, compatibilidad y capacidad de exportar a Javascript (pudiendo usarse en cualquier navegador compatible con HTML5 mediante canvas), y capacidad de exportar a aplicaciones Android, además de las ya implementadas exportaciones a Linux, Mac OS X, Windows y applet de java.

La comunidad

Gracias a la propia naturaleza del proyecto, hablar de recursos de Processing es sin duda apuntar hacia las buenas labores que se están haciendo desde la propia comunidad. Uno de los mejores recursos es la página oficial del proyecto,  que además de permitir descargar la IDE, dispone de tutoriales, referencias al lenguaje, ejemplos, comentarios de libros, una selección de proyectos realizados con Processing y enlaces a las comunidades que apoyan el proyecto.

A continuación comentaremos algunos de estos recursos, añadiendo algunos en español y proponiendo algunos que no están en la página oficial.

Recursos sobre processing.org

Bibliotecas de recursos, ejemplos, canales, y grupos

• El primer recurso a analizar es el wiki oficial. Ahí encontrarás todo tipo de recursos actualizados y, si quieres ir por libre, en este espacio encontrarás todo lo que necesitas: tutoriales, cómo participar, ayuda técnica, entrevistas, comparativas de lenguajes de programación, etc.

• También dentro de la misma página oficial de Processing podrás encontrar muestras de proyectos finales que usan este lenguaje.

•  Openprocessing.org es uno de los espacios más interesantes de la comunidad. Los profesores o centros educativos pueden generar aulas virtuales donde compartir los ejercicios con los alumnos. Como se mantiene en abierto, permite ver e incluso ejecutar directamente el código en la web. Los alumnos suben también sus ejercicios y se convierte en un buen sitio para ver muchas propuestas desde distintos puntos de vista.

• Una web curiosa e interesante es la de Lukas Vojir, que nos propone descubrir distintos monstruos en blanco y negro que reaccionan al movimiento del cursor. Como siempre puedes ver el código, aportar tu propio monstruo y navegar en búsqueda de tu monstruo favorito.

• Creative Applications Network es un blog que está haciendo una labor de alta calidad al recoger trabajos interesantes sobre diseño interactivo y creatividad. Os recomendamos echar un vistazo a la categoría dedicada a Processing.

• Si lo que quieres es ver ejemplos de lo que hace la gente con Processing, lo mejor es que tomes un tiempo para ver las más de 150 páginas de vídeos en vimeo con el tag processing.org o visites el grupo de flickr para ver imágenes generadas con este programa. Recuerda que muchas de estas muestras de proyectos vienen con los enlaces a las webs de los autores o con un mail de contacto que te puede ayudar a conocer mejor el proyecto e incluso entrar en colaboración.

Tutoriales

• De nuevo, un buen sitio para empezar con tutoriales es la misma página de Processing, con su apartado dedicado al aprendizaje. Al usar el IDE de Processing si seleccionas una palabra, con el botón derecho verás la opción de ir directamente a la referencia del lenguaje junto con algunos ejemplos.
• Otro recurso muy interesante para empezar es la web de Daniel Shiffman, que a su vez tiene un libro. En este espacio encontrarás ejemplos, tutoriales y ejercicios para hacer un pequeño curso online  (LearnProcessing_Web.png) y si prefieres basarte en una versión traducida al español puedes encontrar este tutorial en castellano.

• Si no llevas muy bien las lenguas puedes encontrar un interesante tutorial realizado por Joan Soler en catalán y castellano haciendo clic aquí.
• Si lo que realmente te impresiona son la física y las mates, entonces estás de suerte porque Daniel Shiffman está desarrollando un nuevo proyecto basado en este tema para aprender Processing, así que puedes conseguir dos cosas al precio de una… y siempre en abierto y gratuito.

VideoTutoriales

• Si lo tuyo no es leer sino mirar, y si andas un poco perdido con los conceptos básicos de programación, esta completa web te ayudará a empezar de cero y conseguir buenos resultados con ejemplos, vídeos y ejercicios.

• José Sánchez tiene una serie de vídeo tutoriales colgados en vimeo y en youtube, para encontrar un listado completo de estos vídeos puedes ir directamente al wiki de la página de Processing.

Libros

• Puedes encontrar referencias de prácticamente todos los libros de Processing aquí. Según tus intereses y necesidades te será más útil uno u otro. Si estás empezando con el tema de programar, te aconsejamos el último que ha publicado O’Reilly Media, de los propios autores de Processing y con un tono claramente informal y próximo: Getting Started with Processin, Casey Reas and Ben Fry, 2010, O’Reilly Media.

• De los mismos autores una guía más extensa con un prólogo de John Maeda y con una interesante introducción que habla de cómo la computación y el arte llevan desde el principio de la mano. El libro es el resumen de la experiencia pedagógica de los autores con tutoriales, ejemplos y pequeñas explicaciones teóricas que os darán un conocimiento sólido. Processing: A Programming Handbook for Visual Designers and Artists, Casey Reas and Ben Fry, 2007, MIT Press.

• Ira Greenberg hizo una excelente labor con este libro, parecido al comentado anteriormente, y en este caso publicado por la editorial FriendsofED, especializada en diseño, física y programación. Este libro está enfocado a perfiles pluridisciplinares que sienten interés por el diseño, arte, matemáticas, programación y parte siempre de cero para, con poco tiempo, empezar a hacer ejercicios prácticos. Processing: Creative Coding and Computational Art. Ira Greenberg, Friends of Ed.
• Antes hemos hablado de un tutorial para aprender Processing de Daniel Shifmann, aquí tienes las coordenadas del libro que acompaña y extiende el proyecto web: Learning Processing: A Beginner’s Guide to Programming Images, Animation, and Interaction, Daniel Shiffman, 2008, Morgan Kaufmann.

Autores de referencia

•  Hemos hablado de los creadores de Processing. Seguramente si quieres seguir el proyecto de cerca y ver su faceta más artística, lo mejor será echar una ojeada a sus páginas personales: Casey Reas y Ben Fry.

• También es interesante, sobre todo porque es uno de los desarrollados de librerías y escritor de documentos más activo de la comunidad, la web de Daniel Shiffman.

Herramientas online

• El siguiente enlace permite ejecutar código directamente en la web y ver los resultados en directo.

• Esta otra página permite además de escribir en tiempo real, hacerlo de modo colaborativo en un pad con la opción de chatear con los contribuidores en el mismo momento que se va modificando el código. Realmente interesante si quieres colaborar en la distancia con un equipo de programadores.

• Ya lo hemos comentado antes, pero Openprocessing no es solo una comunidad de aprendizaje, sino también una forma de testear los sketches en tiempo real.

• En este caso, Processingjs no es una herramienta on-line, sino una librería de javascript desarrollada por John Resig para que desde canvas se pueda ejecutar Processing, consiguiendo incrustar en cualquier web tus bocetos sin usar ningún plug-in adicional.

Comunidad de desarrolladores

Y finalmente, si todo esto te ha sabido a poco, entonces tu recurso favorito será entrar por la puerta grande y conocer y participar con la comunidad de desarrolladores. Para ello, haz clic aquí.

Cita recomendada: BERGA, Quelic. Introducción a Processing. Mosaic [en línea], abril 2012, no. 96. ISSN: 1696-3296. DOI: https://doi.org/10.7238/m.n96.1217.