You are on page 1of 59

3.

Manual de Flash
Coordinacin de Educacin a distancia de la U. M. S. N. H.

L.I.A. Filho Enrique Borjas Garca

EDUCACIN

@ DISTANCIA

salvando distancias para el aprendizaje

MODULO BASICO
[MANUAL DE FLASH]
Manual de referencias de uso prctico del programa informtico Macromedia Flash CS4, para el diseo de materiales didctico en multimedia, efectos de animacin y presentaciones, utilizados por acadmicos que desean incorporar un entorno en tecnologa informtica ms grca para el proceso enseanza aprendizaje.

DIRECTORIO Rector Dr. Salvador Jara Guerrero Secretario General Dr. Egberto Bedolla Becerril Secretario Acadmico Dr. Jos Gerardo Tinoco Ruiz Secretario Administrativo Lic. Elas Gonzlez Ruelas Secretario Auxiliar Dra. Rosa Mara de la Torre Torres Secretario Particular L.E. Jos Refugio Rodrguez Velzquez Secretario Privado Lic. Pavel Aurelio Ocegueda Robledo Tesorero C.P. Horacio Guillermo Daz Mora Contralor Dr. Jos Luis Chvez Chvez Abogado General Lic. Juan Carlos Gmez Revuelta

NDICE

MODULO BASICO
CONCEPTOS Y ELEMENTOS BSICOS DEL PROGRAMA
Introduccin. Acerca del programa. Flujo del trabajo general de Flash. Tipos de imgenes (vectores y mapa de bits). Objetos.
2

INICIANDO CON FLASH


Espacio de trabajo. Ventana o paneles. Conmutador del lugar de trabajo. Panel de propiedades. Panel biblioteca. Escenario. Lnea de tiempo. Fotograma. Capas. Panel de herramientas. Barra de mens. Nuevo documento. Guardar un documento editable. Formatos de publicacin. Importar al escenario. Importar a la biblioteca.

APLICACIONES BSICAS CON FLASH


Manejo y modificaciones de dibujos. Insertar un ovalo (o circulo), rectngulo (o cuadrado) o figura Polyester. Herramienta de flecha para seleccionar. Deformar y mover un objeto. Separacin de un objeto. Deformacin del objeto. Transformacin libre (deformacin vertical y horizontal cambiar proporcin y girar). Color de contorno y relleno con panel color. Manejo y modificaciones de texto. Insertar un texto. Transformar un texto en objeto de dibujo. Importar un grafico, sonido o video. Smbolos. Smbolo Grfico. Smbolo Clip de pelcula. Smbolo Botn. Animaciones. Fotograma a fotograma. Interpolacin de movimiento. Interpolacin clsica. Interpolacin de forma.
3

CONCEPTOS Y ELEMENTOS BSICOS


INTRODUCCIN:
El presente manual est enfocado al uso prctico del programa de Macromedia Flash CS4 en el desarrollo de material multimedia para las aplicaciones del proceso enseanza aprendizaje, estructurado de tal manera, que inicialmente se dan las referencias bsicas de los conceptos necesarios para el manejo del programa, con la finalidad de ir introduciendo al lector en el amplio e interesante mundo del diseo que el programa nos proporciona, dndonos cuenta que la complejidad de su uso, no est en las aplicaciones de sus herramientas, sino en el miedo o desconocimiento de su uso, ya que no es slo para los genios o desarrolladores informticos, sino que su entorno es tan amigable que cualquier persona, con nociones bsicas puede manejarlo y utilizarlo sin tener complejos conocimientos previos, siendo fcil adaptarnos al entorno que nos presenta, para crear y desarrollar herramientas didcticas que cada uno de nosotros pueda ir armando y utilizarlo en nuestro quehacer acadmico. Adobe Macromedia Flash nos permite crear nuestros propios materiales didcticos que sern utilizados cuantas veces sean expuestos, adems de distribuirlos entre los alumnos al grabarlos en las memorias USB que ya es de uso cotidiano, tambin puede exponerse en los diversos sitios Web para una mayor y ms amplia difusin de su contenido, este ltimo permitiendo verlo y utilizarlo en forma permanente y en todo momento. Cabe mencionar que el sello que cada acadmico plasme en su diseo, ser basndose en su experiencia personal y en los intereses que observamos en los alumnos en cuanto a la forma de captar los conceptos y conocimientos que desea ensear con el fin de que las exposiciones abarquen la mayora de los canales de comunicacin (visual, auditivo y textual) que los alumnos requieren para mejorar la comprensin de los temas expuestos, independientemente de los contenidos y el campo del conocimiento en que se desenvuelven. El lenguaje a utilizar en el manual tiende a ser lo ms cotidiano posible, sin dejar de lado el lenguaje bsico requerido para la comprensin de las partes del programa, explicando estos ltimos para ser utilizados en una forma ms rutinaria. La estructura general del manual est formada por Mdulos, cada mdulo enfoca un conjunto de informacin relativo a un tema especifico, la relacin de los mdulos tiende a ser un tanto independiente entre uno y otro, pero no por ello son autnomo, sino al contrario complementarios, ya que la aplicacin y combinacin de mdulos nos permite enriquecer ms las opciones de herramientas de aplicacin de nuestros diseos. En el inicio se dar una idea general de programa para conocer el entorno, herramientas y forma en que se trabaja con el programa, para posteriormente entrar a temas ms especficos, estos temas sern abordados primeramente en el aspecto conceptual, es decir, definir que es, la funcin que tienen y su aplicacin, despus de tener definido un conjunto de temas interrelacionados entre s, se realizarn una serie de prcticas que nos permitirn entender dnde

