INICIANDO CON FLASH

ESPACIO DE TRABAJO
Teniendo instalado el programa podemos ejecutarlo desde el botn de inicio, buscando la carpeta de adobe, dentro de ella seleccionamos el programa de Flash CS4 (bsico o profesional), al hacer doble clic con el botn izquierdo del mouse, observamos la siguiente ventana de carga del programa

Posteriormente nos da una presentacin para seleccionar el espacio de trabajo sobre la cual vamos a encontrar diferentes elementos como paneles, barras y ventanas, esta presentacin es muy parecida a la utilizada en que otros que integran la suite de adobe, lo cual facilita el manejo de documentos entre estas aplicaciones.

(1)

(2) (3)

(4)

La ventana (1) que se muestra antes de iniciar el programa, observamos 3 columnas, en la del lado izquierdo estn los elementos ms recientes en los que hemos trabajado, para abrirlos directamente, la columna del centro (2) nos permite crear un nuevo programa de Flash,

mostrando en la lista los tipos de formatos y archivos en los cuales podemos crear el documento, en nuestro caso vamos a seleccionar archivo de Flash AS 3.O (ActionScript versin 3.0, es el lenguaje de creacin de scripts, o programacin que tiene Flash), o en su versin anterior 2.0; para las aplicaciones que se desarrollarn en el transcurso del manual, tanto uno como otro puede ser utilizado, pero recomendamos ms la creacin de las aplicaciones con AS 3.0. Con la prctica y dominio en el manejo del programa, podremos utilizar las otras formas de aplicacin que tiene, dependiendo de su uso, las herramientas informticas que se van a aplicar y el tipo de proyectos que se desea generar, entre otros criterios. En las opciones del lado derecho (3) podemos ver Crear con plantillas, En ella tenemos los diferentes tamaos preestablecidos para formatos de publicidad que se quieran crear. La parte inferior de esta ventana (4), nos da la opcin a travs de un cuadro de verificacin para no mostrar esta ventana e ingresar; podemos observar la presentacin inicial del programa en la siguiente figura, donde tenemos las siguientes partes:
Conmutador de PaneldeHerramientas BarradeMens Ventanadedocumento LugardeTrabajo Ventanasopaneles

Capas

Escenario

readeTrabajo

LneadeTiempo

Nuestra ventana del programa est formada por las siguientes partes:

Barra de Men: Es el men principal donde tenemos todos las utilidades del programa, en general tiene las mismas herramientas que otros programas, ms las opciones propias del programa, al seleccionar cualquiera de ellas, nos da el submen de opciones que podemos acceder, ms adelante vamos a ver en su aplicacin a cada una de estas opciones. Escenario: Es el rea (que al inicio es blanco) donde insertamos diferentes objetos (imgenes dibujos, texto, grficos, botones, videos, tanto creados en Flash o que son importados de otros programas), que van a formar la imagen del programa, tanto esttica como animada. rea de Trabajo: Est formado por el escenario y el rea que est alrededor, esta ltima no se visualiza al ejecutar el programa, y es utilizada para ocultar algunos objetos. Ventanas o Paneles: Son el conjunto de herramientas relacionadas entre s y agrupadas segn su funcin. Tenemos diferentes paneles, entre ellos, el panel de color, alinear, muestra, transformar, acciones, componentes, propiedades, transformar, etc., que sern aplicadas en el transcurso del manual. Panel de Herramientas: El panel Herramientas est formado por las utilidades para crear y editar imgenes, ilustraciones, elementos de pgina, etc. Ventana de Documento: La ventana de documento es la pestaa que est encima del rea de trabajo, y nos muestra el programa que est abierto y mostrado en el escenario, ya que Flash nos permite tener varios documentos abiertos, e interactuar entre ellos Capas: en un escenario podemos tener objetos uno detrs del otro, o mostrar un efecto de profundidad, este efecto est formado por Capas, cada capa es como un acetato transparente que se coloca uno detrs del otro, adems de que cada objeto que hay en una capa es independiente de otra. Lnea de Tiempo: La lnea de tiempo est formada por un conjunto de Fotogramas uno al lado del otro, se reproducen y visualizan en el escenario dependiendo del fotograma seleccionado, el cambio entre uno y otro fotograma es el que genera la animacin. Cada fotograma es un escenario que puede ser o no igual al que se encuentra antes o despus de l, generalmente en una pelcula o animacin el cambio entre uno y otro llega a ser muy poco, pero al ser ejecutado el conjunto de fotogramas, forman la animacin (igual como sucede en una pelcula). Conmutador del Lugar de Trabajo: El conmutador del lugar de trabajo nos da diferentes opciones y paneles que se visualizan segn las necesidades del usuario, para esto podemos escoger la vista conceptos Bsicos, o clsico, que son los ms utilizados por usuarios principiantes, conforme a las necesidades propias del documento que se est desarrollando, podemos modificar esta presentacin del programa, o inclusive personalizarla a nuestras necesidades de trabajo.

