UNIDAD DIDÁCTICA: CREACIÓN DE
ANIMACIONES CON FLASH
PARA EL ESTUDIO DE ESTA UNIDAD
DIDÁCTICA SE REQUIERE QUE EL
ESTUDIANTE CONOZCA LAS
HERRAMIENTAS DE TRABAJO DE FLASH.
LA CREACIÓN DE SÍMBOLOS. ESTA
UNIDAD SE TRABAJA EN LA ASIGNATURA
MULTIMEDIA 1, SÉPTIMO NIVEL, FACULTAD
DE DISEÑO DE LA UNIVERSIDAD
TECNOLÓGICA AMÉRICA UNITA.
DOCENTE: ING. MAGALI MEJÍA PESÁNTEZ
Creación de animaciones en
Flash CS3
Creación de movimiento
Efectos de línea de tiempo
Animación interpolada
Animación fotograma a fotograma, entre otros
Creación de fotogramas clave
Cambios en la animación definen un fotograma
clave
Animación fotograma a fotograma cada uno es
clave
Animación interpolada dos claves y se crean los
intermedios
Creación de fotogramas
Insertar > Línea de tiempo > Fotograma clave
Botón derecho en un fotograma de la línea de
tiempo, e insertar fotograma clave
Representación de animaciones
Interpolación de movimiento Interpolación de forma
Interpolación incompleta, falta
fotograma final
Un punto negro fotograma único, el resto de
grises son copias y terminan con un rectángulo
Una a se ha asignado una acción
en el panel de acciones
Una bandera roja indica que tiene una etiqueta
Velocidad de fotogramas
La velocidad de fotogramas, la rapidez con que
se reproduce la animación, se expresa en
fotogramas por segundo (fps).
Si la velocidad de fotogramas es muy baja, la
animación parece detenerse y volver a
empezar y si es muy alta los detalles se ven
borrosos.
Elija una velocidad de 12 fps para Internet. La
velocidad estándar de movimiento de la imagen
es de 24 fps, pero en las películas QuickTime y
AVI es habitualmente de 12 fps.
Animación fotograma a
fotograma
Cambia el contenido del escenario en cada
fotograma y es ideal para las animaciones
complejas en las que la imagen cambia en
cada fotograma en lugar de moverse por el
escenario.
Incrementa el tamaño del archivo con mayor
rapidez que la animación interpolada.
Flash guarda los valores de los fotogramas
completos.
Creación de animaciones
fotograma a fotograma
Defina cada fotograma como fotograma clave y
cree una imagen distinta para cada uno.
Inicialmente, cada fotograma clave tiene el
mismo contenido que el fotograma clave
inmediatamente anterior, de modo que los
fotogramas pueden modificarse en la
animación de forma gradual.
...Animación fotograma a
fotograma
Active la capa y seleccio-
ne el fotograma de inicio
Insertar/Línea de tiempo/
Fotograma clave
Cree la ilustración del primer
fotograma de la secuencia
Clic en el siguiente fotograma a la derecha
y seleccione
Insertar > Línea de tiempo > Fotograma clave
Para crear el siguiente incremento de
la animación, cambie el contenido de
este fotograma en el escenario
Complete la secuencia de animación,
repitiendo los pasos 4 y 5 hasta que haya
creado el movimiento deseado
Para probar la secuencia de animación,
elija Control > Reproducir o haga clic
en el botón Reproducir del controlador
1 2 3
4 5
6 7
Sólo pueden editarse los fotogramas clave.
Para editar fotogramas interpolados, cambie uno
de los fotogramas clave de definición o inserte un
nuevo fotograma clave entre el inicial y el final
Utilización de efectos de línea de
tiempo
Los efectos de la línea de tiempo
Los efectos de línea de tiempo incorporados
permiten crear animaciones complejas con un
número mínimo de pasos.
Los efectos de línea de tiempo pueden aplicarse a
los siguientes objetos:
Texto
Gráficos, incluidos formas, grupos y símbolos gráficos
Imágenes de mapa de bits
Símbolos de botón
...Efecto de línea de tiempo
Cómo añadir un efecto de línea de tiempo
Al añadir a un objeto, Flash crea una capa y
transfiere el objeto a esa capa.
La capa nueva recibe automáticamente el mismo
nombre que el efecto, seguido de un número que
representa el orden en que se aplica el efecto.
Cuando se añade un efecto de línea de tiempo, se
añade a la biblioteca una carpeta con el nombre del
efecto. Esta carpeta contiene los elementos
utilizados en la creación del efecto.
...Efecto de línea de tiempo
Realice uno de los siguientes pasos:
• Seleccione el objeto al que va a agregar el efecto de la línea de tiempo.
Insertar > Efectos de línea de tiempo, realice una selección
y elija un efecto en la lista.
• Haga clic con el botón derecho del ratón en el objeto al que va
a añadir el efecto de línea de tiempo.
Seleccione Efectos de línea de tiempo, y elija un efecto.
Muestre la vista previa del efecto, según la configuración predeterminada.
Modifique los valores predeterminados y
haga clic en Actualizar vista previa para ver el efecto con los nuevos valores.
Cuando aparezca el efecto de línea de tiempo en la ventana de la vista previa,
haga clic en Aceptar.
ConfiguraciónConfiguración
Cada efecto de línea de tiempo manipula un gráfico o
símbolo y permite modificar parámetros concretos. La
ventana de vista previa muestra los cambios realizados
al modificar la configuración.
EdiciónEdición
1 Seleccione el objeto asociado al efecto y realice una:
En el inspector de propiedades, haga clic en Edición.
Haga clic con el botón derecho del ratón y seleccione
Efectos de línea de tiempo > Editar efecto.
2 Edite la configuración y haga clic en Aceptar
EliminaciónEliminación
En el escenario, haga clic con el botón derecho del
Efectos de línea de tiempo > Quitar efecto.
Animación interpolada
Flash puede crear dos tipos de animaciones
interpoladas:
En la interpolación de movimiento, se definen
propiedades tales como la posición, el tamaño y la
rotación de una instancia, un grupo o un bloque de
texto en un momento específico, y también se
puede crear una interpolación de movimiento a lo
largo de un trazado.
En la interpolación de formas, se dibuja una forma
en un momento específico y se modifica o se dibuja
otra forma en otro momento. Flash interpola los
valores o formas de los fotogramas intermedios
para crear la animación.
...Animación interpolada
Nota: para aplicar interpolación de formas a grupos, instancias o
imágenes de mapas de bits, separe estos elementos. Para aplicar
interpolación de formas a texto, separe el texto dos veces para
convertirlo en objetos.
La animación interpolada es una forma eficaz
de crear movimiento y realizar cambios, ya que
reduce al mínimo el tamaño del archivo. En
esta animación, sólo se guardan los valores de
los cambios producidos entre fotogramas.
Para preparar rápidamente los elementos de
un documento para crear una animación
interpolada, distribuya los objetos en capas.
Cómo añadir interpolaciones de
movimiento a instancias, grupos o tipos
Para interpolar los cambios en las propiedades de
instancias, grupos y tipo, utilice la interpolación de
movimiento. Interpola la posición, el tamaño y la
rotación, así como sesgar instancias, grupos y tipo.
Puede interpolar el color de las instancias y los
tipos para crear cambios graduales de color, o
hacer aparecer o desaparecer instancias de forma
paulatina. Para interpolar el color de grupos o
tipos, conviértalos en símbolos. Para animar
caracteres individuales de un bloque de texto por
separado, coloque cada carácter en un bloque de
texto distinto.
Creación de una interpolación de movimiento
mediante la opción Interpolación de movimiento
Active una capa y seleccione un
fotograma clave vacío donde
comience la animación
Para crear el primer fotograma de la interpol. de movim.:
• Cree un objeto gráfico y conviértalo en un símbolo
• Cree una instancia, un grupo o un bloque de texto
• Arrastre una instancia de un símbolo del panel Biblioteca
Cree un segundo fotograma
clave donde acabe la animación
y selecciónelo.
Para modificar el elemento en el último fotograma:
• Mueva el elemento a una nueva posición
• Modifique el tamaño, rotación o sesgo del elemento
• Modifique el color del elemento
Si ha modificado el tamaño del elemento,
seleccione Escala para interpolar el tamaño
del elemento seleccionado.
Para obtener un efecto de
movimientomás real,
aplique suavizado
Haga clic en uno de los fotogramas de la
interpolación, seleccione Movimiento en el
menú emergente Interpolación
(Ventana > Propiedades > Propiedades)
Para girar el elemento mientras se interpola, elija una
opción del menú Girar. Ninguna para impedir, para el mínimo
movimiento Auto y para un número de rotaciones indique
el valor y si es Hacia la derecha o Hacia la izquierda
Si es un trazado de movimiento, seleccione
Orientar según trazado para orientar la línea
de base del elemento interpolado hacia el trazado
Para sincronizar la animación,
seleccione Sinc. del
Inspector de propiedades.
Creación de una interpolación de movimiento mediante
el comando Crear interpolación de movimiento
Seleccione un fotograma clave vacío
y dibuje un objeto en el escenario
o arrastre una instancia de un símbolo
de la Biblioteca
Seleccione Insertar >
Línea de tiempo >
Crear interpolación
de movimiento
Click dentro del fotograma
donde termina la animación
y elija Insertar >
Línea de tiempo > Fotograma
Coloque el elemento en el escenario en
la posición adecuada. Ajuste el tamaño
del elemento para interpolar su escala.
Para interpolar su rotación, ajuste la rotación.
Anule la selección del objeto cuando haya
finalizado los ajustes.
Para ajustar la velocidad de cambio entre
fotogramas interpolados, arrastre la flecha
que se encuentra junto al valor de suavizado
o introduzca un valor
Para girar el elemento seleccionado
mientras se interpola, elija una
opción del menú Girar.
Si está utilizando un trazado de movimiento, seleccione
Orientar según trazado para orientar la línea de base
del elemento interpolado hacia dicho trazado.
Seleccione Sincronizar para garantizar que la instancia
se reproduzca correctamente de forma indefinida en el
documento principal.
Si está utilizando un trazado de
movimiento, seleccione Ajustar
para asociar el elemento interpolado
al trazado de movimiento por su
punto de registro.
Interpolación de movimiento a lo
largo de un trazado
Las capas de guía de movimiento permiten
dibujar trazados a lo largo de los cuales se
animan instancias, grupos y bloques de texto
interpolados. Puede vincular varias capas a
una capa de guías de movimiento para hacer
que varios objetos sigan el mismo trazado. Al
vincular una capa normal a una capa de guías
de movimiento se convierte en un tipo de capa
con guía.
Creación de un trazado de movimiento en una
animación interpolada
1 Cree una secuencia de animación interpolada
de movimiento.
2 Realice uno de los siguientes pasos:
Seleccione la capa que contiene la animación y
elija Insertar > Línea de tiempo > Guía de
movimiento.
Haga clic con el botón derecho del ratón en la capa
que contiene la animación y elija Añadir guía de
movimiento. Flash crea una nueva capa sobre la
seleccionada con el icono de guía de movimiento a
la izquierda del nombre de la capa.
...Creación de un trazado de movimiento en
una animación interpolada
3 Utilice las herramientas Pluma, Lápiz, Línea,
Círculo, Rectángulo o Pincel para dibujar el trazado
deseado.
4 Ajuste el centro al comienzo de la línea en el
primer fotograma y al final de la línea en el último.
Nota: para conseguir un ajuste óptimo, arrastre el
símbolo por su punto de registro.
5 Si desea ocultar la capa de guías de movimiento y
la línea para que sólo pueda verse el movimiento
del objeto mientras trabaja, haga clic en la columna
del ojo de la capa de guías de movimiento.
Créditos
Este material fue realizado tomando textos e
imágenes de ADOBE FLASH CS3® ®
PROFESSIONAL. GUÍA DEL USUARIO