y cmo podemos utilizarlos, y finalmente se dar una serie de ejercicios, para aplicar los temas desarrollados sin entrar en tanto detalle como en las prcticas, los tres pasos (conceptos, practicas y ejercicios) se complementaran con una serie de imgenes, animaciones y video tutoriales, que complementarn mas grficamente lo expuesto textualmente. El objetivo final al concluir cada bloque de temas es que el participante vaya incrementando sus habilidades, guindolo paso a paso para que sin darse cuenta se encamine a la creacin y diseo sus propios ejercicios, considerando que los ejercicios irn incrementando su grado de complejidad. El conjunto de temas complementarn un modulo, el primer mdulo es el principal y ms importante ya que como se menciono, proporcionar las bases para entender el programa y funciones bsicos, a partir de ah los siguientes mdulos sern enfocados a una aplicacin especifica, la cual estar a su vez formada por diversos temas, cada tema tendr sus conceptos, el conjunto de temas permitir realizar las practicas, para posteriormente realizar una serie de ejercicios que complementarn el aprendizaje.
5

ACERCA DEL PROGRAMA


Flash actualmente es el lder en el diseo de animaciones tanto para la Web como para diversos programas de aplicacin, y esto es fcil de entender por el fcil manejo de su entorno y mejoras en su funcionamiento, que cada versin hace que el diseo sea ms sencillo, permitiendo crear diseos atractivos con pocos conocimientos informticos. En las diferentes versiones de Flash, se tiene la versin bsica y la versin profesional, ambas trabajan de la misma manera, la diferencia est en que la profesional esta complementada con mas funciones orientadas al diseo profesional, tenemos la opcin de plantillas y presentaciones que no vienen en la versin bsica.

FLUJO DE TRABAJO GENERAL DE FLASH


Antes de iniciar el manejo del programa, es importante seguir los siguientes pasos (dados por el fabricante del programa), Para crear una aplicacin Flash, los cuales son: 1.- Planificar la aplicacin.-Decida las tareas bsicas que realizar la aplicacin. 2.- Aadir elementos multimedia.- Cree e importe elementos multimedia como imgenes, vdeo, sonido y texto. 3.- Organizar los elementos.- Organice los elementos multimedia en el escenario y en la lnea de tiempo para definir cundo y cmo aparecern en la aplicacin. 4.- Aplicar efectos especiales.- Aplique filtros grficos (como desenfoques, iluminados y biseles), mezclas, adems de otros efectos especiales que considere oportunos. 5.- Utilizar ActionScript para controlar el comportamiento.- Escriba cdigo ActionScript para controlar cmo se comportarn los elementos multimedia, incluido cmo correspondern los elementos a las interacciones del usuario. 6.- Probar y publicar la aplicacin.- Realice pruebas para verificar que la aplicacin funciona del modo deseado; asimismo, busque y solucione los errores que encuentre. La aplicacin se debe probar durante todo el proceso de creacin. Publique el archivo FLA como archivo SWF para que pueda mostrarse en una pgina Web y reproducirse con Flash Player. Segn el proyecto y el estilo de trabajo, se puede cambiar el orden de estos pasos.

TIPOS DE IMGENES (VECTORES Y MAPAS DE BITS)


Dentro del diseo web y diseo grfico, tenemos dos tipos de formatos de imgenes ms utilizados, estos son: El formato de mapa de bits.- Este tipo de imgenes, es formado por pixeles (puntos de color) en conjunto, al combinarse con otros van formando la imagen, en un todo inseparable, una imagen puede estar formada por 1024 x 800 pixeles, es decir, que tenemos 1024 puntos formados horizontalmente con 800 formados verticalmente. El nmero de pixeles que forma la imagen determina la resolucin (calidad) o detalle que forma la imagen; cabe mencionar que est determina el tamao del archivo requerido para su almacenamiento.

El formato vectorial.- Este tipo de formato es muy utilizado en el diseo, gracias a que ocupa poco espacio y principalmente tiene una calidad de imagen que no vara cuando se modifica su tamao, Esto se debe a que los grficos vectoriales describen las imgenes entre lneas y curvas, con propiedades de color y posicin, la siguiente imagen (del manual del fabricante), se describe mediante puntos por los que pasan las lneas, creando el contorno de las figuras.

