Unidad Temática 11. Animación. Definición. Herramientas software para su generación. Aplicaciones en Internet.



Documentos relacionados
5. Animación por ordenador (I).

Principios básicos de Animación por Computadora

UF 1.1 Recursos técnicos y humanos! Técnicas de la animación.! Módulo 1

Roberto Quejido Cañamero

GUIA N 1: INTRODUCCIÓN A FLASH 5

Diseño de actividades para el aula con Jclic Módulo 2: Generalidades sobre la creación de Proyectos Jclic

Objetivo: Que el alumno(a) entienda, comprenda y maneje el programa (Flash )

ELEMENTOS DEL DISEÑO GRÁFICO DISEÑO GRÁFICOEN MOVIMIENTO

Presentaciones. Con el estudio de esta Unidad pretendemos alcanzar los siguientes objetivos:

Las imágenes de los sitios web deben ser livianas para que las páginas se abran con mayor rapidez.

GUIA 3 Tema: Optimización de imagenes y recursos para la web.

En este tutorial aprenderemos las técnicas básicas de tratamiento de imágenes vectoriales con Flash.

PROGRAMA FORMATIVO MACROMEDIA STUDIO 8

GENERACIÓN DE TRANSFERENCIAS

Qué es Fireworks? Los mapas de bits

ING. YIM APESTEGUI FLORENTINO

TIPOS DE RESTRICCIONES

GENERACIÓN DE ANTICIPOS DE CRÉDITO

Capítulo 6. Desarrollo del Software

Paso 1 de 13. Paso 2 de 13. Guía de aprendizaje de Flash CS5 Tutorial 3. Creación de un logotipo textual.

UD6. Diseño de presentaciones

MANUAL COPIAS DE SEGURIDAD

GUÍA 10 Tema: Animación.

Plataforma e-ducativa Aragonesa. Manual de Administración. Bitácora

Adobe Illustrator CS5. Duración: Objetivos:

Accesibilidad web GUÍA FUNCIONAL

CAPÍTULO VI PREPARACIÓN DEL MODELO EN ALGOR. En este capítulo, se hablará acerca de los pasos a seguir para poder realizar el análisis de

Actividades con GeoGebra

App para realizar consultas al Sistema de Información Estadística de Castilla y León

BARRA DE HERRAMIENTAS DE BOCETO:

Tema: Animación en flash. Animando personajes

Adaptar fotografía. 1) Creación de un modelo 3D a partir de una fotografía adaptada

TEMA 20 EXP. WINDOWS PROC. DE TEXTOS (1ª PARTE)

Diseño de páginas web

1

I.E.S. Cuenca Minera Dto. Tecnología P.I. : Introducción al diseño 3D: Blender MODELADO

IMÁGENES DIGITALES. Tipos de imágenes digitales y características

CÓMO CREAR NUESTRO CATÁLOGO

Operación de Microsoft Excel

ANEXO. ACCESIBILIDAD UNIVERSIDAD DE ALICANTE

Departamento de Tecnologías de la Información y la Comunicación 2 Año Unidad 1: Edición digital de imágenes

Guía de uso del Cloud Datacenter de acens

ANIMACIÓN COMPUTARIZADA

Apuntes para hacer páginas Web con FrontPage

Ajuste de objetos en CorelDRAW 12: justo lo que necesitas. Por Steve Bain

6. DESCRIPCIÓN DEL SOFTWARE

Tutorial de FrontPage

MANUAL WINDOWS MOVIE MAKER. Concurso de Gipuzkoa

Unidad I. 1.1 Sistemas numéricos (Binario, Octal, Decimal, Hexadecimal)

Creando páginas para mi

CAPÍTULO 6 SOFTWARE DESARROLLADO


MONTAJE MULTIMEDIA (4º ESO)

1.- DESCRIPCIÓN Y UTILIDAD DEL SOFTWARE DAEMON TOOLS.

APLICACIONES MICROINFORMÁTICA Apuntes de POWERPOINT

Adobe Illustrator CS3 - Curso online

Aproximación local. Plano tangente. Derivadas parciales.

Análisis de los datos

Curso de fotografía Técnica fotográfica. Control de la luz Ricardo Sánchez Alférez

Ideas básicas sobre movimiento

Unidad 1. La información

Trabajar con diapositivas

Draw: objetos en 3D, diagramas de flujo y exportación

Programa diseñado y creado por Art-Tronic Promotora Audiovisual, S.L.

Qcad. Es un programa de diseña asistido por ordenador en 2 dimensiones.

Nueva generación de materiales. Sincronismo video/web

Curso de TIC educativas JITICE 2015

Operación Microsoft Access 97

Crear presentaciones con Impress de OpenOffice

Cuando hablamos de presentaciones, como las de Powerpoint, Keynote o similares, encontramos dos corrientes estéticas muy distintas:

ES U ESPAÑA 11. Número de publicación: Número de solicitud: A47G 29/00 ( )

En términos generales, un foro es un espacio de debate donde pueden expresarse ideas o comentarios sobre uno o varios temas.

Plantilla de texto plano

Internet aula abierta

CASO PRÁCTICO. ANÁLISIS DE DATOS EN TABLAS DINÁMICAS

Adaptación al NPGC. Introducción. NPGC.doc. Qué cambios hay en el NPGC? Telf.: Fax.:

GUÍA TÉCNICA PARA LA DEFINICIÓN DE COMPROMISOS DE CALIDAD Y SUS INDICADORES

CONCEPTOS BASICOS DE IMAGEN DIGITAL

Manual para la utilización de PrestaShop

Son aquellos que guardan imágenes, gráficos y dibujos. Existen fundamentalmente dos tipos de imágenes:

Ajustes de sombras. 1) Añadir localización

Audio ::: Copiar y pegar audio Diseño de materiales multimedia. Web Copiar y pegar audio con Audacity

Creando una webquests

Paso 1 de 10. Paso 2 de 10. Guía de aprendizaje de Flash CS5 Tutorial 13 - Publicación y exportación

Sitios remotos. Configurar un Sitio Remoto

Utilización del sistema operativo GNU/ Linux en las netbooks

Procesador de texto Apunte N 5

Grafismo Electrónico Examen parcial de retoque fotográfico Noviembre de Preguntas de Test

Parámetros con la ventana de selección de usuario, reglas, texto y descomposición (IVE)

I.E. FRANCISCO ANTONIO DE ZELA MANUAL DE MOVIE MAKER

Decisión: Indican puntos en que se toman decisiones: sí o no, o se verifica una actividad del flujo grama.

Introducción al diseño híbrido con ZW3D

FLASH CS5 - DISEÑO WEB

El tutorial de la herramienta pluma esta recomendado para usuarios de photoshop de nivel principiante.

ESCUELA TIC 2.0 MÓDULO 0

TIPOS DE PUBLICIDAD EN INTERNET ANUNCIOS Y ENLACES RECTANGULARES Y/O CUADRADOS - BANNER ADS:

Tras crear el terreno, añadir los objetos y programar la interfaz, el aspecto de la escena inicial quedó como se muestra en la Figura 30.

INFORMÁTICA APLICADA A LA GESTIÓN COMERCIAL LECCIONES DE OFIMÁTICA BÁSICA: GUIA BÁSICA DE MS - POWER POINT

StopMotion, manual de usuario*

ikimap. Comparte cartografía.

Transcripción:

Unidad Temática 11. Animación. Definición. Herramientas software para su generación. Aplicaciones en Internet. 11.1. Conceptos básicos. El término animación viene del griego "anemos" = viento, aliento y del latín "animus" = dar vida. El concepto de animación se asocia habitualmente con el de movimiento. Podemos definir la animación por ordenador como la "generación, almacenamiento y presentación de imágenes que en sucesión rápida producen sensación de movimiento." El fenómeno de la persistencia de la visión (de 100 a 20 mseg.) permite que se fundan las imágenes y que se puede generar la ilusión de movimiento. Los distintos fotogramas no deben ser muy diferentes entre sí, y la sensación de movimiento es más fluida a partir de una frecuencia de presentación de unos 20 Hz. Para reproducir un movimiento real se toman muestras del mismo a intervalos de tiempo regulares, y este muestreo puede sufrir el denominado aliasing temporal, relacionado con el aliasing geométrico. El aliasing temporal se llama también efecto estroboscópico porque un muestreo insuficiente hace que el movimiento se perciba como iluminado con una luz estroboscópica. Para evitarlo, se usa el difuminado de movimiento ("motion blur") que recoge en un solo fotograma varias posiciones del objeto en movimiento. Ejemplo del problema del aliasing temporal: si quisiéramos reproducir el movimiento de un segundero, qué efecto lograríamos tomando muestras a intervalos de 3, 15, 30, 50, 60, 70 seg.? Si se dispone de una serie de fotogramas de una animación, y suponiendo una frecuencia de presentación constante, al aumentar el número de fotogramas el movimiento se hace más lento, y al disminuir el número de fotogramas, el movimiento se hace más rápido. Por ejemplo, eliminando una imagen de cada tres, la velocidad aumenta en un 50%. La animación por ordenador permite representar modelos que evolucionan a lo largo del tiempo (no solamente cambian su posición, sino quizá también su tamaño, color, iluminación, textura...). La animación por ordenador puede entenderse desde distintos puntos de vista: Arte. Herramienta de visualización. Técnica de efectos especiales. Mejora con respecto a la imagen estática. La animación en tiempo real va generando los fotogramas a medida que son necesarios. La animación fotograma a fotograma calcula los fotogramas uno a uno y luego los muestra. A medida que los ordenadores se hacen más rápidos, los algoritmos de generación de imágenes se hacen más complejos, por lo que probablemente siempre existan las dos. Según cual sea el origen de los fotogramas con respecto al ordenador, se distinguen: Procedencia externa: fotogramas dibujados a mano, o generados a partir de la filmación de un movimiento real (técnica denominada rotoscopia). Algunos fotogramas son creados en el ordenador. El animador define manualmente los fotogramas principales de la animación (fotogramas clave, cotas o keyframes ), y el ordenador calcula los fotogramas restantes mediante métodos de interpolación. Generación completa por el ordenador. Son animaciones procedurales o simulaciones en las que la dinámica del modelo se describe de forma algorítmica. En un sistema de animación por ordenador, y siguiendo la analogía de un estudio cinematográfico se distinguen: Guión: descripción detallada de las escenas que componen la animación. Decorado: elementos inmóviles de la escena. - 1 -

