Charla introductoria a processing, versión simple. 2010/09.

1. Charla Introducción a Processing
Jorge Iván Meza Martínez (http://jorgeivanmeza.com/)
Septiembre de 2010
•Qué es ?
•Qué se puede hacer con él ?
•Cómo se obtiene ?
•Cómo se instala ?
•Cómo es su ambiente de desarrollo ?
•Hola Mundo Processing.
•Cómo se exporta el sketch ?
•Cómo es el lenguaje de programación ?
•Ejercicio práctico.
•Enlaces.
Qué es Processing ?
•Es un lenguaje de programación basado en C, Java y Design by Numbers principalmente.
•Nació en 2001 desarrollado por Ben Fry y Casey Reas.
•Sus creadores se encontraban frustrados por la dificultad para desarrollar aplicaciones basadas en en
gráficos interactivos en los lenguajes habituales.
•Su objetivo es el facilitar la creación de sketches o prototipos, encontrar una forma rápida de probar
las ideas en lugar de perder mucho tiempo desarrollando en lenguajes complicados.
•Facilitar la enseñanza y desarrollo para los estudiantes de artes electrónicas y diseño visual mediante
la programación bajo un contexto visual.
•Ha servidor de base e inspiración a varios proyectos interesantes.
•Puede ser fácilmente ampliado por librerías desarrolladas por terceros.
•El lenguaje cuenta con su propio ambiente de desarrollo (PDE) pero desarrollarse en otros editores
externos como Eclipse.
•Consta además de una colección de funciones (API), una sintáxis del lenguaje similar a Java y una

2. comunidad muy activa que lo soporta con una muy buena documentación.
•Se encuentra licenciado por GPL (development enviroment) y LGPL (core).
•Las plataformas soportadas son Windows XP/7, MacOSX 10.5/6 (Intel) y Linux.
Qué se puede hacer con Processing ?
Con Processing se pueden hacer muchas cosas! Estos son sólo unos pocos ejemplos.
•Manipulación de imágenes.
◦Wiimote Kaleidoscope.
◦Tarjetas navideñas.
◦Video art.
•Procesamiento de la información.
◦Universe.
◦The dumpster.
•Simulaciones.
◦One perfect cube.
◦Just landed.
◦We feel fine.
◦TerrainSteering.
◦MSAFluid + Wiimote.
◦Ball droppings.
◦Oasis.
◦Exploring the dynamics of coastal marine ecosystems.
◦Patrones de vuelos comerciales en USA.
•Realidad aumentada.
◦A string.
◦Reconocimiento de QRCodes.
◦Virtual wall.
◦Experience with depth-sensing camera.
◦Aprendizaje virtual.

3. ◦Body navigation.
◦Maeve.
◦You move, you interact.
◦AR Business card.
Cómo se obtiene ?
•Se descarga libremente del sitio web http://processing.org/download/.
•Seleccione la versión según su sistema operativo: Linux, Mac OSX o Windows (con o sin Java).
•Requiere tener el JDK instalado previamente.
Cómo se instala ?
•Para Windows se debe descomprimir el archivo ZIP en la ubicación final y ajustar las rutas (de
Processing y Java de ser necesario) en la variable de ambiente PATH.
•Para Mac OSX se debe hacer doble clic sobre el archivo del instalador (mas información).
•Para Linux es necesario descomprimir el archivo TGZ en la ubicación final y ajustar la ruta en la
variable de ambiente PATH (mas información).
•Agregar un acceso directo en el escritorio o en el menú de inicio de su sistema operativo de ser
necesario.
Cómo es el
ambiente de
desarrollo ?

4. 1.Ejecutar el sketch.
2.Detener el sketch en ejecución.
3.Crear un nuevo archivo fuente.
4.Abrir un archivo fuente de un sketch ya existente.
5.Guardar el código fuente del sketch.
6.Exportar el sketch como un applet.
7.Menú principal.
8.Pestañas de los archivos fuente de los sketches.
9.Editor del código fuente del sketch.
10.Ventana con la salida estándar y salida de error de la ejecución de los sketches.
Hola Mundo Processing.

5. Cómo se exporta el sketch ?
•A un applet (web).
◦File > Export.
◦CTRL + E
◦[6] en el PDE.
•A una aplicación (escritorio).
◦File > Export Application.
◦CTRL + SHIFT + E
Cómo es el lenguaje de programación ?
Estas son las principales generalidades del lenguaje. Para más información consultar la guía de
referencia en línea.
•Comentarios.
◦Una línea: //.
◦Multi línea: /* */.
•Manejo de variables.
◦Asignación =, +=, /=, *= y -=.
◦Tipos de datos.
▪Boolean.
▪Byte.
▪Char.
▪Color.
▪Double.
▪Float.
▪Int.

6. ▪Long.
▪String.
▪Null.
•Manejo de arreglos.
◦Acceso [].
•Operadores unarios: ++ y –.
•Operadores binarios: +, -, *, / y %.
•Operadores de bits: &, |, << y >>.
•Condicionales.
◦If.
▪Else.
◦Abreviado ?:.
◦Switch.
▪Case.
▪Default.
•Iteraciones.
◦For.
◦While.
•Operadores relacionales: ==, >, >=, !=, < y <=.
•Operadores lógicos: &&, ! y ||.
•Funciones matemáticas.
◦Abs.
◦Ceil.
◦Floor.
◦Log.
◦Max.
◦Min.
◦Pow.
◦Round.
◦Sqrt.
•Funciones de azar.
◦Random.

7. •Manejo de excepciones.
◦Try.
◦Catch.
•Dibujo.
◦2D.
▪Arc.
▪Ellipse.
▪Line.
▪Point.
▪Quad.
▪Rect.
▪Triangle.
◦3D.
▪Box.
▪Sphere.
•Colores.
◦Background.
◦Fill / noFill.
◦Stroke / noStroke.
•Imágenes.
◦LoadImage.
◦Image.
•Textos.
◦Salida estándar.
▪Print.
▪Println.
◦Grafico.
▪Text.
•Manejo de eventos.
◦Ratón.
▪MouseClicked.
•MousePressed.

8. •MouseReleased.
▪MouseMoved.
▪MouseDragged.
◦Teclado.
▪KeyTyped.
•KeyPressed.
•KeyReleased.
•Funciones relacionadas con el ciclo de vida del sketch.
◦Setup.
▪Size → width y height.
◦Draw.
▪Redraw.
▪Loop.
▪NoLoop.
◦Exit.
•Programación orientada a objetos.
◦Definición de clases.
◦Instanciación: new.
◦Herencia.
◦Encapsulamiento: public y private.
◦Implementación de interfaces.
◦This y Super.
Ejercicio práctico: laberinto.
Enlaces.
•Processing.
http://www.processing.org/
◦Acerca de.
http://www.processing.org/about/
◦Referencia del lenguaje.

9. http://www.processing.org/reference/
◦Descargas.
http://www.processing.org/download/
▪Google Code Project.
http://code.google.com/p/processing/
◦Wiki oficial.
http://wiki.processing.org/w/Main_Page
•Processing en el blog de Jorge Iván Meza.
http://blog.jorgeivanmeza.com/tag/processing/