OBJETOS
Los objetos son representaciones que tienen un significado hacia el usuario y est formado por un conjunto de propiedades o atributos (datos), representan objetos reales del mundo que nos rodea, o a objetos internos del sistema, para la formacin de nuestros documentos en Flash, vamos a utilizar diferentes objetos, entre ellos: Texto: Este objeto contiene una cantidad definida de propiedades como el color, forma estilo, grosor, solidez, etc. Grfico: Estilo, contorno, color de relleno, grosor, tamao. Imagen: Tamao, color, solidez, etc. Video: El video cuenta con las propiedades de tamao, duracin, calidad de video, solidez de imagen, entre otros. Es importante definir las propiedades de cada uno de los objetos que se utilizan en Flash, ya que conocindolos podemos modificarlos para realizar diseos ms atractivos y/o vistosos que pueden mejorar las imgenes a presentar y los efectos que se pueden realizar. Podemos comparar al diseo de Flash como el diseo del escenario de una obra teatral, donde el diseador va a ir dando forma a cada una de las partes del escenario dependiendo del tema y obra que sr va a presentar, los colores, la iluminacin, los objetos o material que se va a utilizar, considerando que debe ser acorde a los personajes y el contenido de la obra, para determinar el escenario. En ocasiones la obra requiere de cambiar el escenario segn las circunstancias que se presentan, esto tambin es aplicable a los escenarios que podemos utilizar en el programa. El programa de Flash arma su escenario cono los objetos mencionados anteriormente, cambiando sus propiedades dependiendo de las necesidades del programa que se est creando y de los usuarios que lo utilizarn. En una obra teatral, ya teniendo el contenido del escenario, el director de escena prepara y da forma en conjunto con los personajes y equipo de trabajo, para la ejecucin de la obra, en el programa de Flash damos forma al documento que vamos a crear segn el contenido temtico que se desea desarrollar y la creatividad de quien lo disea, da su toque personal para atraer la atencin del tipo de usuario a quien va dirigido.
8

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
10

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 11

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

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:
13

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:

14

ANIMADOR:

CLASICO:

15

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
16

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.

17

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 18

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: MODIFICAR LAS PROPIEDADES DEL ESCENARIO EJERCICIO 5: 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.
19

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).
1

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
20

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.

21

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 22

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

muestra los objetos de las capas como contornos Mostrar Capas como Contornos.- El icono 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.
23

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:
24

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


25

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 , si se presiona este icono se cierra el documento.

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:
26

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)

27

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.

28

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
29

EJERCICIO 7:

APLICACIONES BSICAS CON FLASH


INSERTAR UN OVALO (O CIRCULO), RECTANGULO (O CUADRADO) O FIGURA POLYSTART
Para insertar un valo, rectngulo o figura Polystart, usamos del panel de herramienta el icono , la flecha que est en la parte inferior derecha, abre el men para que este mismo icono nos d las siguientes opciones:

El cuadro negro (1), muestra el tipo de figura que dibuja en el escenario, podemos seleccionar cualquiera de ellos, dependiendo de la figura a dibujar.

DIBUJAR UN OVALO: PROCEDIMIENTO: 1.- Se selecciona la herramienta Ovalo .


2.- Cuando el Mouse esta sobre el escenario, se transformas en una +, luego se coloca en el lugar del rea de trabajo donde se inserta el ovalo (1), y con el botn izquierdo del Mouse se arrastra en diagonal para darle el tamao y forma, soltando el botn (2) se forma el ovalo.
1

2 30

DIBUJAR UN CRCULO: 1.- Se selecciona la herramienta Ovalo .

2.- Cuando el Mouse esta sobre el escenario, se transformas en una +, posteriormente se coloca en el lugar del rea de trabajo donde se inserta el circulo (1), y con el botn izquierdo del mouse, se arrastra en diagonal para darle el tamao y antes de soltar el botn (2) se presiona la tecla Shift para que se forme el crculo.
1

PRACTICA 8: EJERCICIO 8: EJERCICIO 9:

INSERTAR Y EDITAR OVALO Y CIRCULO INSERTAR Y EDITAR OVALO Y CIRCULO CAMBIAR LAS PROPIEDADES DE OVALO Y CIRCULO

DIBUJAR UN RECTANGULO: PROCEDIMIENTO: 1.- Se selecciona la herramienta Rectngulo .

2.- Cuando el Mouse esta sobre el escenario, se transformas en una +, posteriormente se coloca en el lugar del rea de trabajo donde se inserta el rectngulo (1), y con el botn izquierdo de Mouse se arrastra en diagonal para darle el tamao y forma, soltando el botn (2) se forma el rectngulo.
1

DIBUJAR UN CUADRADO: 1.- Se selecciona la herramienta Rectngulo .


31

2.- Cuando el Mouse esta sobre el escenario, se transformas en una +, Posteriormente se coloca en el lugar del rea de trabajo donde se inserta el cuadrado (1), y con el botn izquierdo del mouse, se arrastra en diagonal para darle el tamao y antes de soltar el botn (2) se presiona la tecla Shift para que se forme el cuadrado.
1

PRACTICA 9: EJERCICIO 10: EJERCICIO 11:

INSERTAR Y EDITAR RECTANGULO Y CUADRADO INSERTAR Y EDITAR RECTANGULO Y CUADRADO CAMBIAR LAS PROPIEDADES DE RECTANGULO Y CUADRADO

INSERTAR UN POLIGONO DE VARIOS LADOS PROCEDIMIENTO 1.- Se selecciona la herramienta PolyStar .

2.- Antes de formar la figura, del panel de propiedades, presione el botn opciones (1) que est dentro de configuracin de herramienta (2).

32

3.- Al presionar el botn, se abre la ventana que me permite configura el estilo (polgono o estrella), el numero de lados y el tamao de punto de la estrella.

4.- A continuacin se presentan figuras de polgono creados con 3, 5 y 6 lados, en estas figuras el tamao de punto de estrella no es utilizado.

PRACTICA 10: EJERCICIO 12: EJERCICIO 13:

INSERTAR Y EDITAR FIGURA DE 4 Y 8 LADOS INSERTAR Y EDITAR UNA FIGURA DE 3 Y 7 LADOS CAMBIAR LAS PROPIEDADES DE FIGURAS DE 3 Y 7 LADOS

