Está en la página 1de 39

Antologa Diseo e Imagen Digital II

Contenido
1. QU ES FLASH? ...................................................................................................................................... 3 2. POR QU USAR FLASH CS3? .................................................................................................................... 3 3. LA INTERFAZ DE FLASH CS3 ...................................................................................................................... 3 BARRA DE MENS ....................................................................................................................................... 4 LNEA DE TIEMPO ........................................................................................................................................ 5 CAPAS ......................................................................................................................................................... 5 ESCENARIO ................................................................................................................................................. 5 ZOOM ......................................................................................................................................................... 6 PANELES O VENTANAS ................................................................................................................................. 6 4. DIBUJAR Y COLOREAR .............................................................................................................................. 8 BARRA DE HERRAMIENTAS .......................................................................................................................... 8 PANEL COLOR ............................................................................................................................................ 10 PANEL MUESTRAS ..................................................................................................................................... 11 5. TRABAJAR CON TEXTOS ......................................................................................................................... 14 PROPIEDADES DE LOS TEXTOS .................................................................................................................... 14 TIPOS DE TEXTOS ....................................................................................................................................... 16 6. TRABAJAR CON SONIDOS ....................................................................................................................... 17 IMPORTAR SONIDOS ................................................................................................................................. 19 PROPIEDADES DE LOS SONIDOS ................................................................................................................. 19 INSERTAR UN SONIDO ............................................................................................................................... 21 EDITAR SONIDOS ....................................................................................................................................... 22 7. TRABAJAR CON OBJETOS ....................................................................................................................... 24 LOS OBJETOS ............................................................................................................................................. 24 SELECCIONAR ............................................................................................................................................ 24 COLOCANDO OBJETOS: PANEL ALINEAMIENTO ........................................................................................... 26 PANEL INFORMACIN ............................................................................................................................... 28 LOS GRUPOS ............................................................................................................................................. 29 8. CAPAS ................................................................................................................................................... 30

2 TRABAJAR CON CAPAS ............................................................................................................................... 31

1. QU ES FLASH?
Flash CS3 es una potente herramienta desarrollada por Adobe que ha superado las mejores expectativas de sus creadores. Inicialmente Flash fue creado por Macromedia (Adobe) con el objeto de realizar animaciones vistosas para la web, as como para crear GIFs animados. Los motivos que han convertido a Flash CS3 en el programa elegido por la mayora de los diseadores web profesionales y aficionados son varios.

2. POR QU USAR FLASH CS3?


Las posibilidades de Flash son extraordinarias, cada nueva versin ha mejorado a la anterior. Aunque su uso ms frecuente es el de crear animaciones sus usos son muchos ms. Son tantos, que todos los diseadores web deberan saber utilizar Flash. Flash ha conseguido hacer posible lo que ms se echa en falta en Internet: Dinamismo, y con dinamismo no slo nos referimos a las animaciones, sino que Flash permite crear aplicaciones interactivas que permiten al usuario ver la web como algo atractivo, no esttico (en contraposicin a la mayora de las pginas, que estn realizadas empleando el lenguaje HTML). Con Flash podremos crear de modo fcil y rpido animaciones de todo tipo.

3. LA INTERFAZ DE FLASH CS3


A continuacin se presenta la ventana de flash y sus partes, algunas otras ya se conocen.
BARRA DE MEN

CAPAS PA NE L DE HE RR A MI EN TA S

LNEA DEL TIEMPO

VENTANAS O PANELES

ESCENARIO

PANEL DE PROPIEDADES

Descripcin de cada interfaz:

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.

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: Te 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 encontrars las opciones de depuracin de la pelcula que te ayudaran a encontrar errores de programacin 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. Ayuda: Desde aqu podemos acceder a toda la ayuda que nos ofrece Adobe, desde el manual existente, hasta el diccionario de Action Script, pasando por tutoriales, lecciones guiadas etc...

LNEA DE TIEMPO
Representa una forma de ver los fotogramas de modo simplificado. Consta de 2 partes.

