C.CT.

12PBT0051Z

LOS JOVENES DE LA NUEVA TECNOLOGIA

Director: Oscar Morales Lucena Profesor: Antonio Rodrguez Vzquez Alumno: Juan Carlos Carrillo Marcelino
TECNICO PROGRAMADOR ANALISTA EN SISTEMAS

San Marcos, Guerrero Junio 2011

7. ADOBE FLAS CS3 7.1 Introduccin Qu es FLASH?

Flash CS3 es una potente

herramienta desarrollada por Adobe que ha superado las mejores expectativas de sus creadores. Flash fue creado con el objeto de realizar animaciones y diseos vistosos para la web, as como para crear Los motivos que han convertido a Flash CS3 en el programa elegido por la mayora de los diseadores web profesionales y aficionados son varios. Veamos pues, porque es interesante Flash CS4. Desde la web de Adobe te puedes descargar una versin de evaluacin de Flash CS3 vlida para 30 das. Los logotipos de Flash son propiedad de Adobe, as como las marcas registradas Flash y Adobe.

La Barra de Mens

La Barra de Mens tiene como propsito facilitar el acceso a las distintas utilidades del programa. Es similar a la de cualquier otro programa de diseo web o grfico, aunque tiene algunas particularidades. Veamos los principales Submens a los que se puede acceder: Archivo: Permite crear nuevos archivos, abrirlos, guardarlos... Destaca la potencia de la utilidad Importar que inserta en la pelcula actual casi todo tipo de archivos (sonidos, vdeo, imgenes e incluso otras pelculas Flash), o la de Configuracin de Publicacin desde donde se pueden modificar las caractersticas de la publicacin. Tambin permite configurar la impresin de las pginas, imprimirlas... Edicin: Es el clsico men que te permite Cortar, Copiar, Pegar... tanto objetos o dibujos como fotogramas; tambin permite personalizar algunas de las opciones ms comunes del programa. Ver: Adems de los tpicos Zooms, te permite moverte por los fotogramas y por las escenas. Tambin incluye la posibilidad de crear una cuadrcula y unas guas. Esto se puede seleccionar desde los submens Cuadrcula y Guas desde donde tambin se pueden configurar sus opciones. Insertar: Permite insertar objetos en la pelcula, as como nuevos fotogramas, capas, acciones, escenas... Modificar: La opcin Transformar permite modificar los grficos existentes en la pelcula, y la opcin Trazar Mapa de Bits convierte los grficos en mapas vectoriales (este tema se tratar ms adelante). El resto de opciones permite modificar caractersticas de los elementos de la animacin Suavizar, Optimizar o de la propia pelcula (Capa, Escena ...). Texto: Sus contenidos afectan a la edicin de texto. Ms adelante se tratar en profundidad. Comandos: Permite administrar los Comandos (conjunto de sentencias almacenadas que permiten emular lo que un usuario pueda introducir en el entorno de edicin) que hayamos almacenado en nuestra animacin, obtener otros nuevos de la pgina de Macromedia o ejecutar los que ya tengamos.

Control: Desde aqu se modifican las propiedades de reproduccin de la pelcula. Reproducir, Rebobinar, Probar Pelcula.... Depurar: Aqu encontraremos las opciones de depuracin de la pelcula que te ayudaran a encontrar errores de progrmacin en ActionScrit, entre ellos se encuentran Entrar, Pasar, Salir, Continuar... Ventana: Este men, adems de las opciones clsicas acerca de cmo distribuir las ventanas, incluye accesos directos a todos los paneles y tambin la posibilidad de crear tus propios Espacios de Trabajo, guardarlos, cargarlos, etc. La Lnea de Tiempo representa una forma de ver los fotogramas de modo simplificado. Consta de 2 partes.

1) Los Fotogramas (frames) que vienen delimitados por lneas verticales (formando rectngulos) 2) Los Nmeros de Fotograma que permiten saber qu nmero tiene asignado cada fotograma, cunto dura o cundo aparecer en la pelcula. Adems, en la parte inferior hay herramientas para trabajar con Papel cebolla e informacin sobre el Nmero de Fotograma actual (1 en la imagen), la Velocidad de los Fotogramas (24.0 en la imagen) y el Tiempo de pelcula transcurrido (0.0s en la imagen). A nivel conceptual, la Lnea de Tiempo representa la sucesin de Fotogramas en el tiempo. Es decir, la pelcula Flash no ser nada ms que los fotogramas que aparecen en la Lnea de tiempo uno detrs de otro, en el orden que establece la misma Lnea de tiempo.

LOS FRAMES
La animacin en Flash se basa en los frames o fotogramas. En el siguiente grfico podemos ver una captura del Timeline de Flash, donde aparecen diferentes tipos de frames. En la Capa4 vemos un frame que no contiene ningn elemento, es por tanto un frame vaco. En la Capa2 aparece una animacin hecha frame a frame, es decir el objeto cambia de propiedad en cada uno de los frames, por ejemplo en un frame tiene una posicin y en el siguiente otra, sin embargo en la Capa 1 hay un ejemplo sencillo de animacin que consta de slo 2 frames, que dar como resultado una animacin automtica, esta animacin se caracteriza por el color morado que adoptan los frames y por la flecha que la recorre. Como vers en el grfico, aparece un nuevo trmino, el keyframe o fotograma clave, es en estos keyframes donde se definirn los cambios de propiedades de los elementos de una movie, as por ejemplo, podemos definir que en el frame nmero 1 nuestro objeto tenga un tamao de de 100 y que en el frame 10, lo incremente un 120%, generndose automticamente una animacin cuyo resultado ser el cambio de tamao del objeto en cuestin.

Las modificaciones que se realizan en estos keyframes pueden ser de diversa naturaleza, como cambio de tamao, cambio de posicin, rotaciones, morphings,cambio en el color, en la opacidad, etc. Iremos avanzando en este sentido en los captulos siguientes.

Fotograma Clave: Son fotogramas con un contenido especifco, se crean, por tanto, para insertar en ellos un nuevo contenido no existente en la pelcula. Se identifican por tener un punto negro en el centro y cuando est vaco se le diferencia por una lnea negra vertical. Por ejemplo, en el ejemplo de la "pelota" que rebotaba en el suelo habra 3 Keyframes. Uno para cada posicin distinta de la pelota.

7.2 Barra de Herramientas en Flash

La barra de Herramientas puede dividirse en 4 partes: seleccin, creacin, transformacin, visualizacin, color y otras opciones. Antes de ver estas herramientas, debes saber que en Flash trabajamos con dos tipos de elementos: de pxel y vectoriales. Las herramientas de esta barra sirven para manipular y crear estos elementos.

Seleccin:

La flecha negra nos permite seleccionar objetos enteros, sobre todo aquellos elementos de pxel, para moverlos dentro de la mesa de trabajo, borrarlos o realizar otras acciones. Importante: cuando selecciones una forma con borde, ten en cuenta que para seleccionar el interior y el borde al mismo tiempo, debers hacer doble clic sobre la forma. De otra forma, haz un clic sobre el borde para seleccionar el borde, o uno sobre el interior de la forma para seleccionar esa parte. La flecha blanca selecciona vectores, movindolos o borrndolos. Nos permite cambiar la forma de un objeto vectorial. El lazo se usa para seleccionar elementos de pxel, tanto para borrarlos como para editarlos. Creacin:

La lnea nos permite crear lneas rectas. Para eso se debe hacer clic en un punto de la hoja. Mantn presionado el mouse y mueve el puntero para ver cmo se genera la lnea. Deja de cliquear cuando hayas obtenido la lnea que deseas. Si una sucesin de lneas generan una forma cerrada, esta forma pasar a ser un objeto y podr rellenarse con color, permitiendo adems otras opciones de edicin. La pluma sirve para crear objetos del tipo vectorial (ver imagen de la derecha), con la posibilidad de generar curvas. Es similar a la pluma que se ve en otros

programas de diseo, como por ejemplo el Illustrator. Para saber usar la pluma a la perfeccin es necesario un poco de prctica. Las herramientas de valo y rectngulo generan formas cerradas. Manteniendo presionada la tecla Shift del teclado, podrs crear crculos o cuadrados perfectos. De lo contrario, podrs lograr las dimensiones que quieras, seleccionando el objeto y modificando sus medidas en el cuadro de Propiedades. El lpiz y el pincel son muy parecidos. Con estas herramientas podemos crear lneas a mano alzada. Como ves en la imagen, mientras que el lpiz genera una lnea de borde, el pincel genera relleno y es un objeto en s mismo. Si el trazo del lpiz se une en un punto, se convertir en una forma que podrs rellenar. Al trazo de pincel es una forma llena a la que podemos darle borde. Dentro de esta barra de Herramientas est la opcin de Fuente, para insertar texto. Hay un captulo ms adelante sobre el tratamiento de

tipografas en Flash (Clase 16. Paciencia!), sin embargo podrs darte cuenta lo fcil que es incluir texto con este programa: slo debes seleccionar la herramienta y hacer clic en alguna seccin de la hoja de trabajo. Escribe lo que quieras. Luego podrs mover o rotar la caja de texto. Para editar el texto, tienes varias opciones en el cuadro de Propiedades. Transformacin:

La herramienta de Transformacin es una de las ms importantes porque nos permite rotar y modificar las dimensiones de cualquier objeto. Slo haz clic en la herramienta y luego sobre el objeto u objetos que quieras modificar. La herramienta de Gradiente se usa para editar gradientes, no para generarlos. Se selecciona la herramienta y se hace clic sobre el objeto que se quiera modificar. Podrs modificar las dimensiones del gradiente (la distancia entre un color y otro), la posicin y el ngulo. El Bote de tinta y el Cubo de pintura cumplen la funcin de colorear. El Bote de tinta colorea bordes; el Cubo de pintura colorea rellenos. El Gotero sirve para tomar colores de objetos ya existentes. De esta manera, si queremos pintar un objeto de otro color que ya se utiliz, tomamos el gotero y manteniendo presionado alt+shitf hacemos clic sobre el objeto del color que nos gusta. El color quedar seleccionado y lo podrs usar en la creacin de un objeto nuevo o para colorear uno que ya existe. Atencin: no funciona con gradientes! El Borrador borra cualquier objeto o parte de un objeto. Se puede modificar el grosor y forma del borrador desde la misma barra de Herramientas, en el sector Opciones. Tambin se puede elegir borrar selectivamente: slo relleno, slo borde, slo elementos seleccionados, etc. Visualizacin:

La mano te deja desplazarte por la pantalla a gusto y piacere. Prubalo, pero no hace falta recurrir a la barra de herramientas: presionando la barra espaciadora se habilita la opcin de mano. Es una herramienta muy til para trabajar en un espacio amplio. La Lupa te permite ampliar la pantalla en el sector que quieras. Sin embargo, se utiliza un atajo de la lupa que agiliza mucho el trabajo: presionando ctrl+barra espaciadora visualizars la lupa automticamente en su versin de ampliar. Haz clic sobre la pantalla en el punto que quieras ampliar. Para ampliar ms, haz otro clic. Si quieres reducir el zoom, haz lo mismo, slo que esta vez debers presionar ctrl+alt+barra espaciadora.

Colores: Desde el sector de Colores modificamos el color de relleno y de borde de cualquier objeto (lpiz para borde, cubo de pintura para relleno). Tambin puedes invertir estos colores (la opcin de las flechas): pasando a estar el del borde para el de relleno y al revs. El programa cuenta con colores predeterminados: borde negro y relleno azul (la opcin de los cuadraditos blanco y negro). Opciones: En el sector de opciones, se muestran opciones sobre las diferentes herramientas que vamos seleccionado. Es bueno prestar atencin a estas opciones ya que muchas veces nos simplifican el trabajo. En la imagen puedes ver un ejemplo con las opciones que se muestran cuando Tipos de textos Como ya hemos comentado, Flash distingue entre diversos tipos de textos y les da un tratamiento especial, segn el tipo que sean. Todos los tipos de textos responden a las propiedades comentadas en los puntos anteriores, y es en el Tipo de texto en lo que se diferencian. El tipo de texto se puede modificar desde el Panel Propiedades sin ms que haciendo clic sobre la pestaa Tipo de texto: . Texto esttico El Texto Esttico se caracteriza por no presentar ningn cambio a lo largo de la animacin. Es importante que no confundamos la palabra "esttico" con que el texto no se mueva o malinterpretemos la frase es el texto que no presenta cambios a lo largo de la animacin. Lo que queremos decir es que no cambia el contenido del recuadro de texto, es decir, que el texto puede estar animado (girar, cambiar de color...) y sin embargo ser esttico. As, un recuadro de texto en el que pone "Aprende Flash CS4" durante toda la pelcula, es esttico, aunque dicho texto cambie de posicin, forma o color. Sin embargo, si en ese mismo recuadro de texto pasa a poner "Con este Curso", este recuadro de texto NO es esttico. Se insistir en este punto en los ejercicios de evaluacin. Texto dinmico .

El Texto Dinmico en contraposicin al esttico s que puede cambiar su contenido (adems de estar animado). Su uso es bastante ms complejo que el del Texto Esttico, ya que cada recuadro de texto Dinmico puede ser una variable modificable mediante ActionScript, esto quiere decir que los valores y propiedades de este tipo de textos se pueden modificar mediante programacin, lo que nos saca del objetivo de este curso. Un uso comn que suelen tener es el de representar los textos introducidos mediante Textos de Entrada (ver siguiente punto). Tienen multitud de propiedades, accesibles desde el Panel Propiedades, se puede decidir el nmero de lneas que van a tener, se puede introducir texto HTML, se puede aadir fcilmente un borde al texto o dar nombre a la variable que represente al texto Dinmico. Una opcin interesante es el botn , que nos permite indicar qu caracteres incluir en el archivo SWF. Aqu debemos de indicar los carcteres que esperamos que muestre el texto dinmico.

7.3 Smbolos en Flash

Qu son los smbolos Los Smbolos provienen de objetos que hemos creado utilizando las herramientas que nos proporciona Flash CS4. Estos objetos al ser transformados en smbolos, son incluidos en una 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. Los smbolos nos resultarn fundamentales a la hora de crear nuestras animaciones.

