27
Fundamentos de Animación Digital

Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

  • Upload
    others

  • View
    2

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

Fundamentos de

Animación Digital

Page 2: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

Contenidos…

La Animación

La Animación por Computadora

La Ilusión del Movimiento

Los Fotogramas

Tipos de Animación

Los Formatos

Page 3: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

La Animación

• La animación es un proceso utilizado para

dar la sensación de movimiento a

imágenes o dibujos o a otro tipo de

objetos inanimados (figuras de plastilina,

por ejemplo). Se considera normalmente

una ilusión óptica.

Page 4: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

La Animación por Computadora

• La animación por computadora (también

llamada animación digital, animación informática o

animación por ordenador) es la técnica que consiste

en crear imágenes en movimiento mediante el uso

de ordenadores o computadoras.

Page 5: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

La ilusión de Movimiento

• Los diseños se elaboran con la ayuda de

programas de diseño, modelado y por

último renderizado.

• Para crear la ilusión del movimiento,

una imagen se muestra en pantalla

sustituyéndose rápidamente por una

nueva imagen en un fotograma diferente.

Esta técnica es idéntica a la manera en

que se logra la ilusión de movimiento en

las películas y en la televisión.

Page 6: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

Que es un fotograma?

• Se denomina fotograma a cada una de las imágenes

impresionadas químicamente en la tira

de celuloide del cinematógrafo o bien en la película

fotográfica; por extensión también se llama de ese modo

a cada una de las imágenes individuales captadas por

cámaras de video y registradas analógica o digitalmente.

• Cuando una secuencia de fotogramas es visualizada de

acuerdo a una determinada frecuencia de imágenes por

segundo se logra generar la sensación de movimiento en

el espectador.

Page 7: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

Frecuencia de fotogramas

La frecuencia de los fotogramas o frame se expresa en fotogramas por segundo (en inglés frames per second y abreviado FPS) o en hercios (Hz). Para conseguir que el sistema visual humano vea movimiento ha de tenerse en cuenta que:

• Para observar parpadeo se ha de tener una frecuencia de fotograma menor de 50 Hz.

• La discontinuidad de movimiento tiene una frecuencia de fotograma

menor de 12 a 15 Hz.

Las frecuencias de fotograma de algunos de los sistemas más conocidos son las siguientes:

• Cine mudo: 16–18 Hz.

• Cine: 24 Hz.

• Televisión, normas europeas (PAL & SECAM): 25 Hz.

• Televisión, norma estadounidense (NTSC): 29,97 Hz.

Page 8: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

Ejemplos en cine

• La famosa serie de

fotografías de

Muybridge captadas

con 16 cámaras de alta

velocidad. Al pasar

ante la cámara el

caballo rompía un hilo

que la accionaba. La

sucesión continuada de

ellas consigue sugerir

el movimiento.

Page 9: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

Ejemplos de cine

• El caballo en

movimiento (1878)

de Eadweard

Muybridge.

Page 10: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

Los Fotogramas…

• En este diseño tenemos

fotogramas por separado

que describen un mismo

objeto en distintas

posiciones y/o formas.

Page 11: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

La Animación

• Esta bola roja "rebotando" consiste en

realidad, en 6 fotogramas.

• Aquí se muestran los fotogramas ( a una

velocidad de diez fotogramas por segundo).

Page 12: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

Tipos de animación.

1. Dibujos animados

Los dibujos animados se crean dibujando cada fotograma. Al

principio se pintaba cada fotograma y luego era filmado, proceso

que se aceleró al aparecer la animación por celdas o papel de

acetato inventada por Bray y Hurd en la década de 1910.

2. Stop motion

Animación de objetos, muñecos, marionetas, figuras de plastilina

u otros materiales así como maquetas de modelos a escala. Se

utiliza la grabación "fotograma a fotograma" o "cuadro a cuadro"

(frame a frame).

Page 13: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

3. Pixilación Es una variante del stop-motion, en la que los objetos animados son personas y auténticos objetos comunes (no modelos ni maquetas). Al igual que en cualquier otra forma de animación, estos objetos son fotografiados repetidas veces, y desplazados

ligeramente entre cada fotografía.

4. Rotoscopía

Se basa en dibujar directamente sobre la referencia, que pueden ser los cuadros de la filmación de una persona real. Así se animó en Disney algunas escenas de Blancanieves, protagonista del primer largometraje animado de Disney.

Page 14: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

5. Animación de recortes

Más conocido en inglés como cutout animation, es la

técnica en que se usan figuras recortadas, ya sea de papel o

incluso fotografías. Los cuerpos de los personajes se

