Fichas de Aprendizaje - FLASH CS4

Ficha de Aprendizaje N° 1 Curso: Diseño Gráfico con Adobe Flash Módulo 1: Introducción al programa Adobe Flash Tema: Descubriendo el entorno de trabajo de Adobe Flash Duración: 2 horas pedagógicas

Logros de aprendizaje

Reconoce y utiliza la barra de herramientas y escenario del entorno de Adobe Flash.

Conocimientos previos

Aplicación 1.1: “Entorno de Adobe Flash” Luego de ingresar al programa Adobe Flash, observa las siguientes imágenes y reconoce cuál corresponde al programa Adobe Flash. Luego, responde: ¿A qué programas pertenecen las otras imágenes? Comenta las diferencias y similitudes que encuentras entre los 3 entornos.

1

2

1

3

Mapa de contenidos Descubriendo el entorno de trabajo

La barra de

El escenario

herramientas

Contenidos de aprendizaje Si deseas dibujar, lo puedes hacer en una cartulina. Tu entorno de trabajo puede estar conformado por la cartulina, el lápiz, los plumones, los colores y otras herramientas que te permitan dibujar. Sin embargo, puedes encontrar entornos alternativos para dibujar y para crear imágenes como, por ejemplo, el entorno del Adobe Flash. Veamos cómo funciona este entorno.

Para empezar, debes conocer la forma de acceder a la herramienta.

Veamos dos rutas para ingresar al programa- Adobe Flash.

Ruta 1: Selecciona el botón Inicio, busca la opción Todos los programas y elige el programa.

Ruta 2: Ubica en el escritorio el ícono de acceso directo del programa y haz doble clic sobre él.

Una vez que hayas seguido cualquiera de los dos procedimientos, verás la siguiente ventana con la que el programa te da la bienvenida.

En esta ventana debes seleccionar el archivo con el que trabajarás: Archivo de Flash.

2

Adobe Flash cuenta con un conjunto de elementos que te permiten realizar dibujos y animaciones. Cada una de las barras, paneles, menús, etcétera, cumple una función específica.

La barra de herramientas Es el espacio donde se encuentran todas las herramientas que se utilizan para realizar dibujos y algunas características de animación. Es muy similar a la barra de herramientas de otros programas de diseño de Adobe.

En la Barra de herramientas, existe un grupo que tiene un triángulo negro en la esquina inferior derecha. Estas herramientas contienen una variedad de opciones; para visualizarlas solo haz clic sobre el triángulo.

El escenario Es el área donde se observan los dibujos y animaciones que se realizan; pueden modificarse el tamaño y el color. Para realizar esta acción, debes utilizar el panel Propiedades y dar los siguientes pasos:

1

1. El panel Propiedades.

2. La ventana que emergerá, selecciona el botón Editar que se encuentra en la sección propiedades. Al activar esta opción, aparecerá una ventana emergente.

2

3

3

3. En esta ventana, puedes modificar el tamaño en la sección Dimensiones y el color del escenario en la sección Color de fondo.

GLOSARIO Dimensión. Extensión de una cosa en una dirección determinada.

Aplica lo aprendido

Aplicación 1.2: “Escenario” Abre un nuevo archivo de Adobe Flash, y modifica las dimensiones del escenario de 700 x 400 px; luego, cambia el color de fondo a azul.

Aplicación 1.3: “Panel de propiedades” Descarga el archivo manzana.fla. Selecciona la imagen del archivo que descargaste y observa qué nuevas secciones se activan en el panel Propiedades.

4

Ficha de Aprendizaje N° 2 Curso: Diseño Gráfico con Adobe Flash Módulo 1: Introducción al programa Adobe Flash Tema: Los paneles de Adobe Flash Duración: 2 horas pedagógicas

Logros de aprendizaje Reconoce y utiliza los diversos paneles del entorno de Adobe Flash.

Conocimientos previos

Aplicación 1.4: “Pupiletras de paneles” Descubre los nombres de los principales paneles de Adobe Flash en un pupiletras.

Mapa de contenidos Panel Propiedades

Los paneles

Panel Control

Panel Biblioteca

Panel Alinear

Panel Muestras

1

Contenidos de aprendizaje Los paneles Son ventanas que permiten realizar diferentes acciones como organizar, configurar y conceder ciertas cualidades a los objetos que se insertan en el escenario. El programa Adobe Flash cuenta con una variedad de paneles.

Si se cierra uno de los paneles, o no los visualizas, puedes recuperarlos y activarlos desde el men煤 Ventana.

Cada panel cuenta con un conjunto de herramientas u opciones que permiten mejorar tus animaciones. Para optimizar el entorno de trabajo, puedes colocar los paneles de manera flotante o en otra ubicaci贸n de acuerdo al trabajo que se realiza; para ello, solo debes arrastrarlos con el cursor.

Los principales paneles de Adobe Flash son los siguientes:

路

Panel Propiedades: Muestra las caracter铆sticas del escenario y las de los objetos que se insertan en este.

2

Si deseas modificar las propiedades del escenario, no debe haber ningún objeto seleccionado. Para modificar las propiedades de algún objeto, recuerda que debe estar seleccionado.

Guarda el área de trabajo personalizada para continuar explorando los demás panales. Para abrir una nueva área de trabajo, dirígete al menú Archivo y elige la opción Abrir.

·

Panel Color: En este panel se ubican todos los colores que puedes aplicar al contorno y relleno de los dibujos realizados. También contiene diferentes tipos de efectos como el degradado y el alfa (nivel de transparencia).

¡Importante!

El color también puede visualizarse mediante códigos. ¿Cuál será el código del color amarillo? ¿Y del rojo?

GLOSARIO Efecto alfa.

Es la transparencia de un objeto.

3

·

Panel Biblioteca: En este panel se encuentran todos los símbolos, imágenes y sonidos que se están trabajando en un mismo proyecto de animación. Los objetos que se guardan en este panel se pueden reutilizar y modificar a lo largo del proyecto.

Descarga el archivo manzana2.fla para explorar este panel.

Cuando se selecciona una imagen, símbolo o cualquier otro objeto del panel Biblioteca, este se muestra en miniatura en la parte superior de la ventana.

Para trasladar las imágenes de la Biblioteca al escenario, debes seleccionar la imagen deseada y arrastrarla al escenario. Para practicar esta acción, primero borra la imagen de la manzana del escenario. Luego, ubícate en el panel Biblioteca y verás que la imagen original sigue ahí. Selecciónala y arrástrala al escenario.

Puedes trasladar la misma imagen las veces que desees.

Usando este panel, también puedes duplicar imágenes y otorgarle a cada una de ellas diferentes colores y tamaños. Observa los pasos que se deben seguir para realizar esta acción.