Fotogramas (frames) que vienen delimitados por lneas verticales (formando rectngulos) 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 (12.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.

CAPAS
Se puede definir como una pelcula independiente de un nico nivel. Es decir, una capa contiene su propia Lnea de Tiempo (con infinitos fotogramas). Los objetos que estn en una determinada capa comparten fotograma y por tanto, pueden "mezclarse" entre s. Esto es interesante a menudo, pero otras veces es conveniente separar los objetos de modo que no interfieran entre s. Para ello, crearemos tantas capas como sea necesario. El uso de mltiples capas adems, da lugar a pelculas bien ordenadas y de fcil manejo.

ESCENARIO
Sobre el escenario dibujaremos y colocaremos los diferentes elementos de la pelcula que estemos realizando. El escenario tiene unas propiedades muy importantes, ya que coinciden con las Propiedades del documento. Para acceder a ellas, hagamos clic con el botn derecho sobre cualquier parte del escenario en la que no haya ningn objeto y despus sobre Propiedades del documento:

Tamao: Determinan el tamao de la pelcula. El tamao mnimo es de 1 x 1 px (pxeles) y el mximo de 2880 x 2880 px. Fondo: Determina el color del fondode toda la pelcula. Velocidad deFotogramas: Determina el nmero de fotogramas por segundo que aparecern en la pelcula.

ZOOM
La Herramienta Lupa se emplea para acercar o alejar la vista de un objeto, permitiendo abarcar ms o menos zona del Entorno de Trabajo. Cada vez que hagamos clic en la Lupa duplicaremos el porcentaje indicado en el Panel Zooms. PANEL ZOOMS: Son un conjunto de accesos directos a Submens existentes en el Men Ver. Son muy tiles y ayudan a acelerar el trabajo cuando se emplean correctamente.

PANELES O VENTANAS
Son conjuntos de comandos agrupados segn su funcin (por ejemplo, todo lo que haga referencia a las acciones, ir en el Panel "Acciones"). Su misin es simplificar y facilitar el uso de los comandos. Estos paneles o ventanas se encuentran organizados en el lateral derecho del rea de trabajo. Pudindose expandir o minimizar con un clic de ratn. Si no estn visibles en el lateral derecho, puedes visualizarlos desplegando el men Ventana y haciendo clic sobre el nombre del panel que quieras mostrar. Para mejorar la experiencia del usuario, Flash permite cargar y guardar tus propias disposiciones de paneles, para que si en algn momento el entorno se vuelve un poco catico puedas recuperar tu configuracin elegida desde el men Ventana. Para ello debers acceder a la opcin Ventana Espacio de trabajo Guardar disposicin de paneles. Ahora slo bastar darle un nombre a la disposicin y ser accesible desde el mismo elemento de men Espacio de trabajo en cualquier momento. La funcin de los paneles de flash es: Panel Alinear: Coloca los objetos del modo que le indiquemos.

Panel Color: Mediante este panel creamos los colores que ms nos gusten. Panel Muestras: Nos permite seleccionar un color de modo rpido y grfico. (Incluidas nuestras creaciones). Panel Informacin: Muestra el tamao y las coordenadas de los objetos seleccionados, permitindonos modificarlas. Muy til para alineaciones exactas. Panel Escena: Modifica los atributos de las escenas que usemos. Panel Transformar: Ensancha, encoge, gira... los objetos seleccionados. Panel Acciones: De gran ayuda para emplear Action Script y asociar acciones a nuestra pelcula. Panel Comportamientos: Permiten asignar a determinados objetos una serie de caractersticas (comportamientos) que despus podrn almacenarse para aplicarse a otros objetos de forma rpida y eficaz. Panel Componentes: Nos permite acceder a los Componentes ya construidos y listos para ser usados que nos proporciona Flash. Los componentes son objetos "inteligentes" con propiedades caractersticas y muchas utilidades (calendarios, scrolls, etc...) Panel Cadenas: Mediante este panel Flash aporta soporte multi-idioma a nuestras pelculas. Panel Respuestas: Macromedia pone a nuestra disposicin ayuda y consejos accesibles desde este panel. Panel Propiedades: Nos muestra las propiedades del objeto seleccionado en ese instante, color de borde, de fondo, tipo de trazo, tamao de los caracteres, tipografa, propiedades de los objetos (si hay interpolaciones, etc...), coordenadas, tamao, etc... Panel Explorador de Pelculas: Nos permite acceder a todo el contenido de la pelcula.

EJERCICIO

Crear una cuadrcula que quedar visible al fondo del fotograma (posteriormente no saldr en la pelcula) y que nos servir como gua para poder dibujar objetos de forma exacta y precisa. 1 Pulsa en el men Archivo. 2 Selecciona la opcin Nuevo. 3 Aparecer una nueva pelcula. Si deseas crear la cuadrcula sobre una pelcula ya empezada, sltate los 2 primeros pasos. 4 Selecciona la opcin Cuadrcula del men Ver. 5 Se desplegar un submen como el de la figura.

6 Selecciona la opcin Mostrar Cuadrcula para hacerlo visible. 7 Selecciona la opcin Editar Cuadrcula para ajustar los parmetros de la cuadrcula a tu gusto (tamao, color de fondo...)

8 Selecciona la opcin Ajustes Ajustar a Cuadrcula del men Ver para que los objetos que crees se acomoden a las lneas de la cuadrcula, consiguiendo alinearlos de un modo fcil.

EJERCICIO

Practicar cmo se pueden cambiar algunos atributos fundamentales de las pelculas. 1 Haz clic con el botn derecho sobre el fondo de la pelcula. 2 Selecciona Propiedades del Documento. 3 En Unidades de Reglas selecciona Centmetros. 4 A continuacin selecciona Dimensiones y escribe en las casillas Anchura 22.46 y en Altura 16.84. 5 Pulsa en Aceptar y observa cmo cambia el tamao. Estas medidas equivalen a las estndar 640 x 480 px.

4. DIBUJAR Y COLOREAR
Cuando se disea una pgina web o una animacin el diseador pasa por muchas fases. Tras la fase de "Qu quiero crear y cmo va a ser" viene (normalmente) la fase de diseo grfico. Llevar lo que ha producido tu imaginacin al papel (en este caso al papel de Flash).

BARRA DE HERRAMIENTAS
Contiene todas las Herramientas necesarias para el dibujo. Veamos cules son las ms importantes y cmo se usan: Herramienta Seleccin (flecha) : Su uso principal es para seleccionar objetos. permite seleccionar los bordes de los objetos, los rellenos (con un slo clic), los bordes (con doble clic), zonas a nuestra eleccin. Herramienta Lnea : Permite crear lneas rectas de un modo rpido. Las lneas se crean como en cualquier programa de dibujo, se hace clic y se arrastra hasta donde queramos que llegue la lnea recta. Una vez creada la podemos modificar sin ms que seleccionar situar el cursor encima de los extremos para estirarlos y en cualquier otra parte cercana a la recta para curvarla. Herramienta Texto : Crea un texto en el lugar en el que hagamos clic. Sus propiedades se vern en el tema siguiente. Herramienta valo : Permite trazar crculos o elipses de manera rpida y sencilla. Puedes acceder a ella manteniendo el botn del ratn pulsado sobre la herramienta Rectngulo.

Herramienta Rectngulo : Su manejo es idntico al de la Herramienta valo, tan solo se diferencian en el tipo de objetos que crean. Herramienta Lpiz : Es la primera Herramienta de dibujo propiamente dicho. Permite dibujar lneas con la forma que decidamos, modificando la forma de estas a nuestro gusto. El color que aplicar esta Herramienta se puede modificar, bien desde el Panel Mezclador de Colores o bien desde el subpanel Colores que hay en la Barra de Herramientas. Herramienta Pincel : Su funcionalidad equivale a la del lpiz, pero su trazo es mucho ms grueso. Se suele emplear para aplicar rellenos. Se puede modificar su grosor y forma de trazo. Herramienta Cubo de Pintura : Permite aplicar rellenos a los objetos que hayamos creado. Al contrario que muchos otros programas de dibujo, no permite aplicar rellenos si la zona no est delimitada por un borde. El color que aplicar esta Herramienta se puede modificar, bien desde el Panel Color o bien desde el subpanel Relleno que hay en la Barra de Herramientas. Herramienta Borrador : Su funcionamiento es anlogo a la Herramienta Pincel. Pero su funcin es la de eliminar todo aquello que "dibuje". HerramientaLazo : Su funcin es complementaria a la de la Herramienta Flecha, pues puede seleccionar cualquier cosa, sin importar la forma, (la Herramienta Flecha slo puede seleccionar objetos o zonas rectangulares o cuadradas). En contrapartida, la Herramienta Lazo no puede seleccionar rellenos u objetos (a menos que hagamos la seleccin a mano). Al seleccionar esta Herramienta, en el Panel de herramientas aparecen estos botones: . Esto es la Herramienta Varita Mgica, tan popular en otros programas de dibujo. Permite hacer selecciones segn los colores de los objetos. El tercer dibujo que aparece es este: permite hacer selecciones poligonales.

Herramienta Pluma : Crea polgonos (y por tanto rectas, rectngulos...) de un modo sencillo. Mucha gente encuentra esta herramienta complicada, aunque es una de las ms potentes que ofrece Flash. Su empleo consiste en hacer clic en los lugares que queramos definir como vrtices de los polgonos, lo que nos asegura una gran precisin. Para crear curvas, hay que sealar los puntos que la delimitan y posteriormente trazar las tangentes a ellas. Con un poco de prctica se acaba dominando. Herramienta Subseleccionador : Esta Herramienta complementa a la Herramienta Pluma, ya que permite mover o ajustar los vrtices que componen los objetos creados con dicha herramienta. Herramienta Bote de Tinta : Se emplea para cambiar rpidamente el color de un trazo. Se aplica sobre objetos, si tienen borde, cambia al color mostrado de dicho borde, por el mostrado en el Panel Mezclador de Colores (que coincide con el subpanel Colores que hay en la Barra de Herramientas.)

10

Herramienta Cuentagotas podamos utilizarlos.

: Su misin es "Capturar" colores para que posteriormente

Algunas Herramientas poseen unas opciones especiales que facilitan y potencian su uso. Para acceder a estas utilidades, a veces no basta con hacer clic en la Herramienta correspondiente. La forma de acceder a este Submen consiste en hacer clic en la lnea o en el objeto que has dibujado. Entonces aparecer (o se iluminar si ya estaba presente) un submen como este: Ajustar a Objetos : Se usa para obligar a los objetos a "encajar" unos con otros, es decir, para que en caso de ser posible, sus bordes se superponga, dando la sensacin de estar "unidos". Suavizar : Convierte los trazos rectos en lneas menos rgidas.

Enderezar : Realiza la labor inversa. Convierte los trazos redondeados en ms rectilneos. Tinta : Hace que el trazo sea exactamente el que se realiz con el cursor. Apto para paletas digitales.

EJERCICIO

Crear un valo con las medidas y la forma que queramos 1 Pulsa sobre la Herramienta valo que se encuentra en la Barra de Herramientas.

2 Sita el cursor del ratn en el Escenario (dentro del fotograma actual). 3 Haz clic y arrastra el ratn hacia el lugar que desees. Observars que el movimiento de tu ratn provoca la creacin de un valo (figura 1). Cuando el valo tenga la forma deseada, suelta el ratn. El resultado ser similar al de la figura 2. Truco: Si quieres crear un crculo perfecto, mantn pulsada la tecla SHIFT mientras das forma al valo. (Sucede igual con la Herramienta Rectngulo) Figura1 Figura 2 4 Guarda el archivo como ovalo.fla

PANEL COLOR
Como su nombre indica se usa para fabricar nuestros propios colores y para seleccionar los que ms nos gusten. Para seleccionar un color determinado, bastar con hacer clic en las pestaas que se encuentran junto a los iconos de las Herramientas de Lpiz y de Bote de Pintura. (Si queremos modificar el color de un borde, pulsaremos sobre la pestaa que est junto a la Herramienta Lpiz y si queremos modificar un

11

relleno, haremos clic en la pestaa que est junto a la Herramienta Bote de Pintura.) Al hacerlo aparecer un Panel con multitud de colores para que seleccionemos el que ms nos gusta. Tambin permite introducir el cdigo del color segn el estndar que establece el HTML. Tambin se puede determinar el tipo de relleno que aplicaremos a los objetos creados (mediante la Herramienta Bote de Pintura). Se pueden crear diferentes tipos de Rellenos Slido: Consiste en un relleno formado por un solo color. Degradado Lineal: Es un tipo especial de relleno, de modo que un color se degrada hasta convertirse en otro. Puede ir de arriba abajo o de un lado al otro. Degradado Radial: Es igual que el anterior, pero los degradados tiene forma circular. Mapa de Bits: Permite colocar como relleno alguna imagen existente en la pelcula o ajena a ella si antes se "importa".

PANEL MUESTRAS
Sirve para poder ver de un modo rpido y claro los colores de que disponemos, tanto slidos (un solo color) como degradados (lineales o radiales). Adems, cuando creemos un color mediante el Panel Color, podremos agregarlo a nuestro conjunto de muestras mediante Agregar Muestra (que se encuentra en un men desplegable en la parte superior derecha del Panel Color). Una vez est agregado el color, pasar a estar disponible en nuestro conjunto de muestras y podremos acceder a l rpidamente cada vez que trabajemos con nuestra pelcula. Cada pelcula tiene su propio conjunto de muestras y cada vez que la abramos para editarla, podremos usar las muestras que tenamos la ltima vez que trabajamos con dicha pelcula.

EJERCICIO

Dar color a un valo. Tanto a su interior como a su exterior 1 Abre el archivo que creamos en el ejercicio anterior ovalo.fla 2 Hacemos clic en el interior del valo o en su borde. Depender de la zona cuyo color queramos modificar.Obtendremos algo similar a la figura 1 o a la 2.

Seleccionamos el Interior del valo

Seleccionamos el Borde del valo

12

3 Una vez hecho esto, nos fijamos en el Panel de Muestras, que se encuentra en el lateral derecho del rea de herramientas y seleccionamos el color que nos guste. Para modificar el color del Interior del valotambin podemos seleccionar un color directamente haciendo clic sobre el Panel de Colores existente en el Panel de herramientas junto a la imagen del "Bote de Pintura". O si deseamos modificar el borde, sobre el Panel existente junto al "Lpiz".

EJERCICIO

Crear un objeto cuyo color sea transparente, de modo que se vean los objetos que haya detrs 1 Crea un rectngulo. 2 Seleccionamos el relleno del Rectngulo y modificamos el valor Alfa desde el Panel de Herramientas o desde el panel Propiedades. Por ejemplo, escribimos un valor de 45%.

Rectngulo Azul

Ahora con Transparencia

El efecto alfa trabaja de forma que si situamos cualquier objeto o imagen detrs de l, podemos ver como un efecto de transparencia que mostrar parte de lo que se encuentre detrs de nuestro relleno.

13

14

5. TRABAJAR CON TEXTOS


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.

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

Fuente: 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: Determina el espaciado entre los caracteres. til cuando la tipografa que empleamos muestra las letras muy juntas o para dar efectos concretos al texto. Direccin del Texto: Cambia la orientacin del texto de horizontal a vertical, tanto de izquierda a derecha como de derecha a izquierda. Ajuste automtico entre caracteres: Activar esta casilla provoca que la separacin entre caracteres se realice de modo automtico. Posicin: (o dejarlo normal). Nos permite convertir nuestro texto en subndices o en superdices

URL: 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 ...

15

Tipo de Lnea: 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). Configuracin: Son las clsicas opciones que permiten convertir el texto en Negrita (B), Cursiva (I), cambiar el color del texto y el tamao. Otras Propiedades: 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.

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

