visualización de la información con processing dr. david eduardo pinto avendaño facultad de...

Visualización de la Información con

Processing

Dr. David Eduardo Pinto AvendañoFacultad de Ciencias de la Computación, BUAP

Introducción

ProcessingDescripciónInterfazFunciones Ventajas y Desventajas

Programas

Ejemplos

Referencias

Contenido

¿Qué es Processing?

Ambiente y lenguaje de programación “open source” para personas que desean programar:

• Tratamiento de imágenes• Animación• Interación Humano-Computadora

Útil para:• Estudiantes• Artistas• Diseñadores• Investigadores• Curiosos en la enseñanza, creación de prototipos y productos finales

Fue creado para enseñar fundamentos de programación dentro de un contexto visual.

Introducción

Introducción

Puede ser utilizado tanto para aplicaciones locales así como aplicaciones basadas en Web (Applets).

Fue iniciado por Ben Fry y Casey Reas.

Es la evolución de ideas por parte del grupo de estética y computación del laboratorio de Multimedia del MIT.

Versión actual: Processing 1.0.8 / 18 Oct 2009

http://processing.org/download

Introducción

Está basado en Java, sin embargo, debido a lo simple de sus construcciones, no es necesario saber Java.

Interfaz

InterfazEl botón de reproducir(play) Click para ver tu código ejecutado como un programa.

El botón de parar (stop). Click para detener tu programa.

Crea un nuevo (new) archivo. Processing los llama sketches (bosquejos). los puedes llamar también Applets, programas o piezas interactivas. Abre (open) un sketch preexistente.Guarda (save) en sketch actual dentro de la carpeta de sketches de Processing.

Exporta (export) el sketch a la carpeta de sketch de Processing, esta vez como un Applet de java, completo con su propio archivo html.

• Estructura.• Forma: o Primitivas 2D,o Primitivas 3D,o Curvas, o Atributos, o Vertex y o Loading & Displaying

• Color: o Escenario, o Creación y o Lectura

• Imagen:o Loading & Displaying y o Pixeles.

• Entorno.

• Datos: • Primitiva, • Compuesto, • Conversión, • Funciones de cadena y • Funciones de matrices.

• Entrada: • Mouse, • Teclado, • Archivos, • web y • hora y fecha.

Processing ofrece una gran variedad de funciones las cuales se muestran a continuación:

Funciones

• Tipografía: • Loading & Displaying , • Atributos y • métrica.

• Matemáticas: • Operadores, • Operadores bit a bit, c• Cálculo, • Trigonometría y • Al azar.

• Salida: • Área de texto, • Imagen y archivos

• Control: • Operadores relacionales. • Iteración.• Condicionales.• operadores lógicos.

• Transformar.• Constantes.• Luces y Cámara:

• Luces.• Cámara. • Coordenadas. • propiedades de los

materiales.

Funciones

Hello world!

line(15, 25, 70, 90); Ver ejemplo

size(400, 400); Ver ejemplo background(192, 64, 0); stroke(255); line(150, 25, 270, 350);

stroke(255); // sets the stroke color to white stroke(255, 255, 255); // identical to the line above stroke(255, 128, 0); // bright orange (red 255, green

128, blue 0) stroke(#FF8000); // bright orange as a web color stroke(255, 128, 0, 128); // bright orange with 50%

transparency

Hello mouse!

void setup() { Ver ejemplosize(400, 400); stroke(255);

}

void draw() { background(192, 64, 0); line(150, 25, mouseX, mouseY);

}

Hello mouse!

void setup() { Ver ejemplosize(400, 400); stroke(255);

}

void draw() { line(150, 25, mouseX, mouseY);

}

void mousePressed() { background(192, 64, 0);

}

Ejemplos

Ejemplos

Ejemplos

Ejemplos

Ejemplos

Ejemplos

Ejemplos

VERTIGO, Alfred Hitchcock, 1958

Information Visualization

Information Visualization

Características

Processing OpenGL Flash &Director

Código Abierto Si No No

Fácil Manejo Si No No

Portable Si No No

Pocos Recursos

Si No No

Multiplataforma

Si Si Si

Maquina Virtual Java

Si No No

Processing versus …

Ventajas:1. Es Open Source.2. Fácil manejo.3. Portable.4. Utiliza pocos recursos.5. Su ejecución es mas rápida en comparación con

ActionScript y Lingo.6. Se puede correr en cualquier plataforma.7. Permite incorporar librerías de otros lenguajes8. Para utilizar processing no se necesita ser un

programador muy avanzado.

Desventajas:

9. Necesita la maquina virtual de java.10.No es tan comercial.

Ventajas y desventajas

Ejemplos

3D/Form/Toroid 3D/Lights/Directional 3D/Lights/Spot

DPinto

Libraries/OpenGL/SpaceJunk Libraries/OpenGL/TextureSphere Libraries/OpenGL/YellowTail Libraries/Video(movie)/Loop

Topics /Effects/FireCube Topics /Effects/Tunnel Topics /Fractals-/Tree Topics /Image Processing/Convolution Topics /Simulate/*

Referencias

http://processing.org/ http://go.yuri.at/p5/tutorial/ http://www.tucamon.es/contenido/processing-y-arduino/ http://www.openprocessing.org/visuals/?visualID=4021 http://www.learningprocessing.com/

Learning Processing A Beginner's Guide to Programming Learning Processing A Beginner's Guide to ProgrammingDaniel Shiffman

Visualizing Data Exploring and Explaining Data with the Processing Environment)By Ben Fry, Publisher: O'Reilly Media