4

Haz clic en el panel Biblioteca.

Selecciona la imagen y haz clic derecho.

Elige la Duplicar.

opción

Así se mostrará la copia de tu imagen, en la biblioteca.

· Panel Alinear: Este panel se utiliza para ordenar los objetos que se trabajan en el escenario: a la derecha, a la izquierda y al centro. Además, permite hacer coincidir la imagen con el tamaño del escenario o distribuirla.

Recuerda que, para alinear una imagen, primero debes seleccionarla.

Por ejemplo, si tienes una imagen pequeña y deseas modificar su tamaño para utilizarla como fondo de tu trabajo, debes seleccionar esta opción y realizar los siguientes pasos:

5

Para poder modificar una sola imagen del escenario con el panel Alinear, debes verificar que la opción en escena esté activada.

Aplica lo aprendido Aplicación 1.5: “Cambiando de color” Trabajando con el mismo archivo manzana2.fla, haz doble clic sobre la imagen y selecciona alguna de las manzanas. Luego, cámbialos de color, uno a uno, utilizando el panel Color.

Aplicación 1.6: “Haciendo cambios” Activa el panel Biblioteca y observa qué elementos se encuentran en ella. Luego, copia (Ctrl + C) y pega (Ctrl + V) una imagen de internet en el escenario; por ejemplo, un abrigo. Finalmente, vuelve a observar la biblioteca. ¿Se han producido cambios?

Aplicación 1.7: “Las manzanas” Utilizando el mismo archivo que se está trabajando, coloca o alinea las imágenes de las manzanas como imagen de fondo.

6

Ficha de Aprendizaje N° 3 Curso: Diseño Gráfico con Adobe Flash Módulo 1: Introducción al programa Adobe Flash Tema: Conociendo la línea de tiempo Duración: 2 horas pedagógicas

Logros de aprendizaje

Crea, renombra y utiliza los elementos de las capas en Adobe Flash.

Conoce la utilidad del fotograma en la animación en Adobe Flash.

Conocimientos previos

¿Qué es una línea de tiempo? ¿Conoces algunos ejemplos de líneas del tiempo? ¿Cuál es la utilidad de esta?

Ingresa al siguiente link y observa: http://commons.wikimedia.org/wiki/File:Muybridge_ra ce_horse_animated.gif ¿Sabes cómo se llama ese tipo de película o video y en qué formato se encuentra?

1

Mapa de contenidos Línea de tiempo

Área de fotograma

Área de capas

Creación

Renombrar las capas

Elementos o Componentes

Contenidos de aprendizaje En nuestro entorno, la línea de tiempo sirve para la visualización simple de los fotogramas de nuestra película con el orden determinado que le demos. Los fotogramas se colocan en la línea de tiempo en el orden en que se desea que aparezcan los objetos en la animación final.

GLOSARIO Fotograma. En Flash, es un instante o un momento, equivalente al cuadro o frame de una película; cuantos más fotogramas existan, más será la duración de una animación.

En la parte superior de la línea, se visualiza el número de fotograma en el que te encuentras trabajando.

CABEZA LECTORA

CAPAS

FOTOGRAMAS 2

La línea de tiempo está conformada por dos áreas: el área de fotogramas y el área de capas.

La línea está conectada al escenario.

1. Área de Capas: Las capas, también conocidas como layers (en inglés), son como láminas que se sobreponen unas con otras. Se muestra cada capa con su nombre y su respectivo fotograma; se pueden crear carpetas para que contengan varias capas y ser renombradas. Asimismo, las capas se pueden bloquear y desbloquear, es decir, mostrar u ocultar su contenido.

En la siguiente imagen, ¿cuántos elementos ves en el escenario? y ¿cuántas capas observas en la línea de tiempo? ¿Crees que es importante que cada objeto del escenario se encuentre dentro de una capa? Convérsalo con tus compañeros.

¡Importante!

Lo recomendable es realizar o insertar un objeto por cada capa, para que cada uno de ellos tenga una animación por separado. Además, trabajar de esta manera permitirá que todo lo que se realice dentro de una capa no afecte a las demás, pues cada una es independiente con respecto a las otras.

3

Crear una capa: Para crear una capa, puedes elegir alguna de las siguientes opciones: 2da. Opción 1era. Opción

Haz clic derecho sobre la capa existente y selecciona la opción Insertar capa.

Elige el botón Crear capa.

Cambiar el nombre a las capas Para cambiar el nombre de las capas, haz doble clic al nombre predeterminado por el programa: Capa 1, Capa 2 y escribe el nombre que desees o que ayude a reconocer el contenido de la capa.

Elementos de las capas

1. Área de Fotogramas: Un fotograma representa una imagen individual sin movimiento, 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; cada rectángulo representa un fotograma y van enumerados de 5 en 5 (así llevarás un orden). En la línea de tiempo, se trabaja con estos fotogramas para organizar y controlar el contenido de las imágenes.

4

Aplica lo aprendido Aplicación 1.8: “Creando capas nuevas” En el archivo que estás trabajando, crea 3 capas nuevas. En cada una de ellas copia y pega una fruta diferente. Luego, nombra a las capas con el nombre de los objetos insertados.

Aplicación 1.9: “Opciones de las capas” Descarga el archivo animales.fla y realiza las modificaciones solicitadas.

5

Ficha de Aprendizaje N° 4 Curso: Diseño Gráfico con Adobe Flash Módulo 1: Introducción al programa Adobe Flash Tema: Herramientas de dibujo de Adobe Flash Duración: 2 horas pedagógicas

Logros de aprendizaje

Utiliza las herramientas óvalo, selección, bote de tinta, transformación libre y bote de pintura de Adobe Flash.

Conocimientos previos

Observa estas herramientas y responde a las siguientes preguntas ¿Qué herramientas se utilizan cuando se quiere realizar un dibujo? ¿Cómo se utilizan o que características tienen?

Aplicación 1.10: Herramientas de dibujo Relaciona las siguientes herramientas de dibujo según la indicación.

1

Mapa de contenidos

Herramientas de Adobe Flash

Óvalos

Selección

Bote de tinta

Transformación libre

Bote de pintura

Contenidos de aprendizaje Con la ayuda de las herramientas que encontrarás en la barra de la izquierda, podrás realizar formas geométricas y quizás dibujar algo sencillo, recuerda que Adobe Flash no es un programa para realizar ilustraciones; si se desea realizar dibujos más elaborados utilizar Adobe Illustrator y luego importarlos a Adobe Flash para realizar la animación.

Cada herramienta tiene un acceso directo, el cual se activa al presionar la tecla que lo representa. Por ejemplo:

UTILIZANDO LAS HERRAMIENTAS SÓLIDAS Se mostratrá una de las del grupo de 5: Utilizando la herramienta Óvalo (O) Esta herramienta permite realizar círculos de todos los tamaños. Se encuentra dentro de un grupo de herramientas conocidas como herramientas sólidas (figuras geométricas). Selecciónala haciendo clic en la esquina desplegable de la herramienta Rectángulo.

2

Para dibujar el fondo del ojo de la imagen, utiliza la herramienta Óvalo. Selecciónala de la barra de herramientas y dibuja en el escenario.

Utilizando la herramienta Selección (V) La herramienta Selección sirve para elegir, mover y modificar las imágenes o parte de ellas. Además, tiene la función de editar los píxeles de una imagen bitmap.

Las variantes de las opciones de la herramienta Selección son las siguientes: Aparece cuando seleccionas los bordes de las ilustraciones, ya sean curvas o líneas.

Con esta modificación de la herramienta Selección, puedes estirar, alargar y darle forma curva a las líneas de las imágenes.

3

Aparece cuando seleccionas los puntos o vértices de las ilustraciones.

Con esta opción, puedes modificar el tamaño (reducir y estirar) y la forma de los vértices.

¡¡Importante!

I Un dibujo en Adobe Flash está compuesto por un relleno y un trazo. Para seleccionar ambos elementos a la vez, tienes que hacer doble clic en la figura elegida.

GLOSARIO Contorno. Conjunto de líneas que limitan una figura.

Utilizando la herramienta Bote de tinta (S)

Esta herramienta sirve para proporcionar color a los contornos o repararlos. Está ubicada en la opción desplegable de la herramienta Bote de pintura.

Utilizando la herramienta Transformación libre (Q)

Esta herramienta sirve para disminuir y aumentar el tamaño de una imagen, sin la ayuda del panel Propiedades. También, permite modificar la forma de las imágenes y girarlas.

4

Utilizando la herramienta Bote de pintura (K) La herramienta Bote de pintura permite aplicar relleno a los dibujos que estás realizando y modificar los rellenos de las imágenes exportadas. Esta herramienta se apoya en la herramienta Color de Relleno.

Aplica lo aprendido Aplicación 1.11: “Dibujando una naranja” Haciendo uso de las herramientas antes trabajadas, dibuja una naranja como la que se muestra a continuación:

Reflexiona ¿Encuentras alguna similitud entre las herramientas de Adobe Flash con alguna de la vida cotidiana? ¿Qué otras formas se pueden generar con las herramientas trabajadas?

Investiga y responde: ¿cuál es el número de acciones que se guardan por defecto en el panel Historia? ¿Cómo puedes modificar tal límite?

5

Ficha de Aprendizaje N° 5 Curso: Diseño Gráfico con Adobe Flash Módulo 2: Animación básica con Adobe Flash Tema: Animación en la línea de tiempo I Duración: 2 horas pedagógicas

Logros de aprendizaje Identifica los tipos de símbolos para una animación en la línea del tiempo.

Conocimientos previos

¿Qué películas que has visto en el cine son de tipo animada?

Mapa de contenidos Clip de película

Botón Animación en la línea de tiempo

Símbolos Gráfico

Fotograma

1

Contenidos de aprendizaje

Desarrollar la definición de fotograma Una película o animación se conforma por fotogramas o imágenes que en conjunto dan la ilusión de movimiento. Mientras más fotogramas tenga una animación, más fluido será su movimiento.

1seg Para el movimiento de la esfera se han utilizado 12 fotogramas por segundo (FPS).

Para un segundo de esta película se han usado 12 fotogramas; para 2 segundos, 24 fotogramas, y así sucesivamente.

Para el movimiento de la esfera se han utilizado 24 fotogramas por segundo (FPS).

1seg

Para un segundo de esta película se han usado 24 fotogramas; para 2 segundos, 48 fotogramas, y así sucesivamente.

En ambos ejemplos, la Línea de tiempo muestra un segundo de animación, lo que cambia es la cantidad de fotogramas y, por tanto, la naturalidad del movimiento.

2

Símbolos En el programa Adobe Flash, para insertar una animación en un objeto (imágenes y textos), se necesita convertir estos objetos en símbolos.

Los símbolos provienen de objetos que creas utilizando las herramientas que proporciona el programa. Estos objetos, al ser transformados en símbolos, son incluidos en una biblioteca en el momento que son creados.

Existen 3 tipos de símbolos: ·

Clip de película

Este tipo de símbolo se crea para realizar animaciones independientes dentro de un mismo símbolo, y permite que las animaciones dentro de este no se delimiten por la animación de la línea principal. ·

Botón

Se crea este tipo de símbolo cuando se quieren dar acciones u órdenes que respondan al clic del mouse. ·

Gráfico

Se crea este tipo de símbolo para imágenes estáticas que se animan solo en la línea de tiempo principal.

Aplica lo aprendido

Aplicación 2.1 : “Convertir en símbolos” Convierte en símbolos las diferentes imágenes utilizando el archivo "convertir a símbolos".

Aplicación 2.2 : “Haciendo un personaje” Realiza un boceto a mano alzada de un personaje sencillo, el cual se moverá en una línea de tiempo.

3

Ficha de Aprendizaje N° 6 Curso: Diseño Gráfico con Adobe Flash Módulo 2: Animación básica con Adobe Flash Tema: Animación de fotograma a fotograma I Duración: 2 horas pedagógicas

Logros de aprendizaje

Utiliza la animación fotograma a fotograma.

Importa imágenes al escenario y biblioteca de Adobe Flash.

Conocimientos previos ¿Qué tipos de símbolos has visto en la ficha anterior? ¿Qué diferencias hay entre ellos? Explícale a un compañero, con tus palabras qué es un fotograma.

Mapa de contenidos Tipos de animación

Animación fotograma a fotograma

1

Contenidos de aprendizaje

Tipos de animación

Por ahora empezaremos con el tipo de animación de fotograma a fotograma, en las siguientes fichas veremos animación mediante interpolación de forma y animación mediante interpolación de movimiento.

1. Animación fotograma a fotograma Es el tipo de animación que se realiza aplicando movimientos en los objetos del escenario para cada fotograma agregado de la Línea de tiempo.

Cada fotograma contiene un movimiento distinto, lo que permite la ilusión de movimiento.

Vas a realizar la siguiente animación:

2

1

Exporta la imagen “delfin.fla” en formato png, como lo indica la imagen a continuación:

Guardar las imágenes en formato png te permite tener la imagen sin fondo blanco, es decir, solo la figura. De esta manera, podrás trabajar mejor las animaciones.