VENTANAS O PANELES:
Las ventanas o paneles contienen un grupo de herramientas que utilizamos durante el diseo de nuestros documentos, podemos observar dentro del men principal los diferentes paneles que tienen el programa. PROCEDIMIENTO: 1.- Del men principal seleccionar Ventana, el cual despliega las siguientes opciones:

2.- Nos muestra el siguiente men:

3.- De esta ventana podemos activar o desactivar el panel de herramientas (mostrada en la figura), o presionando F2, es de los ms utilizados, y ser explicado ms adelante. 4.- Entre las opciones que se muestran esta Espacio de trabajo, que nos permite ver las diferentes vistas de paneles abiertos, segn el tipo de diseo que se realiza. 5.- Para Ocultar los paneles seleccionando la ltima opcin o presionando el botn F4, esto amplia el rea de trabajo.

PRACTICA 1: EJERCICIO 1: PRACTICA 2: EJERCICIO 2:

VER Y OCULTAR VENTANAS. VER Y OCULTAR VENTANAS. MOVER PANELES. MOVER PANELES.

CONMUTADOR DEL LUGAR DE TRABAJO:

El conmutador son las diferentes formas de vistas que podemos tener del programa, de las cuales mencionamos los siguientes: CONCEPTOS BSICOS:

ANIMADOR:

CLASICO:

DISEADOR:

PRACTICA 3: EJERCICIO 3:

CREAR VISTA PERSONAL CREAR VISTA PERSONAL

VISTA PERSONAL DEL ESPACIO DE TRABAJO: Teniendo experiencia en el manejo y uso de las diferentes ventanas de Flash, es posible acostumbrarnos a tener varias ventanas abiertas que utilizamos normalmente al realizar cualquier diseo, nosotros podemos grabar una vista personal en el conmutador del lugar de trabajo, realizando lo siguiente: PROCEDIMIENTO: 1.- Tener la ventana con los paneles abiertos y acomodados segn se desee tener.

2.- Seleccionar la flecha que despliega la lista del conmutador de lugar de trabajo. 3.- Seleccionar la opcin Nuevo espacio de trabajo 4.- En la ventana que aparece, escribir el nombre que lo identifique. 5.-Seleccionar aceptar, observamos que en el conmutador del rea de trabajo aparece el nombre que escribimos. PRACTICA 4: EJERCICIO 4: CREAR VISTA PERSONAL DEL ESPACIO DE TRABAJO CREAR VISTA PERSONAL DEL ESPACIO DE TRABAJO

PANEL PROPIEDADES:
El panel propiedades (o del men principal Ventana>Propiedades) nos muestra las propiedades del objeto que se tiene seleccionado, considerando que si el objeto es un texto, sus propiedades sern diferentes al objeto grafico, o al objeto video, en el transcurso del manual veremos la manera de editar las propiedades de los objetos.