EJERCICIO

Crear un texto cualquiera y asgnale las propiedades que ms nos interesen. 1 Abre el archivo nuevo 2 Creamos una nueva capa (ya veremos ms adelante para que sirven) haciendo clic en el botn en la lnea de tiempo. 3 Hacemos clic en la Herramienta Texto y despus en el escenario. 4 Veremos esta imagen . Escribe dentro el texto Esto es un texto de prueba.

5 Hacemos clic en el Propiedades, si es que tenamos minimizado este Panel. 6 Haz que el texto se encuentre centrado haciendo clic en 7 Cambia la fuente del texto . a Verdana seleccionndola en el desplegable

16

8 Cambia el espaciado entre caracteres del texto a 2 escribindolo en la opcin

9 Por ltimo cambia el tamao del texto a 30 y ponlo en Negrita utilizando estos controles: .

TIPOS DE TEXTOS
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: 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 CS3" 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. Los textos estticos slo tienen 2 propiedades extras: a) Usar Fuentes del Dispositivo: Esta opcin permite que la pelcula Flash emplee las Fuentes que tenga instaladas el usuario que ve la pelcula en su ordenador. Si dicho usuario dispone de las fuentes que hemos utilizado en la pelcula, la ver exactamente como queremos que la vea, pero si no las tiene, Flash emplear la fuente que ms se le parezca. Esto muchas veces lleva a que el resultado final (el que ve el usuario) no se parezca al que pretendamos, por lo que suele ser conveniente mantener esta opcin sin seleccionar, aunque esto conlleve un mayor tamao de la pelcula final. b) Seleccionable: Con esta opcin activada el usuario podr seleccionar los textos que aparezcan en la pelcula (cortarlos, copiarlos...) Actvala si lo crees conveniente. TextoDinmico: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.

17

Texto de Entrada: Tiene bsicamente las mismas propiedades que el Texto Dinmico, junto con algunas propias de un tipo de texto orientado a la introduccin de datos por parte de usuario, como por ejemplo el nmero mximo de lneas que puede introducir en ese campo de texto o si queremos que lo que el usuario escriba en dicho campo aparezca como asteriscos (para las contraseas). Evidentemente este tipo de texto se reflejar en nuestra pelcula como un recuadro de texto SIN contenido, ya que lo deber introducir el usuario. Este tipo de texto se puede combinar con el Texto Dinmico.

EJERCICIO

Crear un texto cualquiera y asignarle el Tipo que ms nos interese. 1 Abre el archivo del ejercicio anterior 2 Selecciona el texto que creamos en el ejercicio anterior. 3 Hacemos clic en el Propiedades, si es que tenamos minimizado este Panel. 4 Una vez podamos ver el Panel seleccionamos la Pestaa en la que pondr el tipo de texto y elegimos el tipo de texto que queramos. Veremos que, al hacer clic fuera del texto, cambia la lnea que rodea al recuadro de texto, pasando a ser discontinua y no desapareciendo aunque no escribamos nada dentro. (Los textos estticos desaparecen si no escribes nada y haces clic en cualquier lugar del escenario). Esto es lgico, ya que los textos Dinmicos y los de entrada no tienen por qu tener "contenido"

6. TRABAJAR CON SONIDOS


Quin sera capaz de ver una pelcula muda? Y una animacin espectacular sin sonido? Hasta hace poco, los nicos sonidos que oamos en las pginas web eran los famosos "midis", de escaso tamao y de escasa calidad. De hecho, eran slo instrumentos musicales sin voz, de ah su pequeo tamao (y calidad). Aun as, siempre exista algn creador de pginas web que se aventuraba a poner algn sonido complejo (.wav o .mp3) en su pgina web, por desgracia, su carga es tan lenta, que la mayora de los visitantes se iran de la pgina sin llegar a escucharla. Hoy, gracias a las conexiones de banda ancha orientadas a contenido multimedia, poner sonido a las pginas web es un poco ms fcil, qu aporta FLASH?

18

Flash nos permite insertar cualquier sonido que queramos en nuestras pelculas (.wav, .aiff, .mp3, etc...) de forma fcil y muy efectiva, ya que es capaz de acelerar la descarga del sonido siempre y cuando se descargue junto con nuestra pelcula. Podemos dar a la pelcula efectos simples (el tpico "clic" al pulsar un botn), efectos complejos (msica de fondo) e incluso podemos hacer que la animacin se desarrolle conjuntamente con una msica (si bien esto ltimo necesitara que toda la pelcula estuviera descargada previamente, para evitar "atascos" durante el desarrollo de la animacin). En definitiva, Flash nos lo vuelve a poner fcil. Pero los sonidos ms utilizados son: .wav y .mp3, los cuales consisten en: SONIDOS WAV: Son sonidos con extensin .wav, con una calidad muy buena, concretamente, su calidad es unas 13 veces inferior a un sonido original, cantidad ms que aceptable si tenemos en cuenta que, por ejemplo, el sonido de una llamada telefnica es 100 veces peor que el sonido original y un sonido que escuchamos por la radio (FM), es unas 24 veces peor que el original. Partiendo de ah, comprenderemos que el espacio que ocupa en el disco duro sea muy grande. Es necesaria tanta calidad? Es necesario siempre que el sonido sea completamente limpio? Evidentemente no, y es por esto que surgen otros formatos de audio, otros formatos que sin perder mucha calidad, consigan ahorrar espacio en el disco duro (y en nuestras pelculas Flash) y den flexibilidad a estos sonidos que antes era imposible manejar dado su tamao. (Una cancin de 4 minutos de duracin ocupa 50 MBytes en formato WAV). SONIDOS MP3. Su extensin es .mp3, es una tecnologa de compresin de archivos de audio. Su nombre completo es MPEG-1 Audio Layer 3 y surgi hace unos 15 aos con el objeto de reducir el enorme tamao que ocupaban hasta entonces los archivos de audio como son los sonidos .WAV. MP3 consigue combinar calidad de sonido con un tamao de archivo pequeo, convirtindose en un standard de audio en Internet. Su clave se encuentra en que un sonido MP3 no contiene todos los detalles del audio que no son captables por el odo humano y que s que estn en los sonidos originales. Es decir, si un detalle del sonido no puede ser escuchado por el odo humano, por qu no eliminarlo? Y as se hace, el resultado es un sonido prcticamente idntico (muchas veces completamente idntico, depende del grado de compresin aplicado) al sonido original. A este sonido sin informacin innecesaria, se le aplican unos mtodos de compresin muy potentes y el resultado final es un archivo de audio MP3, con una calidad buena y un tamao muy reducido, por ejemplo, una cancin de 4 minutos pasa a ocupar slo 3,9 MBytes, lo que nos permite almacenar un nmero casi ilimitado de canciones en nuestro ordenador, en CDs o trabajar con ellas en Internet.