2

3

A continuación, abre el archivo mar.fla y crea una nueva capa con el nombre “Delfín”.

Esta capa debe ubicarse debajo de la capa “Mar”.

Luego, selecciona el primer fotograma de la capa “Delfín” e importa al escenario la imagen del delfín. Puedes hacerlo utilizando el menú Archivo y la opción Importar.

Observa y sigue los siguientes pasos:

3

Si eliges Importar a escenario (Ctrl + R), la imagen se va a visualizar en el área de trabajo donde estás. Si eliges Importar a biblioteca, la imagen se guarda en el panel Biblioteca para ser utilizada posteriormente.

Observa que el delfín se inserta en el escenario.

4

Reduce el tamaño del delfín utilizando la herramienta Transformación libre. Luego, ubícalo debajo del agua.

Ahora, trabaja la animación en la capa donde se encuentra el delfín.

5 Selecciona el fotograma N° 5 de la capa “Delfín” e inserta un fotograma clave. Esta opción se encuentra en el menú contextual (accede a él haciendo clic derecho sobre el fotograma).

6 También inserta fotogramas clave en el N° 30 de las capas “Mar” y “Cielo” para que estas se muestren a lo largo de la animación.

4

7

Por último, en el fotograma N°5 de la capa “Delfín”, mueve la imagen del delfín de su posición original hacia arriba y gírala un poco utilizando la herramienta Transformación libre.

GLOSARIO Velocidad de un Fotograma en el cine. En el caso del cine, para poder como espectadores apreciar una película de este tipo de arte, los fotogramas deberán ser proyectados con una cadencia de 24 fotogramas por segundo y entonces así, con esta frecuencia, es que el ojo humano percibirá la tan ansiada ilusión del movimiento.

Aplica lo aprendido

Aplicación 2.3: “Dibujando de fondos y paisajes” Elabora un fondo o paisaje, el cual servirá al personaje que realizaste en la aplicación anterior.

Aplicación 2.4: “Recordando lo aprendido” Realiza el cuestionario en donde recordarás lo aprendido en la sesión.

5

Ficha de Aprendizaje N° 7 Curso: Diseño Gráfico con Adobe Flash Módulo 2: Animación básica con Adobe Flash Tema: Animación fotograma a fotograma II Duración: 2 horas pedagógicas

Logros de aprendizaje

Utiliza la animación fotograma a fotograma.

Utiliza variantes de la herramienta transformación libre.

Conocimientos previos Aplicación 2.5: “Ordenando fotograma a fotograma” Realiza la aplicación en la plataforma y ordena los pasos para realizar una animación fotograma a fotograma.

Mapa de contenidos

Tipos de animación

Animación fotograma a fotograma

1

Contenidos de aprendizaje Para completar la animación de la ficha 6, continuaremos con el fondo del mar, tenemos hacer que simule un movimiento, para ello realiza los siguientes pasos:

8

Inserta un fotograma clave en el fotograma N° 15 de la capa “Mar”, luego selecciona la imagen que se encuentra en esta, y con una de las variantes de la herramienta Transformación libre alárgala un poco hacia la derecha.

Cuando aparezca el símbolo, alarga levemente hacia la derecha la imagen.

Repite el mismo procedimiento anterior en el fotograma N° 30, pero esta vez haz el movimiento hacia la izquierda.

Si al realizar estos procedimientos hay superficies del escenario que sobresalen, puedes recortarlas utilizando líneas, tal como aprendiste en la ficha anterior.

Una vez terminada tu animación, guarda tu archivo y expórtalo como SWF presionando Ctrl + Enter.

2

Del mismo modo que la animación en el fotograma N° 5, realiza fotogramas en el N° 10, 15, 20 y 25 y 30, y modifica el movimiento del delfín como se muestra en las imágenes:

Aplica lo aprendido

Aplicación 2.6: “Terminando mi primera animación” Con el personaje y el fondo, elaborados en aplicaciones anteriores, realiza una animación sencilla.

3

Ficha de Aprendizaje N° 8 Curso: Diseño Gráfico con Adobe Flash Módulo 2: Animación básica con Adobe Flash Tema: Animación mediante interpolación de forma I Duración: 2 horas pedagógicas

Logros de aprendizaje

Realiza animaciones a través de la interpolación de forma de una misma imagen.

Conocimientos previos ¿Qué diferencias creen que puede existir entre la animación ‘fotograma a fotograma’ y la de ‘interpolación de forma’? Luego, comenta en la clase.

Tipos de animación

Mapa de contenidos

Animación fotograma a fotograma

Animación mediante interpolación de forma

Interpolación de forma en una misma imagen

1

Contenidos de aprendizaje 2. Animaciรณn mediante interpolaciรณn de forma Son animaciones que permiten realizar transformaciones mediante las cuales los objetos cambien de su forma original a otra diferente.

Interpolaciรณn de forma en una misma imagen Para comprender mejor este tipo de animaciรณn, realiza una de ellas utilizando la imagen del sapo (descargar de la plataforma el archivo ranita.fla). En este trabajo, modificarรกs su sonrisa.

2

1

Selecciona todas las capas en el fotograma N° 15, excepto la capa “Boca” para que esas imágenes se visualicen en todos los fotogramas en donde se realizará la animación.

Luego, en los fotogramas seleccionados haz clic derecho y elige la opción Insertar fotogramas.

Para seleccionar todos los fotogramas N° 15 de las diferentes capas, selecciona el fotograma N° 15 de la capa “Cabeza”. Luego, utilizando la tecla Ctrl selecciona uno a uno los otros fotogramas.

Clic derecho

2

Ahora trabaja en la capa “Boca” y crea en ella una interpolación de forma. Haz clic derecho en el primer fotograma y Crear selecciona la opción interpolación de forma.

Cuando creas la interpolación, observa que el fotograma cambia de color a un verde pastel.

3

Luego, inserta un fotograma clave en el fotograma N° 7 y modifica la línea de la boca con la herramienta Transformación libre, como se muestra en la imagen.

Al crear el fotograma, observa que aparece una flecha desde el fotograma N° 1 que llega hasta el N° 7.

4

Para finalizar, modifica en el panel Propiedades (sin seleccionar ningún objeto) la velocidad de los fotogramas a 2 FPS para que se visualice la transformación lentamente.

Si el FPS es menor, la velocidad de la animación será más lenta; y si es mayor, será más rápida. Por defecto, siempre aparece con velocidad equivalente a 24 fotogramas por segundo.

3

Una vez terminada tu animación, guarda tu archivo y expórtalo como SWF presionando Ctrl + Enter.