INSERTAR UNA ESTRELLA DE VARIOS LADOS 1.- De la formacin de la figura de un polgono, realice los pasos 1 y 2. 2.- De la configuracin de herramienta seleccione el estilo de estrellas

. 3.- Se van a crear estrellas de 3, 4, 5 y 6 picos, en estas figuras el tamao de punto de estrella es de 0.25, 0.5, 0.75 y 1.5, observe la diferencia de la forma de la estrella.
33

PROPIEDADES DE LOS OBJETOS OVALOS, RECTANGULOS Y POLYSTRAR En todos los objetos se pueden modificar las propiedades del color, grosor y forma de contorno y relleno, el grosor y la solidez del contorno en las propiedades del objeto seleccionado CAMBIAR EL COLOR DEL CONTORNO Y RELLENO PROCEDIMIENTO 1.- seleccione el objeto con la flecha de seleccin , arrastre el Mouse presionando el botn izquierdo para formar un recuadro del objeto remarcndose el objeto, (como se observa en la figura).

2.- En el panel de propiedades seleccionamos el cuadro del color del contorno (1), y del panel de colores, cambiamos su color (2), la figura seleccionada cambiara el color del contorno.

1 34 2 1 2

Contorno

Relleno

3.- En el panel de propiedades seleccionamos el cuadro del color del relleno (1) y del panel de colores, cambiamos su color (2), la figura seleccionada cambiara el color del relleno.

CAMBIAR DE TRAZO Y ESTILO PROCEDIMIENTO: 1.- Para cambiar el trazo, con el Mouse movemos el indicador al lado derecho, eso hace que la figura aumente el grosor del contorno.

2.- Para cambiar el estilo del contorno se selecciona uno de la lista desplegable y el objeto seleccionado se cambia a esta forma.

PRACTICA 11: EJERCICIO 14: EJERCICIO 15:

INSERTAR Y EDITAR ESTRELLA DE 5 Y 8 LADOS


35

INSERTAR Y EDITAR UNA ESTRELLA DE 3 Y 7 LADOS CAMBIAR LAS PROPIEDADES DE LA ESTRELLAS

HERRAMIENTA DE FLECHA PARA SELECCIONAR, DEFORMAR Y MOVER UN OBJETO La opcin de flecha es la ms utilizada en la Barra de Herramientas para el diseo y modificacin de objetos. , debemos abarcar todo el objeto, si no se Para seleccionar un objeto usamos la flecha selecciona todo, cortar el objeto dividindolo en lo seleccionado y no seleccionado, para poder mover con las flechas del teclado, o con el Mouse (cuando se forma una pequea cruz abajo del puntero arrastrando).

Objeto

Objeto Seleccionado

Contorno

Relleno

Seleccin Completa

SEPARACIN DE UN OBJETO: PROCEDIMIENTO 1.- Cuando se hace una seleccin parcial, se puede separar el pedazo del objeto seleccionado del no seleccionado.

Seleccin Parcial DEFORMACION DEL OBJETO PROCEDIMIENTO

Separacin de Partes
36

Se coloca la punta del Mouse sobre el contorno, y en el punto a deformar, se arrastra hasta completar la deformacin.

Objeto Seleccionado PRACTICA 12: PRACTICA 13: EJERCICIO 16: EJERCICIO 17:

Deformacin

Deformacin de Otro Punto

DEFORMACION DE OBJETO CORTAR OBJETO CAMBIO DE PROPIEDADES Y DEFORMACION DE OBJETO DEFORMACION Y CORTE DE OBJETOS

HERRAMIENTA DE LAZO PROCEDIMIENTO 1.- La seleccin de flecha solo permite trazos rectangulares o cuadrados, cuando se desea seleccionar y separar formas irregulares, se utiliza la herramienta de lazo el mouse y formamos el trazo a seleccionar. , se selecciona con

Seleccin de Lazo TRANSFORMACIN LIBRE

Separacin del Objeto


37

Es posible modificar la forma del objeto, adems de cambiar la proporcin, deformarlo o girarlo (sobre su centro o un punto de referencia), para esto utilizamos la herramienta de transformacin libre Podemos utilizar esta herramienta Modificar>Transformar>Transformacin Libre seleccionando del men principal

MODIFICAR SU ANCHO, LARGO Y PROPORCIN PROCEDIMIENTO: 1.- Para modificar su proporcin, primeramente se selecciona el objeto (con la flecha de seleccin), se presiona la opcin de transformacin libre.

Se Selecciona el Objeto

Se Selecciona Transformacin Libre

38

2.- Se modifica lo largo (1), arrastrando con el Mouse sus puntos superiores o inferiores, lo ancho (2), arrastrando con el Mouse sus puntos izquierdo o derecho, aumenta (3) o disminuye (4) su proporcin, arrastrando sus puntos de las esquinas.

(1)

(1)

(2)

(2)

(3) GIRAR PROSEDIMINETO

(4)

1.- Podemos girar El objeto sobre el punto de referencia (circulo en el centro) cuando se coloca la punta del puntero en una de las esquinas y se transforma en una flecha en semicrculo, podemos girar el objeto sobre el eje de referencia (1)
Girodelobjeto 1 39

2.-Si se quiere cambiar el punto de eje del giro (1), se cambia el crculo que est en el centro para hacer girar al objeto sobre ese punto de referencia

Cambia el punto de referencia

DEFORMACION VERTICAL U HORIZONTAL Este caso es cuando el puntero se coloca en el lado a deformar, haciendo la deformacin dejando fija el lado contrario al que se mueve. PROCEDIMIENTO 1.- Podemos realizar la deformacin Vertical u Horizontal al objeto sobre el punto de referencia (circulo en el centro) cuando se coloca la punta del puntero en el lado superior, se transforma en una flecha doble, el lado opuesto queda fijo y el lado a mover se mueve a la izquierda o derecha (deformacin Vertical), Si se coloca sobre el lado derecho el lado opuesto queda fijo y el lado a mover se mover de arriba hacia abajo (deformacin Horizontal).

Deformacin Vertical

Deformacin Horizontal PRACTICA 14: PRACTICA 15: EJERCICIO 18: DEFORMACION DE OBJETO EN PROPORCION GIRO Y DEFORMACION VERTICAL Y HORIZONTAL DEFORMACION EN PROPORCION

40

EJERCICIO 19:

GIRO Y DEFORMACION VERTICAL Y HORIZONTAL

COLOR DE CONTORNO Y RELLENO CON PANEL COLOR Se puede variar el color del contorno colores a utilizar
3 2

seleccionado la flecha para que abra la gama de


1 6 4

Se puede modificar el alfa o intensidad de color (1) (seleccionando sobre el porcentaje y cambindolo a otro valor menor al 100%)), nos muestra el color seleccionado (2), y a un lado el cdigo del color (3), (usado en la programacin), el botn (4)

nos sirve para

eliminar el contorno, podemos dar efectos radiales en los efectos de color que se muestran (5), y (6) para seleccionar otro color en la paleta de colores que se muestra a continuacin.

41

Para el color del relleno se realiza la misma operacin que en el contorno. NOTA.- el color del contorno y relleno lo podemos ver en el panel de propiedades. Para mezclar colores usamos el panel de color (colocado del lado derecho de la pantalla, o lo abrimos del men principal, Ventana > Colores (Maysculas + F9) permitiendo mezclar varios tipos de colores.

La mezcla de colores puede ser slida, radial o lineal, segn sea la seleccin, podemos dar esta mezcla de colores al contorno (1) o al relleno (2).

1 2

42

PRACTICA 16: PRACTICA 17: EJERCICIO 20: EJERCICIO 21:

CAMBIO EN MEZCLA DE COLOR COLOR POR EFECTOS RADIALES MEZCAL DE TIPO DE COLORES EFECTOS EN COLOR

MANEJO Y MODIFICACIN DE TEXTO


Los textos, al igual que en cualquier programa se insertan con la herramienta de texto , podemos modificar sus propiedades, en el caso de Flash tambin es posible transformarlo a un objeto de dibujo. INSERTAR UN TEXTO PROCEDIMIENTO: 1.- Se selecciona el botn de Texto de la Barra de Herramientas. 2.- en el escenario se selecciona un punto donde se inserta el texto, y se arrastra el Mouse para abrir un cuadro de texto (1). Y se escribe el texto (2).
1 2

3.- En las Propiedades de texto, Flash las divide en tres categoras (debe estar seleccionado el texto para realizar las modificaciones: 1.- Caracteres.- Las modificaciones a estas propiedades son Familia.- o tipo de texto podemos ver alguno de ellos en la lista desplegable.

43

Estilo.- Nos permite editar el texto en regular, Italic, Bold o Bold Italic.

Tamao: nos permite modificar el tamao de la letra en puntos. Espacio entre Letras: la distancia entre una y otra letra Color: Es el color de la letra. 2.- Prrafo: Formato: Podemos dar el formato al prrafo de Izquierda, Derecha, Centrado y Justificado

TRANSFORMAR UN TEXTO EN OBJETO DE DIBUJO PROCEDIMIENTO: 1.- Para transformar un texto en objeto de dibujo, se selecciona la opcin del men principal Modificar>Separar, de esta manera se separan las letras en la grafica (1). Cada una de las letras es separada (2), (remarcada en un cuadro azul). 2.- Se vuelve a seleccionar Modificar>Separar, para transformarlo a objeto de dibujo (3). Si solo es una letra, con solo presionar Modificar>Separar, se transforma a objeto.
44

1 2

PRACTICA 18: PRACTICA 19: EJERCICIO 22: EJERCICIO 23:

INSERTAR Y EDITAR TEXTO TRANSFORMAR TEXTO EN OBJETO INSERTAR Y EDITAR TEXTO SEPARACIN Y TRANSFORMACIN DE TEXTO EN OBJETO

IMPORTAR UN GRAFICO, SONIDO O VIDEO


Las imgenes grficos, sonidos o videos guardados en cualquier medio de almacenamiento, pueden insertarse en nuestro documento de Flash. PROCEDIMIENTO: 1.- Del men principal selecciona Archivo>Importar al escenario.

2.- Se abre la ventana de Importar, buscamos la ruta donde se encuentra el documento, predeterminadamente muestra todos los tipos de documento, pero podemos buscar solo un formato, en especfico al desplegar la lista (como se muestra)

45

3.- Al seleccionarlo, se inserta la imagen en el escenario y en el panel biblioteca; en el panel de Biblioteca, Como se haba mencionado anteriormente, muestra los objetos de los documentos abiertos (1), podemos desplegar la lista de cualquier biblioteca de los documentos que tenemos abiertos e insertarlos en el escenario de otro documento (2) (para ello se selecciona el archivo (3) y se arrastra al escenario), de esta manera el archivo tambin se inserta en su biblioteca.

1 2 3

En la figura tenemos abierto el escenario del documento 3 y el panel Biblioteca del documento 1, insertamos el archivo de imagen arrastrndolo al escenario.
46

4.- La imagen (1), Sonido (2), o video (3), aparece en la biblioteca con los siguientes smbolos:
1 2 3

PRACTICA 20: PRACTICA 21: EJERCICIO 24: EJERCICIO 25:

INSERTAR IMAGEN INSERTAR SONIDO INSERTAR IMAGEN INSERTAR SONIDO

SIMBOLOS
Los smbolos son muy utilizados en las animaciones, ya que nos permiten realizar trabajos ms complejos, de una manera ms sencilla, los objetos al ser transformados en smbolos, son incluidos en el panel biblioteca en el momento en que son creados, lo que permite que sean utilizados en varias ocasiones, ya sea en la misma o en otra pelcula. SMBOLO GRFICO PROCEDIMIENTO: 1.- Seleccionamos el objeto que queramos convertir en Smbolo Grfico (puede ser un objeto creado o importado al escenario), accedemos al men Insertar>Nuevo Smbolo, pulsando Ctrl + F8 o F8, o seleccionando el objeto y con el botn derecho del Mouse, abrimos el men contextual y seleccionamos Convertir en Smbolo, nos presenta lo siguiente.

2.-En la opcin de tipo seleccionamos Grfico (como se muestra), introducimos el nombre del smbolo que vamos a crear y presionamos Aceptar. 3.- Para ver los smbolos utilizados en el documento observamos el panel de bibliotecas, si no est abierto, seleccionamos del men principal, la opcin de Ventana > Biblioteca. 4.- Se observa el objeto smbolo grfico que se cre y el icono que lo representa (1).
2 1

47

5.- El objeto transformado en smbolo (2) se remarca con un recuadro azul, y un crculo en el centro. 6.- Cualquier objeto grfico o texto puede ser convertido en smbolo grfico 7.- Si se desea editar el smbolo, en el panel de Herramientas seleccionamos la flecha de seleccin (1), y dando doble clic al botn izquierdo del Mouse para abrir el smbolo, se sale del escenario (2) para abrir el editor del smbolo, se observa en la parte superior del rea de trabajo donde aparece el nombre del escenario, el del smbolo abierto para su edicin (3).
2

8.- Editamos el smbolo y con solo seleccionar el titulo de Escenario 1 (2) nos regresa al escenario, dejando guardado el Smbolo en la Biblioteca, posteriormente lo insertamos en el escenario. PRACTICA 22: PRACTICA 23: EJERCICIO 26: EJERCICIO 27: CREAR SIMBOLO GRAFICO EDITAR SIMBOLO GRAFICO CREAR SIMBOLO GRAFICO EDITAR SIMBOLO GRAFICO
48

SMBOLO CLIP DE PELICULA PROCEDIMIENTO: 1.- Seleccionamos el objeto que queramos convertir en smbolo Clip de Pelcula (puede ser un objeto creado o importado al escenario), accedemos al men Insertar>Nuevo Smbolo, pulsando Ctrl + F8 o F8, o seleccionando el objeto y con el botn derecho del Mouse, abrimos el men contextual y seleccionamos Convertir en Smbolo, nos presenta lo siguiente.

2.-En la opcin de tipo seleccionamos Clip de Pelcula (como se muestra), introducimos el nombre del smbolo que vamos a crear y presionamos Aceptar. 3.- Para ver los smbolos utilizados en el documento observamos el panel de bibliotecas, si no est abierto, seleccionamos del men principal, la opcin de Ventana > Biblioteca. 4.- Se observa el objeto smbolo Clip de Pelcula que se cre y el icono que lo representa (1).
2 1

5.- El objeto transformado en smbolo (2) se remarca con un recuadro azul, y un crculo en el centro. 6.- Un Smbolo Clip de Pelcula nos permite guardar una animacin o pelcula (interpolacin) que sea diferente al escenario, las interpolaciones estn creadas en el escenario, pero a partir de aqu cada interpolacin puede trabajar en forma diferente una de la otra, utilizndose las veces que se desee, solo arrastrndolo del panel de biblioteca al escenario. 7.- Si se realiza la animacin del smbolo, en el panel de Herramientas seleccionamos la flecha de seleccin (1), y dando doble clic al botn izquierdo del Mouse para abrir el smbolo, se sale del escenario (2) para abrir el editor del smbolo, se observa en la parte superior del rea de trabajo donde aparece el nombre del escenario, el del smbolo abierto para su edicin (3), en este momento estamos trabajando en la creacin del clip de pelcula, ya no sobre el escenario.
2 3 49

8.- Creamos la animacin y con solo seleccionar el titulo de escenario 1 nos regresa al escenario, dejando guardado el Smbolo con la animacin. 9.- Observemos que el clip de pelcula est en la biblioteca, la insertamos en el escenario al arrastrar el archivo del panel de Biblioteca al escenario. PRACTICA 24: PRACTICA 25: EJERCICIO 28: EJERCICIO 29: CREAR SIMBOLO CLIP DE PELICULA EDITAR SIMBOLO CLIP DE PELICULA CREAR SIMBOLO CLIP DE PELICULA EDITAR SIMBOLO CLIP DE PELICULA

SIMBOLO DE BOTON Flash nos permite crear botones personalizados de manera muy rpida para dar control e interactividad a las acciones del documento.

PROCEDIMIENTO: 1.- Seleccionamos el objeto que queramos convertir en smbolo Botn (puede ser un objeto creado o importado al escenario, accedemos al men Insertar>Nuevo Smbolo, pulsando Ctrl + F8 o F8, o seleccionando el objeto, y con el botn derecho del Mouse, abrimos el men contextual y seleccionamos Convertir en Smbolo, nos presenta lo siguiente.

50

2.-En la opcin de tipo seleccionamos Botn (como se muestra), introducimos el nombre del smbolo que vamos a crear y presionamos Aceptar. 3.- Para ver los smbolos utilizados en el documento observamos el panel de bibliotecas, si no est abierto, seleccionamos del men principal, la opcin de Ventana > Biblioteca. 4.- Se observa el objeto smbolo Botn que se cre y el icono que lo representa (1).
2 1

5.- El objeto transformado en smbolo (2) se remarca con un recuadro azul, y un crculo en el centro. 6.- Un Smbolo Botn nos permite ejecutar animaciones e interactividad, (mostrado en la prctica). 7.- Para editar el smbolo Botn, en el panel de Herramientas seleccionamos la flecha de seleccin (1), y dando doble clic al botn izquierdo del Mouse para abrir el smbolo, se sale del escenario (2) para abrir el editor del smbolo, se observa en la parte superior del rea de trabajo donde aparece el nombre del escenario, el del smbolo abierto para su edicin (3), en este momento estamos trabajando en la creacin del clip de pelcula, ya no sobre el escenario.

51

8.- La lnea del tiempo del botn, es diferente en el caso del clip de pelcula, ya que este est formado por cuatro partes principales: Reposo, Sobre, Presionado y Zona Activa son los cuatro estados de un botn. Veamos a continuacin, qu representa cada estado. Reposo: es cuando el Mouse no est colocado sobre nuestro botn o no se ha hecho clic sobre l. Sobre: es cuando el Mouse est colocado sobre el botn, pero an no se ha hecho clic sobre l. Presionado: lgicamente, es cuando haces clic sobre el botn. Zona Activa: su mismo nombre lo indica, es cuando el botn est activo. 9.- Podemos cambiar la forma del botn de los tres primeros estados para dar mayor efecto en estos tres cambios. 10.- Observemos que el Botn est en la biblioteca, lo insertamos en el escenario al arrastrar el archivo del panel de Biblioteca al escenario. 11.- Podemos ejecutar acciones con los botones, para ello abrimos el panel de Acciones donde escribimos en lenguaje de programacin la accin de los comandos que deseamos que realice nuestro botn. PRACTICA 26: PRACTICA 27: EJERCICIO 30: EJERCICIO 31: CREAR SIMBOLO BOTON EDITAR SIMBOLO BOTON CREAR SIMBOLO BOTON EDITAR SIMBOLO BOTON

ANIMACIONES
INTERPOLACION FOTOGRAMA A FOTOGRAMA En la interpolacin fotograma a fotograma, vamos a crear una animacin con el mtodo tradicional, donde cada fotograma es un objeto esttico, se colocan en secuencia tomando en cuenta que cada uno de los fotogramas tiene una pequea diferencia al anterior, al reproducir la pelcula obtenemos un efecto animado. Este tipo de interpolacin es muy utilizado en animaciones sencillas de pocos fotogramas o en los Gif animados. PROCEDIMIENTO: 1.- Estando en el fotograma 1 (1) (fotograma vaco (2) por el crculo con relleno en blanco) inserte un objeto (por ejemplo un cuadro):
1 52

2.- Inserte un objeto al escenario, en este momento el fotograma deja de ser vaco (1).

3.- Seleccione el objeto y muvalo hacia la izquierda, ya sea con las flechas del teclado o arrastrndolo con el Mouse.

4.- Para grabar el objeto ya movido en el fotograma 2, se presiona la tecla F6, o en el men principal se selecciona Insertar>Lnea de Tiempo>Fotograma Clave.

53

5.- Repita los pasos 3 y 4 hasta el fotograma 5.

6.- Para ver la reproduccin de la pelcula seleccione del men principal Control > Probar Pelcula, o sobre el nmero de la lnea de tiempo arrastre la gua de la lnea de tiempo (1).

7.- Recuerda que la velocidad de reproduccin depende de la los fotogramas por segundo a la que esta la animacin en las propiedades del documento (est determinado a 24 fotogramas por segundo, podemos cambiar esa velocidad en las propiedades del escenario). PRACTICA 28: PRACTICA 29: EJERCICIO 32: CREAR ANIMACION FOTOGRAMA A FOTOGRAMA PUBLICAR ANIMACION EN *.SWF Y *.EXE CREAR ANIMACION FOTOGRAMA A FOTOGRAMA

INTERPOLACIN DE MOVIMIENTO Otra tcnica es por la interpolacin de movimiento, donde el mismo objeto se mueve de lugar, y modifica su forma, en esta se define nicamente un inicio y un fin de la trayectoria de la animacin del mismo objeto, el programa realizar la animacin de los fotogramas intermedio. Es muy recomendable para animaciones ms complejas, ya que reduce el espacio requerido en memoria. PROCEDIMIENTO: 1.- Estando en el fotograma 1 (1) (fotograma vaco (2) por el crculo con relleno en blanco) inserte un objeto (por ejemplo un cuadro):
1 2 54

2.- Inserte un objeto al escenario, en este momento el fotograma deja de ser vaco (1), transfrmelo en smbolo (de preferencia grfico, pero es posible realizar la interpolacin de cualquier tipo de smbolo),

3.- Seleccione el primer fotograma, presione el botn derecho del Mouse seleccione la opcin crear interpolacin de movimiento.

4.- O seleccione el primer fotograma y en el men principal seleccione Insertar>Interpolacin de movimiento.

5.- El icono de la capa se transforma indicando que es una interpolacin de movimiento (1), llega al fotograma 24, la lnea de gua (2), indica el ultimo fotograma, en este momento con la flecha de seleccin o con los flechas del teclado movemos el objeto a su punto final (3), se forma una lnea indicando el trayecto del punto inicial al final (4).
4 3 2 1

55

6.- Para ver la reproduccin de la pelcula seleccione del men principal Control > Probar Pelcula, o sobre el nmero de la lnea de tiempo arrastre la gua de la lnea de tiempo. 7.- Podemos cambiar la trayectoria de movimiento, seleccionando un punto de la misma y moverla.

PRACTICA 30:

CREAR ANIMACION POR INTERPOLACION DE MOVIMIENTO PUBLICAR ANIMACION EN *.SWF Y *.EXE CREAR ANIMACION POR INTERPOLACION DE MOVIMIENTO

PRACTICA 31: EJERCICIO 33:

INTERPOLACIN CLASICA La interpolacin clsica, es parecida a la interpolacin de movimiento donde el mismo objeto se mueve de lugar, y modifica su forma, en sta se define nicamente un inicio y un fin de la

trayectoria de la animacin del mismo objeto, el programa realizar la animacin de los fotogramas intermedios. PROCEDIMIENTO: 1.- Estando en el fotograma 1 (1) (fotograma vaco (2) por el crculo con relleno en blanco) inserte un objeto (por ejemplo un cuadro):
1 2 56

2.- Inserte un objeto al escenario, en este momento el fotograma deja de ser vaco (1), transfrmelo en smbolo (de preferencia grfico, pero es posible realizar la interpolacin de cualquier tipo de smbolo).

3.- Se selecciona el ultimo fotograma 35, se presiona la tecla F6, o en el men principal se selecciona Insertar>Lnea de Tiempo>Fotograma Clave.

4.- Del fotograma 1 al 34 se repite el objeto, solo el fotograma 35 es el que tiene la posicin final, se crea la interpolacin clsica al seleccionar el primer fotograma y en el men principal seleccione Insertar>Interpolacin clsica.

5.- O seleccione el primer fotograma, presione el botn derecho del Mouse y la opcin crear interpolacin clsica, se observa una flecha que indica que es una interpolacin clsica

6.- Para ver la reproduccin de la pelcula seleccione del men principal Control > Probar Pelcula, o sobre el nmero de la lnea de tiempo arrastre la gua de la lnea de tiempo. PRACTICA 32: CREAR ANIMACIN POR INTERPOLACIN DE CLASICA PUBLICAR ANIMACIN EN *.SWF Y *.EXE CREAR ANIMACIN POR INTERPOLACIN CLASICA.

57

PRACTICA 33: EJERCICIO 34:

INTERPOLACIN DE FORMA Esta animacin transforma un objeto inicial en otro diferente al final, utilizando slo dos objetos, pero debe de realizarse con objetos no smbolos. PORCEDIMIENTO: 1.- Estando en el fotograma 1 (1) (fotograma vaco (2) por el crculo con relleno en blanco) inserte un objeto (por ejemplo un cuadro):
1 2

2.- Para este tipo de animacin, el objeto no debe ser un smbolo, en caso de realizarlo con un smbolo, seleccione el objeto y del men principal elija Modificar>Separar, para que el objeto deje de ser smbolo. 3.- Inserte un objeto al escenario, en este momento el fotograma deja de ser vaco (1),

4.- Seleccione el ltimo fotograma 35 para indicar el fin de la animacin, y presione F6 para crear el fotograma clave, coloque en el escenario el objeto final.

5.- Del fotograma 1 al 34 se repite el objeto, solo el fotograma 35 es el que tiene el objeto final, se crea la interpolacin de forma al seleccionar el primer fotograma y en el men principal seleccione Insertar>Interpolacin de forma.

58

6.- O seleccione el primer fotograma, presione el botn derecho del Mouse y la opcin crear interpolacin de forma, se observa una flecha que indica que es una interpolacin de forma.

7.- Para ver la reproduccin de la pelcula seleccione del men principal Control > Probar Pelcula, o sobre el nmero de la lnea de tiempo arrastre la gua de la lnea de tiempo. PRACTICA 34: PRACTICA 35: EJERCICIO 35: CREAR ANIMACION POR INTERPOLACION DE FORMA PUBLICAR ANIMACION EN *.SWF Y *.EXE CREAR ANIMACION POR INTERPOLACION DE FORMA

You might also like