NOTA: Flash no puede importar sonidos en formato MIDI (.mid). Aun as, si estamos empeados en que en nuestra animacin el sonido sea un MIDI y no queremos o podemos conseguir un programa que convierta el sonido MIDI a WAV o MP3.

19

IMPORTAR SONIDOS
Se puede hacer con sonidos, grficos, e incluso con otras pelculas Flash. Importar por tanto, no es ms que decirle a Flash que aada un determinado archivo a nuestra pelcula, para que podamos usarlo cuando queramos. En realidad, lo aade a nuestra Biblioteca, que es el Panel en el que estn todos los objetos que participan en la pelcula (este Panel se ver ms adelante). As pues si queremos manejar un sonido en nuestra pelcula, deberemos importarlo previamente.Una vez est importado, podremos usarlo con total libertad. Para importar un sonido haz clic en el men Archivo Importar Importar a biblioteca. Se abrir el cuadro de dilogo de Importar a biblioteca. All debers seleccionar en Tipo de archivo Todos los formatos de sonido. Navega por las carpetas hasta encontrar el archivo de audio que quieras incluir en tu pelcula. Seleccinalo haciendo clic sobre l y haz pulsa el botn Aceptar. El sonido estar listo para usarlo donde quieras, podrs encontrarlo en la Biblioteca (men Ventana Biblioteca).

PROPIEDADES DE LOS SONIDOS


Todo lo referente a los sonidos lo podemos editar desde el Panel Propiedades. Aqu tenemos todo lo necesario para insertar, modificar y editar el sonido que acabamos de importar. Si no hemos importado ningn sonido, nos daremos cuenta de que no podemos seleccionar nada en dicho panel, basta insertarlo para que esto cambie. Para que aparezca la posibilidad de trabajar con sonidos, deberemos hacer clic en algn fotograma de nuestra pelcula, tras hacer esto, el Panel Propiedades toma el siguiente aspecto:

Sonido: En esta pestaa nos aparecern las canciones que tenemos importadas, deberemos seleccionar la cancin que pretendamos aadir a nuestra pelcula. Efecto: Desde aqu podremos aadir algn efecto a nuestro sonido, como por ejemplo que el sonido pase del canal izquierdo al derecho (esto crea la sensacin de que el sonido te envuelve ya que lo oyes por un sitio y luego por otro, aunque queda muy lejos de los verdaderos sonidos envolventes), que el volumen aumente progresivamente etc... Si deseamos aadir complejos efectos sonoros, deberemos tratar adecuadamente el sonido con algn programa creado especficamente para este propsito antes de importarlo. EditarSe tratar en ms profundidad estos efectos. Sinc: Esta opcin nos permite determinar en qu momento comenzar a actuar nuestro sonido, estas son las opciones que tenemos:

20

a) Evento: Sincroniza nuestro sonido con un evento determinado. Es la opcin por defecto y provoca que el sonido se empiece a reproducir al pasar la pelcula por el fotograma en el que est situado. Tambin se puede sincronizar el sonido con botones y los dems tipos de smbolos. b) Inicio: Su funcionamiento es equivalente al de "Evento", se diferencian en que si est seleccionado Inicio en vez de Evento y se reproduce otra vez el mismo sonido u otro distinto, lo hace "encima" del sonido actual. Puede ser un efecto muy atractivo, o puede provocar que se forme "ruido" en nuestra pelcula. c) Detener: Detiene el sonido seleccionado. d) Flujo: Esta opcin sincroniza el sonido con el o los objetos con los que est asociado, por tanto, si la carga de la pelcula es lenta y las imgenes no fluyen adecuadamente, el sonido se detendr para sincronizarse con ellas. Este efecto puede dar la sensacin de que la pelcula se corta de un modo muy brusco (pensar en que se considera normal que una imagen tarde en cargarse, pero si se detiene un sonido mientras se reproduce, produce una reaccin muy negativa en los que pueden estar viendo nuestra pelcula). Por otra parte, es un efecto muy adecuado para algunas situaciones, por ejemplo, el efecto de que un personaje hable durante una pelcula. En esta situacin, es muy recomendable que el sonido y las imgenes estn sincronizadas. Repetir: Determina el nmero de veces que se reproducir el sonido segn lo que escribas en la caja de texto de la derecha. Tambin puedes seleccionar Reproducir indefinidamente para que el sonido se reproduzca en un bucle hasta llegar al siguiente fotograma clave.

NOTA: No es recomendable insertar sonidos con la opcin Flujo y a la vez la de Repetir, ya que al estar sincronizados los sonidos con las imgenes, provocaramos que las imgenes (y los fotogramas que las contengan) se dupliquen tambin, aumentando considerablemente el tamao de la pelcula.

EJERCICIO

Insertar un sonido que se prolongue hasta el fotograma 5. 1 Creamos la pelcula mediante Archivo Nuevo (por defecto tendremos un nico fotograma). 2 Seleccionamos el fotograma 1. 3 Insertamos un nuevo fotograma en la lnea de tiempo. En la posicin 5 (desde el Men Insertar Lnea de Tiempo Fotograma Clave). 4 Seleccionamos Importar Importar a Biblioteca, que se encuentra en el Men Archivo. 5 Se abrir la clsica ventana de Windows para buscar un archivo. Busca un archivo de msica con extensin .mp3 y pulsamos Abrir.

21

6 El sonido ya est insertado. Hacemos clic en el Panel Biblioteca (Ventana Biblioteca) y comprobamos que se encuentra all. 7 Seleccionamos el fotograma 1 (donde queremos insertar el sonido). 8 Despus seleccionamos el sonido en el Panel Biblioteca y lo arrastramos hasta el escenario (hasta el fotograma actual). 9 Abrimos el Panel Propiedades y seleccionamos los fotogramas del 1 al 4. 10 En la opcin Sinc seleccionamos Flujo. 11 Acabamos de conseguir que el sonido slo se reproduzca cuando est en los fotogramas indicados.

INSERTAR UN SONIDO
Supongamos que queremos insertar un sonido en un fotograma determinado, de modo que cuando la pelcula Flash llegue a este fotograma comience a reproducirse el sonido. Para que un sonido se reproduzca al llegar a un fotograma, deberemos seleccionar el fotograma en el que queremos que empiece a reproducirse el sonido. Una vez all, abriremos el Panel Propiedades e importaremos el sonido que queramos del modo visto en el punto anterior. Otro modo ms rpido an consistira en seleccionar dicho sonido en la Biblioteca y arrastrarlo al fotograma en el que queramos que se empiece a reproducir el sonido (al fotograma, no a la lnea de tiempo).

As representa Flash los sonidos insertados en Fotogramas De este modo insertamos un sonido, pero suena tal y cmo queremos que suene? ... Depende de lo que busquemos. Por defecto Flash entiende que quieres reproducir el sonido en su totalidad, sino para qu insertarlo entero?, de modo que Flash reproducir el sonido todas las veces que le hayas indicado en Repetir y el sonido sonar aunque el fotograma en el que est no sea el que se est ejecutando en ese instante. Si quisiramos que el sonido pare cuando entremos en otro fotograma, lo podemos hacer de 2 formas distintas, ambas combinando las opciones que nos ofrece el Panel Propiedades. La primera de ellas es seleccionarlo en la Biblioteca y arrastrarlo directamente sobre el escenario. El sonido se aadir al fotograma en el que nos encontramos. Otra opcin sera la de seleccionar el sonido (ya importado a nuestra biblioteca) desde el Panel Propiedades del fotograma seleccionado:

22

En la opcin Sonido seleccionaramos el audio que queremos aadir al fotograma. Luego modificaramos la opcin Sinc., del siguiente modo: Si seleccionamos Flujo, el sonido se reproducir hasta llegar al primer fotograma que no lo contenga. Podemos seleccionar Detener para marcar un fotograma de modo que el sonido se detenga al llegar a l.

EDITAR SONIDOS
Flash no fue creado como un editor de sonidos, por lo que su potencia en este campo es limitada. Aun as, los efectos que permite aplicar de un modo sencillo suelen ser suficientes para cualquier animacin que queramos realizar. Se disponen de estos efectos: Canal Izquierdo: El sonido tan slo se escuchar por el altavoz izquierdo. Canal Derecho: El sonido tan slo se escuchar por el altavoz derecho. Desvanecimiento de izquierda a derecha: El sonido se reproduce inicialmente en el altavoz izquierdo para luego pasar al derecho. Desvanecimiento de derecha a izquierda: El sonido se reproduce inicialmente en el altavoz derecho para luego pasar al izquierdo. Aumento Progresivo: El volumen de nuestro sonido aumenta progresivamente. Desvanecimiento: El volumen de nuestro sonido disminuye progresivamente. Personalizado: Esta opcin nos permite "editar" el sonido de un modo rpido y sencillo. Desde este editor podemos decidir qu volumen tendr nuestro sonido y en qu altavoz. Podemos crear los efectos anteriores ajustndolos a nuestro gusto y podemos crear efectos ms complejos a nuestra medida.

Esta es la apariencia del cuadro de dilogo Personalizar Sonido. La parte superior representa el efecto. Entre las 2 partes hay una lnea de tiempo que nos indica el tiempo de sonido transcurrido en cada punto. Las lneas grises representan el volumen del sonido y haciendo clic en ellas podemos configurar este volumen. En el ejemplo, el Aumentoprogresivo se reproduce en silencio, para poco a poco alcanzar

23

el volumen normal (este efecto equivaldra a unCanalDerecho).

EJERCICIO

1 Creamos la pelcula mediante Archivo Nuevo (por defecto tendremos un nico fotograma). 2 Seleccionamos Importar Importar a Biblioteca, que se encuentra en el Men Archivo. 3 Se abrir la clsica ventana de Windows para buscar un archivo. Buscamos el archivo de sonido y pulsamos Abrir. 4 El sonido ya est insertado. Hacemos clic en el Panel Biblioteca (Ventana Biblioteca) y comprobamos que se encuentra all. 5 Si no se encuentra all, revisaremos los pasos dados, pues algo no hemos hecho bien. 6 Seleccionamos el fotograma en el que queramos insertar el sonido. 7 Despus seleccionamos el sonido en el Panel Biblioteca y lo arrastramos hasta el escenario (hasta el fotograma actual). 8 Pulsamos CTRL + ENTER y el sonido deber escucharse. 9 Alargamos el fotograma actual hasta el nmero 4 (insertando fotogramas normales desde el Men Insertar Lnea de Tiempo Fotograma). 10 Insertamos un nuevo fotograma en la lnea de tiempo. En la posicin 5 (desde el Men Insertar Lnea de Tiempo Fotograma Clave). 11 Abrimos el Panel Propiedades y seleccionamos los fotogramas del 1 al 4. 12 En la opcin Sinc seleccionamos Flujo. 13 Acabamos de conseguir que el sonido slo se reproduzca cuando est en los fotogramas indicados. 14 Ahora prolongamos la duracin del fotograma 5 hasta que ocupe 5 fotogramas ms (insertando fotogramas normales). 15 Insertamos un nuevo Fotograma Clave en la posicin 10. 16 Insertamos el sonido en el fotograma 10 del mismo modo que en el ejercicio 2. 17. Listo!!!

EJERCICIO

1 Seleccionamos Aumento Progresivo dentro de la pestaa Efecto que se encuentra en el Panel Sonidos. 2 Seleccionamos Personalizar dentro de la pestaa Efecto que se encuentra en el Panel Sonidos. 3 Nos dirigimos al final del sonido y hacemos clic en el canal que queramos modificar (el izquierdo est en la parte superior y el derecho en la inferior). Aparecer un recuadro blanco, lo situamos en su parte ms baja para quitarle el sonido y en su parte ms alta para drselo. Jugamos con los volmenes de ambos canales hasta obtener el efecto deseado. Podemos ir probando cmo queda pulsando el PLAY que acompaa este Panel.

24

7. TRABAJAR CON OBJETOS


LOS OBJETOS
Consideramos como un objeto todo aquello que aparezca en nuestra pelcula y sea visible, de modo que podamos trabajar con l,un objeto sera, por ejemplo, cualquier imagen que creemos o importemos, un botn, un dibujo creado por nosotros mismos, etc...Los objetos as considerados tienen 2 partes fundamentales: El Borde: Consiste en una delgada lnea que separa el objeto del exterior del escenario.Puede existir o no, segn nos convenga. Cuando creamos un objeto, el borde se crea siempre y su color ser el indicado en el Color de Trazo (dentro del Panel Mezclador de Colores). Si queremos dibujar creando Bordes deberemos emplear las Herramientas Lpiz, Lnea o Pluma y si queremos que nuestro dibujo no tenga borde, bastar con seleccionar el borde y suprimirlo (ver siguiente punto). El Relleno: El relleno no es ms que el propio objeto sin borde. Es, por tanto, la parte interna del objeto. Su existencia tambin es arbitraria, ya que podemos crear un objeto cuyo color de relleno sea transparente, y por tanto, parecer que dicho objeto no tiene relleno, aunque en realidad s que exista pero sea de color transparente. Para dibujar Rellenos (sin borde) podemos usar herramientas tales como el Pincel o el Cubo de Pintura.

EJERCICIO

Crear 2 rectngulos y eliminar el relleno de uno de ellos y el borde del otro. Procedemos del siguiente modo: 1 Seleccionamos los colores en el Panel Muestras o en el Panel Color, hacemos clic en la Herramienta Rectngulo y dibujamos 2 rectngulos. 2 Hacemos clic en el interior del primer rectngulo y pulsamos la tecla Suprimir (Supr). 3 Hacemos doble clic en el borde del otro rectngulo y volvemos a pulsar la tecla Suprimir.

Los 2 rectngulos originales

Rectngulo sin Relleno y Rectngulo sin Borde

SELECCIONAR
Para poder trabajar con objetos, es fundamental saber seleccionar la parte del objeto que queramos modificar (mover, girar, cambiar de color...). Podremos observar que las partes de un objeto seleccionadas toman una apariencia con textura para indicar que estn seleccionadas.

25

Objeto SIN seleccionar Objeto con el BORDE seleccionado Objeto con el RELLENO seleccionado Cmoseleccionar las diferentes partes de un objeto: Seleccionar un Relleno o un Borde: Basta hacer clic 1 vez en el Relleno o en el Borde que queramos seleccionar. Seleccionar el Relleno y el Borde de un objeto: Hacer doble clic en el Relleno. Seleccionar todos los bordes (o lneas) de un mismo color que estn en contacto : Hacer doble clic sobre una de las lneas que tenga el color que pretendamos seleccionar. Seleccionar un Smbolo, un texto, o un grupo: Clic en el Smbolo, en el texto o en el grupo. Estos tipos de objetos mostrarn un borde de color azul (por defecto) al estar seleccionados. Seleccionar Varios elementos: Mantendremos pulsada la tecla SHIFT mientras seleccionamos los objetos que queramos. Seleccionar los objetos que se encuentran en una determinada zona : Para ello usaremos la Herramienta Seleccin (Flecha). Haremos clic en una parte del escenario y arrastraremos el cursor hasta delimitar el rea que contenga los objetos que queremos seleccionar. Si esta rea corta algn objeto, slo quedar seleccionada la parte del objeto que est dentro del rea que hemos delimitado. Si quisiramos incluir dicho objeto, bastara con usar la tecla SHIFT y seleccionar la parte del objeto que falta por seleccionar.

Adems de la Herramienta Flecha, tambin podemos usar la Herramienta Lazo, ms til an si cabe. Nos permite seleccionar cualquier zona de cualquier forma (la forma la determinamos nosotros) del objeto que sea. Al contrario que la Herramienta Flecha, las reas seleccionadas no tienen por qu ser rectangulares. Seleccionar a partir de la Lnea de Tiempo: Si seleccionamos un determinado fotograma en la lnea de tiempo, se seleccionan automticamente todos los objetos que estn en dicho fotograma. Esto es til para modificar de un modo rpido todos los elementos del fotograma. Seleccionar Todo: La forma ms natural de seleccionar todo, consiste en hacer clic en el men Edicin Seleccionar Todo.