Aplica lo aprendido Aplicación 2.7: “Interpolando la ranita” Realiza los mismos pasos y haz que en el fotograma N° 15, la boca del sapo vuelva a su estado original.

Aplicación 2.8: “Interpolando al león” Después de haber realizado la animación de la ranita, ahora haz lo mismo que este león que te presentamos.

Reflexiona ¿Cuáles han sido los elementos que te resultaron más difíciles de aprender hasta el momento?

Investiga si hay más formas de interpolaciones.

4

Ficha de Aprendizaje N° 9 Curso: Diseño Gráfico con Adobe Flash Módulo 3: Animación intermedia con Adobe Flash Tema: Animación mediante interpolación de forma II Duración: 2 horas pedagógicas

Logros de aprendizaje Realiza animaciones a través de la interpolación de forma con diferentes imágenes.

Conocimientos previos

¿Crees tú que la interpolación de forma con diferentes imágenes tiene los mimos pasos que la interpolación de forma de una misma imagen? ¿En qué son semejantes y en qué se diferencian?

Mapa de contenidos

Animación mediante interpolación de forma

Interpolación de forma con diferentes imágenes

Interpolación de forma en una misma imagen

1

Contenidos de aprendizaje Interpolación de forma con diferentes imágenes Ahora, realiza una transformación de forma con diferentes imágenes para que la primera imagen se convierta en la segunda; y la segunda, en la tercera. Para realizar esta animación, descarga el archivo mariposa.fla de la plataforma y sigue los pasos que se mencionan a continuación.

1

2

Observa la línea de tiempo del archivo descargado; solo hay una capa y un fotograma. Para realizar el ejercicio, debes insertar más fotogramas claves en los N° 5, 15, 20, 30 y 35.

En los fotogramas N° 1 y N° 5, borra las imágenes del capullo y la mariposa para que en la primera parte de la animación solo aparezca la imagen de la oruga. Para realizar este procedimiento, selecciona las otras dos imágenes e inmediatamente elimínalas (tecla Supr).

2

3

Luego, crea la primera interpolación de forma para que la oruga se convierta en capullo. Para ello, selecciona el fotograma N.° 5, haz clic derecho y elige la opción Crear una interpolación de forma.

GLOSARIO Interpolar. Poner o colocar una cosa entre otras.

4

Ahora cambia la velocidad de fotogramas (FPS) a 5; y con la combinación Ctrl + Enter visualiza tu animación.

Aplica lo aprendido Aplicación 3.1: “Metamorfosis de oruga a mariposa” En los fotogramas 15 y 20, elimina las imágenes de la oruga y la mariposa. Asimismo, en los fotogramas 30 y 35 elimina las imágenes de la oruga y el capullo.

3

De la misma forma que has creado una interpolación de forma en el fotograma 5, ahora inserta interpolación de forma en el fotograma 20.

Aplicación 3.2: “Interpolación de forma paso a paso” Realiza la aplicación en la plataforma sobre la animación mediante interpolación de forma con diferentes imágenes.

4

Ficha de Aprendizaje N° 10 Curso: Diseño Gráfico con Adobe Flash Módulo 3: Animación intermedia con Adobe Flash Tema: Animación mediante interpolación de forma de textos Duración: 2 horas pedagógicas

Logros de aprendizaje Realiza animaciones a través de la interpolación de forma de textos.

Conocimientos previos Observa la siguiente presentación: http://www.youtube.com/watch?v=0LgkmLR9FRE

¿Qué te pareció la presentación de los textos?

Mapa de contenidos Animación mediante interpolación de forma

Interpolación de formas de textos

1

Contenidos de aprendizaje Animación mediante interpolación de textos Para realizar una interpolación de forma en los textos, lo primero que debes hacer es escribir en el primer fotograma el texto deseado.

Por ejemplo: tu nombre.

A continuación, copia (Ctrl + C) el nombre escrito e inserta un fotograma clave en blanco en el N.° 25.

Cuando insertas un fotograma clave vacío, el objeto insertado en el primer fotograma no se copiará en este nuevo.

En el nuevo fotograma creado, pega (Ctrl + V) tu nombre y ubícalo en la parte inferior del escenario. Luego, cambia las letras de tu nombre por el de tu apellido.

Al finalizar estas acciones, retorna al fotograma N° 1, selecciona el texto y realiza el siguiente procedimiento:

2

Observa que las letras de tu nombre se separan. Luego, selecciona nuevamente el texto y vuelve a realizar el mismo procedimiento. Después de realizar las acciones mencionadas, verás que el texto se muestra como si fuera una imagen.

Recuerda que para trabajar una interpolación de forma con textos, debes separarlo dos veces. Una manera rápida para realizar esta acción es seleccionando el texto y utilizando la combinación de teclas Ctrl + B dos veces (trabajo con el teclado).

Al terminar de separar tanto tu nombre y apellido, ubícate en el primer fotograma, haz clic derecho en él y selecciona la opción Crea interpolación de forma.

Continuando con el ejercicio de la clase, ingresa al fotograma donde está tu apellido, sepáralo y crea una interpolación de forma.

3

Aplica lo aprendido

Aplicación 3.3: “Animando con textos” Elije una frase de 3 o 4 palabras, sepáralas para convertir el texto a imagen y crea una interpolación de forma con textos con ellas.

Aplicación 3.4. : “Interpolación de textos” Realiza la aplicación en la plataforma sobre la animación o interpolación de textos.

4

Ficha de Aprendizaje N° 11 Curso: Diseño Gráfico con Adobe Flash Módulo 3: Animación intermedia con Adobe Flash Tema: Animación mediante interpolación de movimiento Duración: 2 horas pedagógicas

Logros de aprendizaje

Realiza animaciones mediante interpolación de movimiento.

Conocimientos previos Conversa con tus compañeros sobre: ¿cómo crees que se realizó el movimiento en la siguiente imagen?

Imagen tomada de: http://msdn.microsoft.com/es-es/library/cc295346.aspx

1

Mapa de contenidos Animación mediante interpolación de movimiento

Símbolos

Línea de movimiento

Contenidos de aprendizaje 3. Animación mediante interpolación de movimiento

Es la animación en la que Adobe Flash calcula los valores intermedios entre dos fotogramas, de tal forma que el cambio sea gradual. Esta animación solo funciona si trabajas con símbolos.

Para ver la utilidad de este tipo de animación, elabora un banner que promueva el deporte.

Para empezar a trabajar esta actividad, abre el archivo ciclista.fla. y realiza los siguientes pasos: Primero, configura las propiedades del documento a 800 x 250 píxeles.