construyen con los recortes de sus partes. Moviendo y

reemplazando las partes se obtienen diversas poses, y así se

da vida al personaje.

Page 15: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

6. Animación con acetatos

(cel animation)

El material con el que se hacían las primeras películas y se refiere a la pieza transparente de película que es utilizada en la animación tradicional hecha a mano (esta película transparente es fabricada generalmente de acetato y no de celuloide).

Los acetatos de animación se colocan en capas, una encima de la otra, para producir un solo cuadro de animación. Se utiliza un acetato separado para la capa del fondo y otro para cada objeto que se mueve independientemente sobre el fondo.

Page 16: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

7. Animación basada en cuadros

(flipbook animation)

Es el tipo más simple de animación. Quizá de niño

tuvieron uno de esos libros que contenían una

serie de dibujos al hojear rápidamente el libro, los

dibujos de las páginas sucesivas aparentaban

movimiento.

Page 17: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen
Page 18: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

8. Animación en Sprite.

Esta animación es también llamada animación basada

en repartos cada un sprite puede ser un objeto es

sobrepuesto y animado sobre un fondo estático. Esta

animación es muy común en videojuegos .

Page 19: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen
Page 20: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

Otras técnicas…

Virtualmente cualquier forma de producir imágenes,

cualquier materia que pueda ser fotografiada, puede

utilizarse para animar. Existen muchas técnicas de

animación que sólo han sido utilizadas por unos y que son

desconocidas para el gran público. Entre éstas se incluyen:

pintura sobre cristal, animación de arena, pantalla de agujas,

pintura sobre celuloide, tweening. Pero también es posible

reproducirlo por ordenador.

Page 21: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

Informática en la Animación

• Se puede considerar el aporte de la tecnología en dos

campos: como herramienta de creación y como medio de

representación.

• Para las animaciones dibujadas o pintadas a mano

hay programas que asisten a la creación de los cuadros

intermedios. Cabe recordar que se necesita una gran cantidad

de éstos para dar la sensación de movimiento. En las

animaciones hechas con gráficos vectoriales y con modelos

tridimensionales el programa mismo calcula la

transformación (interpola) de una pose a otra.

Page 22: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

Formatos…

• Diversos formatos de archivo permiten representar

animación en una computadora, y a través de Internet.

• Entre los más conocidos están SWF, GIF, MNG y SVG.

El archivo puede contener una secuencia de cuadros,

como gráficos rasterizados (o la diferencia entre un

cuadro y el anterior), o puede contener la definición de

trazos y sus deformaciones en el tiempo, en un formato

vectorial.

• Hay formatos de archivo específicos para animaciones, y

también se utilizan formatos genéricos que pueden

contener diversos tipos de multimedios.

Page 23: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

La Animación .Gif

• Es una secuencia

de cuadros

Page 24: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

La Animación .Swf

• Contiene la

definición de trazos

y sus deformaciones

en el tiempo, en

un formato vectorial

Page 25: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

Mas Ejemplos

Ejemplo de Animación Cuadro a Cuadro:

http://www.youtube.com/watch?NR=1&feature=fvwp&v=wTeQUC1jxQg

Ejemplo de Animación Basada en Acetatos

http://www.youtube.com/watch?v=cmJsqe7z8f8&feature=related

Ejemplo de Animación por Sprite

http://www.youtube.com/watch?v=Lf-Bri6_rK8&feature=related

Ejemplo de animación por Stop Motion

http://www.youtube.com/watch?v=4Ppln6Q19Cs

Ejemplo de animación por Pixilacion

http://www.youtube.com/watch?v=R9yL2U5U5F8

Ejemplo de animación por Rotoscopia

http://www.youtube.com/watch?v=lFQoN2OaFjg

Animación por recortes

http://www.youtube.com/watch?v=mgW28c0PLJc

Page 26: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

Responde según lo visto

• La animación es un a ilusión óptica ?

• Que nombre recibe cada cuadro de una animación

• Cuales son los aportes de la tecnología informática a la

animación

• Cuantos cuadros o frame debe tener como mínimo una

animación para que no se note discontinuidad en la misma.

• Menciona cuales son los técnicas de animación tradicional

• Cual es la diferencia entre los formatos GIF y SWF al

reproducir las animaciones?

Page 27: Fundamentos de Animación Digital - WordPress.com · 2013-07-09 · programas de diseño, modelado y por último renderizado. •Para crear la ilusión del movimiento, una imagen

Actividad en clase…

• Utilizando Flash, diseña una animación cuadro a cuadro

en la cual una pelota rebote de una lado a otro.