Actores: elementos móviles definidos mediante unas variables que se modifican a lo largo del tiempo siguiendo unas reglas determinadas. Focos: fuentes de luz que iluminan la escena. Se pueden modificar tanto posición como características a lo largo del tiempo. Cámaras: se definen por su posición, su punto de interés y ángulo de visión. Panorámicas, zooms, fundidos... Otros movimientos de cámara: ecuaciones matemáticas, seguimiento de un actor, técnicas interactivas. Se pueden usar múltiples cámaras virtuales. Coreografía o partitura: creación de los elementos, descripción de sus movimientos y sincronización de los mismos. Para todo ello es necesario utilizar un sistema de animación. 11.2. Primeros hitos en la historia de la animación. 1824 Peter Roget presenta el trabajo "The persistence of vision with regard to moving objects" en la British Royal Society. 1831 Los doctores Plateau y Ritter construyen el "fenaquistoscopio": ilusión de movimiento mediante dos discos giratorios. 1872 Eadweard Muybridge comienza su recopilación fotográfica sobre animales en movimiento. 1889 George Eastman comienza la fabricación de película fotográfica. 1895 Los hermanos Louis y Auguste Lumière patentan un dispositivo llamado cinematógrafo, capaz de proyectar imágenes en movimiento. 1906 J. Stuart Blackton realiza la primera película de animación titulada "Humorous phases of funny faces". 1909 Winsor McCay realiza unos dibujos animados llamados "Gertie the Trained Dinosaur" conteniendo unos 10000 dibujos. 1913 Pat Sullivan crea una serie de dibujos animados titulada "Félix el Gato". 1927 La Warner Brothers lanza "El cantante de Jazz", primera película sonora. 1928 Walt Disney crea los primeros dibujos animados con sonido sincronizado: el ratón Mickey. 1964 Ken Knowlton de los laboratorios Bell, comienza a desarrollar técnicas informáticas para generar animaciones. 11.3. Animación tradicional aplicada a la animación por ordenador. La animación tradicional tiene muchos años de vida, y es un buen punto de partida para la animación por ordenador. Los estudios de dibujos animados llevan desde principios de siglo desmenuzando el movimiento y estudiando cómo se puede reproducir con la máxima naturalidad. Es interesante conocer alguno de los principios básicos de la animación tradicional porque pueden facilitar la síntesis de movimiento por ordenador: Anticipación. Se prepara la siguiente acción (por ejemplo, antes de salir corriendo, postura forzada en sentido contrario). La anticipación permite: Preparar los músculos para la acción. Preparar al espectador y captar la atención hacia la acción principal. Indicar la velocidad de la acción. Para conseguir movimientos fluidos y sensación de elasticidad se usan deformaciones de estiramiento y compresión. Los objetos se deforman en la dirección de desplazamiento para dar sensación de peso y gravedad. La deformación es perpendicular a la trayectoria en los impactos. La regla básica consiste en mantener el volumen de los objetos constante. Con estas deformaciones se evita el efecto estroboscópico de forma semejante al difuminado por movimiento. Solapamiento y continuación de las acciones. El solapamiento consiste en comenzar la siguiente acción antes de terminar la anterior (por ejemplo, para abrir una puerta, uno se acerca y ya está estirando la mano antes de llegar). La continuación significa que los movimientos no se detienen - 2 -

bruscamente, sino que continúan más allá de su posición final (por ejemplo un raquetazo, que continúa por inercia mucho después de haber dado a la bola). Por lo tanto, las fases en la animación de un movimiento son: 1) anticipación, 2) realización (con estiramientos, compresiones, solapamientos...) y 3) continuación. La asimetría consigue unos personajes más creíbles y realistas. La exageración sirve para llamar la atención sobre los elementos más importantes. Acción principal y acciones secundarias. La acción principal ha de ser única y clara: debe pasar una sola cosa en cada momento. A nivel individual en cada imagen: con la silueta del personaje debería bastar para entender la acción. A nivel global (en toda una secuencia), el lenguaje cinematográfico ha de ser igualmente claro. Sin embargo, se usan acciones secundarias (por ejemplo anticipación, continuación) que complementan la acción principal sin competir con ella. La mayoría de los desplazamientos siguen trayectorias curvas. En animación tradicional se usa a menudo la terminología cinematográfica para hacer referencia a las partes de una animación: Película (presentación, episodio): es toda la animación en su conjunto. En animación tradicional, suele haber una introducción que se repite en cada episodio. Escena: una cierta continuidad en cuanto a lugares, actores y acciones (e.g. una persecución en coche). Secuencia: sucesión ininterrumpida de planos que integran un tramo coherente y concreto del argumento. Plano: serie de fotogramas captados con la cámara sin dejar de funcionar. Fotograma: cada una de las imágenes individuales. 11.4. Técnicas de animación por ordenador. 11.4.1. Visión general. En la animación tradicional, la combinación de un lapicero y el arte del dibujante, se convierten en una herramienta de gran flexibilidad con la que se pueden lograr movimientos de notable realismo. El ordenador no es una herramienta tan flexible, pero tiene sus ventajas, y puede utilizarse para la creación de animaciones de muy diversas formas. A continuación se describen algunas de las técnicas más comunes. La rotoscopia consiste en capturar un movimiento real, y utilizar esa información para mover un diseño generado por ordenador. La captura de los datos del movimiento real incluye: Simplificación del modelo: normalmente, los movimientos reales (por ejemplo, el lanzamiento de un disco en atletismo) son demasiado complejos para intentar capturarlos íntegramente. Hay que identificar las partes fundamentales del movimiento. Identificación y marcado de los puntos de referencia. Normalmente son las articulaciones, y se suelen marcar con círculos de tela de un color vivo, pelotas de ping-pong... Realización de movimientos y recogida de datos (mediante múltiples cámaras de vídeo, traje de datos...) A continuación, y una vez digitalizada la información, se aplica ésta al modelo generado por ordenador para controlar su movimiento. Mediante esta técnica se consiguen movimientos de gran realismo, ya que al fin y al cabo se está copiando el movimiento real. La animación paso a paso consiste en definir manualmente cada uno de los fotogramas. En algunos tipos de animación tradicional (animación de figuras de plastilina), se usa esta técnica. Utilizando un ordenador, se puede definir manualmente cada uno de los fotogramas de una - 3 -

animación, por ejemplo, dibujar cada uno de los bitmaps de una pequeña animación cíclica. Esta técnica es muy lenta, y solo se usa para pequeñas animaciones. La animación por cotas consiste en basar el movimiento en unos fotogramas fundamentales o fotogramas clave ( keyframes ) y luego dejar que el sistema genere automáticamente los fotogramas intermedios mediante métodos de interpolación. Es importante que las cotas sean representativas del movimiento para que la interpolación tenga suficiente información. Esta técnica está basada en los métodos de trabajo de la animación tradicional en la que los animadores más expertos dibujan los momentos fundamentales del movimiento (cotas o keyframes) y los animadores principiantes dibujan los fotogramas intermedios ( inbetweens ). La animación procedural consiste en describir el movimiento de forma algorítmica. Hay una serie de reglas que controlan como se van modificando los distintos parámetros (como la posición o la forma) a lo largo del tiempo. Para movimientos sencillos (un péndulo o una rueda que gira) es una buena solución, pero para movimientos más complejos (una persona caminando, o una moneda que cae al suelo), resulta difícil conseguir buenos resultados. Hay algunas técnicas con resultados interesantes, como los sistemas de partículas o la simulación de movimientos grupales. La animación tradicional a menudo rompe las leyes de la Naturaleza, y suele definir movimientos atractivos y con carácter, pero imposibles en la realidad. Para realizar animaciones realistas, hay que tener en cuenta esas leyes de la Naturaleza: animación basada en leyes físicas, que utiliza la cinemática y la dinámica. Muchos movimientos cotidianos son muy difíciles de reproducir. La cinemática estudia los movimientos con independencia de las fuerzas que los producen, y se usa en animación en dos variantes: Cinemática directa: a partir del grado de rotación de las articulaciones, se calcula la posición de la estructura articulada. Cinemática inversa: a partir de una posición deseada de la estructura articulada, se calcula cuál debe ser el grado de rotación de las articulaciones. Para este problema puede haber cero, una o varias soluciones. El movimiento basado en cinemática inversa recuerda al de las marionetas con hilos y se aplica en la actualidad a toda la teoría de la robótica. La dinámica estudia el movimiento teniendo en cuenta las fuerzas que lo producen. Se puede obtener gran realismo, pero resulta difícil especificar la animación. Hay que tomar en consideración masas, aceleraciones, grados de libertad, restricciones al movimiento, movimientos prioritarios... La dinámica de los cuerpos rígidos articulados es más sencilla que la de los cuerpos deformables. Se distingue: Dinámica directa: a partir de las masas y fuerzas aplicadas, se calculan las aceleraciones. Dinámica inversa: a partir de las masas y aceleraciones, se calculan las fuerzas que hay que aplicar. 11.4.2. Animación 2D y 3D. La diferenciación más importante que se puede hacer es entre animaciones 2-d y 3-d. Las 2-d son las más parecidas a las características animaciones de dibujos animados y por mucho que pueden hacer combinaciones de profundidad o recoger fantásticas creaciones de los artistas gráficos, no pueden nunca llegar a ser tan realistas como las 3-d. La contrapartida de éstas es que son mucho más caras en tiempo computacional. De hecho, sólo hace muy poco tiempo han empezado a elaborarse con ordenadores de gama baja o digamos de usuario. 11.4.3. Tipos y Técnicas de Animación 2-D. Hay varios modos típicos de hacer animaciones. Intercambiando totalmente imágenes (cuadros, frames) en una secuencia de imágenes. Puede ser una rotación si el último frame coincide con el primero. Es la más lenta. Animación por diferencia de frames. La mayoría de la imagen continúa, y una pequeña parte cambia, y esa es la parte que se almacena. Es mucho más rápida, especialmente si las partes que cambian son pequeñas. Es la más habitual. - 4 -

