Animación en dos dimensiones
Existen teorías diversas que intentan explicar por qué percibimos un movimiento continuo cuando vemos una sucesión de imágenes a una velocidad superior a 10 cuadros por segundo (persistencia de las imágenes en la retina / fenómeno Phi / ilusión óptica). Lo cierto es que es una característica del sistema visual humano que nos permite construir animaciones.
Cada cuadro de una animación debe tener un cambio sutil respecto al anterior para que no se perciban saltos en el movimiento.
El formato gif y su variante gif 89a
Recordemos que gif es un formato de gráficos de mapa de bits que guarda la información en modo indexado, con diferentes tipos de paletas y que admite metadatos.
- Admite transparencia binaria para uno de los códigos de la paleta (solo 100% de transparencia o 100% de opacidad).
- Aplica compresión LZW sin pérdida de información de forma automática, sin que podamos intervenir en ella.
La variante gif -89a guarda una sucesión de gráficos de mapa de bits en modo de color indexado. Por lo tanto, para construir una animación que se vea nítida debemos tener en cuenta el tamaño en píxeles con el que deseamos que sea expuesta y también elegir una paleta de colores que no supere los 256.
¡Manos a la obra!
Construyamos animaciones en 2 dimensiones con Gimp
Descargá desde aquí el archivo auxiliar y construí tu propio gif animado. Trabajá con una paleta de colores a tu elección y guardá tus archivos.
También se pueden construir gif animados con cuadros generados en otro programa. Te mostramos un ejemplo a partir de aplicar escalado a una entidad, empleando Inkscape. Vos podés replicarlo usando la entidad que dibujaste en TGD1 y aplicando la operación de simetría que quieras (rotación, escala, traslación) para generar los cuadros.
CONSIGNA
Elegí uno de los gif animados que construiste, a partir del archivo auxiliar y cargalo en la columna del mural a continuación, que corresponda. El peso de tu archivo no debe superar los 100 KB (y el tamaño en píxeles debe ser 400x400px). Al cargarlo, colocale tu nombre, apellido y registro y consigná: el peso, la cantidad de cuadros que contiene el archivo y el retraso entre ellos. Después cargalo también en el Aula Virtual. (Tenés tiempo hasta mañana viernes 27 de septiembre a las 13:00hs)
Otra forma de construir gif animados, usando un programa en línea.
En este caso, para construir tu animación necesitás preparar tus propios insumos (fotos y/o dibujos en algún formato de mapa de bits).
Este es el resultado obtenido y, en este caso, no difiere en nada respecto a haberlo resuelto con Gimp.
Infografías animadas resueltas con gif
Te invitamos a visitar el sitio de Jacob O’Neal, donde se encuentra el original de esta infografía animada construida por él y resuelta con un gif animado.
La animación original está resuelta con un tamaño en píxeles de 1400×1890 pix y con 120 cuadros. Dado que este gif tiene una paleta muy pocos colores, su autor logró un archivo que pesa solo 500 KB.
Si bien la profundidad en bits de gif siempre es de 8bpp, cuando se emplean pocos colores, la compresión sin perdida, que el formato aplica automáticamente puede ser muy eficaz, lográndose archivos optimizados de bajo peso.
Esta es otra fabulosa infografía animada de Jacob O’Neal resuelta con un gif animado
En este caso la animación está resuelta con 48 cuadros de 1000×2790 pixeles. El peso del archivo es de 2,45 MB
Procesos y recursos para producir animaciones: Guión y Story board
En el proceso de pre-producción (la etapa previa a la producción en la computadora de la animación) se acude a estos recursos:
El guión de animación
Es un escrito que explica la idea y la secuencia de acciones que se desarrollarán en la animación.
El stoy board o guión gráfico
Es una representación visual del guión. Es un esquema gráfico de la idea desglosado por cuadros. Aunque describe el diseño de la animación, no es equivalente a ella. Debe funcionar como un instrumento de comunicación que facilite la producción de la animación. En muchos casos, los story boards están hechos de bocetos dibujados a mano y notas en los márgenes. Aunque también existen programas específicos para generarlos.
Este es un ejemplo de cuadros del story board (o guión gráfico) de la película Wall-e. Te recomendamos visitar el sitio de donde fue obtenido en: https://soydecine.com/storyboard-que-es-y-como-se-hace/
Si ya desarrollaste todas las actividades anteriores, te invitamos que corrobores cuánto aprendiste con ellas, completando el formulario a continuación, y luego, a continuar con la tarea asincrónica.
TAREAS ASINCRÓNICAS
CONSIGNA
1
Te proponemos que te ayudes pensando en un guión escrito, delinees un story board y construyas una animación de la marca que diseñaste en el Taller de Diseño Gráfico, en un tamaño de 650×650 pixeles. Tu archivo final debe pesar menos de 600 KB. Podés ver como ejemplo algunos de los trabajos que realizaron tus compañeros de años anteriores. Utilizaremos esta animación como insumo en la siguiente clase para la realización de una Multimedia Digital.
Cuando tu animación esté lista, subí el gif animado al siguiente mural (consigná tu nombre, apellido, registro, el peso del archivo, la cantidad de cuadros y el retraso). Luego cargá tu gif animado en el Aula Virtual. La fecha de entrega es hasta el jueves 3 de octubre las 8:00 hs.