CREACIÓN DE ANIMACIONES Y SÍMBOLOS La animación permite que las figuras que haya en el escenario generen una ilusión de movimiento en la película, es decir, la animación se crea mediante el cambio del contenido de fotogramas sucesivos; por ejemplo, como cuando se dibujan varias imágenes en diferentes hojas de papel y después se vayan visualizando una a una de una manera rápida, creando así el efecto de movimiento. Para entender la forma en que Flash crea la ilusión del movimiento, debemos comprender los siguientes términos y aspectos. Se pueden crear dos tipos de animaciones en Flash: 1. Fotograma a Fotograma 2. Por Interpolación En la animación Fotograma a Fotograma la animación se crea en cada fotograma de la película. En la animación por interpolación se crea la imagen inicial y final posteriormente Flash crea las imágenes intermedias. CREAR UNA ANIMACIÓN FOTOGRAMA A FOTOGRAMA Recuerde que los fotogramas se visualizan en la ventana Línea de tiempo Cada pequeño rectángulo de la regla en la Línea de tiempo representa un Fotograma PRÁCTICA 1) Inicie un nuevo archivo en Flash y seleccione la herramienta Ovalo 2) Trace un circulo en la Escena 3) Observe como en el fotograma 1 aparece un punto indicando que no esta vació y que contiene la figura recién insertada CORPORATIVO CETEC - SICASA 69
Insertar Fotograma clave vació 1) De un clic en el Fotograma dos para seleccionarlo Observe que al dar clic en el segundo fotograma este se pone en color azul 2) Abra el menú Insertar y seleccione Fotograma clave vació Observe que el Escenario aparece en blanco para poder agregar la figura en el fotograma clave recién insertado CORPORATIVO CETEC - SICASA 70
3) Dibuje un circulo en medio del Escenario un poco más grande que el primero 4) De un clic en el tercer fotograma para seleccionarlo 5) Abra el menú Insertar y seleccione Fotograma clave vació CORPORATIVO CETEC - SICASA 71
6) Trace un circulo en la parte inferior izquierda de la Escena con un tamaño más grande que el anterior Reproducir la película Enseguida ejecutaremos la película para ver el efecto de movimiento. Otra forma de reproducir la película es pulsando la tecla Enter, (sin accesar a ningún menú) 1) Abra el menú Control y seleccione Reproducir Observe como el efecto muestra el despliegue del circulo, del más pequeño al mayor, es decir, como si el circulo creciera CORPORATIVO CETEC - SICASA 72
Cambiar la velocidad de los fotogramas Para apreciar mejor el efecto de movimiento, vamos a cambiar la velocidad de los fotogramas de la película. 1) Seleccione Película del menú Modificar 2) En la Propiedad Veloc. Fotograma escriba el número 2 (o 3 sí lo desea) 3) De un clic en Aceptar 4) Presione la tecla Enter para reproducir la película y observe el efecto del movimiento del circulo Hasta este momento hemos creado una animación Fotograma a Fotograma; ya que como habra observado, para la animación se utilizaron tres fotogramas y en cada uno de ellos se inserto una figura. CORPORATIVO CETEC - SICASA 73
CREAR ANIMACIÓN POR INTERPOLACIÓN Recuerde que en este tipo de animación se debe crear solo dos figuras, la figura inicial y la figura final. 1) Cree un nuevo archivo en Flash, seleccione la herramienta Ovalo y trace un circulo como se muestra en la figura 2) Active la herramienta Flecha 3) De un clic en el Primer fotograma para seleccionarlo 4) Abra el menú Insertar y seleccione Crear interpolación de movimiento CORPORATIVO CETEC - SICASA 74
Observe como se muestra alrededor del circulo un marco azul indicando que la figura sé a convertido en un símbolo Cuando la imagen muestra este recuadro el objeto no se puede borrar, cambiar de relleno o modificar su aspecto en primer plano ya que se trata de un símbolo Un símbolo es una imagen, botón o animación reutilizable. Más adelante comprenderemos más a detalle la utilización de los símbolos. 5) De un clic en el fotograma 10 para seleccionarlo 6) Abra el menú Insertar y seleccione Fotograma clave (observe que también se puede presionar la tecla F6) CORPORATIVO CETEC - SICASA 75
7) Observe como entre el primer fotograma y el ultimo aparece una flecha Los fotogramas clave de interpolación de movimiento están indicados por un punto negro; los fotogramas intermedios tienen una flecha negra sobre fondo azul claro. 8) Verifique que se encuentre seleccionado el fotograma 10 y arrastre el circulo hacia la derecha tal y como se muestra en la figura 9) De un clic en el primer fotograma para seleccionarlo Observe como él circulo esta del lado izquierdo de la escena Recuerde que la animación de interpolación esta compuesta por dos figuras (inicial y final) y en este ejemplo tenemos dos figuras en el fotograma 1 y en el fotograma 10 CORPORATIVO CETEC - SICASA 76
10) De un clic en el fotograma 10 para ver la segunda figura 11) Abra el menú Control y seleccione Reproducir (sí desea solo oprima la tecla Enter para reproducir la película) 12) Observe como se presenta la animación del movimiento del circulo de izquierda a derecha CORPORATIVO CETEC - SICASA 77
SÍMBOLOS Un símbolo es un objeto gráfico al que se le asigna un nombre con el fin de emplearlo posteriormente en la misma película. La finalidad de crear un símbolo, consiste en poder emplearlo las veces que sea necesario en la película sin necesidad de volverlo a dibujar. PRÁCTICA 1) Cree un nuevo archivo de Flash 2) Seleccione la herramienta Lápiz y en el botón de opción Modo lápiz seleccione Tinta 3) Verifique que se encuentre activado el botón Ajustar a objetos de la barra de herramientas Estándar 4) Trate de dibujar un árbol tal y como se muestra en el ejemplo 5) Seleccione la herramienta Cubo de pintura 6) De un clic en el botón Mostrar mezclador de la barra de herramienta Lanzador 7) Al abrirse la ventana Mezclador de un clic en la ficha Muestras 8) Seleccione los colores y rellene la copa del árbol de color verde y el tronco de color café CORPORATIVO CETEC - SICASA 78
9) Active la herramienta Flecha y abra un área abarcando todo el arbol para seleccionarlo 10) Abra el menú Insertar y seleccione la opción Convertir en símbolo 11) Escriba ÁRBOL como nombre del símbolo (verifique que el botón de opción Clip de película este activado) 12) De un clic en el botón Aceptar Observe como aparece un marco azul alrededor de la imagen 13) Cierre la ventana de colores de muestra Recuerde que el marco indica que se trata de un símbolo de flash. CORPORATIVO CETEC - SICASA 79
Biblioteca de Símbolos Ahora supongamos que queremos dibujar otros dos o tres árboles más en el Escenario. 1) Abra el menú Ventana y seleccione la opción Biblioteca Observe ventana Biblioteca la 2) De un clic en el nombre ÁRBOL y observe como se despliega la imagen del símbolo 3) De un clic sobre el nombre del símbolo y sin soltar el botón del mouse arrástrelo hacia la Escena CORPORATIVO CETEC - SICASA 80
Observe como se agrega otra imagen del árbol en la Escena La utilidad y ventaja de crear una imagen como un símbolo, es que la podremos insertar en la película las veces que lo deseemos. Cada imagen que insertemos del símbolo es conocida como Instancia (copia del símbolo original), es decir que podremos insertar tantas Instancias del símbolo en la película como lo deseemos. Modificar las propiedades del Símbolo Una vez que se crea un símbolo este no se puede modificar en el primer nivel del Escenario, si no que se tendrá que modificar en una nueva ventana. Cada cambio que se realice en el símbolo afectará a todas las instancias de la película. A continuación se presentan las diferentes formas de modificar un símbolo. 1) De un clic con el botón derecho sobre el nombre del símbolo y del menú seleccione Editar CORPORATIVO CETEC - SICASA 81
Observe como aparece la figura en una nueva ventana lista para ser modificada 2) Regrese a la Escena dando un clic en Escena1 Observe como al dar clic en Escena1 se retorna a la ventana principal 3) De un clic en el Botón Editar símbolos y del menú seleccione ÁRBOL CORPORATIVO CETEC - SICASA 82
Observe como volvió a aparecer la ventana que permite editar la imagen 4) De un clic en el botón Editar Escena y del menú seleccione Escena1 para volver a la Escena Observe como se retorna a la Escena 5) Abra el menú edición y seleccione Editar seleccionado o Editar símbolos Verifique que se encuentre seleccionado el árbol Como observo, se realizaron tres formas diferentes de editar un símbolo. CORPORATIVO CETEC - SICASA 83
A continuación procederemos a modificar el símbolo. 6) De un clic en alguna parte en blanco para quitar la selección del árbol 7) Seleccione la herramienta Cubo de pintura 8) De un clic en el Botón Mostrar Mezclador y después de un clic en la ficha Muestras para ver los colores 9) Cambie el color de la copa del árbol 10) De un clic en Escena1 para volver a la Escena Si tiene abierta la ventana Biblioteca observará el cambio del símbolo Observe como el cambio afecto a todas las instancias del símbolo CORPORATIVO CETEC - SICASA 84
Modificar una Instancia Como hemos observado al modificar un símbolo este cambio afecta a todas las Instancias de la película, sin embargo en ocasiones, solo se deseará cambiar una Instancia del símbolo para lo cual tendremos que realizar lo siguiente. 1) Active la herramienta Flecha 2) Abra el menú Ventana, seleccione Paneles y del menú seleccione Efecto 3) De un clic en el botón plegable para ver los tipos de efecto y seleccione Avanzado La opción Avanzado permiten cambiar por separado los colores de la Instancia Los controles situados a la izquierda permiten reducir los valores para el color o la transparencia en el porcentaje especificado Los controles de la derecha permiten reducir o aumentar los valores del color o la transparencia por un valor constante CORPORATIVO CETEC - SICASA 85
4) De un clic en el botón plegable del color Rojo y observe que aparece una barra deslizable indicando el valor del color, arrástrela hacía abajo y observe el cambio en el árbol seleccionado Observe que los cambios de los colores solo afectan a la instancia seleccionada 5) Cambie los valores según lo considere 6) Muestre la ventana Biblioteca desde el menú Ventana opción Biblioteca (si es que no la tiene abierta) 7) De un clic en el nombre del símbolo y después arrastre la figura hacia la escena para insertar una tercer Instancia CORPORATIVO CETEC - SICASA 86
Observe como las instancias que se insertan aun tiene las mismas propiedades del símbolo Eliminar un símbolo 1) Active la herramienta Óvalo y dibuje un circulo como se muestra en el ejemplo 2) De un clic en el botón Color de relleno y seleccione un color relleno degradado 3) Active la herramienta Cubo de pintura y de un clic en el circulo para rellenarlo con el color seleccionado 4) Active la herramienta flecha y de doble clic sobre el circulo para seleccionarlo 5) Abra el menú Insertar y seleccione la opción Convertir en símbolo CORPORATIVO CETEC - SICASA 87
6) Escriba el nombre CIRCULO como nombre del objeto 7) De un clic en Aceptar Observe como se agrega el nuevo símbolo en la ventana Biblioteca 8) Arrastre el circulo hacia esta posición para crear una nueva Instancia del símbolo 9) De un clic sobre el nombre del símbolo CIRCULO y después de un clic sobre el botón en forma de bote (Eliminar) CORPORATIVO CETEC - SICASA 88
10) De un clic en el botón Eliminar Observe como se elimina el símbolo y todas las instancias que lo componen Si desea puede crear Carpetas para tener una mejor organización de los símbolos Cree las carpetas y después arrastre dentro de ellas los símbolos CORPORATIVO CETEC - SICASA 89
Cuestionario Preguntas: 1. Cuáles son los dos tipos de animaciones en Flash? 2. En que tipo de animación se crea solo la imagen inicial y la imagen final? 3. Qué representa el pequeño rectángulo ubicado en la línea de tiempo? Subraye la respuesta correcta a) A un fotograma b) A un símbolo c) A una imagen d) Una herramienta 4. Encierre en un circulo el nombre del menú que permite agregar un Fotograma clave vació en la línea de tiempo: 5. Cuál es el nombre del menú que permite reproducir la película? 6. Observe las tres figuras y tache con una X la figura que representa un símbolo 7. Subraye la tecla de función que permite insertar un fotograma clave. a) Enter b) F7 c) F1 d) F6 8. Subraye la tecla nos permite reproducir la película. a) Enter b) F7 c) F1 d) F6 9. Qué es un símbolo en Flash? CORPORATIVO CETEC - SICASA 90
10. Encierre en un circulo el nombre del menú que permite mostrar la Biblioteca de símbolos utilizados en la película. 11. Desde la escena de la película se puede modificar las propiedades de un símbolo? a) Cierto b) Solo si esta agrupado el símbolo c) A veces d) Solo en Una ventana nueva 12. Encierre las opciones del menú ventana que se deben seleccionar para modificar el color de una Instancia. 13. Encierre en un circulo el botón de la ventana Biblioteca, que permite eliminar un símbolo de la lista. 14. Cuando se elimina un símbolo en que afecta a sus instancias? a) Se agrupan b) Se eliminan de la película c) Las instancias se convierten en símbolos CORPORATIVO CETEC - SICASA 91