Animación por paleta. Se suele utilizar para definir en efectos, no suele servir para animaciones "reales". Es rapidísima y se basa únicamente en cambios de paleta que instantáneamente cambian los colores de pantalla. Metamorfosis (morphing) y otro tipo de efectos. El número de cuadros que se pueden mostrar por segundo se llama índice de cuadro (frame index). En general, la llamada animación de personajes (dibujos animados) es la más compleja por la cantidad de facetas que obliga a cambiar en cada cuadro. Es imposible que el ordenador pueda hacerlo "solo", incluso con herramientas muy complejas de animación hace falta un trabajo ingente del animador. Para elaborar animaciones 2-d se pueden usar varias técnicas, que se mezclan o interrelacionan de distintos modos. Más que distintos resultados, son distintos enfoques que considera el animador para realizar la animación. La idea básica es sencilla: hay un objeto que cambia su posición, color u orientación (por supuesto se pueden animar múltiples objetos a la vez con distintos patrones) sobre un fondo. 11.4.4. Animación por Sprites. El objeto gráfico que cambia se denomina sprite. Por eso suele hablarse de animación por sprites. Una de las animaciones básicas es que el gráfico que forma el sprite cambie sin moverse según pasa el tiempo (por ejemplo, una mascota moviendo los brazos o la boca dando la sensación de movimiento). Una vez definidos unos frames básicos se pueden crear bucles (o ciclos, loops), que son patrones de animación que se repiten, interrelacionados probablemente de distintas formas. 11.4.5. Animación por trayectoria. A la vez que cambia, o manteniéndose el mismo gráfico, el objeto puede desplazarse por la pantalla. Es lo que se llama animación por trayectoria (path-based animation). El software actual permite a los animadores desplazar visualmente los objetos por la pantalla, definiendo los puntos iniciales y finales del movimiento, marcando con ello líneas rectas o curvas imaginarias que son las que determinan el camino (path) por el que se desplazará el sprite. También se suele hablar por esto de control de movimiento (motion control). En los programas especializados se permite un control muy fino sobre aspectos del camino, como aceleración o trayectorias complejas. En realidad toda animación por trayectoria se resume en dos aspectos: el camino a seguir y el tiempo de desplazamiento sobre ese camino. Para identificar cómo se realiza esta animación en el tiempo, una aproximación clásica en los programas de creación de animaciones es utilizar una línea de tiempos (timeline) en la que se indican los distintos fotogramas que irán ocurriendo al reproducirse. Para marcar los movimientos se determinan libremente fotogramas clave (keyframes), que son en los que se determinan las posiciones clave de los sprites. Entre dos keyframes es el programa el que anima el objeto a lo largo del camino marcado, creando los fotogramas intermedios (los in-between frames). Los keyframes establecen los puntos principales de la animación y son siempre, al menos, el inicial y el final. El proceso que permite hacer el software de generación de animaciones para crear los cuadros intermedios entre dos puntos claves se denomina tweening (intercalación). El proceso de intercalación permite no sólo mover sobre la pantalla un sprite, sino cambiar su posición de giro de acuerdo al movimiento, hacer un cambio progresivo de color o de tamaño, etc. Para ello suele definirse en cada sprite su punto de control o de registro, que es una especie de "centro de gravedad" sobre el que se actúa cuando se marca la trayectoria. 11.4.6. Animación por acetatos (cel-animation). Normalmente con la línea de tiempo (la timeline) el animador selecciona uno de los fotogramas en cada momento y trabaja sobre él. Una variante distinta permite ver a la vez en pantalla varios frames - 5 -

