Créditos de Toy Story con Processing

  • add¿Qué es Processing?
    Processing es un lenguaje de programación y entorno de desarrollo integrado de código abierto basado en Java, de fácil utilización, y que sirve como medio para la enseñanza y producción de proyectos multimedia e interactivos de diseño digital. Fue iniciado por Bren Fry y Casey Reas, ambos miembros de Aesthetics and Computation Group del MIT Media Lab dirigido por John Maeda. Uno de los objetivos declarados de Processing es el de actuar como herramienta para que artistas, diseñadores visuales y miembros de otras comunidades ajenos al lenguaje de la programación, aprendieran las bases de la misma a través de una muestra gráfica instantánea y visual de la información. El lenguaje de Processing se basa en Java, aunque hace uso de una sintaxis simplificada y de un modelo de programación de gráficos.
  • add¿Qué es Toy Story?
    Toy Story es una serie de películas animadas por ordenador y la franquicia de medios de comunicación de Disney que comenzó con la película original de Toy Story, producida por Pixar Animation Studios y publicada por Walt Disney Pictures. Toy Story
  • add¿Qué son los créditos?
    Al principio o al final de las obras audiovisuales, los créditos citan miembros del reparto y el equipo implicado en la producción. Normalmente consisten en una lista de nombres y funciones a pequeño tipo, que pasan rápidamente página a página o bien se deslizan sobre el fondo o una pantalla negra.

Primer ejemplo

ejemplo uno

En la primera pantalla se le da nombre a las variables PImage como también a la variable del tipo PFont donde luego se cargara la fuente que se va a utilizar. También declaro variables del tipo float que luego nos ayudara para que los créditos se muevan. Debajo está el setup donde cargo imágenes y fuente con el nombre anteriormente asignado cuando declare las variables.

Segundo ejemplo

ejemplo dos

En la segunda pantalla se carga la fuente, con el fill se le asigna el color 255 (blanco). Se centra las imágenes con ImageMode, además de asignarle el valor a PosY para que los textos e imágenes se puedan mover. Se cierra el setup y se abre el draw, donde dibujaremos nuestras pantallas insertando las fotos, dándoles una posición en x e y, también a los textos que irán variando sus tamaños con textSize.

Tercer ejemplo

ejemplo dos

Para que las imágenes y textos se muevan se utiliza la variable posY, sumada de determinado número para que vayan bajando sin que estas queden una detrás de otra.

Cuarto ejemplo

ejemplo dos

Al final de los códigos se actualiza la variable posY restándole valor para que se produzca el movimiento.

Resultado final

Todos los códigos aquí