PANEL BIBLIOTECA:
En el Panel Biblioteca (o del men principal Ventana>Biblioteca), como su nombre lo indica, es la biblioteca de objetos que estn incluidos dentro del documento, el tener estos objetos en esta biblioteca nos permite utilizarlos e insertarlos cuantas veces sea necesario y en cualquier parte, esto debido a que el escenario est formado por las llamadas a los objetos que se encuentran en la biblioteca, los toma de esta biblioteca para su uso, esto hace que el objeto no se repita tantas veces como sea requerido, sino que ser el mismo, haciendo que la cantidad de especio requerido sea mucho menor.

Si se tienen abiertos varios documentos, en la biblioteca se nos van a mostrar los objetos que tiene cada uno de los documentos, permitiendo copiarlos a otra biblioteca, ya sea directamente entre bibliotecas, o insertando el objeto de una biblioteca a la escena del otro documento, de esta manera tambin ser incluido en su respectiva biblioteca. En objetos que son importados a Flash, podemos insertar las directamente a la biblioteca o al escenario, para ser incluidos en su biblioteca.

ESCENARIO:
Al abrir un nuevo archivo de Flash, vemos un espacio en blanco llamado Escenario, el escenario es el lugar donde insertamos nuestros objetos, si observamos el panel de propiedades, nos muestra lo siguiente: En esta ventana tenemos las dos partes que forma las propiedades de Escenario, que son:

PUBLICAR: 1.- Nombre del documento 2.- Tipo de reproductor

3.- Perfil: se refiere al tipo de publicacin que genera, en este caso HTML, SWF, este es posible modificarlo en la opcin Publicaciones. PROPIEDADES: 4.- FPS: Nmero de fotogramas que se reproducen en una animacin por segundo, inicialmente es de 24 por segundo. 5.- Tamao del escenario en pixeles (550 x 400). 6.- Escenario: Muestra el color del escenario.

7.- Si se presiona el botn Editar podemos modificar las siguientes propiedades:

1 2 3 4 5 6

1.- Dimensin: Cambiar el ancho o alto del escenario (en pixeles). 2.- Coincidir: Dejamos la opcin de predeterminada. 3.- Color de Fondo: Por determinado, el color es blanco, pero podemos modificarlo seleccionando la flecha que est en el lado inferior izquierdo .

Si se selecciona otro color cambia el fondo del escenario. 4.- Velocidad de fotogramas: Es la cantidad de fotogramas que se reproducen por segundo en una animacin, lo recomendable es de 12 a 24 fotogramas por segundo. 5.- Unidades de regla: Se muestran diferentes unidades de medida que definen el tamao del escenario.

6.- Transformar como predeterminado: Nos permite guardar los valores de esta ventana, y sean las propiedades del escenario cada vez que se crea un nuevo documento.

PRACTICA 5: EJERCICIO 5:

MODIFICAR LAS PROPIEDADES DEL ESCENARIO PERSONALIZAR EL ESCENARIO

LINEA DE TIEMPO:
El programa de Flash tiene una similitud con una pelcula, la cual est compuesta por escenas de imgenes estticas, que al reproducirse a una velocidad (24 por segundo) da el efecto al ojo humano de movimiento, considerando que cada una de las imgenes tiene un pequeo cambio uno del otro, a cada una de estas escenas estticas, Flash las llama Fotogramas, el conjunto de fotogramas, nos forma la Lnea de Tiempo.

Lnea de Tiempo

FOTOGRAMA:
Tenemos diferentes tipos de Fotogramas, estos son: 1.- Fotograma en Blanco: Es el fotograma que aun no se utiliza, al crear un nuevo documento todos los fotogramas estn en blanco excepto el primero . 2.- Fotograma Clave Vacio: Es el fotograma preparado para introducir los objetos que van a estar en el escenario, es vacio porque aun no se agrega ningn objeto . 3.- Fotograma Clave: Cuando al escenario se le integra un objeto, el fotograma rellena el crculo que est dentro de l para indicar que contienen un objeto . Numero de Fotograma: En la parte superior de los fotogramas, se indican el nmero de fotograma (con el numero mltiplo de 5), marcando sobre el fotograma en recuadro rojo y con una lnea que atraviesa el fotograma, el que se est ejecutando o visualizando en el escenario

