Programa del curso de Introducción a la programación creativa en p5.js organizado por Escuela Coded, Productora Suricata y Centro La Planta. El taller será dictado por Guillermo Montecinos - profesor de Escuela Coded - en Centro La Planta entre los días 12 y 28 de marzo de 2018.
Curso de introducción a la programación creativa que busca explorar las posibilidades de los nuevos medios digitales en contextos artísticos. Durante 6 sesiones revisaremos las nociones elementales de programación que permitan la construcción de sistemas complejos, utilizando el código como herramienta facilitadora de la expresión de la creatividad.
Analizaremos referentes de las artes visuales latinoamericanas y del diseño norteamericano a través de la reinterpretación de algunas de sus obras mediante el lenguaje de programación -inspirados por el proyecto ReCode-. De esta manera, el código será una herramienta al servicio de la creatividad desde el cual podremos analizar una obra, para luego experimentar con los elementos obtenidos de ella.
Posteriormente, revisaremos técnicas para trabajar con texto, imagen y video en un entorno web interactivo, para finalizar el curso con el desarrollo de un proyecto personal o grupal que utilice las herramientas exploradas.
En esta primera clase realizaremos una introducción al curso en la que plantearemos las ideas que nos motivan a enseñar el uso de un Software Libre (FLOSS) como p5.js. Luego discutiremos el contexto en que se desarrollan este tipo de herramientas de programación orientadas al arte. Posteriormente analizaremos el trabajo artístico de pintora cubana Carmen Herrera, para finalmente reinterpretar en código una de sus obras a través de la cual revisaremos, aplicaremos y comprenderemos la estructura y funciones básicas de p5.js, la sintaxis elemental de JavaScript.
- Presentación del instructor y Escuela Coded
- Presentación del Curso, objetivos y alcances
- Introducción a las Artes Mediales, por Aarón Montoya-Moraga
- Introducción a p5.js
- Entorno de programación: editor web
- Referencia web de p5.js
- Carmen Herrera, arte abstracto
- Recode: Green & Orange
- Tarea: reprogramar una obra de Herrera aplicando los conceptos revisados. Experimentar con variaciones e integración de otras herramientas
- Estructura de p5.js
- Sintáxis de JavaScript
- Primeras figuras: ellipse(), rect() y triangle()
- Color: RGB, HSB, colorMode()
- Funciones espaciales: push(), pop(), translate() y rotate()
- Sesión 2. Introducción a p5.js, Coded Escuela
- The 100 years show, documental sobre Carmen Herrera
En esta clase volveremos a revisar y discutir el contexto de las artes mediales, poniendo el foco esta vez en las artes interactivas en entornos web. Posteriormente revisaremos la obra concreta del artista brasileño, particularmente de su ejercicio denominado Metaesquema el cual utilizaremos como modelo para analizar y comprender la lógica algorítmica de sus composiciones. Finalmente llevaremos al código uno de sus ejercicios de Metaesquema, a través del cual revisaremos conceptos elementales de programación como bucles for, condicionales y arreglos de variables.
- Presentación y comentarios recode Carmen Herrera
- Arte Web y Nuevos Medios, por Aarón Montoya-Moraga
- Hélio Oiticica, arte concreto
- Recode: Metaesquema
- Presentación del Proyecto Final
- Variables
- Arreglos
- Bucles For
- Condicional if
En esta clase revisaremos pasajes de la obra de los diseñadores Muriel Cooper y John Maeda, ambos del MIT Media Lab, con el objeto de esbozar una idea del rol de la tipografía en el arte y diseño algorítmicos. Posteriormente, replicaremos una obra de uno de estos exponentes, con el objeto de adentrarnos en el uso de la tipografía como un objeto de diseño en p5.js. Para ello revisaremos y aplicaremos funciones que nos facilitarán el trabajo espacial de texto.
- Presentación y comentarios recode Hélio Oiticica
- Muriel Cooper y John Maeda: tipografía y diseño
- Uso de texto y fuentes en p5.js
- Importación de texto como un arreglo de puntos
- Animación de Texto
- Recode: Japanese Poster, de John Maeda
- Función preload()
- Métodos de objeto font: textBounds() y textToPints()
En esta clase exploraremos las posibilidades que nos entrega p5.js para trabajar con imágenes y video. Comenzaremos importando una imagen al navegador web, la cual manipularemos y filtraremos utilizando las funciones nativas de p5.js. Posteriormente comprenderemos la imagen como una matriz de pixeles, los cuales pueden ser importados y manipulados por separado, creando filtros más complejos sobre la imagen fija. Luego aprenderemos a importar video desde la webcam utilizando el capturador de p5.js, el que desplegaremos en el navegador web y manipularemos en tiempo real.
- Importación de imágenes a p5.js
- Aplicación de filtros en p5.js
- Importación de pixeles
- Manipulación de pixeles
- Captura de video mediante webcam
- Procesamiento de imagen en vivo
- Funciones: loadImage(), createCapture(), loadPixels(), updatePixels(), get() y set()
La penúltima clase del curso estará dedicada a que cada participante trabaje en el desarrollo de su proyecto personal/grupal. El equipo Coded cumplirá el rol de facilitar y ayudar a la programacin de cada uno de los proyectos.
La última clase del curso será dividida en tres partes:
- Cierre de proyectos
- Presentación de proyectos: Los participantes mostrarán a sus compañeros sus proyectos, describiendo su proceso, aprendizajes y logros. Se invitará a un grupo de profesores destacados quienes darán comentarios los participantes sobre su trabajo.
- Cierre de curso
Guillermo Montecinos es educador, músico e ingeniero con base en Santiago. Su trabajo se enfoca en la construcción de experiencias sonoras inmersivas que evoquen y provoquen a la audiencia a partir de la sonoridad y visualidad. Es co-fundador de Coded, Escuela de Artes y Oficios Electrónicos (Santiago, Chile) y graduado de la School for Poetic Computation (NY).
http://guillemontecinos.cl/