jardínBit

PROYECTO FINAL: Espacios Vivos

1 Generalidades

Utiliza Processing para desarrollar un prototipo de composición visual basada en múltiples elementos animados.

La idea es considerar que esta composición visual exista como parte de un espacio físico, ya sea través de proyecciones, video walls, u otro tipo de displays.

Presentarás tu prototipo como video, y un mockup estático de cómo se vería en el espacio que elijas o diseñes.

Puedes trabajar individualmente o en pareja.

1.1 Inspiración

Algunos ejemplos de displays creativos, video walls y proyecciones que pueden darte ideas de cómo contextualizar tu composición.

2 Aspectos técnicos del código

El tamaño de lienzo de tu composición ha de tener al menos 1200px de ancho.

La composición visual ha de consistir primordialmente de múltiples instancias animadas de algún elemento que diseñes.

El código ha de estar desarrollado utilizando las siguientes herramientas:

Queda a tu consideración elegir qué parámetros de dibujo animarás, cuáles dejarás fijos pero serán diferentes entre cada instancia, y cuáles serán constantes en todas las instancias. Por ejemplo:

Opcionalmente, si lo deseas incorpora algún aspecto de interactividad con mouse o teclado, que sirva para simular alguna interacción que podría suceder en el espacio físico. Por ejemplo: la composición cambia cuando alguien está cerca, la composición sigue la posición horizontal de una persona, etc.

3 Procedimiento sugerido

Los siguientes pasos son una aproximación a un proceso creativo que parte de una idea general y va construyendo cada elemento desde la base.

  1. Realiza boceto(s) de la composición visual que quieres desarrollar.
    • Identifica cuál sería el elemento base que se repite
    • Identifica qué parámetros de ese elemento serían distintos en cada instancia, y cuál(es) estarían animados (y de qué manera)
  2. Realiza boceto(s) del elemento base que repetirás en la composición
    • Toma en cuenta los parámetros que decidiste
  3. Construye una función de dibujo con parámetros que dibuje a una instancia de ese elemento de acuerdo a parámetros dados.
    • Recuerda los ejemplos que hemos realizado utilizando con pushMatrix();, translate(x,y); y popMatrix(); dentro de la función de dibujo para poder colocar al dibujo en cualquier posición del lienzo.
  4. Prueba tu función de dibujo llamándola desde un sketch de Processing, asegurándote de que los parámetros cambien lo que diseñaste.
    • Por ejemplo, si la función tiene parámetros x,y para dibujar el elemento en una posición específica, prueba llamarla con diferentes valores numéricos para asegurarte de que sea así.
  5. Declara y crea un arreglo por cada parámetro que quieres que sea distinto entre elementos, de acuerdo a lo que identificaste previamente.
  6. Inicializa los arreglos en setup() como consideres adecuado según tu diseño: manualmente, elementos iguales, aleatorios, siguiendo algún patrón.
  7. Utiliza un ciclo para leer (y modificar, si están animados) los valores de los arreglos dentro de draw(), usándolos como parámetros de tu función de dibujo.
  8. Ajusta lo que consideres necesario:
    • La función de dibujo
    • Los arreglos a utilizar
    • Las técnicas de animación
    • etc
  9. Captura tu resultado y utilízalo para realizar un mockup

4 Entrega

La entrega del proyecto consistirá en tres partes:

4.1 Avances del proceso

Publica en el foro del Proyecto Final tus referencias, avances, bocetos, código, resultados, dudas, comentarios, etc. al final de cada sesión de trabajo.

Hacerlo te permitirá tener retroalimentación oportuna y te facilitará tener registrado tu proceso creativo para los otros dos puntos.

Si gustas publicar más seguido, ¡adelante!

4.2 Presentación en vivo

Presentarás tu proyecto al grupo en la última sesión del curso.

Utiliza entre 5 y 10 minutos para compartirnos:

4.3 Dossier en PDF

Complementa tu presentación con un documento/diapositivas en PDF a entregar a más tardar al finalizar la última sesión del curso, en la sección correspondiente de Actividades.

Incluye en este documento/diapositivas:

Puedes utilizar este dossier como apoyo visual para tu presentación en vivo

5 Cronograma de trabajo propuesto:

La idea es realizar el proyecto en su totalidad durante las sesiones en vivo. Es tiempo suficiente siempre y cuando definamos bien el alcance del proyecto.

Recuerda: publica en el foro tus avances durante los últimos minutos de las sesiones 14 y 15

6 Recomendaciones

Documenta frecuentemente tu proceso: Te recomiendo guardar versiones distintas del código cada vez que hagas cambios significativos, y hacer capturas de imagen y/o video en todas las etapas.

Estaré presente en las sesiones para asesoría y resolución de dudas a nivel individual y grupal. ¡No dudes en compartir tus preguntas!

7 Notas relevantes

7.1 Arreglos

7.2 Ciclos

7.3 Animación

7.4 Dibujo