EJERCICIO

El primer apartado nos pide crear 5 valos y seleccionar 3 de ellos con la tecla SHIFT. 1 Seleccionamos los colores que queramos en el Panel Muestras o en el Panel Color, hacemos clic en la Herramienta valo y dibujamos 5 valos. 2 Hacemos doble clic en el relleno del primer crculo (doble clic para seleccionar tanto el Relleno como el borde). 3 Ahora pulsamos la tecla SHIFT y sin soltarla, hacemos doble clic en otros 2 crculos cualesquiera.

26

Ahora hacemos lo mismo usando la Herramienta Seleccin (Flecha), como pide el segundo apartado. 1 Hacemos clic en una zona del escenario que nos permita capturar 3 crculos. 2 Arrastramos el ratn hasta crear un rea que envuelva completamente a 3 de los 5 crculos. 3 Si quedara alguna parte del crculo fuera de la seleccin, basta con usar la tecla SHIFT para aadirlo a la seleccin actual. Ahora se nos pide seleccionar nicamente los bordes de 3 de ellos. 1 Hacemos clic en el borde del primer valo (si hiciramos 2 clics se seleccionaran todos los bordes del mismo color que estn en contacto con el borde sobre el que hacemos clic). 2 Mantenemos pulsada la tecla SHIFT y repetimos el proceso con 2 valos ms. Nota: Si en vez de valos hubieran sido rectngulos, hubiera hecho falta hacer 2 clics en el borde de cada rectngulo para que este quede totalmente seleccionado. Comprubalo t mismo.

COLOCANDO OBJETOS: PANEL ALINEAMIENTO


Una vez que sabemos seleccionar los objetos o las partes de estos que consideremos oportunas, veamos cmo colocarlos en el Escenario. Para colocarlos de un modo preciso (por no decir exacto), Flash pone a nuestra disposicin el Panel Alinear. Este Panel lo podemos encontrar en el Men Ventana Alinear. As funciona: El Panel Alinear permite colocar los objetos tal y cmo le indiquemos. Antes de ver las posibilidades, debemos hacer hincapi en la opcin En Escenanos permite decir a Flash que todas las posiciones que indiquemos para nuestros objetos tomen como referencia el escenario. Si esta opcin no est seleccionada, los objetos toman como referencia al conjunto de objetos en el que se encuentran, y se colocan en funcin de ellos. Lo ms habitual es seleccionar En Escenario, para que los objetos se coloquen segn los lmites de la pelcula, en el centro del fotograma, etc... Las posibilidades que tiene el Panel Alinear son: Alineamiento: Sita los objetos en una determinada posicin del fotograma (si est seleccionado En Escena). Las distintas opciones afectan a todos los elementos seleccionados y se emplean muy a menudo para situar los objetos en determinados sitios predefinidos. Por ejemplo: Si quisiramos situar un objeto en la esquina inferior izquierda, bastara pulsar el primer y el sexto botn consecutivamente. Distribuir: Sita los objetos en el escenario en funcin de unos ejes imaginarios que pasan por cada uno de ellos, de modo que la distribucin de los mismos sea uniforme. Por ejemplo, si

27

tenemos 2 cuadrados y pulsamos el primer botn de la izquierda. Cada uno de los 2 cuadrados se situar en un extremo de la pelcula (uno arriba y otro abajo). CoincidirTamao: Hace coincidir los tamaos de los objetos. Si est activo "En Escena" estirar los objetos hasta que coincidan con el ancho y el largo de la pelcula. Si no est activo, la referencia ser el resto de objetos. Por ejemplo, si tenemos 2 cuadrados distintos y la opcin "En Escena" no est activada, al hacer clic en el primer botn de "Coincidir Tamao", el cuadrado ms estrecho pasar a tener la anchura del cuadrado ms ancho. Si "En Escena" hubiera estado activa ambos cuadrados hubieran pasado a tener el ancho del fotograma. Espacio: Espacia los objetos de un modo uniforme.

EJERCICIO

1 Abre un archivo nuevo. 2 Dibuja 4 rectngulos de diferentes colores situados en diferentes puntos del escenario. 3 Haz clic en la herramienta Seleccin. 4 Vamos a seleccionar todos los elementos que se encuentran en el escenario, para ello hacemos clic en la esquina superior izquierda y sin soltar el botn del ratn arrastramos hasta la esquina inferior derecha y soltamos (asegrate de que todos los elementos se encuentran en el rea de seleccin). 5 Abrimos el panel de Alineacin, esta vez lo haremos pulsando la combinacin de teclas CTRL + K (aunque tambin podras abrirlo desde el men Ventana). 6 Marca la opcin En escena. 7 Alineamos todos los objetos a la derecha del escenario haciendo clic en .

Observa como todos los objetos se han movido para tener su borde derecho pegado al borde derecho del escenario. 8 Alineamos todos los objeto (aun seleccionados) a la izquierda del escenario haciendo clic en .

Fjate que los objetos ahora se han movido al lado contrario. Alinendose su borde izquierdo con el borde izquierdo del escenario.

EJERCICIO

Se nos pide dibujar 4 objetos y colocarlos en las esquinas. 1 Dibujamos los 4 objetos pedidos, por ejemplo, 4 rectngulos. 2 Abrimos el Panel Alinear. Desde el men Ventana Alinear. 3 Hacemos clic en "En Escena" para que las distribuciones de los objetos se hagan en funcin del tamao del fotograma.

28

4 Seleccionamos el primer objeto y hacemos clic en izquierdo de la pelcula.

para alinear el objeto en el extremos

5 Hacemos clic en para situarlo en el borde superior de la pelcula. Como el objeto est en el extremo superior izquierdo, est en la esquina superior izquierda. 6 Para alinear el segundo objeto en la esquina superior derecha hacemos clic en 7 Para alinear el tercer objeto en la esquina inferior izquierda hacemos clic en 8 Para alinear el cuarto objeto en la esquina inferior derecha hacemos clic en y y . y . .

PANEL INFORMACIN
Adems de controlar la posicin de los objetos desde el Panel Alineamiento, tambin podemos hacerlo, de un modo ms exacto (ms matemtico) desde otro panel, el Panel Informacin. A este Panel se puede acceder desde el Men Ventana Informacin. Las posibilidades de este Panel son limitadas, pero si buscamos exactitud en las medidas o no nos fiamos de las distribuciones de objetos que crea Flash, debemos acudir a l. Medidas del Objeto : Aqu introduciremos un nmero que represente el tamao de nuestro objeto en la medida seleccionada en las Propiedades del documento.Donde:An: hace referencia a la anchura y Al: a la altura. Situacin del objeto : Desde aqu controlamos la posicin del objeto en el escenario. La X y la Y representan el eje de coordenadas (La X es el eje Horizontal y la Y el eje vertical). Las medidas tambin van en funcin de las medidas elegidas para la pelcula. Color Actual : Indica el color actual en funcin de la cantidad de Rojo (R), Verde (V), Azul (A) y efecto Alfa (Alfa) que contenga. Este indicador puede ser engaoso, el motivo es que indica el color que tiene el objeto por el que en ese momento pasamos el cursor del ratn. Por tanto, podemos tener seleccionado un objeto (haciendo clic en l) y ver en el Panel Informacin su tamao y su posicin, pero al desplazar el ratn, el valor del color cambiar y ya no indicar el color del objeto seleccionado, sino el del objeto por el que pase el cursor. Tener esto en cuenta para no cometer errores o perder tiempo innecesario. Posicin del Cursor : Indica la posicin del cursor. Es til por si queremos que suceda algo en la pelcula al pasar el cursor justo por una posicin determinada o para situar partes del objeto en lugares especficos.

29

LOS GRUPOS
Un Grupo no es ms que un conjunto de objetos. Si bien no cualquier conjunto de objetos forman un grupo, ya que para crear un grupo, debemos indicarle a Flash que as lo queremos. Para ello, basta seleccionar los objetos que queremos que formen parte de un grupo y despus hacer clic en el Men Modificar Agrupar. Tras hacer esto observaremos que desaparecen las texturas que indicaban que los objetos estaban seleccionados y observamos que el grupo pasa a ser un "todo", ya que resulta imposible seleccionar a uno de sus miembros sin que se seleccionen a su vez los dems. Adems, aparece el rectngulo azul (por defecto) que rodea al grupo, definindolo como tal.

