Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.

INTRODUCCION A MACROMEDIA FLASH 8.0

Macromedia Flash 8.0, es una herramienta que permite crear animaciones interactivas con diversos tipos de funciones y efectos. Actualmente es una herramienta ms completa en un entorno a aplicaciones de animacin y en ambiente a los diferentes sitios de entorno Web. Usted aprender a crear animaciones con sonidos, puede utilizar sus propios archivos MP3, tambin se podrn importar videos y podr editar estos videos y colocar fragmentos de ellos en sus presentaciones. Flash 8.0, es una herramienta de edicin con la que pueden crearse desde animaciones simples hasta complejas aplicaciones Web interactivas. Las aplicaciones de Flash pueden enriquecerse aadiendo imgenes, sonidos y videos. Flash incluye muchas funciones que la convierten en una herramienta con muchas presentaciones sin perder por ello la facilidad de uso.

Pg. # 1

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0

EFECTOS DE LINEA DE TIEMPO Es posible aplicar efectos de lnea de tiempo en cualquier objeto del escenario para aadir transiciones y animaciones con rapidez, tales como aumentos progresivos, desenfoques giros y otros tipos de animaciones de lnea de tiempo. PLANTILLAS ACTUALIZADAS. Flash incluye plantillas actualizadas para crear presentaciones, aplicaciones de aprendizaje por Internet, anuncio, aplicaciones para dispositivos mviles y otros tipos de documentos de Flash de uso comn. CREAR, ABRIR UN DOCUMENTO Y CONFIGURAR PROPIEDADES Durante el trabajo de Flash puede crear un nuevo documento o abrir un documento existente. Puede utilizar el botn nuevo para abrir un documento del mismo tipo que el ltimo documento creado. Para crear un documento nuevo haga lo siguiente: 1.- Selecciones el Men Archivo Nuevo 2.- En la Ficha General, Seleccionar Documento de Flash - Aceptar

Pg. # 2

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0 Macromedia Flash 8.0 y sus Elementos

Barra de Titulo

Caja de Herramientas

Lnea de Tiempo

Barra de Men

Barra de Herramientas

Editar Escena Editar Simbolos

Ventana de Propiedades

Ventana de Acciones

Para ver la barra de herramientas ingresar al Men Ventana Barra de Herramientas Principal, luego se mostrar la Barra de Herramientas.

Para abrir un documento ya existente: 1.- Seleccionar el Men Archivo Abrir 2.- En el cuadro de Dialogo Abrir, busque el archivo o introduzca la ruta del mismo. 3.- Hacer clip en el Botn Abrir

Pg. # 3

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0

Para configurar las propiedades de un documento ya existente o nuevo en el cuadro de Dialogo Propiedades del documento haga lo siguiente: 1. 2. Con el cuadro abierto, seleccione Modificar Documento, se mostrar el cuadro de Dialogo Propiedades del documento. En la seccin Velocidad de fotograma, ingrese el nmero de fotograma de animacin que debe mostrarse cada segundo. La mayora de las afinaciones que se ven en los equipos, especialmente las que se producen desde un sitio Web, no necesitan una velocidad superior entre 8 y 12 fps (Fotogramas por segundos). La velocidad de fotograma predeterminada es de 12 fps. En dimensiones, siga uno de estos procedimientos. Para especificar el tamao del escenario en pxeles, introduzca los valores en los cuadros de texto Anchura y Altura. Para especificar la unidad de medida para las reglas que puede visualizar en la parte superior y lateral de la ventana de la aplicacin, selecciones una opcin del men emergente situado en la esquina superior derecha. Este valor tambin determina las unidades utilizadas en el panel de Informacin. Para establecer el color de fondo del documento, haga clic en el triangulo del cuadro Color de fondo y seleccione un color de la paleta.

3. 4.

5.

Pg. # 4

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0 TRABAJANDO CON OBJETOS La Caja de Herramienta de Flash. La herramienta Seleccin permite escoger el objeto o seleccionar, para realizar cualquier accin. La herramienta Subseleccin, permite modificar los nodos del objeto seleccionado. La herramienta Transformacin libre permite crear el tamao del objeto sea mas grande o ms pequeo. La herramienta de Transformacin de Relleno permite cambiar el relleno en los objetos de mapa bits. A travs de la ventana mezclador de colores. La herramienta lnea permite crear trazados en lnea recta. La herramienta Lazo permite crear seleccin en determinada rea del objeto. La herramienta pluma permite crear trazados de lnea libre o curvas. La herramienta de Texto nos permite escribir formatos de textos, y a travs de la herramienta transformacin libre le cambiamos el tamao del texto. La herramienta valo nos permite crear objetos de formas circular. La herramienta rectngulo permite crear objetos cuadrados o rectngulos. La herramienta PoliStar permite crear polgonos de diferente tamao solo de 5 puntas. La herramienta Lpiz, permite crear trazados libres. Para crear trazos similares a los obtenidos al pintar en un lienzo, se utiliza la herramienta Pincel. La herramienta Bote de Pintura y Cubo de pintura permite dar colores tanto de lnea como de relleno a un objeto. La herramienta Cuentagotas, permite copia como muestra un color y pegarlo en otro lugar del objeto. La herramienta Borrador permite borrar reas de un objeto. La Herramienta mano permite mover el area del trabajo hacia donde se desea, mientras que la herramienta zoom permite aumentar el tamao del objeto dentro del rea del trabajo. La herramienta colores permite modificar los colores tanto de lnea como de relleno en un objeto.

LINEA DE TIEMPO Y FOTOGRAMAS

Pg. # 5

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0 En la barra principal obtendremos un icono muy til que es el de escalar que nos permite modificar los objetos Las capas poseen puntos de visualizacin de proteccin o bloqueo y un lpiz que indica sobre que capa estamos trabajando o editando actualmente. En la parte inferior encontramos botones de capas los cuales permiten crear una nueva capa, aadir gua de movimiento e insertar carpetas de capas.

Algunas de las teclas de Funciones nos permiten utilizar en forma rpida algunos de los tipos de insercin de Fotogramas F5 Insertar Fotograma F6 Insertar Fotograma clave F7 Insertar Fotograma Clave vacio ANIMACION INTERPOLADA Flash puede crear dos tipos de animacin, interpoladas: Interpolacin de Movimientos e Interpolacin de formas. Crear un Fotograma Clave 1.Seleccione un fotograma en la lnea de tiempo, elija insertar Lnea de tiempo Fotograma clave, de la barra de men o Haga Clip con el botn derecho del ratn en un fotograma de la lnea de tiempo y elija insertar fotograma clave. 2.Luego se mostrar el fotograma clave insertado.

Pg. # 6

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0

En la Interpolacin de movimiento, se define propiedades tales como la posicin, el tamao y la rotacin de una instancia, un grupo o un bloque de texto en un instante especifico, y despus estas propiedades se pueden cambiar en otro momento. Tambin se puede crear una interpolacin de movimiento a lo largo de un trazado. En la Interpolacin de formas, se dibuja una forma en un instante especfico y despus se modifica o se dibuja otra forma en otro instante. Flash interpola los valores de forma de los fotogramas intermedios para crear la animacin. Flash muestra los fotogramas interpolados en color verde claro para la Interpolacin de formas y color azul claro para la Interpolacin de movimiento, con una flecha entre los fotogramas clave. Puesto que los documentos de Flash guardan las formas en cada fotograma clave, cree fotograma clave solo en los puntos de ilustraciones en los que se produzca alguna modificacin. En cada Interpolacin sea de Forma o de movimiento se debe especificar la posicin final de objeto Interpolacin de Movimiento 1.- Ubicarse en la Posicin final a Insertar el Fotograma 2.- Clip derecho, y escoger Crear interpolacin de movimiento

Interpolacin de Forma 1.- Ubicarse en la posicin a insertar el Fotograma 2.- Mostrar la Barra de propiedades en la parte inferior 3.- En la propiedad animar, escoger la opcin forma

Pg. # 7

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0

Cambiar el nombre de la capa Para cambiar el nombre de la capa se da doble clic sobre la capa y se le ubica el nuevo nombre de la capa. Importar una Imagen Para importar una imagen al escenario escoger Archivo Importar Importar a Escenario y luego buscar la ruta donde se encuentra la Imagen

Prctica # 1
Importar al escenario algunos objetos e Imgenes Crear interpolacin de movimientos e interpolacin de formas Cambiar el nombre a las capas Cada objeto se le crea una capa independiente a excepcin de las imgenes con interpolacin de formas En la Capa 2 Insertar una imagen en la posicin 1 de la lnea de tiempo, luego nos ubicamos en la posicin 20 de la lnea de tiempo, Insertar un fotograma clave suprimir la imagen anterior e importar la nueva imagen Desagrupar la imgenes desde la posicin 1 de la lnea de tiempo hasta la ultima posicin a travs de ctrl. B para desagrupar los objetos Escoger la Ventana propiedades en la parte inferior y en cada punto de interpolacin escoger interpolacin de forma.

Pg. # 8

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0

Ventana Propiedades

Practica # 2
Crear el siguiente ejercicio 1) En la Capa 1 insertar un fondo con varios objetos y que llegue hasta la posicin 40 de la lnea de tiempo. 2) Insertar una nueva capa para importar la imagen avin a partir de la posicin 1. 3) Importar 3 Paracaidas 1 en cada capa. 4) Capa fondo Casa ( BL00122) Pared (BL00008) Casa negra (Bl00262) Fondo de tiempo de nieve (J0157177). 5) Capa Avin (TN00234). 6) Capa Paracadas (j0278702).

Pg. # 9

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0

Prctica # 3
1.- Importe en el escenario varias imgenes con casas para establecer el fondo 2.- En capa 2 y 3 importar un edificio por cada capa 3.- Cree 2 nuevas capas para el avion 1 y el avin 2 4.- En las capas de Edificio 1 y Edificio 2 crearla con las interpolaciones de formas

Pg. # 10

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0

EFECTOS DE LINEA DE TIEMPO Flash incorpora efectos de lnea de tiempo que permite crear animaciones complejas con un nmero mnimo de pasos. Los efectos de lnea de tiempo pueden aplicarse a los siguientes objetos: Textos Grficos, incluidos formas, grupos y smbolos grficos Imgenes de mapa bits. Smbolo de botn. Para aadir un efecto a un objeto haga lo siguiente: 1.- Cree y seleccione el objeto al que va a aadir el efecto de lnea de tiempo haciendo clic sobre el objeto

Pg. # 11

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0 2.- Seleccione Insertar Efectos de lnea de tiempo. A continuacin seleccione Efectos Explotar 3.- Luego se mostrar una ventana donde ver una vista previa del efecto segn los valores predeterminados 4.- Escoger aceptar

. TRABAJANDO CON SIMBOLOS Puede crear un smbolo a partir de los objetos seleccionados en el escenario o crear un smbolo vacio y crear o importar el contenido en modo de edicin de smbolos En Flash. Tambin se puede crear smbolos de fuentes. Los smbolos pueden tener toda la funcionalidad disponible en Flash, incluida la animacin. Mediante los smbolos con animacin pueden crearse aplicaciones de Flash con mucho movimiento, al mismo tiempo que se produce el mnimo el tamao de archivo. Considere la posibilidad de crear una animacin en un smbolo cuando exista una accin repetitiva. Para insertar un nuevo smbolo se realizan los siguientes pasos: 1) 2) 3) 4) 5) 6) Ir al men insertar Nuevo smbolo (Escribir el nombre del smbolo Tipo: Clic de pelcula) Dibujar la Figura del smbolo Insertar el fotograma clave en la lnea de tiempo escogida E insertar el nmero de imgenes de acuerdo a los diferentes posiciones En cada insercin de imgenes se inserta un nuevo fotograma clave y se suprime la imagen anterior Para mostrar el smbolo hacia la capa se crea la capa con el nombre diferente o el mismo nombre del smbolo

Pg. # 12

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0 7) Escoger el Men ventana Biblioteca y luego escoger el smbolo y mover el smbolo hacia la capa creada y realizar los fotogramas claves con la creacin de la interpolacin de movimientos

Practica # 4
Crear un rompecabezas tomando como ejemplo la base de un payaso mediante la insercin de smbolos Objetos Payaso terminado

Para crear el rompecabezas hay que seguir los siguientes Pasos: 1) 2) 3) 4) 5) 6) 7) Insertar un smbolo por cada objeto tipo clip de pelculas. Enviar cada objeto al centro del escenario y agrupar el objeto Una vez creado todos los objetos, Ir Men Ventana, y escoger la opcin Biblioteca. Desplazar cada smbolo al escenario principal de la capa 1 Escoger la ventana Acciones de de clip de pelcula y realizar la siguiente codificacin. Funciones Globales Control de Clip de pelculas on doble clip en (press) al abrir la llave en la misma lnea { Funciones Globales Control de Clip de pelculas StartDrag dentro de los parntesis escribir (this,true) } en la siguiente lnea escribir la siguiente codificacin Pg. # 13

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0 8) 9) 10) Funciones Globales Control de Clip de pelculas on doble clip en (release) al abrir la llave en la misma lnea { Funciones Globales Control de Clip de pelculas StopDrag(); Nota: Este procedimiento se realiza por cada objeto restante del payaso

Crear un smbolo tipo Botn: 1) Inserte un smbolo (Nombre: Imagen, Tipo: botn) 2) Importar una imagen para el tipo Reposo 3) Pasar a la siguiente fase Sobre con la tecla de Funcin F7 e importar otra Imagen 4) De la misma manera importar la tercera Imagen a la fase Presionado con la tecla de Funcin F7 Reposo Sobre Presionado