superpuestos. Como podemos imaginar, superponer directamente 5 o 10 fotogramas crearía una imagen irreconocible. La manera de conseguir algo útil e identificable es generar una imagen como si los fotogramas que se superponen fueran sólo semitransparentes, de manera que unos aparezcan con más claridad que otros, y la claridad vaya decreciendo. De esta forma se pueden ver superpuestos varios cuadros consecutivos y se toma referencia de la animación completa. Este es un método usado a menudo en la animación de celuloide tradicional, y se realizaba con "papel cebolla" recordando a la transparencia de las capas de la cebolla que se apilan unas encima de otras. Se suele denominar piel de cebolla (onion skinning) o papel de seda. Las técnicas se pueden combinar. Por ejemplo, el animador puede realizar una mascota que mueve sus piernas usando piel de cebolla y luego hacer además que se desplace por pantalla usando animación de trayectoria. El sprite suele venir determinado por un gráfico bitmap (o varios). Si en su lugar se describe matemáticamente (líneas, superficies, rellenos...) se denomina animación por vectores, pues los gráficos son gráficos vectoriales. Es menos realista o de ser realista es mucho más costosa en tiempo; pero suele ocupar bastante menos espacio, además de poderse escalar sin problemas. Es por ello muy utilizada en Internet (Macromedia Flash es, por ejemplo, un programa especializado en este tipo de animación). 11.4.7. Recortes. Otra técnica comúnmente utilizada en animación son los recortes (cut-outs). Esto significa que cuando se mueve un personaje no se redibuja por completo, sino simplemente las partes móviles (cabeza, o brazos, por ejemplo) y luego se montan. De esta forma se estudia previamente cada animación y se determinan qué partes no van a realizar movimientos parciales, y se dibujan y se animan por separado. El problema de la animación con recortes es el de las uniones entre piezas, que suelen tener que trabajarse bastante para no notarse en demasía. 11.4.8. Acciones secundarias y jerárquicas. Se denominan acciones secundarias a aquéllas que mejoran el resultado transcurriendo paralelamente a la animación de un objeto (la llama de un cohete o la melena al viento de un corredor...). - 6 -

Por ejemplo, si queremos crear efecto de movimiento, en los cambios de velocidad o frenados no todas las partes deberían frenar a la vez: las partes sueltas (la capa de un superhéroe o la antena de un coche) sufren un movimiento distinto al resto de las partes. En este sentido, pueden definirse movimientos o animaciones jerárquicas, que son varios ciclos de movimientos de distintos niveles, que algunas aplicaciones permiten (por ejemplo, las piernas de una persona caminando, de un lado a otro de un vagón, que a su vez se mueve en un tren). 11.4.9. Técnicas de animación 3-D. La animación 3-d, igual que el diseño de gráficos 3-d, es mucho más compleja que la bidimensional, y requiere por lo general una gran potencia de cálculo para ser elaborada con calidad, y un elevado tiempo de diseño para producir efectos realistas de movimiento, especialmente en lo que respecta a la animación de personajes o a la generación de entornos renderizados. La animación de personajes en 3-d normalmente implica la definición de los distintos segmentos tridimensionales y la unión entre ellos, definiendo puntos de conexión y puntos de rotación que permitirán hacer la animación. Posteriormente habrá que definir cuáles son los frames que nos interesan y renderizar por separado cada uno de ellos, formando una secuencia de imágenes realistas que finalmente se unirán secuencialmente en la composición. Los programas de edición 3-d permiten simplificar el proceso de animación de segmentos, una vez dibujado el personaje, definiendo una jerarquía de enlaces entre objetos tridimensionales, y aplicando después sobre ellos dos técnicas básicas que se llaman cinemática inversa y directa, como ya introdujimos en un momento anterior en este documento. Volvemos a comentarlas añadiendo alguna característica más y varios ejemplos: La cinemática directa (direct kinematics) es la posibilidad de mover algunas de las "piezas" de un personaje o montaje 3-d actuando sobre un punto y produciendo un movimiento sobre su eje o centro de rotación (por ejemplo, mover el brazo fijada la rotación sobre el hombro). El programa de animación 3-d genera con fórmulas geométricas simples todos los movimientos necesarios de las partes ligadas a su vez a ella. En este caso, en la jerarquía de movimientos o giros definida, se parte de un eje más importante fijo (por ejemplo, el hombro) para mover elementos más sencillos (por ejemplo, el brazo). La cinemática inversa (inverse kinematics) es la posibilidad de que, moviendo elementos más sencillos en la jerarquía, el programa interpola el resto de articulaciones o puntos de giro, que pueden ser configurados por el animador, para conseguir que se muevan acorde a eso. Este tipo de movimiento es mucho más interesante pero a la vez más complejo, ya que en general no hay un sólo modo de rotar los elementos entre sí para conseguir seguir el movimiento final que pretende el usuario. Por ejemplo, un codo puede girar en un sentido, pero no en otro. Por ello pueden configurarse márgenes de rotación que indiquen al software qué límites tiene a la hora de elegir entre unos movimientos u otros. Otra técnica distinta para construir elementos tridimensionales son las metaesferas que facilitan la creación de personajes sin costuras, ya que se definen diversas esferas o variantes (elipsoides, etc.) que entre sí se fusionan de acuerdo a su proximidad de una forma contínua en toda su superficie, y que pueden animarse independientemente o uniendo esferas entre sí con una especie de esqueleto. - 7 -