Cmo crear un smbolo La accin de crear un nuevo smbolo es una de las ms usadas en Flash ya que es uno de los primeros pasos para crear una animacin, como veremos ms adelante. El procedimiento es el siguiente: 1. Seleccionamos el o los objetos que queramos convertir en un smbolo smbolo. Lo ms habitual es partir de una forma. 2. Abrimos a la ventana Convertir en smbolo, accediendo al men Insertar Nuevo Smbolo, desde le men contextual eligiendo Convertir en smbolo, o directamente con las teclas Ctrl + F8 o F8. 3. Una vez hecho esto nos aparecer una ventana como la mostrada en la imagen. Introducimos el nombre del smbolo que vamos a crear, y que nos permitir identificarlo en la biblioteca, lo que se har imprescindible cuando tengamos muchos smbolos.

4. Slo nos queda seleccionar el tipo de smbolo (desplegable Tipo) al que queremos convertir nuestro objeto. Podemos elegir entre Clip de Pelcula, Botn y Grfico. Sus caractersticas y las diferencias entre ellos las veremos en temas posteriores. Lo ms habitual es Clips de pelcula para los objetos que queremos mostrar en el escenario, y Botn si queremos que acte como tal. 5. Bastar con pulsar Aceptar para tener nuestro smbolo creado.

Practicas Para empezar vamos a ver lo que todos deseamos cuando iniciamos nuestra aventura en Flash, el movimiento de un objeto (esto puede ser cualquier cosa que tengamos sobre el escenario), una bola, un mono, un auto, una imagen lo que sea. Vern una diagonal cada vez que ponga una palabra en ingles/espaol. Tenemos dos clases de movimiento las cuales llamaremos cuadro a cuadro / frame to frame, e interpolacin de movimiento / motion tween. Empecemos por la animacin cuadro a cuadro: Este tipo de animacin todos la conocemos, es mas o menos como se realizan las caricaturas o dibujos animados, ya ven que para esto realizan un dibujo, y despus realizan el mismo dibujo pero un poco diferente, y as sucesivamente, despus los hacen pasar todos muy rpido, y esto nos da una sensacin de movimiento, bueno pues esto es lo que se hace en flash para hacer una animacin cuadro a cuadro, solo que aqu no tenemos que volver a dibujar la misma imagen varias veces, si no, que podemos trabajar con la misma, solo que la iremos modificando poco a poco. Veamos un ejemplo: Abran un archivo nuevo en flash, ahora dibujemos un circulo, como se muestra en la imagen, utilizando la herramienta de ovalo (muestro las herramientas en el tutorial de Flash por partes),

A continuacin nos dirigimos a la lnea de tiempo, e insertamos otro fotograma clave / key frame aparte del que ya esta (ya saben, puede ser con F6, o clic derecho, new key frame), entonces tenemos dos key frames en la lnea de tiempo, el primero es donde tenemos la bola como aparecer inicialmente, ahora damos clic en el segundo frame de modo que quede seleccionado, nos dirigimos a la bola, y la movemos un poco a la derecha, vamos a la lnea de tiempo e insertamos otro fotograma clave, y movemos otro poco la bola a la derecha, as repetimos esta accin como unas diez veces, hasta que nuestra bola quede del otro del escenario.

Ahora si, tenemos nuestro primer movimiento cuadro a cuadro, a continuacin lo que tienes que hacer es presionar y mantener presionada la tecla Control y presionar enseguida Enter (sin soltar control hasta que ayas presionado enter) para ver tu pelcula en accin, la pelcula va a realizar un ciclo, esto es que tu animacin se va a estar repitiendo y repitiendo sin fin, despus de ver tu animacin, puedes

presionar control + W para terminarla, o dar clic en la cruz superior de la derecha (hay dos cruces, es la de abajo).

Espero que te aya funcionado, si tienes alguna duda, no dudes en hacrmela llegar, yo te responder lo mas rpido que pueda. Bueno, ahora veamos lo que es La Interpolacin de Movimiento: Si recuerdan el pasado movimiento de la bola, me gustara, hacer el mismo pero ahora con interpelacin de movimiento o motion tween. Para comenzar vamos a ver primero lo que es un smbolo / symbol , para poder trabajar con interpolacin de movimiento en flash tenemos que utilizar smbolos, los cuales podemos crearlos convirtiendo objetos que tengamos en nuestro escenario (de objeto a smbolo), o crearlos vacos y posteriormente insertarles algo(esto es un poco mas difcil, as es que lo veremos mas adelante), pero vamos a ver los que creamos convirtiendo un objeto en smbolo. Volvamos dibujar la misma pelota (circulo) pero en una nueva pelcula, al igual que en el ejemplo anterior.

Nota: Cuando nosotros le ponemos Crear interpolacin de movimiento / create motion tween, automticamente Flash nos convierte nuestro objeto (que en este caso es la bola) en un smbolo, pero esto no es conveniente manejarlo as, as es que mejor nosotros crearemos nuestro propio smbolo para poder definirle un nombre y tipo de smbolo que queremos que sea. Muy bien, ahora que ya tenemos nuestra pelota, utilizaremos la herramienta flecha / arrow tool, y seleccionaremos la pelota dando clic en un lado de ella y arrastrndolo hasta cubrirla de esta manera:

y al soltar el clic del ratn se ver as: Esto es porque la bola lleva relleno y lnea en la orilla, y si solo le damos un clic puede ser que solo seleccionemos uno de los dos. Bueno, ya que tenemos la bola seleccionada, vamos existen dos maneras de convertirla en smbolo, la primera es ir al men en la parte de arriba, en la seccin de Insertar / Insert , escoges la opcin de Convertir en smbolo / convert to symbol, y la segunda forma es la mas fcil, solamente despus de que tenemos el objeto seleccionado tenemos que presionar F8 y listo, automticamente despus de cualquier de las dos formas pasadas veremos esta ventana:

Aqu es donde le daremos el nombre a nuestro smbolo, en la parte donde dice Name, colocaremos el nombre que le deseamos dar a nuestro smbolo, que este caso ser bola, dejamos el Behavior como esta, en Movie Clip (de esto dependen las propiedades que va a tener nuestro smbolo, pero eso lo veremos mas adelante), Registration tambin lo dejamos como esta, ya que este caso no lo vamos a utilizar, el Registration es como si le pusieras un clavo a tu smbolo, y al momento que quieres modificarlo a escala (el tamao), es hacia donde va a crecer, crecer al lado contrario de donde le pones el

clavo. Muy bien, ahora despus de ponerle el nombre demos clic en OK, y nuestra pelota se ver as:

Si tu pelota se ve de esta manera, Felicidades!, ya tienes un smbolo movie clip. Nota: Al momento que tu has creado tu smbolo o movie clip, pasa algo que te ayuda de mucho, automticamente este se agrega a tu librera. Y que es la librera?, pues la librera es una parte de flash, en donde se van guardando todos los smbolos que tu utilizas en la pelcula, de modo, que si necesitas otra pelota, no tengas que volver a dibujarla, si no, solamente tienes que insertarla desde la librera, talvez con la pelota no te parece tan maravilloso, pero que tal si tienes un auto con el cual te tardaste 3 horas dibujndolo, y ahora solo es cuestin de insertarlo de nuevo, pero esto no es todo, adems, puedes importar libreras que hiciste en otras pelculas, lo ves, eso es un auxilio muy grande, pero bueno, lo entenders mejor cuando empieces a trabajarlo. Y por ultimo, para ver la librera, el acceso rpido es presionando (Control + L). Muy bien, ahora que ya tenemos nuestro smbolo, vamos a ver la interpolacin de movimiento / motion tween: En este momento tenemos nuestra lnea de tiempo de esta manera:

A continuacin vamos a dar clic derecho en el frame / fotograma numero 40 de nuestra lnea de tiempo, y en el men contextual que sale, vamos a dar clic en la opcin de insert frame / insertar fotograma, y nuestra lnea de tiempo lucir as:

Dirigimos el puntero del ratn al primer frame / fotograma, y damos un clic derecho sobre el, en el men contextual que emerge seleccionaremos la opcin de create motion tween / crear interpolacin de movimiento y la lnea del tiempo se rellenara con una lnea punteada as:

Ahora ya tenemos nuestra interpolacin de movimiento, ya solo tenemos que indicar una cosa, el movimiento, y esto se hace de la siguiente manera: Demos un clic en el frame / fotograma numero 40, de modo que quede seleccionado (esto lo sabemos porque queda sombreado, de color negro). Ahora nos dirigimos al escenario / stage, y tomamos la bola con el puntero del ratn, la arrastramos hasta el otro extremo del escenario / stage, que quede de esta forma:

Como pueden ver en la lnea de tiempo se cre una flecha desde el frame / fotograma numero uno, hasta el numero 40, me supongo que ustedes ya lo haban visto verdad??, bueno, pues esta flecha indica interpolacin de movimiento, pero en si que es lo que ocurre con esto?, pues solamente hacemos que flash trabaje por nosotros, lo que pasa con la interpolacin de movimiento es que nosotros solamente indicamos el principio y el fin de nuestro smbolo, y FLASH CREA TODOS LOS FRAMES / FOTOGRAMAS INTERMEDIOS, muy bien, para entendernos mejor, por que no dejamos de una vez que corra nuestra pelcula?, vamos, presionemos (Control + Enter) para ver que pasa. Como ves, espero que ahora me entiendas mejor, cuando me refiero a que flash crea automticamente los frames intermedios. Una ultima cosa, colcate en frame 20 y arrastra la pelota un poco hacia abajo, veras que se crea otro punto negro (key frame / fotograma clave) en la lnea de tiempo, y ahora son dos flechas, muy bien, corre la pelcula para que veas que es lo que pasa. Sigue experimentando con estos movimientos todo lo que quieras, vers que solo depende de ti y tus ideas para darles un buen us Interpolacin por Forma Cuando lo que queramos no sea cambiar la posicin de un objeto en el escenario, sino su forma de manera progresiva (o ambas cosas a la vez), Flash 8 nos ofrece la tcnica de la Interpolacin por Forma, que consiste simplemente en ir transformando el contorno de un objeto creado en su interfaz hasta que sea igual que el contorno de otro objeto distinto.

Realizar una interpolacin por forma, es muy semejante a crear una interpolacin de movimiento. Flash genera fotogramas intermedios en los que va variando ligeramente la forma del fotograma anterior. As como hacamos en el tema anterior, slo necesitamos dos fotogramas clave. Colocaremos en el primer fotograma el objeto con su aspecto original, y en el ltimo la apariencia final que queremos que tenga. Esta vez, es importante destacar que para que una Interpolacin por Forma funcione como es debido aquellos objetos que intervengan debern ser objetos vectoriales (no smbolos Flash). Debemos tener tambin dos aspectos en cuenta: 1) Separar en distintas capas los objetos fijos y los que estarn animados. 2) Poner en distintas capas objetos que vayan a ser transformados con formas distintas, ya que Flash transformar todos los objetos vectoriales del primer fotograma en aquello que haya en el ltimo fotograma de la interpolacin. Si realizamos la interpolacin por forma correctamente la lnea de tiempos tendr este aspecto:

Las consideraciones sobre la velocidad y el nmero de fotogramas que vimos en las interpolaciones de movimiento se pueden aplicar tambin a la interpolacin por forma y a cualquier animacin hecha con Flash. Si hay algn fallo en los parmetros necesarios para que la interpolacin se ejecute bien, como por ejemplo, que uno de los objetos en capa sea un smbolo, se mostrar algo as en la lnea de tiempos:

Para crear una interpolacin de forma debers actuar de forma similar que para crear una de movimiento. Una vez tengas los fotogramas de inicio y fin de la animacin debers seleccionar todos los fotogramas que participen en ella y abrir el panel Propiedades.

All debers seleccionar la opcin Forma en el desplegable Animar. Y ya habrs terminado.

Fotograma Un fotograma viene a ser en Flash un instante o momento de una pelcula, es un equivalente a cuadro de un film. Cuantos ms fotogramas existan ms duracin tendr la pelcula flash. Es posible agregar, mover, eliminar, cortar, pegar y limpiar fotogramas. Al hacer un click derecho, sobre un fotograma Flash muestra un men contextual, como indica la figura.

Fotograma Clave (Keyframe) Son usados cuando se quiere realizar un cambio en determinado punto de la pelcula. Son usados cuando hay interpolacin de movimiento o interpolacin de forma. Cuando se inserta un fotograma clave, automticamente el contenido del fotograma anterior es trado a este nuevo punto de la pelcula.

Etiquetas de los fotogramas (Frame Label) Son usados para identificar algn fotograma en particular en la lnea de tiempo. Para ingresar una etiqueta se debe hacer un click en el fotograma y luego en el panel Propiedades ingrese el nombre de la etiqueta:

Velocidad de fotogramas o velocidad de la pelcula (Frame rate) Indica el nmero de fotogramas por segundo. Cuanto ms sea el nmero de fotogramas por segundo, la pelcula ser rpida y su duracin es menor. La Velocidad de Fotogramas afecta a toda la lnea de tiempo de la pelcula, no se puede hacer una seccin con una velocidad determinada. Haciendo [Ctrl+J] iremos hacia las Propiedades del Documento y podremos modificar la velocidad de los fotogramas.

La animacin en Flash Flash es un programa bsicamente orientado a la animacin, de ah la gran importancia de este tema. No obstante, para ir creando animaciones cada vez

ms complicadas se necesita, sobre todo, mucha prctica, aparte de conocer bien las herramientas. En este tema y los sucesivos mostraremos las tcnicas bsicas de animacin en Flash. La unin de estas tcnicas ser la que nos permita crear las ms variadas y vistosas animaciones. En el tema de la animacin, Flash ofrece unas facilidades muy grandes, consiguiendo efectos que normalmente requieren ciertos conocimientos y espacio de almacenamiento para ser creados, como es el caso por ejemplo de los GIF animados o lenguajes de programacin como JavaScript, de una manera muy sencilla, sin necesidad de excesivos conocimientos y ocupando muy poco espacio en disco. Aunque Flash ofrece tcnicas mejores, tambin se pueden crear animaciones a modo de GIF animado. Se les denomina animaciones Fotograma a Fotograma. Estas son las animaciones ms bsicas y conviene conocerlas. Para ello conviene visitar nuestro tema bsico: Animaciones Fotograma a Fotograma. A continuacin veremos distintos tipos de animaciones que el creador de pelculas Flash deber tomar como gua inicial. Cabe destacar que podremos aplicar varias de estas animaciones colocndolas en distintas capas. Con esto es con lo que conseguiremos los efectos ms espectaculares a la par que tiles. Desde el punto de vista del diseo general de una pgina web es muy importante tener claro un concepto: no se debe crear animaciones en pginas que no lo necesitan ni crear animaciones que distraigan al que visualice nuestros documentos de lo realmente importante, el mensaje. En esta versin de Flash CS4 ha habido un cambio importante en las animaciones, lo que hasta ahora se llamaba interpolacin de movimiento, pasa a llamarse interpolacin clsica y la interpolacin de movimiento actual es totalmente nueva, ms potente y verstil. . Interpolacin de movimiento Es la accin bsica de las animaciones en Flash. Permite desplazar un smbolo Flash de un lugar a otro del escenario, siendo necesarios nicamente dos fotogramas, lo que optimiza mucho el rendimiento de la pelcula.