El ciclista está formado por objetos agrupados. Para trabajar en ellos, haz doble clic en cada objeto. Al hacerlo, observa que al lado del nombre de la escena aparece el grupo en el que te encuentras (Objeto de dibujo). Para salir del grupo, solo haz clic en Escena 1.

2

· Creando símbolos Ahora crearás un símbolo de tipo clip de película para animar cada parte de la imagen independientemente.

Para crear el símbolo, selecciona la imagen y utiliza la tecla F8.

Luego colócale a esta animación el nombre “ciclista” y escoge la opción Clip de película.

Otra manera de convertir una imagen en símbolo es a través de la opción Convertir en símbolo del menú Modificar.

Cuando creas un símbolo, este se almacena directamente en el panel Biblioteca y lo que queda en el escenario es una instancia.

Si haces doble clic sobre la instancia, ingresarás al símbolo; y si haces doble clic sobre la imagen del símbolo, ingresarás al grupo de objetos.

Escena

Símbolo

Para salir de ellos, haz clic en Escena 1.

Una instancia es la representación del símbolo en el escenario.

3

Grupo

GLOSARIO Instancia: Es la representación del símbolo en el escenario

·

Aplicando la interpolación de movimiento

Ahora que tienes el clip de película, cambia el nombre de la capa a “Manejando”.

Luego, haz clic derecho en el fotograma de la capa “Manejando” y crea una interpolación de movimiento. Los fotogramas marcan automáticamente un segundo, y según tu documento llega hasta el fotograma N.° 24, ya que son 24 fotogramas por segundo (24fps).

Después de las acciones mencionadas, comienza a realizar la animación. Para ello, coloca la cabeza lectora en el último fotograma, selecciona la instancia (símbolo Ciclista) y arrástrala hacia la derecha, de tal modo que se observe que el ciclista cruza el escenario. Observa la imagen.

Línea de movimiento

Luego, presiona Enter para visualizar el movimiento. Observa que este es de un segundo, y como es un tiempo breve debes estirarlo (arrastrándolo) hasta el fotograma N° 50 de la línea de animación que es de aproximadamente 2 segundos.

4

Finalmente, observa que la línea que marca el movimiento del ciclista tiene más puntos. Estos representan los fotogramas y pueden manipularse.

Línea de movimiento

Fotogramas

Aplica lo aprendido Aplicación 3.5: “Creando interpolaciones de movimiento” Descarga el archivo saposaltarin.fla y crea las interpolaciones de movimiento para cada elemento de la imagen, tal como se muestran en la primera figura.

Aplicación 3.6: “Crucigrama de interpolación de movimiento” Realiza el crucigrama en la plataforma sobre términos trabajados en la sesión.

5

Ficha de Aprendizaje N° 12 Curso: Diseño Gráfico con Adobe Flash Módulo 3: Animación intermedia con Adobe Flash Tema: Animación utilizando editor de movimiento Duración: 2 horas pedagógicas

Logros de aprendizaje Realiza animaciones mediante el editor de movimiento.

Conocimientos previos

¿Cómo crees que se puede editar un movimiento? ¿qué aspectos de podrán modificar? Comenta con tus compañeros.

Mapa de contenidos Animación mediante interpolación de movimiento

Línea de movimiento

Símbolos

Editor de movimiento

1

Contenidos de aprendizaje Trabajando dentro del símbolo y con el editor de movimiento El editor de movimiento sirve para darle propiedades de movimiento a los objetos (giros, escala, aceleración, etcétera) que se encuentran en un fotograma que tiene una interpolación de movimiento. Con este elemento, también puedes proporcionar efectos de color y filtros a las imágenes.

Ahora, utilizando el Editor de movimiento haz girar las ruedas de la bicicleta sobre su propio eje. Lo primero que debes hacer para realizar esta acción es ingresar al símbolo Ciclista.

Da doble clic sobre la instancia para entrar al símbolo.

Después, selecciona una rueda y conviértela en un nuevo símbolo al cual llamarás “Rueda”.

Observa la imagen. Esta muestra que el grupo de objetos está dentro del símbolo “Rueda” y este, a su vez, está dentro del símbolo “Ciclista”. Este último símbolo se encuentra en la escena.

2

Ordena las capas: La capa en la que está la imagen del ciclista, la llamarás “Ciclista”; después, crea otra capa con el nombre “Rueda”, en la que animarás la rueda. Selecciona la rueda y presiona Ctrl X para cortar la rueda de la capa “Ciclista”.

Selecciona el fotograma vacío de la capa “Rueda” y presiona Shift + Ctrl + V para pegar la rueda en la posición inicial.

Haz clic derecho sobre el fotograma de la capa “Rueda” y crea una interpolación de movimiento.

Con la cabeza lectora ubicada en el último fotograma, dirígete al Editor de movimiento (está al lado de la Línea de tiempo), y en la opción Rotación escribe 360; esto significa que la rueda dará una vuelta completa de 360°. mp

GLOSARIO Rotación.

Movimiento giratorio de un cuerpo alrededor de su eje.

Si no tienes abierta la ventana del Editor de movimiento, puedes activarla en la opción Ventana del menú principal.

Observa que gira la rueda al mover la cabeza lectora.

3

Como el tiempo es demasiado para que gire una rueda, acorta la animación de la capa “Rueda” del fotograma N° 24 al fotograma N° 15. Para igualar el tiempo de la rueda con la del ciclista, inserta un fotograma en el número 15 de la capa “Ciclista”.

Selecciona el fotograma N° 15 y presiona F5.

Para que ambas ruedas giren, utiliza el mismo símbolo “Rueda” para ambas. Tendrás que eliminar la rueda derecha pues no está animada, y luego tendrás que colocar una instancia del símbolo “Rueda” en su lugar.

Crea una capa nueva “Rueda2”, y en la capa “Ciclista” elimina la rueda de atrás (Ctrl + X).

Selecciona la instancia de la capa “Rueda”, cópiala (Ctrl + C) y pégala en la capa “Rueda2” (Ctrl + Shift + V).

Ahora que tienes ambas ruedas animadas, presiona Ctrl + Enter para visualizar la animación en SWF.

No te olvides de guardar tus archivos, pues los vas a utilizar más adelante.

4

¡II ¡¡Importante!

La interpolación de movimiento no solo es lineal, pues puede tener distintas trayectorias que se pueden lograr modificando los puntos.

· Creando trayectorias Los rombos que se muestran en la línea de tiempo de las capas que tienen una interpolación de movimiento son fotogramas claves de posición. Puedes modificar las trayectorias de la línea de animación insertando fotogramas claves de posición y modificando la dirección que debe seguir el elemento. También puedes utilizar la herramienta Selección (flecha negra) para darle forma curva o modificar los puntos que componen la línea de movimiento de la imagen.

