area tecnologia e informÁtica grado noveno guia flash

AREA TECNOLOGIA E INFORMÁTICA GRADO NOVENO

GUIA FLASH

1 / 33


GUIA FLASH

2 / 33

PROPÓSITO AFECTIVO Que los estudiantes demuestren interés y motivación por: • Identificar y manipular las herramientas de los programas de animación vectorial para crear elementos multimediales e interactivos. • Construir y graficar mentefactos conceptuales. • Comprehender la importancia de la evolución tecnológica en el transporte marítimo. Descubriendo nuevos saberes informáticos y tecnológicos con creatividad. PROPÓSITO EXPRESIVO Que: • Identifique y manipule las herramientas de los editores gráficos para el tratamiento de imágenes. • Construya y grafique mentefactosprecategoriales. • Comprehenda la importancia de la energía AlternatvaEolica. parasolucionar con creatividad situaciones vivenciales de su

entorno.

PROPÓSITO EXPRESIVO Que: • Identificar y manipular las herramientas de los programas de animación vectorial para crear elementos multimediales e interactivos. • Construir y graficar mentefactos conceptuales. • Comprehender la importancia de la evolución tecnológica en el transporte marítimo. Para representar con creatividad

realidades en su cotidianidad.

•

•


GUIA FLASH

3 / 33

INTRODUCCION A FLASH

¿Qué es?… Flash es una herramienta reconocida para la creación de animaciones

en 2D y 3D, inicialmente fue creada por Macromedia con el objetivo de realizar animaciones vistosas para la web, así como para crear GIFs animados, actualmente pertenece a la Suite Adobe.

Este programa ha sido escogió por una gran cantidad de diseñadores web profesionales y aficionados.

Adobe ha querido en esta última versión integrar todos sus productos en una suite única en la que prima sobre todo la compatibilidad entre ellos (software de edición de imagen, video, audio, etc.).

Formatos: FLA, SWF, FLV, SWC, FLP.

Objetivo: Identificar y manipular las herramientas de los programas de animación vectorial para crear elementos multimediales e interactivos.


GUIA FLASH

4 / 33

Al igual que muchos programas utilizados en Windows, Flash tiene un entorno de trabajo con diferentes paneles o ventanas y barras (Se debe tener en cuenta que este entorno se puede personalizar, ocultando y desocultando algunas opciones):

UNIDAD UNO: CONOCIENDO EL ENTORNO DE TRABAJO


GUIA FLASH

5 / 33

LA BARRA DE HERRAMIENTAS. HERRAMIENTAS BÁSICAS

La Barra de Herramientas contiene todas las Herramientas necesarias para el dibujo. Veamos cuáles son las más importantes y cómo se usan:

Herramienta Selección (flecha): . Es la herramienta más usada de todas. Su uso principal es para seleccionar objetos. Permite seleccionar los bordes de los objetos, los rellenos (con un sólo clic), los bordes (con doble clic), zonas a nuestra elección... Además, su uso adecuado puede ahorrarnos tiempo en el trabajo.

Herramienta Línea: Permite crear líneas rectas de un modo rápido. Las líneas se crean como en cualquier programa de dibujo, se hace clic y se arrastra hasta donde queramos que llegue la línea recta. Una vez creada la podemos modificar sin más que seleccionar situar el cursor encima de los extremos para estirarlos y en cualquier otra parte cercana a la recta para curvarla.

Herramienta Texto: Crea un texto en el lugar en el que hagamos clic. Sus propiedades se verán en el tema siguiente.

Herramienta Óvalo: La herramienta Óvalo permite trazar círculos o elipses de manera rápida y sencilla. Puedes acceder a ella manteniendo

el botón del ratón pulsado sobre la herramienta Rectángulo.

Herramienta Rectángulo: Su manejo es idéntico al de la Herramienta Óvalo, tan solo se diferencian en el tipo de objetos que crean.

Herramienta Lápiz: Es la primera Herramienta de dibujo propiamente dicho. Permite dibujar líneas con la forma que decidamos, modificando la forma de estas a nuestro gusto. El color que aplicará esta Herramienta se puede modificar, bien desde el Panel Mezclador de Colores o bien desde el subpanel Colores que hay en la Barra de Herramientas.

Herramienta Pincel: Su funcionalidad equivale a la del lápiz, pero su trazo es mucho más grueso. Se suele emplear para aplicar rellenos. Se puede modificar su grosor y forma de trazo.

Herramienta Cubo de pintura: Permite aplicar rellenos a los objetos que hayamos creado. Al contrario que muchos otros programas de dibujo, no permite aplicar rellenos si la zona no está delimitada por un borde. El color que aplicará esta Herramienta se puede modificar, bien desde el Panel Color o bien desde el subpanel Relleno que hay en la Barra de Herramientas.

Herramienta Borrador: Su funcionamiento es análogo a la Herramienta Pincel. Pero su función es la de eliminar todo aquello que "dibuje".


GUIA FLASH

6 / 33

LA BARRA DE HERRAMIENTAS. HERRAMIENTAS AVANZADAS

