Bitácora - Clase 21 de Mayo de 2016
Aula: 603
Profesora: Laura
Cortes
Hora de inicio: 1:00
pm
Hora de finalización:
6:00pm
Procedimientos:
1.
La docente introduce la clase presentando unos videos
sobre programas que se pueden crear con el programa processing y adicionalmente
nos comparte la página web http://www.openprocessing.org/ en la cual se
pueden ver diversos sketches realizados por otras personas y que son libres de
derechos de autor.
2.
Los compañeros expresan sus opiniones acerca de esta
herramienta y la maestra nos invita a reflexionar sobre otros tipos de
pulsadores que podríamos utilizar en nuestra infografía como los sensores de
movimiento.
3.
Para introducir Arduino, discutimos brevemente la
historia de Hernando Barragán y su paso por la universidad italiana donde
inventó el proyecto Wiring, como parte de su tesis de maestría. Este será el proyecto
base sobre el que luego su tutor de tesis, Massimo Benzi, construiría Arduino,
sin dar crédito a lo que su brillante alumno había construido. Reflexionamos
alrededor del rol de un colombiano en la creación del microprocesador de
hardware libre más famoso del mundo.
4.
Descargamos las versiones no instalables de los
programas processing y arduino y extraemos las carpetas para empezar el trabajo
sobre nuestra infografía interactiva.
5.
La maestra nos invita a hacer en notepad++ un paquete
de datos en XML que se podría utilizar para cambiar la información de la
infografía sin necesidad de crear de nuevo el código completo. Lo que hicimos
fue esta estructura:
6.
Después de crear este código general; cambiamos los
datos para crear un código específico de nuestra infografía también en
notepad++. En este código usamos el nombre de la categoría general, una imagen
general, las subcategorías, la explicación de las subcategorías y una imagen
relacionada a cada una.
7.
Adicionalmente, debemos crear una carpeta llamada data
con este archivo XML de notepad++ y las imágenes que utilizaremos en esta
infografía interactiva.
8.
Luego de esto se crearon las rutas en el software
Processing 3.1.1 para conectarlo con el archivo XML anteriormente creado en
Notepad++.
9.
Se crearon las
instrucciones en Processing para crear el archivo con extensión .pde, como se
muestra a continuación:
10. Este código indica a Processing crear la clase info y las
categorías Tipo, Nombre, Imagen y Descripción, configura el tamaño de la
ventana de 1024 x 780 pixeles, establece la conexión con el archivo
configinfografia.xml, anteriormente hecho en NotePad++, la instrucción
get.Children indicó obtener la información de las categorias.
11. Se indica la configuración de la ventana, se modifica el
tamaño y tipo de letra, el fondo, tamaño del título. Se indica abrir cada
imagen, luego de este se programa un comando para que cada imagen se abra al
oprimir una letra en el teclado. Este código es el siguiente:
12. Luego de este se guardó el archivo en un formato .exe (ejecutable) para poderlo abrir en cualquier
PC con permiso de administrador.
Fotografías de clase
Bitácora realizada por:
Katherine Blanco
Diego Gómez
Frank Sierra
























