Tag: Processing

Para terminar el curso, el último día (21 de diciembre) vimos un par de ejercicios de repaso general, donde se utilizaban arrays, classes, tipos de letras, control del movimiento, etc. Son los siguientes:

En la novena sesión del curso (14 de diciembre) vimos la exportación del trabajo en forma de aplicación y en forma de applet para la web, con posibilidad de incrustarlo en el código de nuestra propia página. Todo ello queda reflejado en el ejercicio 17 referenciado en el post anterior.

En la próxima sesión nº9 (14 de diciembre) veremos el tema de exportación del trabajo para distribución o inserción en la web. Para ello os he preparado el ejercicio E17, que ya se puede descargar del ftp.

Al descomprimirlo, en la carpeta E17_Exportar encontraréis un archivo llamado LEEME.TXT (con explicaciones) y cuatro subcarpetas, que detallo a continuación:

• E17a_SketchPanal: contiene un sketck de processing convencional. Se diseña un panal a base de hexágonos y haciendo clic van cambiando de color. Este sketch es el que vamos a exportar.
• E17b_application.windows: El contenido de esta carpeta es el resultado de ejecutar la opción “File > Export Application” del menú de Processing.
• E17c_applet: Contiene el resultado de ejecutar la opción “File > Export” del menú de Processing, que es una página web con el applet de java listo para subir a la web.
• E17d_webPersonalizada: Ejemplo de cómo incrustar el código web de processing en nuestra propia página.

En clase aclararemos todos estos conceptos.
Un saludo y hasta mañana. Álvaro.

Hola.

En primer lugar recordaros que el próximo martes día 7 de diciembre no hay clase (se hace puente) y que las dos clases que quedan son los días 14 y 21 de diciembre.
En segundo lugar comentaros que he replanteado el ftp, y en lugar de ir los archivos RAR organizados por sesiones ahora tenéis un RAR para cada ejercicio.

Observaciones importantes:

• El E09_DegradadoMap no os lo había incluído, así que procurad descargarlo.
• El E15_Mapa ha pasado a ser el número E16_Mapa.

Nuevos ejercicios añadidos (los que vimos ayer en clase):

• E15a (datosExternos_1): Ejemplo sencillo de cómo leer los datos de un archivo de texto y mostrarlos en la consola.
• E15b (datosExternos_2): Ejemplo ampliación del anterior donde mostramos los datos capturados de un archivo externo en el sketch, con interactividad (manejo por el teclado para pasar hacia delante y hacia atrás).

Antes de la próxima sesión (14 de diciembre) publicaré algún artículo más. Revisad el blog dentro de unos días.

Saludos. Álvaro.

El próximo martes 30 de noviembre, durante la primera parte de la sesión veremos un ejemplo de cómo manejar objetos (classes) en el sketch aplicando las funciones de detección de rectángulos que estudiamos anteriormente. 

En la segunda parte aprenderemos cómo se pueden leer datos de ficheros externos y manejarlos o analizarlos para para crear gráficos en Processing. Si nos da tiempo iniciaremos el desarrollo de un ejercicio de creación de un mapa que engloba los conceptos de lectura de datos externos, generación de classes, y dibujado y detección de polígonos, todo en uno.

El archivo Sesiones 7 y 8.rar que hay en el ftp está actualizado, y en él he añadido los siguientes ejemplos:

• E14a (class cajas 1): manipulación de objetos en pantalla con el ratón. Creación de una clase, inserción de objetos en el sketch y manejo de estos con el mouse.
• E14b (class cajas 2): refinamiento del ejercicio anterior, con un control fino de los objetos seleccionados que impide que se nos “escapen” del ratón una vez capturados.
• E15 (mapa): dibujado de un mapa a partir de colecciones de datos externos en ficheros  ascii.

Conviene que tengáis descargado el rar en vuestros portátiles, porque para el trabajo de clase vamos a emplear varios de los archivos ahí contenidos.

Hola.

El pasado martes 16 quedó pendiente de resolver el sketch de 400 flechas para que respondiera al clic del ratón. La errata estaba en que en la función “orientar” definida en la class Flecha puse float alfa = atan2(…..), y sobraba el float, ya que al ponerlo defino alfa como una variable local de esa función y esto impide que se cambie el valor de la variable alfa definida como variable general de la class. Debería poner solamente alfa = atan2(…..). Probadlo a ver si os funciona. De todos modos lo revisaremos en el aula el próximo martes.

En el ftp os pongo el ejercicio E12 con tres variaciones, que analizaremos en la próxima clase:

• E12a (flechas desordenadas): lo mismo que vimos en clase, con la errata resuelta, y un poquito de diseño (fondo negro y flechas de colores aleatorios)
• E12b (flechas ordenadas):  ahora las flechas están colocadas ordenadamente en x e y. Con clic-izquierdo se orienta al ratón, con clic-derecho se desorientan y con clic-centro se muestra/oculta la malla x,y. Podéis probar a cambiar parámetros, por ejemplo la variable rango, que hace que la malla sea más o menos tupida.
• E12c (flechas adaptativas): cuando hacemos clic-izquierdo las flechas se orientan al ratón,y además cambian a color amarillo intenso si están cerca del ratón y amarillo pálido si están lejos, variando también el grosor según la proximidad al ratón. Utilizamos la función map() que estudiamos el dia 9 de noviembre.

También os pongo un ejercicio para aprender a detectar zonas con el ratón en el sketch, que utilizaremos más adelante para detectar objetos y moverlos.

• E13a (deteccion): al pasar el ratón por encima de unas figuras (cuadrado, cículo y triángulo) estas cambian de aspecto. En el código se definen tres funciones de detección, una para rectángulos, otra para círculos y otra para polígonos cualesquiera. Hablaremos de todo ello en clase.
• E13b (detección de un polígono): análisis de detalle de la detección de polígonos

Estos ejercicios los teneis en el archivo Sesiones 7 y 8.rar del ftp.
Un saludo. Álvaro

Y aquí van los ejercicios prometidos en el post nº 4; podéis descargarlos del archivo Sesiones 5 y 6.rar que hay en el ftp.

• E09 (degradado map): dibujo de degradados (rampas de color) mediante el uso de la función map(), muy útil para convertir directamente de un rango de números a otro.
• E10a (arrays 1): uso de arrays para guardar grandes grupos de datos. En este ejemplo se guardan las 50 últimas posiciones del ratón y se utilizan esas coordenadas para dibujar elementos en el sketch. 
• E10b (arrays 2): en este ejemplo se usan arrays para dibujar polígonos de vértices aleatorios
• E11a (transformaciones: desplazar y rotar): dibujamos un objeto en el punto 0,0 (esquina superior izquierda del sketch), mediante un desplazamiento la colocamos en el centro y mediante una rotación la orientamos para que mire siempre al ratón (para esto usamos también la función atan2())
• E11b (transformaciones): ampliación del ejercicio anterior, colocando tres flechas en lugar de una sola.

Os recuerdo que he actualizado el handbook de Reas&Fry con subrayados en el texto con amarillo fosforescente de las funciones explicadas en cada capítulo, para que sea más fácil interpretar los contenidos. Descargadlo también (está en la carpeta DOC). A lo largo del curso iré marcando más capítulos y os lo volveré a actualizar.