Crear grupos es muy til, ya que nos permite, como ya hemos dicho, tratar al conjunto de objetos como un todo y por tanto, podemos aplicar efectos al conjunto, ahorrndonos la labor de hacerlo de objeto en objeto. Por ejemplo, supongamos que tenemos un dibujo que representa un conjunto de coches. Tras dibujarlos todos, nos damos cuenta de que queremos aumentar el tamao de los coches. Podemos aumentar el tamao de los coches de uno en uno, corriendo el riesgo de aumentar unos ms que otros y perdiendo las proporciones entre ellos, o podemos formar un grupo con los coches y aumentar el tamao del grupo, de modo que aumenten todos de tamao a la vez y en la misma proporcin. De igual modo, podemos mover al grupo de posicin, hacer que gire... Al crear un grupo, simplemente estamos dando unas propiedades comunes a un conjunto de objetos y, en ningn caso perdemos nuestro objeto. En cualquier momento podemos deshacer el grupo, mediante el Men Modificar Desagrupar. Adems, Flash nos permite modificar los elementos de un grupo sin tener que desagruparlo. Para ello, seleccionamos el Grupo de elementos y hacemos clic en el Men Edicin Editar Seleccionado. Podremos editar los objetos que componen el grupo por separado teniendo en cuenta que, como es lgico, los cambios realizados afectarn al grupo adems de al elemento en cuestin.

EJERCICIO
1 Los seleccionamos todos del modo que prefiramos. 2 Hacemos clic en el Men Modificar Agrupar

La primera parte del ejercicio nos pide Agrupar un conjunto de elementos (que ya tenemos).

30

La segunda parte del ejercicio nos pide Desagrupar el conjunto de elementos que acabamos de agrupar. 1 Seleccionamos el Grupo haciendo clic en l. 2 Hacemos clic en el Men Modificar Desagrupar

8. CAPAS
Todo el mundo ha visto alguna vez cmo trabajan los dibujantes de dibujos animados. Y todos hemos visto cmo colocan una hoja semitransparente con dibujos sobre otras y la superposicin de todas forman el dibujo final. Por qu no dibujan todo en una misma hoja? Por qu trabajan con varios niveles y con varios dibujos si van a acabar todos juntos? Los motivos son muchos, y estos niveles que emplean los dibujantes, equivalen a las Capas que utiliza Flash. Cada capa es, por tanto, un nivel en el que podemos dibujar, insertar sonidos, textos... con INDEPENDENCIA del resto de capas. Hay que tener en cuenta que todas las capas comparten la misma Lnea de Tiempos y por tanto, sus distintos fotogramas se reproducirn simultneamente. Clarifiquemos esto con un ejemplo: Supongamos que tenemos 2 capas. En una de ellas los fotogramas del 1 al 10 contienen el dibujo de una portera de ftbol. En la otra los fotogramas del 1 al 5 contienen el dibujo de un portero (del 5 en adelante estn vacos). Pues bien, esta pelcula nos mostrar inicialmente (durante el tiempo que duren los primeros 5 fotogramas) la portera con el portero, para despus (durante los fotogramas del 5 al 10) mostrar la portera sin portero. De este modo la portera es independiente del portero, y podemos tratar estos objetos con total libertad, ya que no interfieren entre ellos para nada. Otra razn para separar los objetos en capas, es que Flash nos obliga a colocar cada animacin distinta en una capa. De lo contrario, todos los objetos que se encuentren en dicha capa formarn parte de la animacin. Si queremos que un objeto NO forme parte de una animacin, deberemos quitarlo de la capa en la que se produce dicha animacin. Siguiendo con el ejemplo del portero, si quisiramos crear un movimiento que haga que el portero se desplace hacia un lado no hay ningn inconveniente, pero si la portera estuviera en la misma capa que el portero, entonces AMBOS objetos se moveran hacia dicho lado, con lo que resultara imposible que slo se moviera el portero. La solucin es separar los objetos en 2 capas, como ya hemos hecho.

31

Las capas adems, tienen otras utilidades, nos permiten ordenar nuestra pelcula de forma lgica, y nos ayudan en la edicin de dibujos (evitando que se "fundan" en uno slo, o bloqueando el resto de capas de modo que slo podamos seleccionar la capa que nos interese).

TRABAJAR CON CAPAS


La vista standard de una capa es la que muestra la imagen. Veamos para qu sirven los distintos botones y cmo usarlos. Insertar Capas : Como su nombre indica, sirve para Insertar capas en la escena actual. Inserta capas normales. Aadir Capa Gua : Inserta una capa de tipo gua. Se tratan en profundidad el siguiente punto. Borrar Capa : Borra la capa seleccionada. Cambiar Nombre: Para cambiar el nombre a una capa, basta con hacer doble clic en el nombre actual. Propiedades deCapa: Si hacemos doble clic en el icono , podremos acceder a un panel con las propiedades de la capa en la que hayamos hecho clic. Podremos modificar todas las opciones que hemos comentado anteriormente y alguna ms de menor importancia. Aqu puedes cambiar diferentes opciones sobre la capa, como su nombre o su color. Tambin puedes bloquearla u ocultarla. Mostrar / Ocultar Capas : Este botn permite ver u ocultar todas las capas de la pelcula. Es muy til cuando tenemos muchas capas y slo queremos ver una de ellas ya que permite ocultar todas a la vez, para despus mostrar slo la actual. Para activar la vista de una capa en concreto (o para ocultarla) basta con hacer clic en la capa correspondiente en el punto (o en la cruz) que se encuentra bajo el icono "Mostrar / Ocultar capas" Bloquear Capas : Bloquea la edicin de todas las capas, de modo que no podremos modificarlas hasta desbloquearlas. Para bloquear o desbloquear una capa concreta, procederemos como en el punto anterior, clic en el punto o icono "Cerrojo" situados en la capa actual bajo el icono "Bloquear Capas". Bloquear una capa es muy til cuando tenemos varios objetos juntos y en capas distintas y queremos asegurarnos de que no modificamos "sin querer" alguno de ellos. Tras bloquear su capa podremos trabajar con la seguridad de no modificar dicho objeto, ni siquiera podremos seleccionarlo, de modo que editaremos con mayor facilidad el objeto que queramos. Mostrar/Ocultar capas como contornos : Este botn nos muestra/oculta los contenidos de todas las capas como si slo estuviesen formados por bordes. De este modo y ante un

32

conjunto numeroso de objetos, podremos distinguirlos a todos de forma fcil y podremos ver en qu capa est cada uno de ellos. Tambin se puede activar o desactivar para cada capa de un modo similar a los anteriores botones. Para realizarlo hacemos lo siguiente:

Opciones activas

Opciones desactivas

En la primera imagen la capa actual no tiene ninguno de los botones activados, podemos observar que en la columna "Mostrar Capas" aparece un punto. Este punto significa que NO est activada esta opcin, lo mismo sucede con el botn "Bloquear capas". En la columna "Mostrar capas como contornos" aparece un cuadrado CON relleno, lo que simboliza que los objetos se mostrarn completos y no slo sus contornos. En la segunda imagen aparece una cruz situada bajo la columna "Mostrar Capas", lo que indica que dicha capa no es visible en el escenario. Aparece un cerrojo bajo la columna "bloquear capas", lo que simboliza que la capa est bloqueada. Y en la columna "Mostrar capas como contornos" NO aparece relleno. La capa se est mostrando en este modo y no podremos ver los rellenos hasta deseleccionar esta opcin. Adems, el color de los contornos ser diferente para cada capa, de modo que podamos distinguirlas mejor. El color del contorno, coincidir con el indicado en cada capa. En este ejemplo podemos ver cmo queda un objeto en funcin de tener activada o no la opcin contorno:

Reorganizar las Capas


Como ya se ha comentado, las distintas capas tienen muchas cosas en comn unas con otras. Lo primero y principal es la Lnea de tiempos, todas las capas de una misma escena comparten la misma lnea de tiempos y por tanto, los objetos de todos los fotogramas 1 de todas las capas se vern al mismo tiempo en la pelcula superpuestos unos sobre otros. y qu objeto est delante de los dems? Pues este criterio viene dado por la colocacin de las Capas en la pelcula. Los objetos que se mostrarn delante de todos los dems sern aquellos que se encuentren en la capa situada ms arriba. Es decir, si nos fijamos en el ejemplo anterior: El portero aparece delante de la portera, porque la capa "Portero" est situada encima de la capa "Portera", como puede apreciarse en la imagen. Si quisiramos cambiar esta distribucin, basta con