Es importante destacar que para que una Interpolacin de movimiento se ejecute correctamente aquellos objetos que intervengan debern haber sido previamente convertidos a smbolos. Los grficos, clips de pelcula, textos y botones son algunos de los smbolos que se pueden interpolar. Tambin se debe tener cuidado al realizar una interpolacin con dos smbolos que se encuentren en la misma capa, ya que el motor de animacin los agrupar como uno slo y el resultado no ser el esperado. Por esto es conveniente asegurarse de dos cosas: 1. Separar en distintas capas los objetos fijos y los que estarn animados. 2. Poner tambin en distintas capas objetos que vayan a ser animados con direcciones o formas distintas. Pasemos pues al tema en cuestin. Una interpolacin de movimiento, como hemos dicho, es el desplazamiento de un smbolo de uno a otro punto del escenario. El hecho de que slo se necesiten dos fotogramas es debido a que Flash, nicamente con la posicin inicial y final, "intuye" una trayectoria en lnea recta y la representa (veremos que tambin se pueden realizar movimientos no rectilneos). Crearla es tan simple como hacer clic derecho sobre el fotograma que contiene los elementos y elegir Crear interpolacin de movimiento. Por defecto, se aadirn unos cuantos fotogramas, rellenos de un color azulado. Ahora vamos al fotograma final, o creamos uno clave donde nos plazca. Y desplazamos el smbolo. Veremos que aparece una lnea punteada, por defecto recta, que representa el trazado de la animacin. Cuando realicemos la interpolacin correctamente observaremos un aspecto como este en la lnea de tiempo.

Esto indica que la animacin cambiar la posicin del smbolo del fotograma 1 hasta la posicin del mismo smbolo en el fotograma 24, utilizando precisamente 24 fotogramas. El nmero de fotogramas que se usen en la

interpolacin indicar las subetapas de que constar la animacin. Cuantas ms subetapas ms sensacin de "continuidad" (menos saltos bruscos) pero a la vez menos velocidad en el movimiento. La velocidad en el movimiento de las pelculas la podemos cambiar tambin modificando su parmetro en la lnea de tiempo, pero esto no cambiar lo que hemos comentado anteriormente respecto al nmero de fotogramas. La velocidad est expresada en Fotogramas Por Segundo ( fps) y se puede modificar haciendo doble clic en el lugar que hemos indicado de la lnea de tiempo. A mayor valor ms velocidad, pero se deben poner siempre suficientes fotogramas para que se desarrolle la animacin como queremos. El trazado recto generado por defecto podemos modificarlo directamente haciendo clic y arrastrndolo, una vez seleccionada previamente la herramienta Seleccin .

En cualquier fotograma de la interpolacin podemos cambiar la posicin del smbolo (o cualquier otra propiedad), creando ah un fotograma clave de propiedad, que se representa por un pequeo rombo en la lnea de tiempo. La interpolacin de movimiento permite modificar muchos parmetros del movimiento mediante el Editor de movimiento, que veremos a continuacin. Color Anteriormente hemos visto que es muy fcil elegir un color de los selectores de color (ya sea para relleno o contorno) que hay en el panel de Propiedades (al seleccionar una forma) o en el grupo de Opciones (al activar una herramienta de dibujo)

Cada vez que picamos sobre estos selectores aparece la paleta Web predeterminada:

Desde este Selector de color podremos

Elegir un color establecido Crear un color personalizado Crear un color con canal Alfa (grado de transparencia) Esta misma paleta de colores la podemos encontrar en la solapa de Muestras de color (en Flash 8 dentro del panel Color)

Crear un color personalizado. 1. Abriremos la paleta predeterminada de colores picando sobre el Selector de color (el de relleno o contorno) 2. Con el cursor nos dirigiremos sobre el botn Editor de Color.

3. Se abrir el correspondiente cuadro de dilogo Color.

4. Editar un color desde este cuadro es muy intuitivo. Podemos partir del color que ya tena el selector o elegir uno de los Colores Bsicos de la izquierda... y despus: 1. Variar su tono y saturacin picando en el campo de Gamas de color. 2. Finalmente variar su luminosidad en la Barra de la derecha. 5. Para los ms "sibaritas" del color tambin tenemos la posibilidad de editar un color numricamente por dos parmetros diferentes:

Matiz (tono) / Saturacin / Luz: las tres caractersticas del color. Valor entre 0 - 240 Rojo / Verde / Azul: los tres canales de color en pantalla. Valor entre 0 255.

6. Una vez hayamos definido nuestro color podemos pulsar Aceptar y empezar a trabajar con l en el escenario... o podemos picar sobre el botn Agregar a los colores personalizados de la parte inferior. Y el color pasar a formar parte de la galera de Colores personalizados de este cuadro.

Selector de color Crear un color desde el Mezclador de color

Flash nos ofrece en la solapa/panel del Mezclador de colores el completo laboratorio que necesitamos para fabricar cualquier color. Nos debemos acostumbrar a su uso. 1. Abrimos dicha solapa desde la opcin de men Ventana > Mezclador de colores 2. ATENCIN: Debemos tener muy claro que el color con que estamos trabajando, del relleno o el contorno... activndolo en la casilla correspondiente. En este caso trabajamos sobre el color del relleno.

Tenemos el campo de la gama de colores, la barra de luminosidad y los valores numricos de RVA (Rojo, Verde y azul) y el hexadecimal... todo a mano en un mismo panel!!! Y ms posibilidades que tiene este panel que iremos viendo en esta leccin.

Aadir un color a la Muestra El color que hayamos construido con el Mezclador de colores podemos insertarlo dentro de la muestra predeterminada de colores... para que aparezca ya directamente en el selector de colores de relleno y contorno. 1. Una vez elegido el color pulsamos sobre el botn de Opciones de panel (en la esquina superior derecha del mismo)

... y elegimos la opcin Aadir Muestra...

2. A partir de ese momento el color formar parte de la lista predeterminada del Selector de colores y del Panel de Muestra de Color.

Para eliminar un color del panel de Muestra basta seleccionarlo y pulsar el botn de Opciones de ese panel (esquina superior derecha) y elegir la opcin Eliminar muestra. Paleta de colores Ya hemos visto cmo podemos colorear los contornos de las figuras y darles un relleno de color desde el cuadro Colores en la parte inferior del panel Herramientas o bien a travs de los comandos del panel Propiedades despus de activar la herramienta. Al picar sobre el icono de Color de relleno o Color de trazo se abre la paleta Web. Desde ella escogeremos el color con el que queramos pintar nuestro grfico.