Otras técnicas utilizan curvas tridimensionales flexibles o algunas otras variantes basadas en polígonos en lugar de esferas. Técnicas más avanzadas de animación 3-d emplean otros enfoques radicalmente distintos, como: deformaciones morphing sistemas de partículas, basados en simulación de fenómenos naturales, etc. 11.5. Técnicas de animación orientadas a la web. Las animaciones son un recurso muy útil para el diseñador de páginas web. Pero también son el signo más evidente de mal gusto en muchas, muchas páginas. No hay nada peor que castigar la vista de los visitantes con un montón de feas animaciones que poco o nada aportan a los contenidos. Si las utilizamos selectivamente, las animaciones pueden resolver muchas necesidades. Hay dos formas principales de incorporar animaciones a las páginas web: los gif animados (la solución más extendida) y las películas de flash. También se pueden utilizar otros formatos multimedia, pero no se utilizan tan extensamente como estos dos. 11.5.1. Animación con GIF. Un gif animado consiste, simplemente, en una serie de imágenes, en formato gif, naturalmente, que están colocados consecutivamente y se muestran en pantalla durante un intervalo de tiempo determinado; se puede especificar para cada fotograma o frame. Al acabar la serie, puede volver a empezar (loop) un cierto número de veces, o indefinidamente. Con este formato, admitido por cualquier navegador(internet Explorer, Netscape Navigator, Arena, Mosaic, etc.), se tiene la ventaja que ofrece el formato gif: rápida descarga, nitidez, uso de transparencia... pero también la limitación de que las imágenes deben tener un número fijo de colores (un máximo de 256). Al tratarse de un formato de bitmap, si la animación es muy grande, larga o compleja, el tamaño del fichero resultante puede ser excesivo para que sea práctico. Trucos para la creación de animaciones GIF. Un gif animado se puede preparar con un programa dedicado (GIF Construction Set, Ulead Gif animator, Animagic) o bien utilizar la capacidad de exportar animaciones de otros programas más generales de creación y manipulación de imágenes, tales como Xara, Fireworks, Imageready. Crear el gif animado implica una preparación previa tan importante o más que la creación de los fotogramas de la animación. Debemos considerar qué partes del objeto se mueven y cuáles se mantienen fijas, y dibujar el número mínimo de frames para que la animación sea compacta pero convincente. La mayoría de animaciones que se crean, de todos modos, no son animación de movimiento, sino al estilo de los banners publicitarios de muchas páginas. Es una manera de exponer más información en la misma área de la pantalla. Podemos enlazar, por ejemplo, una serie de lemas uno tras otro, para que aparezcan gradualmente. En este gráfico vemos los principales controles que ofrece un típico programa de construcción de animaciones gif. Con cualquier aplicación de las comentadas, no resulta nada complicado crear la animación. Sólo deben prepararse las imágenes individuales. Las partes invariables pueden copiarse de un fotograma - 8 -