33

hacer clic en la capa que queramos mover y arrastrarla hacia arriba o hacia abajo hasta la posicin deseada. Veremos como los objetos se colocan delante o detrs de los de la capa seleccionada segn su capa se

encuentre por encima o por debajo de la nuestra. Para mover un objeto de una capa a otra, deberemos seguir unos sencillos pasos. Para mover un fotograma de una capa a otra, basta con seleccionar el fotograma a mover y arrastrarlo hasta la capa donde queramos pegarlo. Tambin se puede Copiar el fotograma y luego pegarlo en la capa de destino. EJERCICIO Mover un objeto situado en una capa a otra 1 Abre el archivo trabajo.fla. 2 Seleccionamos la Capa donde est el rectngulo que queremos cambiar de capa. 3 Hacemos doble clic en el rectngulo para seleccionarlo en su totalidad (relleno y borde). 4 Pulsamos el botn derecho del ratn. Se abrir un men como el de la imagen. 5 Seleccionamos Cortar. El rectngulo desaparecer. 6 Seleccionamos el fotograma en el que queramos colocar el objeto (situado en la capa donde se encuentra el texto que creamos en ejercicios anteriores). 7 Hacemos clic con el botn derecho sobre el escenario de este fotograma de destino. 8 Hacemos clic en Pegar para colocar el objeto en este fotograma o hacemos clic en Pegar in Situ para pegar el objeto en la misma posicin en la que estaba al cortarlo

34

Tipos de Capas
Alver las propiedades generales de una capa o al hacer clic con el botn derecho del ratn sobre el icono de una capa cualquiera, existen varios tipos de capas. Capas normales : Son las capas por defecto de Flash y tienen todas las propiedades descritas en los puntos anteriores. Son las ms usadas y se emplean para todo, colocar objetos, sonidos, acciones, ayudas... Capas Gua : Son capas especiales de contenido especfico. Se emplean en las animaciones de movimiento de objetos y su nico fin es marcar la trayectoria que debe seguir dicho objeto. Debido a que su misin es representar la trayectoria de un objeto animado, su contenido suele ser una lnea (recta, curva o con cualquier forma). En esta imagen podemos ver el contenido de 2 capas. La primera de ellas contiene la bola azul y la segunda contiene la lnea curva. La segunda capa la hemos definido como Capa Gua, para que al realizar la animacin de movimiento (esto lo veremos en un tema posterior) su contenido NO se vea en la pelcula, sino que sirva de recorrido para la bola azul. Es Importante recordar que el contenido de las Capas Gua no se ver en la pelcula final. Su efecto har que la pelota azul se desplace de un extremo de la lnea al otro siguiendo esa ruta. Bonito efecto verdad? Capas con Gua (GuidedLayers) : Cuando definimos una capa como capa gua, es necesario definir despus una capa guiada. Esto es, una capa que quedar afectada por la gua definida en la Capa gua. Si no definimos una capa guiada, la capa gua no tendr ningn efecto y si bien NO se ver en la pelcula (por ser una capa gua) tampoco provocar ningn efecto en las dems capas. En la imagen anterior, la bola azul se deber encontrar en una capa Guiada, de lo contrario no seguir la ruta marcada por la capa gua. Las capas gua y las capas guiadas se relacionan entre s de un modo evidente. A cada capa gua le corresponden una serie de capas guiadas. Al asociar una capa gua con una capa guiada, el icono que representa a la capa gua cambia, indicndonos que est realizando correctamente su labor. En la imagen podemos ver un ejemplo de capa gua y capa guiada correctamente asociadas entre s. (La capa llamada aulaClic es, evidentemente, la capa con Gua) El funcionamiento de las Capas Gua y sus utilidades lo veremos a fondo en el tema de las Animaciones de Movimiento

35

Capas Mscara : Estas capas se pueden ver como plantillas que tapan a las capas enmascaradas (las veremos enseguida). El funcionamiento de estas capas es algo complejo (tampoco demasiado) y se analizar en temas posteriores. Basta con decir que estas capas se colocan "encima" de las capas a las que enmascaran y slo dejan que se vea la parte de stas que tapan los objetos situados en las capas mscara (son como filtros). Al igual que las capas gua, los objetos existentes en este tipo de capas tampoco se ven en la pelcula final. S se vern los objetos de su correspondiente capa enmascarada a los que estn "tapando".

Capas Enmascaradas : Estas capas funcionan conjuntamente con las Capas mscaras. Al igual que las capas gua y las capas guiadas deben ir asociadas unas a otras para que su efecto sea correcto. Sus objetos s que son visibles en la pelcula final, pero slo cuando algn objeto de la capa Mscara est sobre ellos.

Veamos el funcionamiento de estas capas con un ejemplo. En este ejemplo, los rectngulos azules forman parte de la Capa Enmascarada y por tanto se vern en la pelcula final (pero slo lo que tape la capa mscara). El valo rojo est situado en la capa Mscara y no se ver en la pelcula, pero slo se ver lo que l "tape". As se emplean las mscaras...

EJERCICIO

Realiza las siguientes imgenes utilizando capas

36

9. SMBOLOS
Los Smbolos provienen de objetos que hemos creado utilizando las herramientas que nos proporciona Flash CS3. 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.

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: Seleccionamos el objeto que queramos convertir en smbolo. Abrimos el panel de Propiedades del Smbolo, accediendo al men Insertar NuevoSmbolo o simplemente pulsando Ctrl + F8 o F8.

Una vez hecho esto nos aparecer una ventana como la mostrada en la imagen. Introducimos el nombre del smbolo que vamos a crear. Esto al principio y mientras tengamos poco smbolos no ser muy importante, pero ms adelante nos servir para hacer referencia al objeto. Slo nos queda seleccionar el tipo de smbolo 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. Bastar con pulsar Aceptar para tener nuestro smbolo creado. Para practicar estas operaciones te aconsejamos realizar Ejercicio Crear Smbolo.

EJERCICIO

Crear un smbolo de grfico que nos permitir coger destreza en una accin que ser bsica en la creacin de animaciones. 1 crea un nuevo documento e inserta un ovalo. 2 Seleccionamos el valo haciendo doble clic sobre l. 3 Abrimos el men Insertar Nuevo Smbolo... de la barra de mens. Se desplegar una ventana como la de la figura.

37

4 En el campo Nombre introducimos el nombre de nuestro grfico, por ejemplo " Mi Primer Smbolo". 5 Seleccionamos la opcin Grfico en el apartado Tipo. Con esto le decimos a Flash que el nuevo smbolo ser un grfico. 6 Pulsamos Aceptar y ya tenemos nuestro primer smbolo grfico creado.

Las Bibliotecas
En Flash CS3 podemos encontrar dos tipos de bibliotecas, las bibliotecas comunes y de ejemplos y aquellas asociadas a las pelculas que hemos creado. Todas ellas las tenemos a nuestra disposicin para utilizar los smbolos que contienen. Para acceder a las bibliotecas comunes que nos ofrece Flash simplemente tenemos que ir a la Barra de Mens, Ventana BibliotecasComunes y seleccionar alguna de las que se nos ofrecen. Las hay de todo tipo de smbolos: botones, clips o grficos. Para acceder a la librera de smbolos de la pelcula que estamos creando de nuevo vamos a la Barra de Mens, Ventana Biblioteca. En esta biblioteca aparecern todos los smbolos que hemos creado hasta el momento. Podemos comprobar como el nuevo smbolo que hemos creado en el ejercicio anterior (Ejercicio Crear Smbolo) se ha aadido a nuestra biblioteca accediendo a ella como acabamos de indicar. Para utilizar un smbolo de una biblioteca basta con pulsar en el nombre de dicho smbolo y arrastrarlo a cualquier lugar del rea de trabajo. Observa cmo podemos hacerlo.

Diferencia entre smbolo e instancia


Como hemos comentado anteriormente, cuando creamos un smbolo, Flash lo almacena en una biblioteca. Pues bien, cada vez que

38

utilicemos ese objeto en una pelcula, ste se convierte en una instancia. Aunque parece que sean lo mismo, la importancia de esta distincin es que cuando utilicemos un smbolo que hayamos creado previamente en una pelcula, al modificarlo se modificar la instancia, mientras que el objeto seguir intacto, tal y como era en el momento de su creacin, de manera que podremos volverlo a utilizar en otro momento. A la derecha tenis un ejemplo de una biblioteca, en este caso una biblioteca estndar de Flash. Cada elemento de la biblioteca es un smbolo.

También podría gustarte