Manual de Macromedia Flash 8

Centro Americano Integral de Idiomas y ComputaciónC@INICOMPUT S.A.

Manual de Macromedia Flash 8.0

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 más completa en un entorno a aplicaciones de animación y en ambiente a los diferentes sitios de entorno Web.

Usted aprenderá a crear animaciones con sonidos, puede utilizar sus propios archivos MP3, también se podrán importar videos y podrá editar estos videos y colocar fragmentos de ellos en sus presentaciones.

Flash 8.0, es una herramienta de edición con la que pueden crearse desde animaciones simples hasta complejas aplicaciones Web interactivas. Las aplicaciones de Flash pueden enriquecerse añadiendo imágenes, sonidos y videos. Flash incluye muchas funciones que la convierten en una herramienta con muchas presentaciones sin perder por ello la facilidad de uso.

Pág. # 1



EFECTOS DE LINEA DE TIEMPO

Es posible aplicar efectos de línea de tiempo en cualquier objeto del escenario para añadir transiciones y animaciones con rapidez, tales como aumentos progresivos, desenfoques giros y otros tipos de animaciones de línea de tiempo.

PLANTILLAS ACTUALIZADAS.

Flash incluye plantillas actualizadas para crear presentaciones, aplicaciones de aprendizaje por Internet, anuncio, aplicaciones para dispositivos móviles y otros tipos de documentos de Flash de uso común.

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 botón 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 – Nuevo2.- En la Ficha General, Seleccionar Documento de Flash - Aceptar

Pág. # 2



Macromedia Flash 8.0 y sus Elementos

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 – Abrir2.- En el cuadro de Dialogo Abrir, busque el archivo o introduzca la ruta del mismo.3.- Hacer clip en el Botón Abrir

Pág. # 3

Caja de Herramientas

Barra de Menú

Barra de Titulo

Barra de Herramientas

Línea de Tiempo

Ventana de Propiedades

Ventana de Acciones

Editar Escena

Editar Simbolos



Para configurar las propiedades de un documento ya existente o nuevo en el cuadro de Dialogo Propiedades del documento haga lo siguiente:

1. Con el cuadro abierto, seleccione Modificar Documento, se mostrará el cuadro de Dialogo Propiedades del documento.

2. En la sección Velocidad de fotograma, ingrese el número de fotograma de animación que debe mostrarse cada segundo. La mayoría 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.

3. En dimensiones, siga uno de estos procedimientos.Para especificar el tamaño del escenario en píxeles, introduzca los valores en los cuadros de texto Anchura y Altura.

4. Para especificar la unidad de medida para las reglas que puede visualizar en la parte superior y lateral de la ventana de la aplicación, selecciones una opción del menú emergente situado en la esquina superior derecha. Este valor también determina las unidades utilizadas en el panel de Información.

5. 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.

Pág. # 4



TRABAJANDO CON OBJETOS

La Caja de Herramienta de Flash.

La herramienta Selección permite escoger el objeto o seleccionar, para realizar cualquier acción.La herramienta Subselección, permite modificar los nodos del objeto seleccionado.La herramienta Transformación libre permite crear el tamaño del objeto sea mas grande o más pequeño.La herramienta de Transformación de Relleno permite cambiar el relleno en los objetos de mapa bits. A través de la ventana mezclador de colores.La herramienta línea permite crear trazados en línea recta.La herramienta Lazo permite crear selección en determinada área del objeto.La herramienta pluma permite crear trazados de línea libre o curvas.

La herramienta de Texto nos permite escribir formatos de textos, y a través de la herramienta transformación libre le cambiamos el tamaño del texto.La herramienta óvalo nos permite crear objetos de formas circular.La herramienta rectángulo permite crear objetos cuadrados o rectángulos.

La herramienta PoliStar permite crear polígonos de diferente tamaño solo de 5 puntas.La herramienta Lápiz, 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 línea 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 tamaño del objeto dentro del área del trabajo.La herramienta colores permite modificar los colores tanto de línea como de relleno en un objeto.

LINEA DE TIEMPO Y FOTOGRAMAS

Pág. # 5



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 visualización de protección o bloqueo y un lápiz 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, añadir guía de movimiento e insertar carpetas de capas.

Algunas de las teclas de Funciones nos permiten utilizar en forma rápida algunos de los tipos de inserción de Fotogramas

F5 Insertar FotogramaF6 Insertar Fotograma claveF7 Insertar Fotograma Clave vacio

ANIMACION INTERPOLADA

Flash puede crear dos tipos de animación, interpoladas: Interpolación de Movimientos e Interpolación de formas.

Crear un Fotograma Clave1.- Seleccione un fotograma en la línea de tiempo, elija insertar Línea de tiempo Fotograma clave, de la barra de menú o Haga Clip con el botón derecho del ratón en un fotograma de la línea de tiempo y elija insertar fotograma clave.2.- Luego se mostrará el fotograma clave insertado.

Pág. # 6



En la Interpolación de movimiento, se define propiedades tales como la posición, el tamaño y la rotación de una instancia, un grupo o un bloque de texto en un instante especifico, y después estas propiedades se pueden cambiar en otro momento. También se puede crear una interpolación de movimiento a lo largo de un trazado.

En la Interpolación de formas, se dibuja una forma en un instante específico y después se modifica o se dibuja otra forma en otro instante. Flash interpola los valores de forma de los fotogramas intermedios para crear la animación.Flash muestra los fotogramas interpolados en color verde claro para la Interpolación de formas y color azul claro para la Interpolación 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 modificación.

En cada Interpolación sea de Forma o de movimiento se debe especificar la posición final de objeto

Interpolación de Movimiento1.- Ubicarse en la Posición final a Insertar el Fotograma2.- Clip derecho, y escoger Crear interpolación de movimiento

Interpolación de Forma1.- Ubicarse en la posición a insertar el Fotograma2.- Mostrar la Barra de propiedades en la parte inferior3.- En la propiedad animar, escoger la opción forma

Pág. # 7



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

Práctica # 1

Importar al escenario algunos objetos e ImágenesCrear interpolación de movimientos e interpolación de formasCambiar el nombre a las capasCada objeto se le crea una capa independiente a excepción de las imágenes con interpolación de formasEn la Capa 2 Insertar una imagen en la posición 1 de la línea de tiempo, luego nos ubicamos en la posición 20 de la línea de tiempo, Insertar un fotograma clave suprimir la imagen anterior e importar la nueva imagenDesagrupar la imágenes desde la posición 1 de la línea de tiempo hasta la ultima posición a través de ctrl. B para desagrupar los objetosEscoger la Ventana propiedades en la parte inferior y en cada punto de interpolación escoger interpolación de forma.

Pág. # 8



Ventana Propiedades

Practica # 2

Crear el siguiente ejercicio1) En la Capa 1 insertar un fondo con varios objetos y que llegue hasta la posición

40 de la línea de tiempo.2) Insertar una nueva capa para importar la imagen avión a partir de la posición 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 Avión (TN00234).6) Capa Paracaídas (j0278702).

Pág. # 9



Práctica # 3

1.- Importe en el escenario varias imágenes con casas para establecer el fondo2.- En capa 2 y 3 importar un edificio por cada capa3.- Cree 2 nuevas capas para el avion 1 y el avión 24.- En las capas de Edificio 1 y Edificio 2 crearla con las interpolaciones de formas

Pág. # 10



EFECTOS DE LINEA DE TIEMPO

Flash incorpora efectos de línea de tiempo que permite crear animaciones complejas con un número mínimo de pasos. Los efectos de línea de tiempo pueden aplicarse a los siguientes objetos:TextosGráficos, incluidos formas, grupos y símbolos gráficosImágenes de mapa bits.Símbolo de botón.Para añadir un efecto a un objeto haga lo siguiente:1.- Cree y seleccione el objeto al que va a añadir el efecto de línea de tiempo haciendo clic sobre el objeto

Pág. # 11



2.- Seleccione Insertar – Efectos de línea de tiempo. A continuación seleccione Efectos – Explotar3.- Luego se mostrará una ventana donde verá una vista previa del efecto según los valores predeterminados4.- Escoger aceptar

.

TRABAJANDO CON SIMBOLOS

Puede crear un símbolo a partir de los objetos seleccionados en el escenario o crear un símbolo vacio y crear o importar el contenido en modo de edición de símbolos En Flash. También se puede crear símbolos de fuentes. Los símbolos pueden tener toda la funcionalidad disponible en Flash, incluida la animación.

Mediante los símbolos con animación pueden crearse aplicaciones de Flash con mucho movimiento, al mismo tiempo que se produce el mínimo el tamaño de archivo. Considere la posibilidad de crear una animación en un símbolo cuando exista una acción repetitiva.

Para insertar un nuevo símbolo se realizan los siguientes pasos:

1) Ir al menú insertar – Nuevo símbolo (Escribir el nombre del símbolo Tipo: Clic de película)

2) Dibujar la Figura del símbolo3) Insertar el fotograma clave en la línea de tiempo escogida4) E insertar el número de imágenes de acuerdo a los diferentes posiciones5) En cada inserción de imágenes se inserta un nuevo fotograma clave y se suprime

la imagen anterior6) Para mostrar el símbolo hacia la capa se crea la capa con el nombre diferente o el

mismo nombre del símbolo

Pág. # 12



7) Escoger el Menú ventana Biblioteca y luego escoger el símbolo y mover el símbolo hacia la capa creada y realizar los fotogramas claves con la creación de la interpolación de movimientos

Practica # 4

Crear un rompecabezas tomando como ejemplo la base de un payaso mediante la inserción de símbolos

Objetos Payaso terminado

Para crear el rompecabezas hay que seguir los siguientes Pasos:

1) Insertar un símbolo por cada objeto tipo clip de películas.2) Enviar cada objeto al centro del escenario y agrupar el objeto3) Una vez creado todos los objetos, Ir Menú Ventana, y escoger la opción

Biblioteca.4) Desplazar cada símbolo al escenario principal de la capa 15) Escoger la ventana Acciones de de clip de película y realizar la siguiente

codificación.6) Funciones Globales – Control de Clip de películas – on doble clip en (press) al

abrir la llave en la misma línea { 7) Funciones Globales – Control de Clip de películas – StartDrag dentro de los

paréntesis escribir (this,true) } en la siguiente línea escribir la siguiente codificación

Pág. # 13



8) Funciones Globales – Control de Clip de películas – on doble clip en (release) al abrir la llave en la misma línea {

9) Funciones Globales – Control de Clip de películas – StopDrag();10) Nota: Este procedimiento se realiza por cada objeto restante del payaso

Crear un símbolo tipo Botón:1) Inserte un símbolo (Nombre: Imagen, Tipo: botón)2) Importar una imagen para el tipo Reposo3) Pasar a la siguiente fase Sobre con la tecla de Función F7 e importar otra Imagen4) De la misma manera importar la tercera Imagen a la fase Presionado con la tecla

de Función F7

Reposo Sobre Presionado

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

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

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

INSERTAR SONIDOS Y VIDEOS

Importar sonidosPara 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 MP3Para importar un sonido haga lo siguiente:1.- Seleccione Archivo – Importar

Pág. # 14



2.- Importar a la Biblioteca3.- En el cuadro de dialogo Importar busque y seleccione el archivo, y presionar el botón abrir

En el elemento de la Biblioteca se mostrará de la siguiente manera:

Y la ventana propiedades:

Como agregar un sonido a un botón

1.- Crear una capa insertando un Botón2.- Seleccionar el Menú Ventana – Comportamiento

3.- Escoger Añadir comportamiento4.- Sonidos opción Cargar archivo MP3 de Flujo

Pág. # 15



5.- En el cuadro de diálogo aparece Introducir la dirección de la URL, ubicar la dirección del archivo de sonido Ejemplo:C:\Documents and Settings\Fmlia. Lucas Reyna\Mis documentos\MY MUSIC FOR EVER\27 - 05 - 2006 (D)\Disco6.- Escoger la opción aceptar7.- En la opción evento, escoger Al presionar

INSERTAR VIDEOS

Macromedia Flash proporciona diversos métodos 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

Pág. # 16



3) Hacer clic en Finalizar para cerrar el asistente de importación de video y comenzar el procedimiento de Importación.

4) Al final se mostrará el video importado

Pág. # 17



TRABAJANDO CON ESCENAS

Para organizar un documento por temas, puede utilizar escenas: Por ejemplo, puede utilizar escenas diferentes para una introducción, un mensaje de carga y los créditos.

Nota: No se puede utilizar escena en un documento basado en pantallas.

Al publicar un documento de Flash que contiene más 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) Ir al menú Insertar – Escena y en la parte superior de la línea de tiempo se mostrará el número de la escena en que se está trabajando

2) 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) Crear una Escena Menú e insertar varios botones en las que por medio de los botones llamar a cada escena

2) Para insertar los botones Ir al Menú Ventana – Escoger – Bibliotecas Comunes – Botones

3) Tipo de botones para los normales Buttons buble 2 escoger los colores

Pág. # 18



4) Tipo de botón para el botón salir Playback rounded – rounded green stop

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

Pág. # 19



Dentro de la ventana Acción de Botón de cada botón crear la siguiente función.5) Funciones Globales – Control de Clip de Películas – on (press) al comenzar la

llave { Funciones Globales – Control de Linea de tiempo – GotoAndStop (“COSTA”,1)

6) El código para el botón salir es el siguiente:7) Funciones Globales – Control de Clip de películas – on (release) al comenzar la

llave { Funciones Globales – Navegador\Red – fscommand (“quit”,”true”);

8) En la capa 1 crear un código para detener el parpadeo 9) Funciones Globales – Control de línea de tiempo – Stop.Practicas AdicionalesProyecto Cupido

Pág. # 20



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 opción de PowerClip, podemos insertar la imagen dentro, del objeto dibujado y después 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 Símbolo (Insertar--- Símbolo)2. Importamos el fragmento dentro del símbolo.3. Y luego se repiten lo mismo hasta terminar con todos los fragmentos.

También se deben crear símbolos con rectángulos que son los que van a recibir las piezas del rompecabezas.

Después de haber creado todos los fragmentos procedemos a diseñar la pantalla que va a tener nuestro rompecabezas, en flash.

Este va a ser el aspecto de nuestro diseño.

Pág. # 21

Símbolos (Fotos) 12 en total Símbolos (Rectángulos) 12 en total



La parte del código.

1. A cada fragmento se le debe ubicar un nombre de instancia para poder hacer referencia a él en la programación

2. Como a la hora de mover los fragmentos, cada uno de ellos necesitará otro símbolo (Rectángulos), que los va a recibir a ellos se les deberá ubicar un nombre instancia también.

Los fragmentos deberán llevar nombres de instancia desde f1 hasta f12, mientras que los rectángulos deberán llevar nombres de instancia desde c1 hasta c12.

Pág. # 22

Fragmentos a la izquierda, y rectángulos (símbolos) a la derecha, en igual número. (Cada símbolo debe llevar un nombre de instancia.



3. Proceso del movimiento y validación.A cada fragmento se le deberá crear una variable (programación) para almacenar la ubicación del símbolo (tanto en X como también en Y) en el documento.

En las acciones del escenario se creará todas las variables para cada fragmento de la foto para almacenar su ubicación con relación a la pantalla.f1_x=_root.f1._x;f1_y=_root.f1._y;

f2_x=_root.f2._x;f2_y=_root.f2._y;











4. Después de haber creado las variables a cada fragmento, llego la hora de escribir el código de movimiento a cada fragmento.

on (press) {this.startDrag ();

}on (release) {

if (this.hitTest(_root.c6)) {this._x=_root.c6._x;

Pág. # 23

Nombres de las variables (X,Y)

Nombre de instancia del fragmento.



this._y=_root.c6._y;stopDrag();}

else {stopDrag();this._x=_root.f6_x;this._y=_root.f6_y;}

}

En las primeras líneas de código 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 validación al momento de soltar el clic se preguntará si ha hecho colisión en el símbolo (rectángulo) correcto.

if (this.hitTest(_root.c6))Si esto es verdadero al fragmento se le asignará la posición del símbolo (rectángulo) 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 símbolo que le corresponde se le asignara la ubicación inicial que se encuentra almacenada en la variable.

else { stopDrag(); this._x=_root.f6_x;

this._y=_root.f6_y;}

Como usted sabra esta programación es para cada uno de los fragmentos y debe cambiarse el nombre dependiendo el fragmento y el rectángulo en que se este programando.

Pág. # 24

Manual de Macromedia Flash 8

Documents

macromedia flash

flash puede crear

convierten en una herramienta

animacin y en ambiente

en dimensiones

herramienta subseleccin

herramienta lpiz

idiomas y computacin