al siguiente; se indica el tiempo que se ha de mostrar cada uno, normalmente en milisegundos, y se decide si se repetirá toda la animación, un número finito de veces o indefinidamente. El tamaño final del GIF puede ser considerable si hay muchas imágenes, con muchos colores diferentes y formas complejas. Para reducir algo el tamaño de la animación, puede intentarse aplicar una paleta común a toda la serie de imágenes. El ejemplo que mostramos, algo más arriba, es un ejemplo gif animado aprovechando las posibilidades del formato: nuestro simpático charlatán apenas tiene 5k de tamaño de fichero. 11.5.2. Películas de Flash. La limitación de gif, jpg i png es que son ficheros de mapa de bits, con una resolución fija. No es posible cambiar el grado de ampliación de la imagen dentro del navegador, y si lo hacemos, inevitablemente perdemos calidad. La solución en este caso sería utilizar un formato vectorial, pero los navegadores no lo han permitido hasta hace relativamente poco. Se han intentado diferentes propuestas, entre ellas una muy interesante de Xara (el formato.web), pero han fracasado. A falta de un estándar oficial, se ha impuesto un formato cada vez más difundido: Flash. Si se quieren incluir imágenes en las que se pueda ampliar (zoom) para ver los detalles, que incluyan interactividad (menús desplegables, enlaces...) y sonido, debe considerarse el formato flash (o Shockwave Flash). Con los navegadores en las versiones 4-5, no hay ningún problema, puesto que incorporan el plugin necesario, que de todos modos es gratis: puede bajarse muy rápidamente de la web de Macromedia (http://www.macromedia.com). Ciertamente, Flash es más que un formato de vector, y más que un formato de animación: se usa más para animaciones interactivas, una especie de películas que para ilustraciones estáticas (si bien muchos de nuestros ejemplos están más bien en esta última categoría.) Flash se ha convertido en el estándar de facto para gráficos vectoriales, pero existe un nuevo formato emergente, recomendado por el consorcio de la www, llamado SVG (Scalable vector graphics). En el futuro probablemente se emplee en abundancia... Las películas de Flash se generan con un método bastante diferente al de los gif animados. Aunque Flash no sea precisamente un ejemplo de programa fácil de aprender, en algunos aspectos, debido al trabajo con objetos vectoriales, crear ciertos tipos de animación es tarea simple. Por ejemplo, los efectos de cambio de luminosidad y movimiento o cambio de forma que afecten a un objeto son la simplicidad misma en Flash. Para crear imágenes estáticas, o preparar las imágenes de base para la animación, también es posible utilizar Freehand o Illustrator, (este último requiere un plugin gratuito). Se elige la opción archivo exportar... eligiendo shockwave flash (swf). Una de las mayores ventajas de Flash es su manejo de símbolos: un símbolo es un objeto de la animación; una vez definido, queda incorporado al panel de símbolos del programa, y podemos utilizar tantas copias como deseemos, alterando su color, tamaño, visibilidad, distorsionándolas, fundiéndolas entre sí... sin que aumente el tamaño del fichero, puesto que el programa busca la información para generar el objeto en una única definición, la de la librería de símbolos. Flash, de Macromedia, es un programa de manejo un tanto complejo, que permite crear animaciones interactivas en formato SWF. Su manejo de gráficos vectoriales permite cambiar las dimensiones sin problemas, interpolar formas y otros efectos manteniendo tamaños de archivo compactos. Por ejemplo, visitando la página inicial de Macromedia, podemos ver un ejemplo bastante típico de lo que se puede conseguir con Flash. Aparece una imagen con una serie de efectos de animación y al cabo de unos instantes se nos ofrecen una serie de botones para elegir opciones. Estos botones pueden tener un efecto de "mouseover" y, además, al apretarlos desplegar un submenú, empezar una nueva animación, etcétera. Cuándo usar Flash?. Dadas las especiales características de Flash, no vale la pena si sólo queremos crear un pequeño banner con animación; supondría una inversión de mucho tiempo para aprender la forma en que trabaja el programa. De todos modos, Flash lleva un sistema de ayuda muy completo y fácil de - 9 -

entender y no resulta difícil manejarlo correctamente. Para determinados efectos, es rápido y cómodo, mucho más conveniente que la alternativa de un gif estático o animado: Animaciones con mucho movimiento de unos pocos símbolos: por ejemplo, unos engranajes. Flash resuelve la animación con mucha más facilidad, calidad y con un tamaño pequeño. El ejemplo que acompaña estas líneas tiene unos 5k, tamaño muy pequeño en comparación con el que exigiría un gif. Además, crear este tipo de movimientos en flash es muy fácil y con un gif sería extremadamente complicado y laborioso. Para animaciones a gran escala. El tamaño en Flash no tiene importancia (salvo que se incluyan también bitmaps en la película), por lo que pueden resolver animaciones a pantalla completa o para áreas extensas, situación en la que un gif animado sería poco práctico. Para logotipos que se van definiendo cada vez más, de forma gradual, a partir de una imagen inicial muy tenue; este efecto se puede hacer tan complejo como se quiera y el fichero final puede ser increíblemente pequeño. Con un GIF resultaría un enorme tamaño. Si queremos mostrar una imagen ampliable para ver detalles, por ejemplo, un catálogo de imágenes vectoriales o fuentes, un mapa... El inconveniente principal que presenta Flash, que alguno debería tener, es la exigencia de un plugin específico para ver estas imágenes. No es ningún problema grave, ya viene incluido en las últimas versiones de los navegadores y si es necesario se puede descargar libremente del site de Macromedia, sin que tarde mucho, ya que el reproductor de flash es relativamente pequeño. El mismo navegador detecta si existe una nueva versión y procede a preparar la actualización si nosotros lo autorizamos así. - 10 -