C:\Archivos de Progrmas\Microsof Office\Clipart\Pub60Cor\S O00191.wmf

C:\Archivos de Progrmas\Microsof Office\Clipart\Pub60Cor\J0 174639.wmf

C:\Archivos de Progrmas\Microsof Office\Clipart\Pub60Cor\J0 386120.wmf

INSERTAR SONIDOS Y VIDEOS Importar sonidos Para insertar archivos de sonidos en Flash, puede importarlos a la Biblioteca del documento actual. Los siguientes formatos de archivos de sonidos se pueden importar a Flash. WAV MP3 Para importar un sonido haga lo siguiente: Pg. # 14

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0 1.- Seleccione Archivo Importar 2.- Importar a la Biblioteca 3.- En el cuadro de dialogo Importar busque y seleccione el archivo, y presionar el botn abrir En el elemento de la Biblioteca se mostrar de la siguiente manera:

Y la ventana propiedades:

Como agregar un sonido a un botn 1.- Crear una capa insertando un Botn 2.- Seleccionar el Men Ventana Comportamiento

3.- Escoger Aadir comportamiento 4.- Sonidos opcin Cargar archivo MP3 de Flujo

Pg. # 15

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0 5.- En el cuadro de dilogo aparece Introducir la direccin de la URL, ubicar la direccin del archivo de sonido Ejemplo: C:\Documents and Settings\Fmlia. Lucas Reyna\Mis documentos\MY MUSIC FOR EVER\27 - 05 - 2006 (D)\Disco 6.- Escoger la opcin aceptar 7.- En la opcin evento, escoger Al presionar

INSERTAR VIDEOS Macromedia Flash proporciona diversos mtodos para incluir videos en los documentos de Flash. Se puede importar Clip de Videos a Flash en archivos incorporados con formato MOV, AVI, MPEG U otro. Para importar un clip de video incorporado hacer lo siguiente: 1) Seleccionar Archivo Importar Importar a escenario - Aceptar

2)

Al aceptar se mostrar un Asistente

Pg. # 16

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0

3)

Hacer clic en Finalizar para cerrar el asistente de importacin de video y comenzar el procedimiento de Importacin.

4)

Al final se mostrar el video importado

Pg. # 17

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0

TRABAJANDO CON ESCENAS Para organizar un documento por temas, puede utilizar escenas: Por ejemplo, puede utilizar escenas diferentes para una introduccin, un mensaje de carga y los crditos. Nota: No se puede utilizar escena en un documento basado en pantallas. Al publicar un documento de Flash que contiene ms de una escena, las escenas del documento se reproducen en el orden en el que aparecen en el panel Escena del documento de Flash. Los fotogramas del documento se numeran de forma consecutiva en todas las escenas Para insertar una nueva realizar los siguientes pasos: 1) 2) Ir al men Insertar Escena y en la parte superior de la lnea de tiempo se mostrar el nmero de la escena en que se est trabajando Si deseamos cambiar el nombre a la escena escoger el men Ventana Otros Paneles Escenas

3)

Dar doble clic sobre el nombre de la Escena 1 y cambiar el nombre de la misma

Practica # 5
1) 2) 3) Crear una Escena Men e insertar varios botones en las que por medio de los botones llamar a cada escena Para insertar los botones Ir al Men Ventana Escoger Bibliotecas Comunes Botones Tipo de botones para los normales Buttons buble 2 escoger los colores

Pg. # 18

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0 4) Tipo de botn para el botn salir Playback rounded rounded green stop

Dentro De cada escena debe existir botones de retorno hacia la escena men

Pg. # 19

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0

Dentro de la ventana Accin de Botn de cada botn crear la siguiente funcin. 5) Funciones Globales Control de Clip de Pelculas on (press) al comenzar la llave { Funciones Globales Control de Linea de tiempo GotoAndStop (COSTA,1)

6) 7)

El cdigo para el botn salir es el siguiente: Funciones Globales Control de Clip de pelculas on (release) al comenzar la llave { Funciones Globales Navegador\Red fscommand (quit,true);

8) En la capa 1 crear un cdigo para detener el parpadeo 9) Funciones Globales Control de lnea de tiempo Stop. Practicas Adicionales Proyecto Cupido

Pg. # 20

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0 Practica Final

Practica de Rompecabezas.
Necesitamos editar la imagen para dividirla en varias partes, para facilidad lo podemos hacer con el programa Corel Draw, utilizando la herramienta papel grafico, para dibujar el objeto contenedor y con la opcin de PowerClip, podemos insertar la imagen dentro, del objeto dibujado y despus se debe desagrupar. Luego se guardan los fragmentos individualmente con formato (jpg). Una vez fragmentada la imagen tenemos que hacer lo siguiente: 1. En Flash creamos un Smbolo (Insertar--- Smbolo) 2. Importamos el fragmento dentro del smbolo. 3. Y luego se repiten lo mismo hasta terminar con todos los fragmentos. Tambin se deben crear smbolos con rectngulos que son los que van a recibir las piezas del rompecabezas. Despus de haber creado todos los fragmentos procedemos a disear la pantalla que va a tener nuestro rompecabezas, en flash.

Smbolos (Fotos) 12 en total Este va a ser el aspecto de nuestro diseo.

Smbolos (Rectngulos) 12 en total

Pg. # 21

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0

La parte del cdigo. 1. A cada fragmento se le debe ubicar un nombre de instancia para poder hacer referencia a l en la programacin

2. Como a la hora de mover los fragmentos, cada uno de ellos necesitar otro smbolo (Rectngulos), que los va a recibir a ellos se les deber ubicar un nombre instancia tambin.

Fragmentos a la izquierda, y rectngulos (smbolos) a la derecha, en igual nmero. (Cada smbolo debe llevar un nombre de instancia. Los fragmentos debern llevar nombres de instancia desde f1 hasta f12, mientras que los rectngulos debern llevar nombres de instancia desde c1 hasta c12.

Pg. # 22

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0

3. Proceso del movimiento y validacin. A cada fragmento se le deber crear una variable (programacin) para almacenar la ubicacin del smbolo (tanto en X como tambin en Y) en el documento.

Nombres de las variables (X,Y)

Nombre de instancia del fragmento.

En las acciones del escenario se crear todas las variables para cada fragmento de la foto para almacenar su ubicacin con relacin a la pantalla. f1_x=_root.f1._x; f2_x=_root.f2._x; f3_x=_root.f3._x; f1_y=_root.f1._y; f2_y=_root.f2._y; f3_y=_root.f3._y; f4_x=_root.f4._x; f5_x=_root.f5._x; f6_x=_root.f6._x; f4_y=_root.f4._y; f5_y=_root.f5._y; f6_y=_root.f6._y; f7_x=_root.f7._x; f8_x=_root.f8._x; f9_x=_root.f9._x; f7_y=_root.f7._y; f8_y=_root.f8._y; f9_y=_root.f9._y; f10_x=_root.f10._x; f11_x=_root.f11._x; f12_x=_root.f12._x; f10_y=_root.f10._y; f11_y=_root.f11._y; f12_y=_root.f12._y; 4. Despus de haber creado las variables a cada fragmento, llego la hora de escribir el cdigo de movimiento a cada fragmento. on (press) { this.startDrag (); } on (release) { if (this.hitTest(_root.c6)) {this._x=_root.c6._x; Pg. # 23

Centro Americano Integral de Idiomas y Computacin C@INICOMPUT S.A. Manual de Macromedia Flash 8.0 this._y=_root.c6._y; stopDrag();} else { stopDrag(); this._x=_root.f6_x; this._y=_root.f6_y;} } En las primeras lneas de cdigo lo que se logra es que el objeto se mueva al hacer clic sostenido sobre el y arrastrarlo en la pantalla. on (press) { this.startDrag (); }

Luego dentro del evento on (release) se har la validacin al momento de soltar el clic se preguntar si ha hecho colisin en el smbolo (rectngulo) correcto. if (this.hitTest(_root.c6)) Si esto es verdadero al fragmento se le asignar la posicin del smbolo (rectngulo) que le corresponde, {this._x=_root.c6._x; this._y=_root.c6._y; StopDrag () ;} En caso contrario es decir que el fragmento no colisiono con el smbolo que le corresponde se le asignara la ubicacin inicial que se encuentra almacenada en la variable. else { stopDrag(); this._x=_root.f6_x; this._y=_root.f6_y;} Como usted sabra esta programacin es para cada uno de los fragmentos y debe cambiarse el nombre dependiendo el fragmento y el rectngulo en que se este programando.

Pg. # 24