Trayectoria

Fotogramas claves de posición

Aplica lo aprendido

Aplicación 3.7: “Haciendo trayectorias en una animación” Realiza una animación similar a la planteada, inserta el archivo “mariposas.fla” al de “saposaltarin.fla” y crea trayectorias en la línea de animación.

Aplicación 3.8: “Trayectoria de un auto” Realiza la animación aplicación siguiendo las indicaciones en la plataforma.

5

Reflexiona ¿Te resultó interesante aplicar lo que aprendiste? ¿Por qué?

Investiga qué otros editores de movimientos existen.

6

Ficha de Aprendizaje N° 13 Curso: Diseño Gráfico con Adobe Flash Módulo 4: Animación avanzada con Adobe Flash Tema: Animación mediante poses de cinemática inversa y e interpolación clásica Duración: 2 horas pedagógicas

Logros de aprendizaje Realiza animaciones haciendo uso las poses de cinemática inversa.

Utiliza la herramienta hueso.

Realiza animaciones haciendo uso de la interpolación clásica.

Conocimientos previos Ingresa al siguiente enlace: http://www.youtube.com/watch?v=_v EPOWhA3CQ y luego comenta lo observado. ? ¿qué aspectos se podrán

Mapa de contenidos

Animación mediante interpolación de movimiento

Animación mediante poses de cinemática inversa

Animación mediante interpolación clásica

1

Contenidos de aprendizaje Animación mediante poses de cinemática inversa

Son animaciones mediante una estructura a modo de huesos que permiten un movimiento natural.

Ingresa al símbolo “Ciclista” y anima al personaje con el que estás trabajando; para ello, utiliza la herramienta Hueso. Comienza creando una capa con el nombre “Pierna”.

Selecciona la pierna y la cadera de la capa “Ciclista”, elimínalas con Ctrl + X y pégalas en la capa “Pierna” con Ctrl + Shift + V.

Para una animación con cinemática inversa, necesitas tener los objetos desagrupados ya que la herramienta con la que trabajarás no funciona cuando están agrupados. Para ello, selecciona los 2 objetos y presiona Ctrl + B. Luego, selecciona la herramienta Hueso, haz clic en la cadera y arrastra el cursor del mouse hasta la rodilla. Después, haz clic en la rodilla y arrastra el cursor del mouse hasta el pie.

Observa que todas las partes seleccionadas con la herramienta Hueso pasan automáticamente a una nueva capa de animación con cinemática inversa denominada “Esqueleto” tendrá la figura de una persona y sus fotogramas clave se llamarán “pose”. La capa anterior quedará vacía.

2

Para comenzar con la animación, selecciona el fotograma N° 15 de la capa “Esqueleto”; haz clic derecho y elige la opción Insertar pose o presiona F6.

Cinemática Inversa

Pose

Selecciona el fotograma N° 7 y mueve la figura “pierna” hacia arriba con la flecha de Selección (V). Observa cómo se crea una pose para este nuevo movimiento.

Finalmente, con Ctrl + Enter verás la animación completa.

Cuando se utilizan símbolos dentro de otros símbolos, es necesario exportar la animación como SWF. De esta manera, la podrás ver completamente.

Animación mediante interpolación clásica

Es la forma en la que se crean interpolaciones en las versiones anteriores de Adobe Flash CS4. Es similar a la interpolación de movimiento en varios aspectos, pero se diferencian porque tienen solo un tipo de orientación: vertical, horizontal o perpendicular. Por otro lado, también pueden realizar distintas trayectorias, pero solo si se utiliza combinándola con la opción Añadir guía de movimiento clásica.

3

Ya acabaste con la animación del ciclista. Ahora, elabora un título para completar el banner.

Regresa a la Escena 1 y crea una nueva capa llamada “Texto”.

Tu línea de tiempo se visualizará de esta forma.

El texto del banner pertenece a la familia “Eras Blod ITC”, tamaño 38. Considerando estas características, escribe la siguiente frase:

El texto en Adobe Flash no necesita estar dentro de un símbolo para ser animado.

Crea fotogramas claves presionando F6 en el fotograma N° 50 y N° 20 de la capa “Texto”.

Luego, haz clic derecho en el primer grupo de fotogramas y crea una Interpolación clásica.

4

Haz lo mismo en el segundo grupo de fotogramas.

Enseguida, ubícate en el primer fotograma y mueve el texto hacia arriba y hacia afuera del escenario. Después, disminuye su tamaño con la ayuda de la herramienta Transformación libre (Q) y presionando la tecla Shift para que no se desproporcione.

Para ver el movimiento del texto, mueve la cabeza lectora o presiona Enter; y para ver la animación completa, presiona Ctrl + Enter.

5

Aplica lo aprendido Aplicación 4.1: “Movimiento a la ranita bailarina” Utilizar el archivo “ranitabailarina.fla” y dale movimiento utilizando la animación con cinemática inversa para que simule que está bailando.

Aplicación 4.2: “Animando a mi personaje” Abre el archivo del personaje que dibujaste en la “Aplicación 2.2” y realiza las acciones solicitadas en la plataforma.

6

Ficha de Aprendizaje N° 14 Curso: Diseño Gráfico con Adobe Flash Módulo 4: Animación avanzada con Adobe Flash Tema: Animación con interpolación clásica y la opción añadir guía de movimiento clásica.

Duración: 2 horas pedagógicas

Logros de aprendizaje

Realiza movimientos con diferentes trayectorias utilizando la animación Interpolación clásica.

Realiza movimientos con la opción añadir guía de movimiento clásica.

Conocimientos previos

Conversa con tus compañeros sobre las diferencias entre animación en la línea de tiempo, de interpolación por forma y de interpolación de movimiento y cuándo se debería utilizar cada una de ellas.

Mapa de contenidos Animación mediante interpolación de movimiento

Animación mediante interpolación clásica

Guía de movimiento

1

Contenidos de aprendizaje También puedes realizar movimientos con diferentes trayectorias utilizando la animación Interpolación clásica y la opción añadir guía de movimiento clásica. Observa y sigue los pasos utilizando el archivo avión.fla.

Observa el archivo.

Ubica la instancia del avión que se encuentra en el primer fotograma de la capa del mismo nombre, al inicio de la trayectoria. Cerciórate de que el inicio de la trayectoria esté en el centro del avión.

Observa la imagen.

Haz clic derecho en la capa “Avión” y elige la opción Añadir guía de movimiento clásica.

Dibuja con la herramienta Lápiz o Pluma la forma de la trayectoria en la capa “Guía” (lo que dibujes en esta capa no se visualizará al momento de exportar tu animación).