Si bien a la hora de colorear disponemos de la paleta predeterminada, tenemos la opcin de personalizar o crear nuestro color y almacenarlo en la paleta de colores Web. Vamos, por lo tanto, a tratar los siguientes puntos:

Elegir un color establecido Crear un nuevo color para poder utilizarlo con posterioridad Crear un color con canal Alfa (grado de transparencia)

Hemos visto como podemos escoger los colores de relleno y contorno picando sobre los iconos correspondientes en el campo Colores de la parte inferior del panel Herramientas. Adems, los mismos iconos o botones de relleno y trazo los encontramos en el panel Propiedades y el panel Muestras de color. En todos los casos encontramos la paleta predeterminada de colores.

Elegir un color. 1. Picamos sobre el icono de Color de relleno o Color de trazo para abrir la paleta de colores. 2. Desplazamos el cursor en forma de Cuentagotas para escoger el color preciso. 3. Picamos para seleccionarlo y poder colorear o bien el trazo o el relleno del objeto, segn el icono que hayamos activado (de contorno o de relleno).

A pesar de disponer de la paleta de colores, es posible personalizarlos creando de nuevos. Crear un color desde la paleta predeterminada de colores. 1. Abriremos la paleta predeterminada de colores picando sobre los iconos Color de relleno o Color de trazo del panel Herramientas.

2. Con el cursor nos dirigiremos sobre el botn Color.

3. Picaremos para abrir el correspondiente cuadro de dilogo Color.

4. Seleccionaremos uno de los colores bsicos de la izquierda. El color se incluir en el pequeo cuadro de muestra de la parte inferior derecha.

5. Introducimos su componente en Rojo, Verde y Azul (valores decimales), o

Seleccionamos el color en la ventana del campo de colores, a la derecha del cuadro de dilogo, mostrndonos la nueva mezcla en los campos de Rojo, Verde y Azul. A la derecha del campo de colores tenemos el espectro con el que podremos variar la luminosidad o matiz del color escogido. 6. Una vez hayamos definido nuestro color, picaremos sobre el botn Agregar a los colores personalizados de la parte inferior. El color se mostrar a la izquierda, en el campo Colores personalizados.

7. Picamos sobre el botn Aceptar. El panel Mezclador de colores tambin nos brinda la posibilidad de personalizar nuestros colores y despus almacenarlos en la paleta predeterminada desde del panel Muestras de color. Almacenar el color personalizado en la paleta predeterminada Una vez hemos creado nuestro color, tenemos la opcin de almacenarlo en la paleta predeterminada de colores.

Ejecutamos el comando Agregar muestra del men del mismo panel Mezclador de colores Nos dirigimos sobre la zona gris por debajo de la paleta predeterminada del panel Muestras de color. El cursor tomar la forma de la herramienta Cubo de pintura. Picamos y nuestro color personalizado se almacenar en la paleta predeterminada de colores.

Para borrar un color personalizado ejecutamos el comando Eliminar muestra del men del panel Muestras de color.

El panel Mezclador de colores tambin nos permite crear colores Alfa, es decir, aplicar a los colores porcentajes de transparencia.

Colores alfa. 1. Seleccionamos el color que queramos aplicarle una transparencia. 2. En el panel Mezclador de colores, abriremos el selector de transparencia que se encuentra junto al campo Alfa o bien entraremos el valor, en porcentaje, directamente en el campo, sabiendo que el 100% es completamente opaco y 0% es transparente.

En la mitad superior del cuadro Muestra se visualiza el porcentaje de transparencia tomando como referencia una cuadrcula.

En la siguiente imagen se aprecia el efecto del color rojo del rbol con 50% de transparencia sobre el color verde. (Atencin, para poder conseguir este efecto los objetos deben estar en diferentes capas o agrupados).

Bordes y rellenos En este punto veremos las herramientas Bote de Tinta pintura del panel Herramientas. y el Bote de

Bote de pintura. Permite colorear los rellenos de los objetos . 1. Escogemos el color con el que queremos rellenar nuestro grfico. 2. Activamos la herramienta Cubo de pintura en el panel Herramientas. 3. Elegimos las caractersticas del cubo pulsando sobre los botones de la paleta que se despliega en la parte inferior del panel Herramientas. Estas

opciones nos permiten rellenar de color aquellos objetos que no tengan contornos completamente cerrados.

4. Picamos en el interior del contorno que queremos rellenar. En el caso del ejemplo rellenamos los contornos de un pequeo rbol.

Se puede apreciar que el contorno del tronco no est completamente cerrado. Por lo tanto, hemos activado la opcin Cerrar huecos grandes Bote de Tinta. Permite dar color a los contornos de un grfico. 1. Elegimos el color de Trazo. 2. Activamos la herramienta Bote de Tinta en el panel Herramientas. 3. Establecemos los atributos especficos de Contorno: el color, el grosor y el tipo de lnea. .

4. Pulsamos el borde de un grfico. En el ejemplo cambiamos los bordes del tronco y de la copa.

Borrador

La herramienta borrador

permite borrar tanto rellenos como bordes.

Haciendo doble click sobre esta herramienta se borra todo el fotograma. Para recuperar lo que hemos borrado, ejecutamos el comando Deshacer del men Edicin.

Para borrar una parte del fotograma actuaremos como sigue: 1. Activamos la herramienta Borrador en el panel Herramientas. 2. Elegimos las caractersticas del borrador pulsando sobre los botones de la paleta que se despliega en la parte inferior del panel.

3. Podemos elegir tamao del borrador, el mtodo de borrado y la posibilidad de borrar por igualdad o tonalidad de color . 4. Picamos y arrastramos sobre la superficie que queremos borrar.

Modos de borrado Tal y como hemos visto en el punto 2, la herramienta Borrador dispone de varias opciones de ejecucin.

Borrar Normal: picamos y arrastramos sobre la superficie que queremos borrar. Borrar Rellenos: slo borra los rellenos pero no borra los contornos. Borrar Lneas: slo borra las lneas o contornos pero no borra los rellenos. Borrar Rellenos Seleccionados: primero se seleccionan los rellenos con la herramienta Flecha y, de este modo, nos aseguramos de que slo se borrarn los rellenos que han sido seleccionados. Borrar Dentro: slo borra dentro del contorno. Para determinar cual es el contorno, tenemos que empezar a borrar dentro del contorno que delimitar el borrado.

Borrar por seleccin de color. Con la herramienta Grifo del punto seleccionado. 1. Activar la herramienta Borrador. 2. Activar la herramienta Grifo en el cuadro Opciones de la parte inferior del panel Herramientas. 3. Picar en una zona de color. En el ejemplo se borra la masa verde de la copa del rbol. , borramos las zonas que tiene el mismo color

7.4 Textos en Flash