Herramienta Lazo: Su función es complementaria a la de la Herramienta Flecha, pues puede seleccionar cualquier cosa, sin importar la forma, (la Herramienta Flecha sólo puede seleccionar objetos o zonas rectangulares o cuadradas). En contrapartida, la Herramienta Lazo no puede seleccionar rellenos u objetos (a menos que hagamos la selección a mano).

Al seleccionar esta Herramienta, en el Panel de herramientas aparecen estos

botoness: . Esto es la Herramienta Varita Mágica, tan popular en otros programas de dibujo. Permite hacer selecciones según los colores de los objetos. El

tercer dibujo que aparece es este: permite hacer selecciones poligonales.

Herramienta Pluma: Crea polígonos (y por tanto rectas, rectángulos...) de un modo sencillo. Mucha gente encuentra esta herramienta complicada, aunque es una de las más potentes que ofrece Flash. Su empleo consiste en hacer clic en los lugares que queramos definir como vértices de los polígonos, lo que nos asegura una gran precisión. Para crear curvas, hay que señalar los puntos que la delimitan y posteriormente trazar las tangentes a ellas. Con un poco de práctica se acaba dominando.

Herramienta Subseleccionador: Esta Herramienta complementa a la Herramienta Pluma, ya que permite mover o ajustar los vértices que componen los objetos creados con dicha herramienta.

Herramienta Bote de Tinta: Se emplea para cambiar rápidamente el color de un trazo. Se aplica sobre objetos, si tienen borde, cambia al color mostrado de dicho borde, por el mostrado en el Panel Mezclador de Colores (que coincide con el subpanel Colores que hay en la Barra de Herramientas.)

Herramienta Cuentagotas: Su misión es "Capturar" colores para que posteriormente podamos utilizarlos. Al utilizar las herramientas básicas, se debe tener mucho cuidado en su manipulación y en las opciones que cada una de ellas nos ofrece, aunque son similares, de acuerdo a la herramienta se presentaran algunas variaciones:

Lápiz

Color

Altura o grosor del trazo (pixeles) Estilo del trazo

UNIDAD DOS: APLICACIÓN DE HERRAMIENTAS

(TRAZOS, OVALO, RELLENO)

Estilo del final trazo Suavidad del trazo


GUIA FLASH

7 / 33

Pincel:

Línea

Rectángulo:

Ovalo

Para aplicar rellenos a las figuras, estas deben estar bien cerradas y se debe hacer un clic en el centro de la figura y para aplicar color a los bordes se debe de seleccionar con un solo clic la línea del contorno. (si se hace doble clic no se aplicara el color)

RELLENO BORDE

Cuando se hace clic, aparecen unos pequeños punticos que inican una selección activa

Ejemplo de manipulación de objetos: En flash se considera un objeto todo aquello que aparezca en nuestra película y sea visible, por ejemplo, figuras dibujadas, imágenes, botones, etc.

Tamaño y forma del pincel (pixeles)

Color del relleno

Radio de las esquinas Definición de unión de

segmentos


GUIA FLASH

8 / 33

Cuando se crear una figura, se crea un borde y relleno de manera independiente, y es posible que al realizar algún movimiento estos se separen, para evitar q esto suceda se crear un objeto agrupado, el cual podrá ser editado al doble clic sobre él.

Para agruparlo hacemos doble clic sobre el relleno del objeto y luego presionamos

desde el teclado ctrl + G:

Para ingresar a modificarlos deberás dar doble clic en el objeto, aquí nos daremos cuenta de que ya el objeto es un grupo:

Ejercicio práctico:

Ahora crea 4 grupos diferentes asignando a cada uno un color de borde y relleno diferente.


GUIA FLASH

9 / 33

INTERPOLACIÓN

Cuando lo que queramos no sea cambiar la posición de un objeto en el escenario, sino su forma de manera progresiva (o ambas cosas a la vez), Flash nos ofrece la técnica de la Interpolación por Forma, que consiste simplemente en ir transformando el contorno de un objeto creado en su interfaz hasta que sea igual que el contorno de otro objeto distinto. Realizar una interpolación por forma, es muy semejante a crear una interpolación de movimiento. Flash genera fotogramas intermedios en los que va variando ligeramente la forma del fotograma anterior. Esta vez, es importante destacar que para que una Interpolación por Forma funcione como es debido aquellos objetos que intervengan deberán ser objetos vectoriales (no símbolos Flash).

Debemos tener también dos aspectos en cuenta:

1. Separar en distintas capas los objetos fijos y los que estarán animados. 2. Poner en distintas capas objetos que vayan a ser transformados con formas

distintas, ya que Flash transformará todos los objetos vectoriales del primer fotograma en aquello que haya en el último fotograma de la interpolación.

Si realizamos la interpolación por forma correctamente la línea de tiempos

tendrá este aspecto:

Las consideraciones sobre la velocidad y el número de fotogramas que vimos en las interpolaciones de movimiento se pueden aplicar también a la interpolación por forma y a cualquier animación hecha con Flash. Si hay algún fallo en los parámetros necesarios para que la interpolación se ejecute bien, como por ejemplo, que uno de los objetos en capa sea un símbolo, se mostrará algo así en la línea de tiempos:

UNIDAD TRES: MANEJO DE OBJETOS INTERPOLACIÓN, CAPAS, LINEA DE TIEMPO


GUIA FLASH

10 / 33

Para crear una interpolación de forma deberás actuar de forma similar que para crear una de movimiento. Puedes hacer clic derecho sobre los fotogramas o seguir los pasos siguientes: Una vez tengas los fotogramas de inicio y fin de la animación deberás seleccionar todos los fotogramas que participen en ella y abrir el panel Propiedades.

Allí deberás seleccionar la opción Forma en el desplegable Animar

LINEA DE TIEMPO La Línea de tiempo organiza y controla el contenido de una película a través del tiempo, en capas y fotogramas. Los componentes principales de la Línea de tiempo son las capas, los fotogramas y la cabeza lectora El concepto de Capa es fundamental para manejar Flash ya que permite organizar según el elemento a diseñar y la línea de tiempo permite ver los fotogramas de modo simplificado.

CAPAS Las capas (layers) son como láminas transparentes que sobreponemos una con otra. Si pintamos en la capa de la parte de abajo de color verde, y en la segunda capa dibujamos un círculo rojo, veremos a través de todas las láminas un rectángulo verde, con un círculo rojo. Cada capa es un nivel en el que podemos dibujar, insertar sonidos, textos... con INDEPENDENCIA del resto de capas. Hay que tener en cuenta que todas las capas comparten la misma Línea de Tiempos y por tanto, sus distintos fotogramas se reproducirán simultáneamente. Otra razón para separar los objetos en capas, es que Flash nos obliga a colocar cada animación distinta en una capa. De lo contrario, todos los objetos que se encuentren en dicha capa formarán parte de la animación. Si queremos que un objeto NO forme


GUIA FLASH

11 / 33

parte de una animación, deberemos quitarlo de la capa en la que se produce dicha animación. Ejemplo de capas: Al igual que el modo en que trabajan los dibujantes de dibujos animados, utilizando hojas calcantes con dibujos sobre otras y la superponiendo unos tras otros, en una especie de niveles, así mimo se debe trabajar en cualquier proyecto de animación, dado que esto permite mantener un orden y una independencia que faciliten el trabajo. Sin embargo no se debe olvidar que la línea de tiempo sigue siendo la misma sea cual sea la capa en la que se encuentre.

Para crear una nueva capa de debe dar clic sobre el icono que aparece en la parte inferior izquierda del panel de capas.

LOS SÍMBOLOS

Son objetos o elementos que se han creado utilizando las herramientas que proporciona Flash. Cuando los objetos se transforman en símbolos, se incluyen o almacenan en una biblioteca en el momento en que son creados, lo que permite que el usuario los utilice cada vez que los necesite, ya sea en la misma o en otra película. Pero cada vez que utilicemos ese objeto en una película, éste se convierte en una instancia aunque parece que sean lo mismo, la importancia de esta distinción es que cuando utilicemos un símbolo que hayamos creado previamente en una película, al modificarlo se

UNIDAD CUATRO: SIMBOLOS E IMAGENES

Crear nueva capa

Mostrar / ocultar todas las capas Bloquear / desbloquear todas las capas

Mostrar / ocultar todas las capas como contorno

Eliminar capa

Cada objeto se encuentra en una capa

diferente


GUIA FLASH

12 / 33

modificará la instancia, mientras que el objeto seguirá intacto, tal y como era en el momento de su creación, de manera que podremos volverlo a utilizar en otro momento. Crear símbolos requiere de habilidad, creatividad y destreza ya que es uno de los primeros pasos para crear una animación. Los símbolos contenidos en las bibliotecas están identificados por su nombre y por un icono que representa el tipo de símbolo que representan entre ellos están:

a) Clip b) Botón d) grafico

IMÁGENES Las imágenes son gráficos u objetos prediseñadas o previamente guardadas en un medio de almacenamiento que aportan personalidad y colorido a las animaciones de flash.

Aunque es más habitual utilizar los gráficos con fines personales o de entretenimiento, hay formas de conferirles un aspecto profesional y atractivo en cualquier tipo de animación, para utilizarlas solo basta con ingresar al medio de almacenamiento e insertarlas en el sitio de la animación que se necesite.

Antes de agregar imágenes prediseñadas tenga en cuenta Decidir el tipo de imágenes que se van a agregar, mostrar las barras de tareas relativas a las imágenes, Personalizar la imagen prediseñada.

EFECTOS Son herramientas que realizan animaciones más complejas, fácilmente se pueden combinar las interpolaciones de movimiento con los efectos y transformaciones que se pueden realizar sobre los símbolos que las componen y aplicar efectos sobre las mismas interpolaciones. Algunos de los efectos más utilizados son:

Efectos sobre la interpolación Tamaño Escala Aceleración: Rotación Orientar según trazado

Sincronizar Ajustar Efectos sobre el símbolo interpolado Efecto brillo

Efecto tinta Efecto transparencia (Alfa)

GUÍA DE MOVIMIENTO En ocasiones la animación de un objeto puede tener movimientos lineales y los fotogramas claves corresponden a un cambio en el sentido del movimiento. Con las guías de movimiento se pueden obtener nuevos y diferentes desplazamientos. Anteriormente hemos visto como las interpolaciones de movimiento incluyen por defecto el trazado con la trayectoria del objeto, y que este trazado puede modificarse


GUIA FLASH

13 / 33

fácilmente, sin embargo las interpolaciones clásicas no lo incluyen. Si deseamos que el objeto siga una trayectoria no rectilínea en una animación clásica hemos de crear una capa guía de movimiento. Una guía es una capa especial que marca una trayectoria para los símbolos de la capa a la que afecta, para que dichos símbolos la sigan, durante el movimiento. Las guías actúan como un trazado a través del cual se mueve el objeto. Puede ser un trazado recto, ondulado o combinado. Sólo se debe ubicar el elemento dentro del trazado para comenzar la animación. Hacer un movimiento ondulado a un elemento sin las guías de movimiento seria más complejo porque Requiere al menos un fotograma clave nuevo cada vez que el objeto cambie de dirección. Con las guías puedes generar movimientos curvos de forma muy sencilla: Esta capa es invisible durante la reproducción y permite dibujar cualquier tipo de dibujo vectorial, que nos permitirá crear un movimiento no forzosamente rectilíneo.

TEXTOS

Como en cualquier otra aplicación, la herramienta de texto es muy importante al momento de diseñar cual tipo de animación, es por eso que se debe de conocer sus propiedades y como modificarlas.

Para poder escribir, se debe hacer clic en la Herramienta Texto y posteriormente en el punto del escenario en el que queramos empezar a escribir. En el Panel Propiedades se modifican las principales propiedades de todas las propiedades del texto: tamaño, tipo, estilo, etc.

El Panel Propiedades contiene las principales propiedades de todos los objetos que se utilicen durante la película, de modo que si seleccionamos un texto, podremos ver en él todo lo que nos hace falta conocer sobre nuestro texto.

Fuente:

Desde aquí, al igual que en los editores de texto más comunes podemos seleccionar el tipo de letra o "fuente" que más nos guste.

Espaciado: Determina el espaciado entre los caracteres. Útil cuando la tipografía que empleamos muestra las letras muy juntas o para dar efectos concretos al texto.

Se debe dar clic sobre el texto para

que las propiedades se puedan modificar

UNIDAD SEIS: TEXTOS Y SONIDO


GUIA FLASH

14 / 33

Dirección del Texto: Cambia la orientación del texto de horizontal a vertical, tanto de izquierda a derecha como de derecha a izquierda.

Ajuste automático entre caracteres: Activar esta casilla provoca que la separación entre caracteres se realice de modo automático.

Posición: Nos permite convertir nuestro texto en subíndices o en superídices (o dejarlo normal).

URL: Si queremos que al pulsar sobre nuestro texto, el usuario vaya a una dirección web, nada más fácil que escribirla ahí. Flash la asociará al texto que estés escribiendo en ese momento.

Destino: Determina si la URL a la que el texto hace referencia se cargará en la misma ventana del navegador, en una nueva ...

Tipo de Línea: Si el texto que vamos a incluir es dinámico (de lo contrario aparece sin activar), esta opción nos permite determinar cómo queremos que aparezcan las líneas (línea única, multilínea o multilínea sin ajuste).

Configuración: Son las clásicas opciones que permiten convertir el texto en Negrita (B), Cursiva (I), cambiar el color del texto y el tamaño.

Otras Propiedades: Dado que Flash trata los textos como objetos, éstos también tienen anchura, altura y coordenadas. Podemos modificarlos a nuestro gusto, pero debemos tener en cuenta que los caracteres no deben estirarse sin motivo, pues las tipografías son una parte muy importante y deben respetarse. 1. Un Párrafo no es más que un conjunto de caracteres con propiedades comunes a todos ellos. Estos párrafos admiten ciertas opciones que nos permiten trabajar con bloques de texto. El Panel Propiedades nos proporciona las siguientes opciones para trabajar con párrafos (entre otras).

A la Izquierda: Todas las líneas empezarán tan a la izquierda como sea posible (dentro del recuadro de texto que hayamos definido).

Centrar: Las líneas se distribuyen a la derecha y a la izquierda del punto medio del Párrafo.

A la derecha: Todas las líneas empezarán tan a la derecha como sea posible (dentro del recuadro de texto que hayamos definido).

Justificado: El texto se ensancha si es necesario con tal de que no quede "dentado" por ninguno de sus límites. El resto de opciones nos permiten determinar los márgenes (izquierdo y derecho), los sangrados de párrafo y el espacio interlineal.


GUIA FLASH

15 / 33

SONIDO

Para ingresar se ingresa por: el menú archivo

Para que aparezca la posibilidad de trabajar con sonidos, deberemos hacer clic en algún fotograma de nuestra película, tras hacer esto, el Panel Propiedades toma el siguiente aspecto:

Sonido: En esta pestaña nos aparecerán las canciones que tenemos importadas, deberemos seleccionar la canción que pretendamos añadir a nuestra

Efecto: Desde aquí podremos añadir algún efecto a nuestro sonido, como por ejemplo que el sonido pase del canal izquierdo al derecho (esto crea la sensación de que el sonido te envuelve ya que lo oyes por un sitio y luego por otro, aunque queda muy lejos de los verdaderos sonidos envolventes), que el volumen aumente progresivamente etc... Si deseamos añadir complejos efectos sonoros, deberemos tratar adecuadamente el sonido con algún programa creado específicamente para este propósito antes de importarlo.

Sinc: Esta opción nos permite determinar en qué momento comenzará a actuar nuestro sonido, estas son las opciones que tenemos:

Evento: Sincroniza nuestro sonido con un evento determinado. Es la opción por defecto y provoca que el sonido se empiece a reproducir al pasar la película por el fotograma en el que está situado. También se puede sincronizar el sonido con botones y los demás tipos de símbolos.

Inicio: Su funcionamiento es equivalente al de "Evento", se diferencian en que si está seleccionado Inicio en vez de Evento y se reproduce otra vez el mismo sonido u otro distinto, lo hace "encima" del sonido actual. Puede ser un efecto muy atractivo, o puede provocar que se forme "ruido" en nuestra película.

Detener: Detiene el sonido seleccionado.

Flujo: Esta opción sincroniza el sonido con el o los objetos con los que esté asociado, por tanto, si la carga de la película es lenta y las imágenes no fluyen adecuadamente, el sonido se detendrá para sincronizarse con ellas. Repetir: Determina el número de veces que se reproducirá el sonido según lo que escribas en la caja de texto de la derecha. También puedes seleccionar Reproducir indefinidamente para que el sonido se reproduzca en un bucle hasta llegar al siguiente fotograma clave.


GUIA FLASH

16 / 33

IMPORTACIÓN DE ELEMENTOS Para acceder a las bibliotecas comunes que nos ofrece Flash simplemente tenemos que ir a al menú Ventana → Bibliotecas Comunes y seleccionar alguna de las que se nos ofrecen. Las hay de todo tipo de símbolos: botones, clips o gráficos. Para acceder a la biblioteca de símbolos de la película que estamos creando, de nuevo vamos a la Barra de Menús, Ventana → Biblioteca. En esta biblioteca aparecerán todos los símbolos que hemos creado hasta el momento. Los símbolos contenidos en las bibliotecas están identificados por su nombre y por un icono que representa el tipo de símbolo que representan:

Clip Botón Gráfico Para utilizar un símbolo de una biblioteca basta con pulsar en el nombre de dicho símbolo y arrastrarlo a cualquier lugar del área de trabajo. Observa cómo podemos hacerlo.

MÉTODOS DE IMPORTACIÓN Para importar gráficos vectoriales, gráficos en mapa de bits y sonidos, Flash dispone de varios métodos.

1. Importar desde el menú La opción Archivo/Importar le dará acceso a un menú en el que podrá elegir

entre importar a la escena, a la biblioteca, abrir una biblioteca externa o importar vídeo. En cualquiera de los casos se abrirá una ventana en la que podrá seleccionar el formato de archivo a importar, así como la unidad y carpeta en donde se encuentra. Además, con este método podrá importar archivos bitmap de forma secuencial.

2. Importar desde el portapapeles Al igual que la inmensa mayoría de aplicaciones Windows, Flash CS3 permite

importar imágenes a través del portapapeles y mediante las órdenes Copiar, Cortar y Pegar. Cuando se trate de bitmaps la imagen se pegará en la escena como un grupo y se guardará también en la biblioteca, mientras que cuando se trate de imágenes vectoriales únicamente aparecerán en la escena. Los sonidos no pueden ser importados con este método. No obstante, este sistema puede no resultar adecuado con algunos tipos de imágenes y algunos objetos vectoriales pueden perderse durante el traspaso a través del portapapeles. Igualmente, los bitmaps importados con este

UNIDAD SEIS: IMPORTAR ELEMENTOS, MASCARA Y

PUBLICACIONES


GUIA FLASH

17 / 33

método pueden presentar problemas a la hora de trazarlos (vectorizarlos) o utilizarlos como relleno.

3. Importar mediante la biblioteca

Puede importar objetos a su escena utilizando las bibliotecas de otras películas. Para ello, puede hacer dos cosas: Utilice la opción Archivo/Importar/Importar a biblioteca para importar directamente a la biblioteca del documento activo toda clase de archivos tales como imágenes, sonidos WAV y MP3, vídeos MPEG y AVI, películas SWF, etc. Utilice la opción Archivo/Importar/Abrir biblioteca externa y luego traspase los elementos que desee de la biblioteca de otro documento a la biblioteca del documento actual o directamente a la escena. Evidentemente, puede ir abriendo una tras otra las bibliotecas que desee para ir quedándose con los elementos que prefiera de cada una.

Las Máscaras

Es un efecto utilizado frecuentemente en páginas web que contienen películas Flash. Dicho efecto consiste en ocultar objetos que se encuentren en el escenario de Flash, y mostrarlos poco a poco, por algún objeto que tenga una interpolación de movimiento o cualquier otro efecto que sea producto de tu imaginación. La máscara no es solamente para ocultar objetos completamente, un ejemplo podría ser mostrar los objetos color gris y que un objeto con interpolación de movimiento los muestre de otro color cuando pase sobre ellos.

PUBLICAR LA PELICULA Cuando se va a presentar la película se debe publicar o exportar el archivo Flash FLA a otro formato para su reproducción. La función Publicar de Flash está diseñada para presentar la animación en la Web. Este comando crea el archivo (SWF) de Flash Player y un documento HTML que inserta dicho archivo en una ventana del navegador. El comando Exportar película le permitirá crear el contenido de Flash que se puede editar en otras aplicaciones y exportar una película directamente en un formato único. Por ejemplo, puede exportar una película entera como archivo de Flash Player, como una serie de imágenes de mapas de bits, como un fotograma único o un archivo de imagen, y como imágenes estáticas y de movimiento en varios formatos entre los que se incluye GIF, JPEG, PNG, BMP, PICT, QuickTime o AVI.


GUIA FLASH

18 / 33

Dibujar con diferentes herramientas:

Ahora vamos a combinar el uso de las herramientas vistas en los ejercicios anteriores, realizando una figura sencilla, en este caso será una casa: 1. Dibujar el techo con la herramienta Línea:

2.

Dibujar la base y .las ventanas con la herramienta Rectángulo:

3. Dibujar la puerta con la herramienta Rectángulo y Ovalo. (También se debe utilizar la herramienta borrador):

4. Asignar color de borde y de relleno de la siguiente manera: Techo y puerta: Café, ventanas: azules y base: café claro.

Guardar en Flash 1. Clic en el menú archivo 2. Clic en la opción Guardar 3. Se escribe el nombre del

archivo y se mantiene el formato de flash

4. Clic en Guardar

ACTIVIDAD # 1 UNIDAD DOS


GUIA FLASH

19 / 33

Utilizando las herramientas de rectángulo, ovalo, lápiz, y asigne un relleno de color y borde, dibuje sobre el lienzo o escenario las siguientes figuras.

Figura 1 Figura 2

Figura 3 Figura 4

ACTIVIDAD # 2 UNIDAD DOS


GUIA FLASH

20 / 33

1. Ubicación inicial del símbolo:

2. Insertamos un Fotograma Clave en el fotograma No. 20 y movemos el círculo hasta el otro extremo del lienzo.

3. Se hace clic sobre el primer fotograma y luego en el panel de propiedades, en el menú desplegable de la opción Animar, se escoge Movimiento.

4. Ahora se realizara un movimiento con 3 símbolos diferentes en 3 capas diferentes:

ACTIVIDAD # 1 UNIDAD TRES

Al finalizar oprimimos la tecla ENTER y observamos cómo e Circulo se

mueve de un extremo a otro o según la ubicación que se le asigno en el fotograma 20.


GUIA FLASH

21 / 33

5. El movimiento en cada capa deberá durar 20 fotogramas, pero el círculo 2 y 3 arrancaran 5 fotogramas después del anterior de la siguiente manera:

De esta manera cuando se oprima la tecla ENTER, los círculos arrancaran uno después del otro, pero sin desaparecer de la escena, ni al principio ni al final.

Capa: Circulo 1 / Símbolo: Circulo Rosado

Capa: Circulo 2 / Símbolo: Circulo Azul

Capa: Circulo 3 / Símbolo: Circulo Naranja

Así debe aparecer en la

biblioteca

La interpolación de movimiento entonces

deberá realizarse en el fotograma 1, 5 y 10 respectivamente.


GUIA FLASH

22 / 33

(Interpolación de forma)

La interpolación de forma permite al objeto transformarse y crear efectos interesantes en cuanto a formas, colores, ubicación dentro del escenario, etc.

1. Similar a los visto en interpolación de movimiento, en la línea de tiempo se deben organizar los objetos en capas y con nombre claros. En este caso utilizaremos una sola capa a la cual le pondremos Tranf. Cuadro, para esto debemos dar clic derecho sobre la capa y cambiar las propiedades.

2. Creamos el objeto con la herramienta Rectángulo y le asignamos un color de borde y de relleno, y le asignamos un nombre, este recuadro estará ubicado en el primer fotograma. (en este tipo de interpolación no se convierte en símbolo) 3.

4. Creamos un fotograma clave en el fotograma #20, luego borramos el recuadro ubicados en este último fotograma y dibujamos un círculo con color de borde y relleno diferentes.

5. nos ubicamos en el primer fotograma y en la opcion Animar del panel de propiedades, seleccionamos la opcion Forma. Y luego en la linea de tiempo

Se borra el cuadro solo en este fotograma, se debe dejar igual

en los demás fotogramas

En el fotograma que se borro, se dibuja el círculo

ACTIVIDAD # 2 UNIDAD TRES


GUIA FLASH

23 / 33

notaremos como la interpolacion de forma se demarca en un color diferentes a la interpolacion de movimiento.

6. Al presionar la tecla ENTER, el recuadro pasara a ser un cirulo al completar los 20 fotogramas, cambiando no solo de forma sino también de color de borde y relleno.

7. Crear 2 capas más y dibuja en cada uno de ellas 2 figuras geométricas de diferente tamaño.

Inicial

Final


GUIA FLASH

24 / 33

Guía de movimiento

1. En el primer fotograma dibuja un pequeño círculo, asígnale un color con efecto degradado y cámbiale el nombre a la capa.

2. Inserta un fotograma clave en la

línea de tiempo en el fotograma #30 y mueve el círculo hasta en extremo inferior derecho de la página y se crea la interpolación de movimiento.

3. Ahora se insertara la guía de movimiento, para esto se debe dar clic sobre la capa donde se encuentra el circulo y elegir la opción de Añadir Guía de Movimiento, esto hará que aparezca una nueva capa en donde dibujaremos con el lápiz una línea libre.

4. Ahora debemos asegurarnos de que el circulo este ubicado exactamente en el primer fotograma sobre el inicio de la línea y en el ultimo fotograma sobre el fin de la línea.

5. Al oprimir la tecla ENTER, el circulo se desplazara siguiendo el trazo, de esta forma lograremos crear una guía de movimiento.

ACTIVIDAD # 1 UNIDAD CUATRO

Debe ser muy exacto para que la guía funcione.


GUIA FLASH

25 / 33

6. Para ocultar la línea daremos clic en la opción de ocultar capa.

Ahora realizaremos la guía con un objeto más complejo que dibujaremos con las herramientas sencillas.

1. Las dimensiones del escenario será de 100 x 300 pixeles.

2. A la capa 1 le cambiamos el nombre y dibujamos un avión

con las herramientas básicas y luego convertimos en un símbolo (clip de película).

3. Asignamos 30 fotogramas para su movimiento y luego

añadimos la guía de movimiento.

4. Creamos una nueva capa donde dibujamos un cielo con nubes para ambientar nuestra animación.

Ya no se vera la línea sobre el escenario



GUIA FLASH

26 / 33

Efectos

Crearemos una animación en donde se aplicaremos aceleración y rotación o girar.

1. Creamos 2 capas, en una se ubicara la base sobre la que se hará el movimiento y en la otra se dibujara una bola. En este caso la línea de tiempo durara 30 fotogramas en donde insertaremos 4 fotogramas claves y aplicaremos los efectos:



GUIA FLASH

27 / 33

Texto: con interpolación de movimiento

1. Configuramos el escenario de la siguiente manera:

2. Con la herramienta de texto escribimos una frase en el centro del escenario y personalizamos las propiedades:

3. Ahora convertiremos el texto en un símbolo (clip de película), solo de esta forma

podremos manipularlo con los efectos ya conocidos de animación e insertando diferentes fotogramas claves para lograr interpolaciones de movimiento.

Fotograma 1. Texto ubicado en el centro, tamaño 20 y convertido en símbolo (clip de película). Además

agregaos el efecto Giro: Horario – veces: 1

En los Fotogramas 15, 30, 25, 30, 35. Ubicaremos el texto en diferentes posiciones del escenario, dejando como ultima

posición la esquina inferior izquierda.

ACTIVIDAD # 1 UNIDAD CINCO


GUIA FLASH

28 / 33

Texto: con interpolación de forma


2. Con la herramienta de texto escribimos un numero en el centro del escenario y personalizamos las propiedades:

3. Utilizaremos 20 fotogramas de la línea de tiempo, en el primer fotograma escribimos un número y en el último escribimos otro.

Fotograma 10. Presionamos la tecla Q para que nos permita transforma libremente el tamaño del texto y

sosteniendo la tecla SHIFT estiramos desde la esquina el texto para que no pierda su ubicación en el centro.

Fotograma 45. Al igual que en el fotograma 10, utilizaremos el teclado para modificar el tamaño del texto, pero en este caso presionaremos la tecla ALT para que el texto crezca

desde la esquina que se estire.

ACTIVIDAD # 2 UNIDAD CINCO


GUIA FLASH

29 / 33

4. Para que la interpolación funcione, se deber separa el texto, en este caso se deben separar cada uno de los números:

5. Luego aplicamos la interpolación de forma :

6. Ahora realiza en un nuevo archivo la interpolación de forma con las vocales.

Mascaras


2. Crea 2 capas.

Damos clic derecho sobre el numero y luego elegimos la opción Separar. (Se hace esto en ambos números)

ACTIVIDAD # 1 UNIDAD SEIS