Cuando varios fotogramas se repiten, se juntan estos en uno solo, y el ltimo fotograma se marca con un recuadro en vez de crculo

A todos los recuadros donde se insertan los fotogramas se les llama lnea de tiempo (1), para poder insertar un objeto, es importante que se inserte primero un fotograma (cuando se abre un documento el primer fotograma es un fotograma vaco).

Para insertar un fotograma se selecciona el lugar donde se coloca y con el botn derecho del Mouse se abre un men donde se selecciona insertar fotograma

Si se inserta un fotograma en la lnea de tiempo 7 los fotogramas del 1 al 6 van a ser repetidos, del fotograma 1, observe que tiene un recuadro dentro del fotograma que indica el fin de la serie de repeticin del fotograma 1.

Es posible eliminar fotogramas, seleccionando aquellos que van a ser eliminados y posteriormente con el botn derecho del Mouse se abre un men donde se selecciona quitar fotograma.

Para insertar un fotograma clave se selecciona el lugar donde se coloca y con el botn derecho del Mouse se abre un men donde se selecciona insertar fotograma clave.

Para insertar un fotograma clave vaci, se realiza la misma operacin, pero seleccionando fotograma clave vaco.

Con lo visto anteriormente tenemos los conocimientos bsicos para el manejo del programa de Flash, estos conocimientos los podemos utilizar en textos, imgenes o dibujos que al animarlos o combinarlos, nos permiten crear documentos multimedia para desarrollar material didctico adecuado a las necesidades de las materias que se imparten.

CAPAS:
En el diseo de documentos, sobre todo en animaciones, para dar el efecto de profundidad, utilizamos capas, que no es otra cosa que formar la imagen como si fueran acetatos, una detrs de otra, adems nos permite realizar efectos por separado en cada una de las capas.

En la imagen tenemos la capa ovalo encima de la capa rectngulo, esto es el acomodo de la capa que esta encima con los objetos al frente del escenario, y la capa que est hacia abajo, acomoda los objetos al fondo del escenario. Cambiar el Nombre a Las Capas: Para cambiar el nombre a la capa damos doble click al nombre de la capa y estar la palabra seleccionada para cambiar su nombre, al terminar de colocar el nuevo nombre.

Insertar y Eliminar Capa: Para insertar una nueva capa, seleccionamos el icono Nueva Capa (1) y la inserta encima de la capa que este seleccionada. Para eliminar una capa, primero la seleccionamos y damos clic al icono Eliminar Capa (2). La capa que est siendo utilizada y editada en el escenario esta remarcada (3) y aparece el icono de (4). Ver y Ocultar Capa: Para ver y ocultar todas las capas, se selecciona el icono (5), y en la parte de abajo se muestra una en los puntos que estn debajo del icono, que indica que las capas estn ocultas, si se desea solo ocultar una o varias (6), se selecciona el punto (7) que est debajo de este icono.

5 4 3 5 1 4 2 4 6 7

Bloquear o Desbloquear Capas: A un lado de ocultar esta el icono de Bloquear (8), esto es para no hacer modificaciones accidentales a los objetos de una capa, el uso es igual al anterior, si se selecciona el icono, se bloquean todas las capas, indicndolo con el icono del candado en todas las capas , y si no se desea bloquear todas las capas, se selecciona las capa a bloquear, a continuacin se muestran algunas capas bloqueadas (9).
8

Mostrar Capas como Contornos.- El icono muestra los objetos de las capas como contornos si se selecciona este icono, al igual que los casos anteriores podemos seleccionar los contornos por cada capa, en las siguientes figuras se muestran las capas con contorno (1) y sin contorno (2). (1) (2)

PRACTICA 6: EJERCICIO 6:

MANEJO DE CAPAS CAPAS