Flash abarca todo aquello que nos pueda hacer falta a la hora de crear una animacin, y por tanto, tambin todo aquello relativo a los textos. Sin embargo, Flash fue concebido para crear animaciones grficas, de modo que tratar cualquier texto como si de un objeto ms se tratase, listo para ser animado a nuestro gusto. Esto nos permitir posteriormente animar textos y crear espectaculares animaciones con muy poco esfuerzo. Flash distingue entre 3 tipos de texto, texto esttico o normal, texto dinmico y texto de entrada (para que el usuario introduzca sus datos, por ejemplo), tambin se puede crear texto que soporte formato HTML etc... Propiedades de los textos Para poder escribir, deberemos hacer clic en la Herramienta Texto y posteriormente en el punto del escenario en el que queramos empezar a escribir. Para saber ms acerca de Cmo escribir textos visita nuestra Pgina Avanzada . El Panel Propiedades contiene las principales propiedades de todos los objetos que empleemos durante nuestra pelcula, de modo que si seleccionamos un texto, podremos ver en l todo lo que nos hace falta

conocer sobre nuestro texto, respecto a la anterior versin la interfaz de las propiedades de texto a cambiado considerablemente.

Panel Propiedades Veamos a fondo el Panel Propiedades:

Posicin y Tamao: Dado que Flash trata los textos como objetos, stos tambin tienen anchura, altura y coordenadas. Podemos modificarlos a nuestro gusto, pero debemos tener en cuenta que los caracteres no deben estirarse sin motivo, pues las tipografas son una parte muy importante y deben respetarse. Familia: Desde aqu, al igual que en los editores de texto ms comunes podemos seleccionar el tipo de letra o "fuente" que ms nos guste. Espaciado entre letras: Determina el espaciado

entre los caracteres. til cuando la tipografa que empleamos muestra las letras muy juntas o para dar efectos concretos al texto. Ajuste automtico: Activar esta casilla provoca que la separacin entre caracteres se realice de modo automtico.

Configuracin: Son las clsicas opciones que permiten convertir el texto en Negrita (B), Cursiva (I), cambiar el color del texto y el tamao.

Suavizado: Las opciones de suavizado resultan importantes a la hora de mostrar nuestro texto. Encontramos estas opciones:
o

Utilizar fuentes de dispositivo: Se emplean las fuentes de la impresora, lo que hace ms liviano el archivo SWF al no incluir la fuente. Aunque nos exponemos a que la fuente no est instalada, por lo que se emplear otra. Slo deberamos de utilizar esta opcin para las ms comunes. Texto de mapa de bits, no realiza suavizado, ocupando ms tamao y perdindose resolucin al redimensionar. Suavizado para animacin, pretendemos animar texto. es la mejor opcin cuando

o o

Suavizado para legibilidad, favorece la legibilidad, pero no debemos de emplearla en textos animados. Suavizado personalizado, nos permite ajustarlo manualmente.

Orientacin: Cambia la orientacin del texto de horizontal a vertical, tanto de izquierda a derecha como de derecha a izquierda. Seleccionable: Posicin: superdices. Vnculo: Determina si el usuario pordr seleccionar el texto. Nos permite convertir nuestro texto en subndices o en

Si queremos que al

pulsar sobre nuestro texto, el usuario vaya a una direccin web, nada ms fcil que escribirla ah. Flash la asociar al texto que ests escribiendo en ese momento.

Destino:

Determina si la URL a la

que el texto hace referencia se cargar en la misma ventana del navegador, en una nueva ... Comportamiento: Si el texto que

vamos a incluir es dinmico (de lo contrario aparece sin activar), esta opcin nos permite determinar cmo queremos que aparezcan las lneas (lnea nica, multilnea o multilnea sin ajuste).

Un Prrafo no es ms que un conjunto de caracteres con propiedades comunes a todos ellos. Estos prrafos admiten ciertas opciones que nos permiten trabajar con bloques de texto. El Panel Propiedades nos proporciona las siguientes opciones para trabajar con prrafos (entre otras). A la Izquierda: Todas las lneas empezarn tan a la izquierda como sea posible (dentro del recuadro de texto que hayamos definido). Centrar: Las lneas se distribuyen a la derecha y a la izquierda del punto medio del prrafo. A la derecha: Todas las lneas empezarn tan a la derecha como sea posible dentro del recuadro de texto que hayamos definido). Justificado: El texto se ensancha si es necesario con tal de que no quede "dentado" por ninguno de sus lmites. El resto de opciones nos permiten determinar los mrgenes (izquierdo y derecho), los sangrados de prrafo y el espacio interlineal.

Texto esttico El Texto Esttico se caracteriza por no presentar ningn cambio a lo largo de la animacin. Es importante que no confundamos la palabra "esttico" con que el texto no se mueva o malinterpretemos la frase es el texto que no presenta cambios a lo largo de la animacin. Lo que queremos decir es que no cambia el contenido del recuadro de texto, es decir, que el texto puede estar animado (girar, cambiar de color...) y

sin embargo ser esttico. As, un recuadro de texto en el que pone "Aprende Flash CS4" durante toda la pelcula, es esttico, aunque dicho texto cambie de posicin, forma o color. Sin embargo, si en ese mismo recuadro de texto pasa a poner "Con este Curso", este recuadro de texto NO es esttico. Se insistir en este punto en los ejercicios de evaluacin. Texto dinmico El Texto Dinmico en contraposicin al esttico s que puede cambiar su contenido (adems de estar animado). Su uso es bastante ms complejo que el del Texto Esttico, ya que cada recuadro de texto Dinmico puede ser una variable modificable mediante ActionScript, esto quiere decir que los valores y propiedades de este tipo de textos se pueden modificar mediante programacin, lo que nos saca del objetivo de este curso. Un uso comn que suelen tener es el de representar los textos introducidos mediante Textos de Entrada (ver siguiente punto). Tienen multitud de propiedades, accesibles desde el Panel Propiedades, se puede decidir el nmero de lneas que van a tener, se puede introducir texto HTML, se puede aadir fcilmente un borde al texto o dar nombre a la variable que represente al texto Dinmico. Una opcin interesante es el botn , que nos permite indicar qu caracteres incluir en el archivo SWF. Aqu debemos de indicar los carcteres que esperamos que muestre el texto dinmico. Al editar nuestra pelcula, distinguieremos los textos dinmicos por aparecer enmarcados en una lnea discontinua. Flash permite crear animaciones de texto tan interactivas como las que pueden crear con imgenes (ya hemos visto lo sencillo que es convertir un texto en un enlace a otra pgina web). An as, crear animaciones con textos, que sobrepasen a las que Flash incorpora por defecto (colores, transparencias, brillos, rotaciones, movimientos o combinaciones de estos) puede resultar un trabajo de muchsimas horas y mucha paciencia. Los resultados son increbles, pero puede resultar recomendable en estos casos usar algunos programas diseados con este objetivo. Entre otros destacan el Swish, el FlaX o el MiX-Fx, con ellos podrs crear efectos de texto asombrosos en pocos minutos, aunque no podrs gozar del entorno de Flash CS4 ni podrs emplear el resto de herramientas de que dispone. Incorporar Fuentes

Al crear un archivo de flash, y utilizar texto dinmico o textos de entrada, tenemos que tener presente que si hemos elegido una fuente que no est disponible en el sistema que se reproduce la pelcula, se sustituir por otra fuente disponible. Esto es un problema, ya que puede alterar bastante nuestro diseo. Para evitar esto, podemos incluir las fuentes que hemos empleado en nuestro proyecto. Esto garantiza que el texto se vea tal y como lo creamos, independientemente de las fuentes del sistema. Esto slo ser necesario hacerlo para los textos dinmicos , ya que el texto esttico se guarda como un grfico vectorial, y no habr problemas. Para incorporar una fuente en la pelcula hacemos clic derecho en alguna parte vaca de la Biblioteca, y seleccionamos Nueva fuente. Se abrir el siguiente cuadro de dilogo:

En el desplegable Fuente seleccionamos la fuente que deseamos utilizar. Seleccionamos los estilos que vamos a utilizar (Negrita, Cursiva y Tamao). El nombre que le demos se mostrar en la Biblioteca y estar lista para utilizarse. Cuando creemos un campo de texto dinmico o de entrada, seleccionamos nuestra fuente, que aparecer sealada con un asterisco (*).

De esta forma nos aseguramos que nuestro proyecto se ver tal cual lo creamos.

7.5 Botones en Flash

Los botones de flash son objetos grficos a los que podemos asignar diferentes estados (normal, sobre, presionado...) y que cuando los pulsemos (o pasemos por encima), se ejecuten determinadas acciones. Crear un botn en Flash Para crear un botn podemos primero dibujarlo, por ejemplo en el estado de reposo, y despus convertirlo en smbolo; para ello, una vez seleccionado, elegimos el men: "Insertar-Convertir en smbolo". Debemos escribirle un nombre, y elegir el comportamiento de Botn. Como somos de Salamanca, vamnos a hacer un tpico " Botn Charro":

Si abrimos la biblioteca ("Ventana-Biblioteca"), veremos que ya aparece dentro.

Ahora debemos disear los diferentes estados del botn, editando el smbolo. Para ello, haremos doble clic en el icono del botn (en la biblioteca), o bien "botn derecho-Editar", apuntando al botn que aparece en la escena. Lnea de Tiempo de un botn En la lnea de tiempos veremos que estamos modificando el botn, no la escena:

Podemos apreciar que en vez de fotogramas normales, como cualquier animacin de flash, disponemos de cuatro fotogramas "especiales":
Reposo es donde colocaremos el botn con su aspecto nortmal, es decir, cuando no est siendo apuntado por el ratn. es el aspecto que tendr cuando el ratn se pasa por encima, pero sin pulsar. se trata del botn mientras estamos pulsando el ratn en l. aqu definimos la zona donde el botn responder al ratn. Podemos crear un circular, pero que se active en una zona rectangular, por ejemplo. Es muy importante en los textos, puesto que si no se crear una zona activa, slo se detecta el ratn cuando est encima del trazo del texto en s, no en el espacio entre letras, ni en el medio de una letra "O", por ejemplo.

Sobre

Presionado

Zona activa

Para crear diferentes efectos en cada estado, podemos hacerlo de una forma fcil pero efectiva, partiendo del mismo dibujo, y cambiando slo el tono de color, por ejemplo. Tambin podramos trabajar con diferentes capas para crear otros objetos dentro de cada estado, por ejemplo, en "sobre" podemos crear el tpico "letrero" de fondo amarillo, donde aparece una frase explicando el resultado de pulsar el botn, o una pequea animacin del mismo botn, por ejemplo, cambiando su tamao, rotndolo, etc... Primero debemos insertar un fotograma clave en la posicin "Sobre".

Para hacer que aparezca ms tenue al pasar el ratn por encima, en el panel de efectos, eligiendo los parmetros que aparecen en esta imagen:

Insertando otro fotograma clave en la posicin "Presionado", podemos hacer otro cambio con estos parmetros, para darle otro efecto:

Si lo deseamos, podemos asignar una zona activa, creando en dicha posicin un fotograma clave, pero en este caso, no es necesario... Veamos a continuacin los diferentes estados del botn, despus de los cambios realizados:

Para usar el botn, basta con insertarlo desde la biblioteca a la escena. Practica para crear un botn en Flash Flash, nos permite crear botones personalizados, de manera muy rpida; a la vez nos ayuda a darle mas vida a nuestras pginas web; en pocas palabras, nos ayuda a hacer ms atractivo nuestro sitio y lgicamente eso es lo que queremos para aumentar el nmero de visitas a nuestro website.

Por medio de lenguajes de programacin (por ejemplo Javascript), tambin podramos crear botones, pero sera un poco ms complicado; adems no podramos crear exactamente los mismos efectos que podemos hacer con Flash. Empecemos: 1- Primero crearemos un nuevo smbolo, haciendo la siguiente combinacin de teclas: ALT+F8. Aparecer el siguiente cuadro:

2- En Nombre (Name), escribe "botn 1", en Comportamiento (Behavior) selecciona la opcin Botn (Button), finalmente haz click en

Aceptar

(OK).

Automticamente, seremos enviado desde la Escena 1 al escenario del smbolo "botn 1"; ah es donde crearemos un botn que ser incluido en nuestra biblioteca. El escenario nicamente para la creacin de botones, ser parecido a la siguiente imagen:

Mira hacia la lnea del tiempo (Timeline), como puedes notarlo es diferente a la lnea del tiempo de la Escena 1. La lnea del tiempo, del escenario para crear botones es parecida a la siguiente imagen:

Expliquemos el grfico anterior: Debemos entender que 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 click sobre l. Sobre: es cuando el mouse est colocado sobre el botn, pero an no se ha hecho click sobre l.

Presionado: lgicamente, es cuando haces click sobre el botn. Zona Activa: su mismo nombre lo indica, es cuando el botn est activo. Continuemos con la creacin de nuestro "botn 1". La cabeza lectora, en la lnea del tiempo tiene que estar sealando el estado de Reposo. 4- Haz click sobre la Herramienta de Rectngulo (Rectangle Tool), que se encuentra en el Panel de Herramientas. 5- Dibuja un rectngulo en el centro del rea de trabajo, y ponle el color azul. 6- Despus presiona la tecla F6; sto har que la cabeza lectora en la lnea del tiempo pase al estado Sobre. Como podrs notarlo, el botn se copia, as que no necesitars hacer un nuevo dibujo. 7- An estamos en el estado Sobre, si no tienes seleccionado el botn, hazlo (con la Herramienta Flecha y haz doble click sobre nuestro dibujo), luego dirgete a Color de Relleno que se encuentra en la seccin colores del Panel de Herramientas, y escoge el color rojo, como se muestra a continuacin:

8- Despus presiona nuevamente la tecla F6, para que la cabeza lectora pase al estado Presionado, y cambia el color de relleno de la misma forma que lo hicimos en el paso 7; y escoge un color verde. Finalmente presiona por ultima vez F6 para pasar al estado Zona activa, sto har que se copie el botn. Para este ltimo estado, no es realmente necesario cambiar el color de fondo. Con los colores que hemos aplicado, haremos que el botn cambie de color, cuando se lleven a cabo los Estados de los botones anteriormente descritos. Nuestro botn ha sido creado, as que puedes volver a la Escena 1,

abre la biblioteca y vers que ah esta el smbolo llamado "botn 1", podrs arrastrarlo al escenario las veces que quieras para hacer varias copias de l. Toma la Herramienta de Texto (A), y escribe lo que desees, despus coloca el texto sobre el botn creado; para probar la pelcula haz la tradicional combinacin de teclas CTRL + Enter. Si despus quieres ver la pelcula en tu explorador de internet, nicamente presiona las teclas CTRL + F12.