GUIA FLASH

30 / 33

3. En la capa 1, que llamaremos fondo, se debe importar una imagen y colocarla en todo el escenario. En la capa llamada mascara dibujamos un pequeño círculo.

4. Se crea una interpolación de movimiento libre al objeto de la capa mascara sobre todo el fondo, de modo que recorra la mayor parte de la imagen.

5. Convertir el objeto en mascara: se da clic derecho sobre la capa y se elige la

opción de mascara.

6. Para publicar la película, y ver el efecto de la máscara, presionamos las teclas SHIFT + ENTER o desde el menú de archivo elegimos la opción de configuración de la publicación.


GUIA FLASH

31 / 33

Marque con una X la respuesta correcta según corresponda 1. Elija la respuesta correcta a las siguientes afirmaciones: a) Adobe Flash CS3 fue creado por Macromedia con el fin de desarrollar elementos multimediales e interactivos aplicados a la web b) Adobe Flash CS3 fue creado por FutureSplash Animator con el fin de desarrollar páginas Web c) Adobe Flash CS3 actualmente pertenece a Adobe Systems y es una aplicación que desarrolla elementos multimediales e interactivos aplicados a la web d) Adobe Flash CS3 es una aplicación que sirve solo para la animación de texto 2. El icono que sirve para seleccionar objetos es: a) b) c) d) 3. conteste falso o verdadero

La Barra de Herramientas contiene todos Los menús necesarios para el dibujo.

Herramienta Lápiz: Permite dibujar líneas con la forma que decidamos

Son herramientas que realizan animaciones de menor complejidad

La Línea de tiempo organiza y controla el contenido de una película a través del tiempo, en capas y fotogramas

Las capas (layers) son como láminas transparentes que sobreponemos una con otra.

El escenario está ubicado en el área de trabajo

Las Mascaras son un efecto utilizado frecuentemente en páginas web que contienen películas Flash.

Herramienta Bote Elipse: Se emplea para cambiar rápidamente el color de un trazo.

4. Dibuja los iconos de la barra de herramientas avanzadas 5. grafica la ventana de trabajo de Adobe Flash CS3

ACTIVIDAD DE INFORMÁTICA # 1


GUIA FLASH

32 / 33

EJERCICIO PRÁCTICO REALIZAR LA ANIMACION DE UNA PELOTA QUE REBOTA (SUBE Y BAJA) 1. Inicio – Todos los programas – Adobe Flash CS3 Professional 2. Archivo de Flash – Action Script 2.0 3. Antes de comenzar dibujaremos una sencilla pelota. Haga clic en el botón de la herramienta Rectángulo (Ubicada en el panel de herramientas) y Dale la letra O para seleccionar la herramienta ovalo, la cual permite trazar círculos o elipses de manera rápida y sencilla. 4. Arrastrando el mouse sostenido sobre el escenario dibuja un ovalo, el cual representa nuestra pelota. 5. Ahora ya tenemos el primer fotograma con la pelota dibujada, vamos a copiarlo y a pegarlo con el fin de tener 3 fotogramas iguales; Damos clic derecho sobre el fotograma 1 (ubicado en la línea del tiempo) y seleccionamos copiar fotograma. 6. Ahora seleccionamos el fotograma 2 (vacio por ahora) y hacemos clic derecho, y elegimos la opción pegar fotogramas. 7. Ahora seleccionamos el fotograma 3 (vacio por ahora) y hacemos clic derecho, y elegimos la opción pegar fotogramas. 8. Dado que simularemos el movimiento de una pelota, el 1 y 3 fotograma representaran la pelota en su posición más alta, mientras que el 2 representará la pelota en el momento de tocar el suelo, nos situamos en el 2 fotograma (ubicado en la línea del tiempo). 9. Con la herramienta selección (Ubicada en el panel de herramientas) movemos la pelota hacia abajo. 10. Ahora prologamos el tiempo que está la pelota en cada una de sus posiciones, y creamos la animación para que la pelota suba y baje como si estuviera rebotando. 11. Con la herramienta Subselección (Ubicada en el panel de herramientas), El fotograma 2 lo extendemos hasta el número 10 y el fotograma 3 lo llevamos hasta el número 20. 12. Con clic sostenido seleccionamos desde el 9 hasta el 1 (de izquierda a derecha – desde el cuadrito blanco hasta el fotograma indicado - Quedando este resaltado en negrita) y damos clic derecho sobre la selección y elegimos la opción: Crear interpolación de movimiento. 13. Con clic sostenido seleccionamos desde el 19 hasta el 10 (de izquierda a derecha – desde el cuadrito blanco hasta el fotograma indicado -Quedando este resaltado en negrita) y damos clic derecho sobre la selección y elegimos la opción: Crear interpolación de movimiento.

ACTIVIDAD DE INFORMÁTICA # 2


GUIA FLASH

33 / 33

14. En la barra de menús, damos clic en el menú depurar – depurar película y podremos ver la animación creada.

area tecnologia e informÁtica grado noveno guia flash

Documents