PANEL DE HERRAMIENTAS
Es el ms utilizado en el diseo y edicin, su uso lo aplicaremos en el diseo de las prcticas que se presentan ms adelante, sus elementos son:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

1.- Seleccionar.- Selecciona objetos en el escenario. 2.- Sub seleccin.- Selecciona y transforma los objetos utilizando los puntos de nodo que los forman. 3.-Transformacion Libre.- Al seleccionar el objeto me permite modificar el tamao, rotar y distorsionarlo. 4.- Rotacin 3D.- Tambin herramienta de traslacin 3d. 5.- Lazo.- Nos permite seleccionar a mano alzada parte de los objetos, estas parte pueden ser separadas del objeto. 6.- Pluma.- Nos permite dibujar punto por punto, al hacer clic con el mouse se inicia un punto que se enlaza con otro punto dando clic al mouse, unindolos con una lnea y as forma figuras. 7.- Texto.- Nos permite insertar texto a nuestro escenario. 8.-Linea.- Permite insertar lneas al escenario. 9.- Rectngulo.- Forma la figura de Rectngulo, aparte de Ovalo y Polytar. 10.- Lpiz.- Permite crear figuras utilizando el mouse como lpiz. 11.-Pincel.- Permite disear dibujos igual que el lpiz, pero con el efecto de lnea en pincel, tambin tiene el efecto de pincel rociador. 12.- Deco.- Forma efecto decorativo de enramada. 13.- Hueso.- Utilizado para efecto de animacin ubicando un punto de rotacin o movimiento. 14.- Cubo de Pintura.- Nos permite modificar el color de relleno del objeto, Tambin contiene la herramienta de Bote de Tinta, que nos permite modificar el color, grosor y forma del trazo de lpiz o contorno. 15.- Cuentagotas.- Nos permite copiar el color del borde o relleno del grfico, para insertarlo y en otro objeto grafico. 16.- Borrador.- El mouse se transforma en un crculo, y borra el contorno o relleno por los que pasa. 17.- Mano.- Nos permite mover todo el escenario con los objetos que contiene. 18.- Lupa.- Permite disminuir o aumentar la vista del escenario. 19.- Color del contorno del objeto que se inserta al escenario. 20.- Color del relleno del objeto que se inserta al escenario.

BARRA DE MENU
Como en todos los programas de Windows, algunas de las aplicaciones son comunes a todos los programas de aplicacin de Windows, y otras son propias del programa. Otras opciones son propias del programa, y en este men se agrupan las herramientas y comandos con las siguientes opciones: Archivo: Contienen los comandos para guardar documentos, importar y exportar objetos, generar publicaciones, realizar impresiones, entre otras. Edicin: Permite realizar la edicin de objetos, lnea de tiempo, smbolos, buscar y remplazar, y las opciones de copiar, cortar, pegar. Ver.- Nos permite utilizar los diferentes comandos para las diferentes vistas del escenario y de la ventana del programa. Insertar.- Permite insertar tanto smbolos, interpolaciones, lnea de tiempo y escenas al documento. Modificar: Nos permite realizar modificaciones al documento, smbolos, lnea de tiempo y objetos en el escenario. Texto: Se utiliza para las ediciones de las propiedades de texto y ortografa, como el tamao, fuente, estilo, color. Comandos: Nos permite administrar, obtener y ejecutar los diferentes comandos, as como exportar e importar movimientos XML. Control: Nos permite manipular la ejecucin y reproduccin de las animaciones y de los documentos creados. Depurar: Nos da las opciones para encontrar errores en programacin de la pelcula, as como iniciar una sesin remota de depuracin Ventanas: Podemos abrir y ocultar las diferentes ventanas o paneles que tienen Flash, teniendo abiertas las que estamos utilizando y ocultando las que no se requieren, con la finalidad de ampliar el rea de visin del escenario, y no saturar la ventana del programa. Ayuda: nos permite acceder a las ayudas que ofrece Adobe Macromedia, en las referencias, manuales, tutoriales o lecciones que son tiles para comprender mejor el uso de las herramientas del programa.