Para finalizar, crea una interpolación clásica en la capa “Avión”.

Ubica la instancia del avión que se encuentra en el fotograma N.° 35 de la capa respectiva, al final de la trayectoria.

Cerciórate de que el final de la trayectoria esté en el centro del avión.

2

Aplica lo aprendido

Aplicación 4.3: “Animando a las arañas” Realiza la aplicación en la plataforma en donde trabajarás la interpolación de movimiento y la interpolación clásica.

Aplicación 4.4: “Animando a un carro y una abeja”

Realiza la aplicación en la plataforma en donde trabajarás la interpolación de movimiento y animación fotograma a fotograma.

3

Ficha de Aprendizaje N° 15 Curso: Diseño Gráfico con Adobe Flash Módulo 4: Animación avanzada con Adobe Flash Tema: Uniendo archivos en una misma escena en Adobe Flash.

Duración: 2 horas pedagógicas

Logros de aprendizaje Une dos archivos en una misma escena de Adobe Flash.

Conocimientos previos ¿Qué es una escena? ¿en qué ámbitos de la vida cotidiana se usa este término?

Mapa de contenidos

Uniendo archivos Adobe Flash

Uniendo dos archivos en una misma escena

1

Contenidos de aprendizaje Uniendo archivos en una misma escena Para unir el documento del paisaje con el del ciclista, es necesario que ambos documentos estén abiertos.

Luego, pasa los objetos del documento Paisaje a una sola capa.

Comienza a trabajar con los elementos de la capa “Paisaje”. Para realizar esta acción, selecciona su fotograma y córtalo (Ctrl + X), luego dirígete al fotograma de la capa “Fondo” y presiona Ctrl + Shift + V. De esta misma forma, traslada todos los objetos de las capas “Casas”, “Dibujo” y “Paisaje” a la capa “Fondo”.

Una vez que las capas estén vacías, elimínalas.

Ya que la animación del archivo “ciclista.fla” tiene 50 fotogramas, el paisaje debe llegar al mismo número de fotogramas. Primero, dirígete al fotograma N° 50 e inserta fotogramas.

Ahora dirígete al documento Ciclista. Selecciona ambas capas, luego haz clic derecho sobre los fotogramas y cópialos.

Ahora regresa al archivo Paisaje y crea una nueva capa. Después selecciona su primer fotograma vacío, haz clic derecho y en la opción desplegable elige la alternativa Pegar fotogramas.

2

Para ver la animación completa, exporta tu archivo como SWF. Guarda el archivo con el nombre “banner.fla”

No te olvides de guardar todos tus trabajos.

GLOSARIO Archivo SWF. Son archivos suficientemente pequeños para publicarlos por la web en forma de animaciones.

Aplica lo aprendido

Aplicación 4.5: “Uniendo dos archivos en una misma escena” Realiza las indicaciones de la aplicación en la plataforma con el archivo “metamorfosis.fla”.

3

Aplicación 4.6: “Uniendo otros archivos en una misma escena” Realiza las indicaciones de la aplicación en la plataforma para crear nuevas animaciones.

4

Ficha de Aprendizaje N° 16 Curso: Diseño Gráfico con Adobe Flash Módulo 4: Animación avanzada con Adobe Flash Tema: Uniendo archivos en distintas escenas de Adobe Flash.

Duración: 2 horas pedagógicas

Logros de aprendizaje

Une dos archivos en distintas escenas de Adobe Flash.

Conocimientos previos

Recuerda los pasos que seguiste en la ficha anterior para unir dos archivos en una misma escena de Adobe Flash, ¿serán los mismos para trabajar en escenas diferentes?

Mapa de contenidos

Uniendo archivos Adobe Flash

Uniendo dos archivos en

Uniendo dos archivos en distintas escenas

una misma escena

1

Contenidos de aprendizaje Uniendo archivos en distintas escenas Si quieres unir diferentes animaciones en un mismo proyecto, puedes usar la opción Crear escenas. Observa que en el siguiente ejercicio se han unido en tres escenas las animaciones que hasta el momento has realizado.

Abre la animación de la interpolación de forma que realizaste con la oruga, capullo y mariposa (“metamorfosis.fla”); copia todos sus fotogramas. Luego, abre un nuevo archivo y en la escena que aparece por defecto, “Escena 1”, selecciona el primer fotograma de la capa 1 y pega los fotogramas.

Luego, con ayuda del menú Insertar crea una nueva escena. La nueva escena insertada se denominará por defecto “Escena 2”. Aquí, copia los fotogramas del archivo “saposaltarín.fla”.

Para terminar, crea una nueva escena, “Escena 3”, y copia los fotogramas del archivo del banner animado que acabas de realizar. Cuando termines, presiona las teclas Ctrl + Enter y notarás que las tres animaciones se encuentran en el mismo proyecto y que se reproducen una después de la otra.

Escena 1

Escena 2

2

Escena 3

Aplica lo aprendido Aplicación 4.7: “Uniendo archivos en diferentes escenas” Realiza la aplicación siguiendo las indicaciones en la plataforma. Para ello, necesitarás tu carpeta con los archivos trabajados durante el curso.

PROYECTO INTEGRADOR Han sido seleccionados para formar parte del equipo de diseño gráfico de “Clima de Cambios”, la cual es una iniciativa de la Pontificia Universidad Católica del Perú para informar y sensibilizar a la ciudadanía sobre los impactos del cambio climático en el país y en el mundo.

Como parte de su trabajo deberán crear una nueva animación para concientizar y brindar recomendaciones a las personas sobre este tema.

Es importante que tengas en cuenta algunos datos importantes para la realizar esta campaña: 1. El trabajo será realizado en grupos de dos o tres compañeros.

2. Para elegir un tema específico y puntual a abordar puedes ingresar a la siguiente dirección web: http://www.pucp.edu.pe/climadecambios/ para conocer más sobre el trabajo que viene realizando esta iniciativa.

3. Recuerda que la animación debe iniciarse teniendo un objetivo, es decir, qué quieres lograr en el público que la vea, por lo deberás crear un story board o, en su defecto, boceto de lo que va a contener dicha animación.

4. Para lograrlo, deberás aplicar todo lo aprendido a lo largo del curso (herramientas y los diversos tipos de animación=.

5. Al finalizar, entregarás a tu profesor/a los bocetos de donde fue tu punto de partida, los archivos de dibujo o animaciones parciales, el archivo final en formato “.fla” y el archivo de presentación “swf”.

Reflexiona ¿Qué fue lo que más te gusto del trabajo realizado en Adobe Flash?

Investiga que otras animaciones puedes realizar con este programa.

3