NUEVO DOCUMENTO
Para abrir un nuevo documento se selecciona Archivo>Nuevo, se abre la ventana donde se selecciona el tipo de documento a crear y se agrega la pestaa con los dos documentos abiertos.

GUARDAR UN DOCUMENTO EDITABLE

Cuando abrimos un documento de Flash, aparece con el nombre Sin ttulo-1, para darle un nombre al documento, realizamos el siguiente procedimiento PROCEDIMIENTO. 1.- selecciona la opcin de Archivo>Guardar, abre una ventana con las opciones de direccin, nombre y tipo documento de Flash CS4, (extensin del documento, *.fla), finalmente se guarda esta extensin de archivo editable. La siguiente figura muestra el icono de Flash de extensin *.flv.

2.- Cuando un documento no se guarda por primera vez, se seleccione Archivo>Guardar como, ya sea para cambiar el nombre o guardar los cambios. 3.- Si tenemos varios documentos abiertos en la misma ventana de Flash, estos se muestran en la pestaa con el nombre de los documentos abiertos, sobreponindose aquel en el que se est trabajando, en el ejemplo tenemos 3 documentos abiertos, el segundo de ellos sobre el cual se trabaja:

A un lado del nombre del documento esta una documento.

, si se presiona este icono se cierra el

Slo el documento anterior es al que nos permite editar o realizar modificaciones, los posteriores nicamente son para ser publicados, para que el usuario trabaje con ellos, pero no permite modificarlos.

CONFIGURAR PUBLICACION
Para la configuracin de una publicacin, se selecciona Archivo>Configuracin De Publicacin, mostrando la siguiente ventana:

Por defecto se tienen seleccionados los tipos de documentos de Flash (*.swf), HTML (*.html), es decir, se configuran estos dos tipos de documentos, el primero son animaciones que se insertan a una pgina Web o aplicacin de Flash, y el segundo es una publicacin de una pgina Web propia. Se utilizan para este curso los tipos, imagen GIF (*.gif), imagen JPG (*.jpg) y proyectos de Windows (*.exe).

FLASH. (*.swf).

HTML (*.html)

GIF. (*.gif)

JPG. (*.jpg)

Proyecto Windows (*.exe) El formato GIF permite las animaciones (se debe definir como GIF animado), y el formato JPG no permite la animacin ya que es una foto.

IMPORTAR AL ESCENARIO (objeto de imagen, sonido, video)

Se selecciona la opcin de Archivo > Importar > Importar A Escenario o directamente (CTL + R), se abre la ventana de importar, se ubica la direccin donde se encuentra el archivo, se presiona el botn de abrir para importar al escenario.

Nota.- Podemos importar al escenario imgenes de mapa de Bits, tambin se importa con ese formato en la biblioteca. Se pueden importar al escenario Todos los objetos compatibles con Flash, entre ellos tenemos:

IMPORTAR A LA BIBLIOTECA (objeto de imagen, sonido, video)

En el lugar de los paneles (ubicado del lado derecho del programa); hay uno muy utilizado, donde se guardan los smbolos (objetos) que se utilizan en Flash, dependiendo del tipo, puede ser imagen, clip de pelcula o botn, este ultimo nos permite darle interactividad al documentos, si no se muestra el panel de biblioteca, se selecciona del men principal la opcin de Ventana > Biblioteca, o ms directamente (Ctl + L). Ya sea importando al escenario o a la biblioteca, el procesamiento y tipo de objetos son los mismos. * El tema de los smbolos ser ampliado en el transcurso del manual. PRACTICA 7: IMPORTAR IMAGEN Y SONIDO AL ESCENARIO Y GUARDAR DOCUMENTO EDITABLE Y PUBLICACIONES IMPORTAR IMAGEN Y SONIDO AL ESCENARIO Y GUARDAR DOCUMENTO EDITABLE Y PUBLICACIONES

EJERCICIO 7: