16

TEMA 8. MACROMEDIA FLASH MX

José M. Castillo Castillo

MACROMEDIA FLASH MX

1

INDICE DE CONTENIDO TEMA 8. MACROMEDIA FLASH MX 1. CONOCIENDO FLASH 1.1 Presentación y objetivos del curso 1.2 Requerimientos técnicos para flash 1.3 Ejecución de macromedia flash 1.4 El entorno de trabajo 1.5 Configurar las propiedades de una película nueva 1.6 Cargar y previsualizar una película guardada 1.7 Guardar una película 1.8 La paleta herramientas 1.9 El escenario y su visualización 1.10 Ayudas de dibujo 1.11 Trabajo con paneles 1.12 Línea de tiempo 1.13 Explorador de películas 1.14 Salir de macromedia flash 1.15 Simulación - iniciar flash desde el menú inicio 1.16 Simulación - localizar áreas del entorno de trabajo 1.17 Simulación - configurar las dimensiones del escenario 1.18 Simulación - salir de la aplicación 1.19 Simulación - abrir paneles flotantes 2. TÉCNICAS DE DIBUJO 2.1 Importación desde otras aplicaciones 2.2 Convertir imágenes bitmap en gráficos vectoriales 2.3 Dibujo de formas simples 2.4 Dibujo de formas libres 2.5 Configuración y utilización de la herramienta pluma 2.6 Dibujo con la herramienta pincel 2.7 Borrado de objetos en flash 2.8 Contornos y rellenos 2.9 Trabajo con rellenos sólidos y degradados 2.10 Modificación de líneas y contornos 2.11 La herramienta bote de tinta 2.12 La herramienta cubo de pintura 2.13 Herramientas de texto en flash 2.14 Creación de campos de texto dinámicos 2.15 Simulación - importar un archivo 2.16 Simulación - transformar mapa de bits en gráfico vectorial 2.17 Simulación - configurar la herramienta pluma 2.18 Práctica - copiar dibujos 2.19 Práctica - aprendiendo a dibujar en macromedia flash

MACROMEDIA FLASH MX

2

3. SELECCIÓN Y MANIPULACIÓN DE OBJETOS 3.1 Selección y transformación de objetos con la herramienta flecha 3.2 Uso de la herramienta lazo 3.3 Agrupación de objetos 3.4 Objetos no agrupados 3.5 Mover y copiar objetos en flash 3.6 Escalar objetos en flash 3.7 Transformación libre de objetos 3.8 Distorsión de objetos 3.9 Envoltura de objetos 3.10 Rotar y sesgar objetos en flash 3.11 Alineación de objetos 3.12 Simulación - escalar una imagen mediante el panel info 3.13 Simulación - alinear una imagen en el escenario 3.14 Práctica - macromedia shockzone 4. TRABAJAR CON FRAMES Y CAPAS EN FLASH 4.1 Información general sobre los fotogramas 4.2 Creación de etiquetas y comentarios 4.3 Utilización de anclajes 4.4 Información general sobre las capas 4.5 Creación de capas 4.6 Capas guías 4.7 Capas máscara 4.8 Simulación - insertar y modificar una capa 4.9 Práctica - creación de menús animados 5. BIBLIOTECA - SÍMBOLOS E INSTANCIAS 5.1 La biblioteca de símbolos de flash 5.2 Creación de símbolos 5.3 Creación de botones 5.4 Intercambiar símbolos 5.5 Trabajar con carpetas en la ventana biblioteca 5.6 Eliminación de elementos de una biblioteca 5.7 Cambiar las propiedades de las instancias 5.8 Simulación - abrir la biblioteca 5.9 Simulación - crear un símbolo gráfico 5.10 Simulación - convertir un objeto en símbolo gráfico 5.11 Simulación - eliminar un objeto de la biblioteca 5.12 Simulación - consulta de la biblioteca 5.13 Simulación - visibilidad de la instancia de la escena 5.14 Práctica - visibilidad de un clip de película

MACROMEDIA FLASH MX

3

6. ANIMACIÓN 6.1 Uso de escenas en flash 6.2 Animación de fotograma a fotograma 6.3 Extensión de imágenes de fondo en una animación 6.4 Interpolación de movimiento entre dos puntos 6.5 Interpolación de movimiento a lo largo de un recorrido 6.6 Interpolación de formas (morphing) 6.7 Edición de animaciones en flash 6.8 Simulación - mostrar la totalidad de fotogramas de una capa 6.9 Simulación - crear una nueva escena 6.10 Práctica - chimaira intro 6.11 Práctica - chimaira menú 7. SONIDO Y MÚSICA EN FLASH 7.1 Importación de sonidos 7.2 Añadir sonidos a una película de flash 7.3 Añadir efectos de sonido a los botones 7.4 Edición de sonidos 7.5 Compresión de sonidos 7.6 Simulación - importar un archivo de sonido 7.7 Simulación - compresión de sonidos 7.8 Práctica - creación de bandas sonoras dinámicas 8. INTERACTIVIDAD BÁSICA 8.1 Creación de películas interactivas 8.2 Acciones en fotogramas 8.3 Acciones en objetos 8.4 Modificación de acciones 8.5 Saltar a un fotograma o escena 8.6 Reproducir y parar una película 8.7 Ajustar la calidad de visualización de una película 8.8 Detener todos los sonidos de una película 8.9 Llamar a una URL desde flash 8.10 Controlar la ventana del reproductor de flash 8.11 Cargar un SWF de flash dentro de una película 8.12 Descargar una película de flash 8.13 Precarga básica de una película 8.14 Impresión de los fotogramas de una película 8.15 Simulación - abrir una página web haciendo uso de script 8.16 Simulación - acción para cerrar el reproductor de flash 8.17 Práctica - uso del panel acciones 8.18 Práctica - siguiendo el recorrido del ratón 8.19 Práctica - creación de una clave para múltiples usuarios

MACROMEDIA FLASH MX

4

9. INTERACTIVIDAD AVANZADA 9.1 Arrastrar y soltar objetos sobre el escenario de flash 9.2 Creación de un cursor personalizado 9.3 Captura de acciones de teclado con flash 9.4 Valores de códigos de teclado para flash 9.5 Creación de campos de texto en scroll 9.6 Configuración de valores de color en una película 9.7 Creación de controles de sonido 9.8 Simulación - convertir un objeto en objeto arrastrable 9.9 Práctica - creación de una calculadora 9.10 Práctica - creación de un juego de naves espaciales 10. PUBLICACIÓN Y EXPORTACIÓN DE PELÍCULAS 10.1 Publicación de películas de flash 10.2 Configuración de publicaciones SWF 10.3 Configuración de publicaciones HTML 10.4 Visualización previa de publicaciones y configuraciones 10.5 Exportación de películas e imágenes 10.6 Simulación - proteger la exportación de nuestra película 10.7 Práctica - juego de la serpiente

MACROMEDIA FLASH MX

5

1. CONOCIENDO FLASH En esta primera lección, veremos una pequeña introducción a Macromedia Flash y los requisitos del sistema necesarios para la instalación y correcto funcionamiento del programa. Después, de forma inmediata, pasaremos a ver los primeros conceptos y procedimientos que le ayudarán a familiarizarse con Flash. Aprenderá a abrir, guardar y manipular películas y, además, comenzará a familiarizarse con los principales controles que forman la interfaz del programa.

1.1. Presentación y objetivos del curso Durante los últimos años, hemos asistido a un espectacular crecimiento del número de usuarios y páginas que componen la red. Este crecimiento ha venido a confirmar que Internet es ya la gran revolución de la comunicación del nuevo milenio. Los que conocemos este medio desde sus primeros momentos, hemos ido observando cómo las páginas grises y formadas únicamente con texto han ido evolucionando hasta presentar contenidos cada vez más interactivos, con el fin de captar la atención del usuario. En este fenómeno, sin lugar a dudas, Macromedia Flash ha tenido mucho que ver. Gracias a Flash, en los últimos años, muchos proyectos interactivos han podido ser publicados en la red.

Este curso constituirá un complemento para aquellos diseñadores y creativos que quieran dar mayor vistosidad a sus páginas Web en Internet. A lo largo del curso, aprenderá a manejar y crear contenidos vectoriales a los que podrá dotar de animación e interactividad. Para finalizar, nos adentraremos en el mundo de la programación con ActionScript logrando crear numerosos efectos que dotarán de mayor espectacularidad a nuestros trabajos. Aunque Flash fue creado fundamentalmente para editar y publicar contenidos multimedia interactivos en la Web, gracias a las nuevas mejoras incluidas en la versión MX, Flash puede ser utilizado para crear aplicaciones multimedia para distribuir en CD-ROM.

MACROMEDIA FLASH MX

6

1.2. Requerimientos técnicos para Flash Para la instalación de este programa y su correcto funcionamiento, harán falta una serie de condiciones y requerimientos mínimos para el PC en el que vayamos a trabajar:

o Procesador Intel Pentium o compatible con un mínimo de 200 MHz. o 64 Mb de memoria RAM (128 Mb recomendados). o 85 Mb de espacio disponible en disco duro. o Tarjeta con soporte para 1024 x 768 con 16 bits de color. o Ratón compatible con Windows. o Unidad de CD-ROM (sólo necesaria para la instalación del programa). o Sistema operativo Windows 98 SE o superior (incluyendo Windows XP).

1.3. Ejecución de Macromedia Flash Una vez instalado Macromedia Flash, iniciar el programa será tan fácil como ejecutar cualquier otro programa de Windows.

Enlace vídeo:

1.4. El entorno de trabajo Al abrir Flash por primera vez, nos encontraremos con una imagen similar a la que se representa en la imagen. La nueva interfaz del programa hace su manejo más fácil. Las funciones más utilizadas aparecen en el panel Propiedades situado en la parte baja del programa. Gracias a esto, ya no será necesario tener que abrir muchos paneles y ventanas. Otras funciones utilizadas con frecuencia se muestran en paneles que se contraen fácilmente y que podremos acoplar y desacoplar según nos convenga para aprovechar al máximo el espacio en la pantalla.

MACROMEDIA FLASH MX

7

Barra de título: Situada en la parte superior de la pantalla muestra el nombre de archivo de la escena actual.

Menús desplegables: Se encuentra justo debajo de la Barra de título y contiene los menús por defecto de Macromedia Flash.

Paleta Herramientas: En esta Barra están todas las herramientas que le permitirán crear y editar elementos de Flash.

Línea de Tiempo: Es la línea de tiempo que permite controlar lo que irá sucediendo en el escenario de su película. Es el corazón de todo proyecto interactivo en Flash.

Área de trabajo: Es la zona donde podrá crear y editar los elementos que diseñe con las herramientas de Flash.

Escenario: Es el área rectangular redimensionable donde todo lo que ocurra será lo que el usuario verá en su proyecto final.

Panel Propiedades: Este nuevo panel facilitará al usuario el acceso a los atributos más utilizados del elemento seleccionado, tanto en el escenario como en la Línea de Tiempo.

1.5. Configurar las propiedades de una película nueva

Cuando abrimos una nueva sesión de Macromedia Flash, la aplicación crea un nuevo archivo o película con una configuración predeterminada. Si lo deseamos, podremos crear nuevas películas adicionales en las que trabajar. También podremos abrir una plantilla como documento nuevo, para ello podremos elegir entre varias plantillas predeterminadas incluidas en el programa o abrir una plantilla guardada previamente. Usando el cuadro de diálogo Propiedades del documento, podremos configurar las dimensiones del escenario, velocidad de fotogramas, color de fondo y otras propiedades de una nueva película.

Enlace vídeo:

MACROMEDIA FLASH MX

8

1.6. Cargar y previsualizar una película guardada La opción Abrir del menú Archivo nos permitirá cargar una película guardada en formato *.FLA. Para poder previsualizar en su totalidad el contenido de una película, deberemos reproducirla, ya sea en una ventana de forma individual o en una página Web.

Enlace vídeo:

1.7. Guardar una película Las películas que estemos editando actualmente pueden guardarse en cualquier momento mediante la opción Guardar del menú Archivo con el nombre que se indica en la Barra de título de la pantalla de Macromedia Flash. Para guardar con otro nombre o en otro lugar una película, utilizaremos la opción Guardar como del menú Archivo. Como gran novedad, podremos guardar un documento FLA de Flash como plantilla, con la idea de poder utilizarlo como punto de partida de un nuevo documento que vayamos a crear. Su utilización es parecida a como se utilizan las plantillas en los procesadores de texto o en aplicaciones de edición de páginas Web.

Enlace vídeo:

1.8. La paleta Herramientas Antes de comenzar a crear y editar elementos, será necesario que conozca e identifique las herramientas que Macromedia Flash pone a su disposición en la paleta Herramientas. En ella es donde encontramos todos los elementos de dibujo o texto que podremos crear con Flash. También nos proporciona las herramientas necesarias para manipular gráficos. Si observa con detenimiento la Barra de herramientas, podrá ver que ésta se encuentra subdividida en diferentes áreas. Por supuesto, tiene disponibles las herramientas, las cuales veremos con más detenimiento a continuación. Dispone también de dos botones de vistas, una zona de color donde podrá cambiar el color de las líneas y del relleno, y finalmente, tenemos el área Opciones que es una zona contextual que va cambiando en consonancia con la herramienta seleccionada en dicha barra.

Flecha: Permite seleccionar, mover y editar objetos en Flash.

Subseleccionar: Esta herramienta nos permitirá ajustar o cambiar el ángulo de los segmentos de líneas y curvas que creemos.

Línea: Dibuja líneas rectas.

MACROMEDIA FLASH MX

9

Lazo: Nos permite seleccionar áreas no regulares de los objetos contenidos en una escena. En la zona contextual, aparecen varias varitas mágicas que permiten seleccionar zonas por colores y el modificador para que el lazo seleccione en formato poligonal.

Pluma: Con esta nueva herramienta, podremos dibujar líneas curvadas con puntos editables que podremos manipular fácilmente usando la herramienta Subseleccionar.

Herramienta Texto: Sirve para introducir texto en el proyecto.

Óvalo: Nos permite dibujar círculos y elipses. En el área Colores, podemos definir si queremos que estas áreas se muestren rellenas o no, así como el color de éste.

Rectángulo: Crea cuadrados y rectángulos. En el área Colores, podemos definir si queremos que estas áreas se muestren rellenas o no, así como el color de éste.

Lápiz: Con esta herramienta se pueden dibujar contornos irregulares. Flash presenta un modo de dibujo asistido que permite “interpretar” lo que se va dibujando para optimizar el resultado, en función del modo seleccionado en el área contextual Opciones.

Pincel: Con esta herramienta podremos rellenar contornos o pintar rellenos directamente sobre la escena. Flash presenta varios modos de relleno que puede escoger en el primer modificador de la zona contextual.

Transformación libre: Esta es una de las herramientas nuevas en Flash, y nos permitirá transformar objetos, grupos, instancias o bloques de texto de forma libre.

Transformación de relleno: Esta herramienta tiene una gran importancia porque nos permitirá modificar un relleno degradado, tanto radial como lineal.

Bote de tinta: Permite reajustar los valores de un contorno ya existente o crea un contorno alrededor de un relleno.

Cubo de pintura: Esta herramienta se utiliza para cambiar los valores de relleno de objetos ya existentes.

Cuentagotas: Con esta herramienta, podremos “copiar” el color y tamaño de líneas y rellenos para poder aplicarlos en otros elementos.

Borrador: Borra partes de los elementos. En la zona contextual, puede ajustar los distintos modos de borrado, así como, la forma de la herramienta.

MACROMEDIA FLASH MX

10

1.9. El escenario y su visualización El escenario se usa para organizar las películas de Flash. Al iniciar una nueva sesión del programa, Flash crea por defecto una escena en blanco con el nombre Sin título-1. Nosotros podremos tener tantas escenas como necesitemos. Lo único que debe de tener en cuenta es que las escenas se reproducirán en el orden establecido. Con las herramientas disponibles en el área Ver de la paleta Herramientas, podremos cambiar el grado de amplificación del escenario, de tal forma, que podamos ver el escenario entero en la pantalla o una zona determinada del dibujo aumentada. El grado máximo de amplificación dependerá de la resolución de nuestro monitor y del tamaño de la película.

Enlace vídeo:

1.10. Ayudas de dibujo Macromedia Flash nos proporciona una serie de elementos de ayuda como son las reglas, guías y cuadrícula que nos ayudarán a dibujar y diseñar objetos de manera más precisa. Podremos colocar guías en un documento y ajustar objetos a las mismas o activar la cuadrícula y ajustar los objetos a ésta.

Enlace vídeo:

1.11. Trabajo con paneles Los paneles de Flash nos ayudarán a ver, organizar, y modificar los elementos de una película. Algunos de los paneles aparecen ya anclados en el programa por defecto. Para ver una lista completa de los paneles disponibles en Flash, utilice el menú desplegable Ventana. Macromedia Flash nos permitirá mostrar, ocultar, agrupar y redimensionar los paneles cómo y cuándo nosotros queramos. Si realizamos una agrupación de varios paneles, podremos guardar la nueva configuración con el hombre que deseemos, de manera que siempre que queramos podamos usarla. La mayoría de estos paneles presentan un pequeño menú emergente con opciones adicionales. A estos menús se accede por medio del icono que aparece en la esquina superior derecha de un panel. Si no aparece ningún icono de control del menú, significa que el panel no tiene menú de opciones.

MACROMEDIA FLASH MX

11

Además, con la flecha de la parte izquierda del panel hay un icono de flecha que nos permitirá expandir o contraer un panel.

Enlace vídeo:

1.12. Línea de Tiempo La Línea de Tiempo de Macromedia Flash es donde se organiza y controla el contenido de las películas. Este contenido se organizará en capas y fotogramas. Las capas de una película aparecen listadas en la parte izquierda del cuadro. Por su parte, los fotogramas contenidos en cada capa aparecen de manera lineal a la derecha de la capa correspondiente. En la parte superior, podemos ver una barra de referencia con los números de los frames, desplazando el regulador, podremos indicar el frame que se mostrará en el escenario. En la parte inferior de la Línea de Tiempo, se encuentra la Barra de estado, donde se muestra el número de fotograma activo, la velocidad de fotograma por segundo configurada, y el tiempo transcurrido en el frame activo.

Por defecto, la Línea de Tiempo aparece anclada en la parte superior de la ventana principal del programa, justo encima del escenario. Si lo desea, puede convertirla en una ventana flotante que podremos redimensionar y colocar, cómo y dónde deseemos.

Enlace vídeo:

MACROMEDIA FLASH MX

12

1.13. Explorador de Películas Hasta el lanzamiento de esta nueva versión del programa, siempre habíamos echado en falta la posibilidad de tener una ventana donde pudiéramos observar, comprobar y modificar las distintas instancias por sus nombres. Esta ventana mostrará el contenido de una película organizados en una estructura de árbol jerárquica por la que podremos desplazarnos fácilmente. En la parte superior de la ventana, aparecen una serie de botones que nos permitirán realizar un filtrado por categorías de los elementos del documento, y un cuadro de edición en el que podremos localizar rápidamente un elemento del que conocemos el nombre.

Enlace vídeo:

1.14. Salir de Macromedia Flash Macromedia Flash podrá ser cerrado de distintas formas, mediante las cuales abandonaremos el programa. Hemos de tener en cuenta, que una vez salgamos, ya no podremos deshacer los cambios efectuados en una escena la próxima vez que entremos en él. Por lo tanto, asegúrese de anular los cambios no deseados antes de salir del programa.

Enlace vídeo:

MACROMEDIA FLASH MX

13

1.15. Simulación: Iniciar Flash desde el menú Inicio Utilice el menú Inicio de Windows para iniciar una nueva sesión de trabajo con Macromedia Flash.

Enlace a la simulación:

1.16. Simulación: Localizar áreas del entorno de trabajo Una vez hemos entrado en el programa, ahora vamos a tratar de localizar las distintas áreas de su entorno.

Enlace a la simulación:

1.17. Simulación: Configurar las dimensiones del escenario Utilice el cuadro de diálogo Propiedades de película para configurar las dimensiones del escenario en 300 x 300 píxeles.

Enlace a la simulación:

1.18. Simulación: Salir de la aplicación Utilice el menú Archivo para Salir del programa.

Enlace a la simulación:

1.19. Simulación: Abrir paneles flotantes Haciendo uso del menú correspondiente, abra primero el panel Info y después el panel Escena.

Enlace a la simulación:

MACROMEDIA FLASH MX

14

Recuerda:

El área del entorno de trabajo de Adobe Flash que podremos controlar lo que irá sucediendo en

nuestra película es Línea de tiempo.

La combinación de teclas rápidas que nos permitirá cerrar la aplicación es ALT+F4.

El formato de archivo con el que se guardan las películas de Flash *.FLA.

La herramienta que Flash nos permitirá ajustar o cambiar el ángulo de los segmentos de líneas y

curvas que creemos es Subseleccionar.

Los sistemas operativos que son soportados por Adobe Flash es Windows 95 (incluido Windows XP).

La forma que podremos acceder a los paneles flotantes de Adobe Flash es seleccionando la opción

Paneles del menú desplegable Ventana.

El área del entorno de trabajo de Adobe Flash donde se representará cuando creemos una película es

Escenario.

Las dimensiones por defecto del escenario de una película de Flash son de 550 x 400 píxeles.

La herramienta que utilizamos para reajustar los valores de un contorno ya existente o para crear un

contorno alrededor de un relleno es Bote de tinta.

La cantidad de memoria RAM que se recomienda para un funcionamiento correcto de Adobe Flash es

de 64 MB de memoria RAM (128 MB recomendados).

MACROMEDIA FLASH MX

15

2. TÉCNICAS DE DIBUJO En esta segunda lección, nos centraremos fundamentalmente en el estudio de todas las herramientas de dibujo que Flash pone a nuestra disposición para crear y manipular objetos sobre el escenario. Además, aprenderemos a importar imágenes para transformarlas en gráficos vectoriales para su posterior manipulación o para usarlas como relleno. Es importante comprender las distintas posibilidades que nos ofrecen estas herramientas para dar calidad a nuestros diseños.

2.1. Importación desde otras aplicaciones Flash es capaz de reconocer una gran variedad de archivos en formato vectorial y de mapa de bits, que podremos colocar en el escenario importándolos o pegándolos. Flash importa gráficos vectoriales, bitmaps y secuencias de imágenes:

Las imágenes vectoriales de FreeHand serán importadas directamente dentro de la película de Flash respetándose capas, bloques de texto, librerías y páginas. Además, si el archivo importado utiliza el modo de color CMYK, Flash lo convierte automáticamente a un archivo con color RGB.

Los archivos de imagen PNG de Fireworks pueden ser importados directamente dentro de la película Flash, ya sea, como gráfico vectorial o como mapa de bits editables. Si importamos un archivo PNG cortando y pegando, el archivo se convertirá en una imagen bitmap.

Las imágenes vectoriales de Flash (SWF), Adobe Illustrator, y los archivos WMF se importarán como un grupo en la capa actual.

Las imágenes de mapa de bits (BMP, JPG, GIF...) se importarán como objetos individuales en la capa actual. Debido a que importar imágenes puede incrementar el tamaño de nuestras películas, Flash nos permitirá comprimir los archivos de imagen que importemos.

Una secuencia de imágenes será importada como una sucesión de fotogramas dentro de la capa actual.

Enlace vídeo:

2.2. Convertir imágenes bitmap en gráficos vectoriales El comando Trazar mapa de bits de Flash nos permitirá convertir una imagen bitmap en un gráfico vectorial editable. Use este comando para manipular la imagen como un gráfico vectorial o para reducir considerablemente su tamaño.

Enlace vídeo:

MACROMEDIA FLASH MX

16

2.3. Dibujo de formas simples Para crear formas simples en el escenario de nuestro proyecto de Flash, utilizaremos las herramientas Línea, Óvalo y Rectángulo que se encuentran en la paleta Herramientas del programa.

Enlace vídeo:

2.4. Dibujo de formas libres

Para crear formas más libres, utilizaremos la herramienta Lápiz. Con esta herramienta, podremos dibujar formas a “mano alzada” sobre el escenario. Una vez dibujadas las líneas, Flash las suavizará de forma automática. El grado de suavizado dependerá del modo de dibujo seleccionado en el área contextual Opciones.

Enlace vídeo:

2.5. Configuración y utilización de la herramienta Pluma

Con esta nueva herramienta, podremos crear segmentos de líneas rectas o curvas con puntos editables que nos permitirán modificar la forma de los objetos que creemos de una forma rápida y sencilla. Flash nos permitirá configurar algunas preferencias para esta herramienta. Por defecto, cuando utilizamos esta herramienta, no podemos tener un control muy fiable de lo que vamos haciendo, debido a que no vemos lo que estamos dibujando hasta una vez finalizado, así que resultará de gran utilidad configurar una serie de opciones que nos pueden ayudar antes de ver su utilización.

Enlace vídeo:

MACROMEDIA FLASH MX

17

2.6. Dibujo con la herramienta Pincel

La herramienta Pincel nos permitirá pintar directamente sobre el escenario. Con ella podremos rellenar zonas de color. Esta herramienta presenta un gran número de opciones en el área contextual de la paleta, que nos permitirán configurar desde la forma y tamaño del pincel hasta cómo afectará su uso a los elementos contenidos en el escenario. Además, si el tipo de relleno activo es un mapa de bits, conforme va usando la herramienta para dibujar sobre el escenario, aparecerá la imagen establecida como relleno.

Enlace vídeo:

2.7. Borrado de objetos en Flash

Para borrar objetos en Flash, utilizaremos la herramienta Borrador de la paleta. Utilizando esta herramienta, podremos borrar líneas y rellenos de una manera rápida. Al igual que ocurría con la herramienta Pluma, el comportamiento de esta herramienta es configurable y su utilización, como veremos a continuación, es muy similar.

Enlace vídeo:

2.8. Contornos y rellenos Hasta ahora hemos visto que los objetos que creamos en Flash están compuestos por contornos y rellenos. Los contornos son las líneas, de más o menos grosor, que definen la forma del objeto. Por el contrario, los rellenos son los espacios interiores delimitados por esos contornos.

El contorno y el relleno de un objeto son seleccionables por separado. En cualquier momento, podremos utilizar las herramientas Bote de tinta para modificar el contorno de un objeto o Cubo de pintura para cambiar el relleno de un objeto. Por defecto, Flash crea rellenos cuando hacemos formas cerradas con las herramientas Óvalo, Rectángulo y Pluma. Este relleno será del color que tengamos activo en el área Colores de la paleta Herramientas. Es posible desactivar el relleno de los objetos, o bien rellenarlos, utilizando una imagen bitmap.

Enlace vídeo:

MACROMEDIA FLASH MX

18

2.9. Trabajo con rellenos sólidos y degradados Flash ofrece la posibilidad de trabajar con dos tipos de color de relleno: sólidos y degradados. A continuación, veremos algunas explicaciones de cómo crear su propia configuración de colores y a trabajar con las paletas de colores de Flash. Para trabajar con colores, resulta de gran utilidad tener abierto el nuevo panel Mezclador de colores.

Flash tiene siempre a nuestra disposición, una paleta de colores donde podemos seleccionar el color que deseemos utilizar. Solamente tendremos que hacer clic con el ratón sobre la muestra de color, y Flash automáticamente desplegará la paleta de colores donde podremos seleccionar aquél que más nos guste.

MACROMEDIA FLASH MX

19

Un degradado es una transición matizada entre dos o más colores. Flash realiza esta transición en bandas lineales o en círculos concéntricos, dependiendo de la opción que tengamos activa en la lista desplegable del panel Mezclador de colores.

Enlace vídeo:

2.10. Modificación de líneas y contornos Ya hemos visto cómo podemos cambiar fácilmente el tipo de relleno que aplicará Flash a los objetos de forma cerrada. A continuación, aprenderemos el manejo del panel Propiedades que nos facilitará la configuración del color, estilo y grosor de las líneas y contornos que creemos.

Enlace vídeo:

MACROMEDIA FLASH MX

20

2.11. La herramienta Bote de Tinta

Se utiliza para cambiar los atributos de las líneas o contornos de formas. Con esta herramienta, sólo se pueden aplicar colores sólidos, pero no degradados ni mapas de bits. Cuando se tienen que cambiar los atributos de varios objetos a un mismo tiempo, es más fácil utilizar esta herramienta que andar seleccionando las líneas individualmente.

Enlace vídeo:

2.12. La herramienta Cubo de pintura

Con esta herramienta podremos colorear áreas cerradas. Podremos colorear áreas vacías o cambiar el color de áreas ya pintadas. Podremos utilizar colores sólidos, degradados y mapas de bits. Al activar esta herramienta, en el área Opciones aparece el modificador Tamaño de hueco que permitirá rellenar áreas que no están cerradas por completo.

Enlace vídeo:

2.13. Herramientas de texto en Flash

Hasta ahora, hemos visto cómo crear todo tipo de objetos en Flash, pero si verdaderamente queremos darle una dimensión extra a nuestras películas, deberemos colocar bloques de textos en el escenario. Con Flash, podremos ajustar la fuente, el estilo, tamaño, color y alineación de los textos que introduzcamos, del mismo modo que si estuviésemos en un procesador de texto de Windows. Además, también podremos aplicar transformaciones a los textos, tales como rotaciones, simetrías, escalas, etc.

Enlace vídeo:

2.14. Creación de campos de texto dinámicos Los campos de textos nos permitirán situar texto en una película, a la vez que ésta se está reproduciendo. De este modo, podremos crear fácilmente formularios o encuestas en Flash. Un campo de texto puede ser usado para que el usuario introduzca información y también para mostrar información variable usando ActionScript.

Enlace vídeo:

MACROMEDIA FLASH MX

21

2.15. Simulación: Importar un archivo Utilice las opciones de importación de Macromedia Flash para importar el archivo "imagen.bmp".

Enlace simulación:

2.16. Simulación: Transformar mapa de bits en gráfico vectorial Use el comando Trazar mapa de bits para transformar la imagen importada en un gráfico vectorial. Utilice las opciones por defecto del cuadro de diálogo.

Enlace simulación:

2.17. Simulación: Configurar la herramienta Pluma Utilice el cuadro de diálogo Preferencias para configurar la herramienta Pluma y poder previsualizar los segmentos de línea que vayamos dibujando sobre el escenario, con lo que obtendremos mayor control sobre ellas.

Enlace simulación:

2.18. Práctica: Copiar dibujos Si tiene dificultades a la hora de dibujar a mano alzada utilizando el ratón, o no tiene suficiente imaginación para crear sus propios diseños, podrá utilizar la técnica que se explica en esta práctica para copiar dibujos. Solamente necesitaremos una imagen en formato “*.gif” o “*.jpg” que importaremos dentro de la película.

MACROMEDIA FLASH MX

22

2.19. Práctica: Aprendiendo a dibujar en Macromedia Flash Macromedia continúa evolucionando el programa multimedia más popular creado para diseño Web. Flash, además de ser una herramienta indispensable para la creación de animaciones e interacciones para Internet, presenta una serie de herramientas de dibujo de un gran potencial y versatilidad. De hecho, los diseñadores pasan por alto que Flash puede ser usado para crear gráficos de alta resolución. Usando las técnicas que se describirán a continuación, aprenderá a usar las herramientas de dibujo de Flash creando una imagen vectorial.

Recuerda: El paso previo que tenemos que hacer para utilizar una imagen bitmap como relleno es utilizando la opción Separar del menú Modificar. Los gráficos vectoriales pueden editarse sin afectar a su calidad. El comando de Macromedia Flash que nos permitirá convertir imágenes bitmap en gráficos vectoriales es el comando Trazar mapa de bits del menú Modificar. La tecla que deberemos mantener pulsada para dibujar una circunferencia es la tecla MAYUS. El panel que utilizaremos para configurar el color, estilo y grosor de las líneas y contornos que creemos es el panel Propiedades. El menú que nos dirigiremos si queremos importar un gráfico en nuestra película es el menú Archivo. La herramienta que deberemos utilizar para crear sectores y donut es la herramienta Óvalo. El panel que utilizaremos para crear un relleno degradado es el panel Mezclador de Colores. La forma que podremos crear formas cerradas sin relleno se consigue en el área RELLENO Y TRAZO, pulsaremos con el ratón sobre Color de relleno y activaremos la opción Sin color. La herramienta que utilizaremos si queremos crear formas a "mano alzada" sobre el escenario es la Herramienta Lápiz.

MACROMEDIA FLASH MX

23

3. SELECCIÓN Y MANIPULACIÓN DE OBJETOS En este capítulo, veremos las distintas formas de seleccionar objetos sobre el escenario que nos ofrece Macromedia Flash. La selección es uno de los procesos principales de cualquier programa de diseño. Para aplicar cualquier modificación (mover, copiar, agrupar, transformar y alinear) a un objeto, previamente hay que tenerlo seleccionado.

3.1. Selección y transformación de objetos con la herramienta Flecha

La herramienta Flecha nos será muy útil a la hora de seleccionar objetos enteros, ya sea haciendo clic sobre un objeto o arrastrando con el ratón una región de selección rectangular. Además, dependiendo del tipo de objeto (contorno o relleno), podremos hacer algunas transformaciones a la vez que realiza la selección.

Enlace vídeo:

3.2. Uso de la herramienta Lazo

La herramienta Lazo de Macromedia Flash nos permitirá seleccionar áreas no rectangulares dibujando un contorno a mano alzada. Si, además, utilizamos el modificador Modo Polígono del área contextual, podremos crear áreas de selección poligonales.

Enlace vídeo:

3.3. Agrupación de objetos En muchas ocasiones, para manipular los elementos que tengamos en el escenario, deberemos tenerlos agrupados como objetos sencillos. En los objetos agrupados, podremos editar de forma individual los objetos que forman el grupo.

Enlace vídeo:

MACROMEDIA FLASH MX

24

3.4. Objetos no agrupados En Flash, los objetos no agrupados tienen una manera muy especial de interactuar entre sí. Esta interacción permite combinar objetos entre sí para conseguir formas nuevas. Estos comportamientos siguen estas reglas:

Fusión: Cuando superponemos un relleno sobre otra forma rellena con el mismo color, ambas formas se fusionan en una sola.

Sustracción: Cuando superponemos un relleno sobre otra forma rellenada de distinto color, la forma superior recorta la forma subyacente.

Intersección: Cuando un contorno cruza a otro, sea del color que sea, automáticamente, las líneas que interseccionan se descomponen en los segmentos que quedan formados por el cruce de las líneas.

3.5. Mover y copiar objetos en Flash

Para mover objetos sobre el escenario, podremos hacerlo arrastrando directamente el objeto sobre el escenario con la herramienta Flecha activada, utilizando los comandos cortar y pegar o moviéndolos directamente con las teclas de control del teclado. Además, podremos utilizar el portapapeles de Windows para mover un objeto entre Flash y otras aplicaciones. También podremos mover y redimensionar los objetos por el escenario utilizando el panel Info o el panel Propiedades. Estos paneles utilizan las mismas unidades especificadas en el área Unidades de regla del cuadro de diálogo Propiedades del documento.

Enlace vídeo:

3.6. Escalar objetos en Flash Una de las transformaciones más comunes que podremos realizar con Flash es el escalado de objetos, que nos permitirá alargar o reducir un objeto de forma horizontal, vertical o en ambos sentidos. Con Flash, podremos escalar objetos de distintas maneras que a continuación pasaremos a ver:

Enlace vídeo:

MACROMEDIA FLASH MX

25

3.7. Transformación libre de objetos

La nueva herramienta Transformación libre nos permitirá transformar objetos, grupos, instancias o bloques de texto libremente. En el área Opciones de la paleta Herramientas, aparecen una serie de opciones que nos permitirán realizar combinaciones con varias transformaciones como el movimiento, la rotación, la escala y la distorsión.

Enlace vídeo:

3.8. Distorsión de objetos Otra de las novedades que nos ofrece Flash es la posibilidad de distorsionar un objeto seleccionado. Si se arrastra un selector de esquina o lateral, se mueve la esquina o el borde y se vuelven a alinear los bordes adyacentes. Si arrastramos un punto angular con la tecla MAYÚS presionada, el ángulo y la esquina adyacente se mueven a la misma distancia y en la dirección opuesta.

NOTA: Este comando no puede utilizarse para modificar símbolos, imágenes, vídeos, grupos de objetos ni textos.

Enlace vídeo:

3.9. Envoltura de objetos Este nuevo modificador nos permitirá deformar y distorsionar objetos. Una envoltura es un cuadro de delimitación que contiene uno o más objetos. Los cambios que realicemos en la forma de una envoltura, afectarán a la forma de los objetos contenidos en ella.

Enlace vídeo:

NOTA: Al igual que ocurría con el comando Distorsionar, este comando no puede utilizarse para modificar símbolos, imágenes, vídeos, grupos de objeto ni textos.

MACROMEDIA FLASH MX

26

3.10. Rotar y sesgar objetos en Flash Del mismo modo visto en la aplicación anterior, en Flash podremos rotar un objeto alrededor de un punto. Por defecto, dicho punto de rotación estará en el centro del objeto, pero Flash nos permitirá moverlo para obtener diferentes resultados. Además, podremos sesgar un objeto inclinándolo a lo largo de sus ejes.

Enlace vídeo:

3.11. Alineación de objetos Con el panel Alinear, podremos alinear dos o más elementos seleccionados de la escena a lo largo de los ejes vertical y horizontal. Además, podremos distribuir los objetos seleccionados esparciéndolos por el escenario y redimensionarlos.

El panel Alinear muestra numerosas opciones que podremos seleccionar para alinear imágenes. Cada botón muestra una pequeña imagen representativa de cómo serán alineados los objetos. En Flash, las opciones de alineación se presentan de manera más clara.

Enlace vídeo:

MACROMEDIA FLASH MX

27

3.12. Simulación: Escalar una imagen mediante el panel Info Utilice el panel Info para escalar la imagen colocada sobre el escenario. Ajuste las dimensiones para que coincida con las del escenario que son 550 de Ancho y 400 de Alto.

Enlace simulación:

3.13. Simulación: Alinear una imagen en el escenario Utilice el panel Alinear para alinear la imagen de la escena en el centro del escenario.

Enlace simulación:

3.14. Práctica: Macromedia Shockzone En esta práctica, vamos a realizar una animación que se ha estado viendo en la página Web de Macromedia durante varios años. Se trata de una animación creada por Hillman Curtis, director general y director creativo de “hillmancurtis.com, Inc.” empresa de diseño de Nueva York, que hoy día se encuentra a la vanguardia del diseño de gráficos en movimiento para la Web.

MACROMEDIA FLASH MX

28

Recuerda:

Para seleccionar un contorno formado por líneas conectadas entre sí utilizando la herramienta

Flecha haremos un doble clic en una de las líneas que lo componen.

La herramienta que utilizaremos para seleccionar áreas no rectangulares dibujando un contorno

a mano alzada es la Herramienta Lazo.

Para seleccionar un conjunto de líneas unidas por sus vértices hay que hacer doble clic sobre

cualquier parte de la línea

Podemos copiar objetos utilizando la herramienta Flecha: Arrastrando el objeto sobre el

escenario con la tecla CTRL pulsada.

Para diferenciar un objeto agrupado de otro que no lo está, al seleccionarlo sobre el escenario de

nuestra película los objetos agrupados se muestran encerrados en un área rectangular.

La herramienta que utilizaremos para seleccionar objetos enteros con un simple clic sobre el

escenario es la Herramienta Flecha.

La combinación de teclas que nos permitirá agrupar objetos es CTRL+G.

El modo que podemos escalar un objeto que tengamos seleccionado en el escenario, es

utilizando el panel Transformar.

MACROMEDIA FLASH MX

29

4. TRABAJAR CON FRAMES Y CAPAS EN FLASH Ahora que ya conoce cómo crear y editar elementos en Flash, es el momento de darle un poco de orden a nuestra composición. Para ello, Flash pone a nuestra disposición las capas y los frames (fotogramas). Veremos que es en la ventana Línea de Tiempo, donde se establece la duración de una animación y se ensambla la ilustración en capas. Además, con el uso de capas, podremos cambiar fácilmente el apilamiento de los elementos de una escena, cambiando la posición de las capas en la Línea de Tiempo.

4.1. Información general sobre los fotogramas La Línea de Tiempo de Flash es el lugar donde se organiza y controla el contenido de una película. Este contenido se organiza en capas y fotogramas. Observe la siguiente ilustración, puede ver una pequeña imagen que describe lo que significa cada fotograma en la Línea de Tiempo de Flash:

Fotograma clave vacío: Aparece representado por un círculo vacío en el fotograma. Esto quiere decir que no hay ningún objeto en esos fotogramas. El área ocupada por los fotogramas que vienen a continuación es de color blanco.

Fotograma clave: Indicado por un círculo negro en el fotograma. Significa que hay objetos en esos fotogramas. Hasta que no se coloque un fotograma clave vacío o borre los objetos, esta área se representará de color gris.

Fotogramas de interpolación de movimiento: Indica que tenemos un objeto que ha sufrido un desplazamiento, escala o rotación desde un punto A a otro B dentro de una capa de la Línea de Tiempo. El área ocupada por los fotogramas de la interpolación es de color azul.

Fotogramas de interpolación de forma: Representa la transformación de un objeto en otro a lo largo de un número de fotogramas. El área entre los fotogramas claves aparece representada de color verde.

Acción en Fotograma: Se representa con una pequeña letra “a” minúscula. Nos informa de que existe una acción asociada a ese fotograma.

Fotograma de sonido: Se representa por una onda que cruza los fotogramas afectados. Para movernos por la Línea de Tiempo de Flash, podemos utilizar el cabezal de lectura que aparece en la parte superior del cuadro. El encabezado de la Línea de Tiempo muestra los números de los fotogramas de la animación.

MACROMEDIA FLASH MX

30

La forma de visualizar los fotogramas en la Línea de Tiempo puede configurarse utilizando el menú emergente de visualización situado en la parte derecha del cuadro. De forma predeterminada, los frames aparecen como celdas estrechas. Por medio de este menú, podremos cambiar el tamaño de las mismas e incluso ver una representación preliminar del contenido de la escena dentro de la Línea de Tiempo.

Para cambiar la anchura de las celdas de los frames, seleccione Muy pequeño, Pequeño, Normal, Mediano o Grande.

Para reducir la altura de las celdas de los fotogramas, active la opción Corto.

Para que las secuencias de fotogramas se muestre en la Línea de Tiempo con un color, active la opción Fotogramas coloreados.

En la parte final del menú, aparecen dos opciones de previsualización que permiten mostrar una imagen reducida del contenido de un fotograma dentro de la Línea de Tiempo. Estas miniaturas pueden resultar muy útiles para previsualizar una animación.

4.2. Creación de etiquetas y comentarios Las etiquetas de fotogramas son usadas para identificar los fotogramas claves en la Línea de Tiempo. Un fotograma clave es un frame en el que se define cualquier cambio en una animación. Las etiquetas aparecen representadas en la Línea de Tiempo por una pequeña banderita de color rojo. Si movemos o eliminamos un frame, la etiqueta asociada se mueve con el frame al que originalmente estaba vinculado. Los comentarios se usan para anotar observaciones personales sobre las acciones establecidas en la Línea de Tiempo. Los comentarios no se exportan con los datos de la película, así que pueden tener la longitud que desee. En la Línea de Tiempo se representan con dos pequeñas barras de color verde.

Enlace vídeo:

MACROMEDIA FLASH MX

31

4.3. Utilización de anclajes Otra de las grandes novedades de Macromedia Flash son los anclajes, que ayudarán a mejorar la navegación en las películas de Flash, ya que permiten que los usuarios utilicen los botones de avance y retroceso de sus navegadores para saltar de un anclaje a otro dentro de un mismo documento. Los fotogramas clave con anclajes se representan en la Línea de Tiempo mediante un icono en forma de ancla.

Enlace vídeo:

4.4. Información general sobre las capas Las capas son extremadamente importantes en Flash. En una película, puede tener tantas capas como necesite. De hecho, es mejor crear una nueva capa por cada objeto que creemos, de esta forma, nos será más fácil realizar cualquier modificación sin afectar a otros objetos de la escena.

Para renombrar una capa, haga un doble clic sobre el nombre de la capa que desee cambiar y escriba el nuevo nombre cuando aparezca el cursor de texto. Hacer esto resultará de gran ayuda para organizar la estructura de nuestra película. Además, podremos cambiar el orden de las capas sólo con arrastrarlas hacia arriba o hacia abajo dentro de la lista. Hemos de tener en cuenta que, las capas siempre se visualizan de manera que la capa superior se sobrepone sobre las capas inferiores.

MACROMEDIA FLASH MX

32

A continuación, vamos a ver los cinco modos de presentación de una capa en Flash. Estas opciones nos resultarán de gran interés a la hora de trabajar sobre una escena, especialmente si hay muchos objetos.

1. Modo activo: Es la capa representada con un icono de un lápiz, está situado junto al nombre e indica que está activa. Sólo puede haber activa una capa.

2. Modo normal: Este es el modo en que se muestra una capa cuando no se está haciendo nada en ella.

3. Modo bloqueo: Cuando una capa está bloqueada, no se podrá seleccionar ningún objeto contenido en dicha capa. Para identificar rápidamente una capa bloqueada, aparece un pequeño candado junto al nombre de la capa.

4. Modo oculto: Cuando una capa está oculta, los objetos contenidos en ella no se muestran en el escenario. Un icono con forma de “X” nos indica que una capa está oculta.

5. Modo contorno: Cuando está activo, los objetos de la capa se muestran como contornos sin los detalles de los gráficos.

4.5. Creación de capas

Cuando creamos una nueva capa en Flash, ésta aparecerá justo encima de la capa que tengamos seleccionada en ese momento y, además, se convertirá de forma automática en la capa activa.

Enlace vídeo:

4.6. Capas guías Para ayudarnos cuando dibujamos, podremos usar las capas guías, que sirven para utilizar los contenidos de esa capa, como guías de referencia para el posicionamiento de los elementos sobre el escenario. Estas capas las podemos reconocer fácilmente por el icono de guía situado delante del nombre de la capa. Posteriormente, los elementos incluidos en la capa guía no serán visibles en la película final.

Enlace vídeo:

MACROMEDIA FLASH MX

33

4.7. Capas máscara Las capas máscaras se utilizan para ocultar todo aquello vinculado a dicha capa, excepto el lugar donde se sitúe un objeto con relleno. Cualquiera de las formas que dibujemos en esta capa, serán las formas a través de las que se muestre el contenido de las capas, quedando invisible lo que quede fuera de esta forma. Este tipo de capas son muy útiles para crear distintos efectos y composiciones más atractivas.

Enlace vídeo:

4.8. Simulación: Insertar y modificar una capa En primer lugar, utilice el icono Insertar capa de la Línea de Tiempo para crear una nueva capa con el nombre "Sonidos". A continuación, a través del menú Modificar cambie el nombre de la capa a "Imágenes".

Enlace simulación:

4.9. Práctica: Creación de menús animados Para esta práctica, vamos a crear un menú animado que interactuara al pasar el puntero del ratón por encima de un botón. Este es un ejercicio bastante largo, que nos llevará una hora de realización aproximadamente.

MACROMEDIA FLASH MX

34

Recuerda: La representación de las etiquetas usadas para identificar los fotogramas de la Línea de Tiempo es con una pequeña banderita de color rojo. Para reconocer un fotograma clave en la Línea de tiempo de nuestra película aparece representado por un círculo negro en el fotograma. Para reconocer la capa activa de nuestra película se representa con un icono de un lápiz situado junto al nombre de la capa. La forma que podremos renombrar una capa es usando el cuadro de diálogo Propiedades de Capa. Para reconocer una interpolación de forma en la Línea de tiempo de nuestra película lo visualizamos mediante el área ocupada por los fotogramas de la interpolación de color verde. La función principal de una capa guía es utilizar los contenidos de una capa como referencia para el posicionamiento de elementos en el escenario.

MACROMEDIA FLASH MX

35

5. BIBLIOTECA: SÍMBOLOS E INSTANCIAS En este nuevo tema, vamos a tratar el uso de los símbolos e instancias de Macromedia Flash. Veremos que todos los elementos que creemos en nuestro escenario, se pueden almacenar en una biblioteca para tenerlos disponibles en futuras utilizaciones. Cada archivo de Flash presenta su propia biblioteca y podemos almacenar imágenes de mapa de bits, sonidos y archivos de vídeo. Para finalizar, veremos la forma de modificar el brillo, color y transparencia de las instancias de nuestra película.

5.1. La Biblioteca de símbolos de Flash Todo documento de Flash tiene una biblioteca de objetos asociada. En esta biblioteca se van almacenando y organizando los elementos gráficos creados en Flash como símbolos o importados desde otras aplicaciones. Tres son los tipos de símbolos que puede crear:

Gráficos: Los gráficos se usan para imágenes estáticas y para crear piezas de animación reutilizables ligadas a la Línea de Tiempo de la película.

Clip de película: Utilice símbolos de clips de películas para crear piezas de animación reutilizables que se reproduzcan de forma independiente de la Línea de Tiempo de la película principal.

Botones: Con estos símbolos, crearemos botones interactivos en nuestras películas. Podrá definir el gráfico asociado a cada estado del botón, y asignarle acciones a las distintas instancias del botón.

Al seleccionar un elemento de la ventana de biblioteca, Flash muestra una visualización previa del mismo en la parte superior de la ventana. Si el elemento seleccionado es animado o es un archivo de sonido, utilice el controlador para previsualizarlo.

Puede organizar los elementos de biblioteca en carpetas. Las columnas de la ventana de biblioteca muestran el nombre de un elemento, su tipo, el número de veces que se utiliza en el archivo y la fecha en que se modificó por última vez. Puede ordenar los elementos de la ventana de biblioteca por cualquier columna.

MACROMEDIA FLASH MX

36

Además, Flash nos permitirá abrir las bibliotecas de cualquier archivo “*.FLA” (formato estándar de las películas de Flash) para utilizar cualquier elemento disponible en el archivo abierto en nuestra película.

Enlace vídeo:

5.2. Creación de símbolos En la siguiente aplicación, veremos las distintas formas que nos ofrece Flash para la creación de símbolos. Aprenderemos a realizar un símbolo vacío, a hacer o importar el contenido en él y a crear símbolos a partir de objetos seleccionados directamente sobre el escenario.

Enlace vídeo:

5.3. Creación de botones Los botones son una parte esencial en toda película de Flash si desea crear una interactividad. Un botón es precisamente uno de los tres símbolos que puede crear en Flash, pero, a diferencia de los otros símbolos, ahora la Línea de Tiempo sólo tiene cuatro fotogramas. Los primeros tres fotogramas muestran el botón en sus tres posibles estados: Reposo, Sobre, Presionado; el cuarto fotograma define el área activa del botón.

MACROMEDIA FLASH MX

37

Los estados de representación de un botón en los diferentes fotogramas son algo que debe conocer a la hora de crearlo. A continuación, veremos una pequeña explicación de cada función: Reposo: Representa al botón en su estado natural cuando el puntero del ratón no está sobre él.

Sobre: Este segundo fotograma representa el estado del botón cuando pasamos el cursor del ratón sobre él.

Presionado: Este fotograma representa el aspecto que tendrá el botón en el momento de hacer un clic sobre él

Zona activa: Este estado nunca será visible cuando representemos nuestra película. Representa el área que responderá al ratón

NOTA: Uno de los principales problemas con los que se puede encontrar un nuevo usuario de Flash es la realización de botones de texto. Si el usuario no coloca un área rellena en el fotograma Zona activa, ocurrirá que sólo las líneas del texto podrán ser seleccionables, con lo que resultará un poco difícil poder pulsar el botón.

Enlace vídeo:

MACROMEDIA FLASH MX

38

5.4. Intercambiar símbolos Con Macromedia Flash podremos intercambiar símbolos para poder visualizar una instancia diferente en nuestra escena conservando todas las propiedades de la instancia original, como los efectos de color o las acciones asignadas a un botón.

Enlace vídeo:

5.5. Trabajar con carpetas en la ventana Biblioteca La ventana Biblioteca de Flash nos permite organizar los elementos almacenados en nuestra película usando carpetas, del mismo modo que si estuviéramos dentro del Explorador de Windows. Cuando creamos un nuevo símbolo, éste es almacenado en la carpeta seleccionada. Si no hay ninguna seleccionada, se almacenará en la raíz de la ventana Biblioteca.

Enlace vídeo:

5.6. Eliminación de elementos de una Biblioteca Cuando borramos un elemento de la ventana Biblioteca, todas las instancias o apariciones de ese elemento dentro de la película son también borradas. Por lo tanto, tenemos que tener un gran cuidado a la hora de eliminarlos, ya que una vez borrado un elemento, no podremos recuperarlo, a no ser que tengamos guardados esos cambios y carguemos la escena de nuevo. Para evitar posibles confusiones, sabrá si el elemento está siendo usado visualizando la columna Número de usos de la ventana Biblioteca.

MACROMEDIA FLASH MX

39

Puede reducir considerablemente el tamaño de un archivo de Flash, si elimina todos los elementos de la biblioteca que no se estén utilizando. De todas formas, si no los elimina, no pasará nada, ya que estos elementos al no estar utilizados no aparecerán cuando reproduzcamos nuestra película.

Enlace vídeo:

5.7. Cambiar las propiedades de las instancias Cada instancia de un símbolo en Flash tendrá sus propias propiedades y podrán ser configuradas de forma independiente. Podremos configurar las opciones de color y la transparencia, de una forma fácil, usando el panel Propiedades. Este panel nos permite configurar las siguientes propiedades de una instancia:

Brillo: Con esta opción, podremos ajustar la luminosidad u opacidad de una imagen. El valor se podrá establecer en una escala comprendida entre el negro (-100%) y el blanco (100%).

MACROMEDIA FLASH MX

40

Tinta: Con esta opción, podremos aplicar un color a la instancia con el mismo matiz. Utilice el selector de color o los valores RGB para escoger el color de tinte. Utilice el control deslizante de la parte superior para configurar el porcentaje de color que se aplicará; los valores irán comprendidos entre un 0% (no se aplica tinte a la instancia) a un 100% (el color sustituye por completo a la instancia).

Alfa: Con este control podremos ajustar la transparencia de una instancia. Los valores irán comprendidos entre un 100% (la imagen no resulta afectada) y un 0% (la imagen se vuelve totalmente transparente).

Avanzado: Mediante esta opción, podremos ajustar por separado los valores de color rojo, verde, azul y la transparencia de una instancia. El uso de esta opción resultará de gran utilidad a la hora de crear y animar efectos de color sutiles en imágenes bitmaps.

Enlace vídeo:

MACROMEDIA FLASH MX

41

5.8. Simulación: Abrir la biblioteca Utilice el menú Ventana para abrir la biblioteca de la película.

Enlace simulación:

5.9. Simulación: Crear un símbolo gráfico Utilice el menú Insertar para crear un nuevo símbolo gráfico con el nombre "LOGOTIPO".

Enlace simulación:

5.10. Simulación: Convertir un objeto en símbolo gráfico Convierta el objeto gráfico de la escena en un símbolo gráfico con el nombre "Dibujo".

Enlace simulación:

5.11. Simulación: Eliminar un objeto de la biblioteca Utilice el botón Eliminar de la biblioteca de Flash para borrar el objeto almacenado en la biblioteca de nuestra película.

Enlace simulación:

5.12. Simulación: Consulta de la biblioteca Utilice el botón Opciones de la biblioteca para que se muestre el número de veces que son usados en nuestra película los elementos de la biblioteca.

Enlace simulación:

MACROMEDIA FLASH MX

42

5.13. Simulación: Visibilidad de la instancia de la escena Utilice el panel Propiedades para reducir la visibilidad de la instancia de la escena a un 50%.

Enlace simulación:

5.14. Práctica: Visibilidad de un clip de película En este tutorial aplicará los conocimientos de Macromedia Flash para crear una página de inicio de un grupo de música. Para ello, utilizaremos símbolos animados y botones que configuraremos nosotros mismos. El conocimiento y el dominio de las posibilidades que ofrecen los símbolos es crucial para el aprendizaje del programa.

Recuerda: Para proceder a crear un nuevo símbolo vacío accedemos al menú Insertar y seleccionaremos la

opción Nuevo símbolo.

La opción Brillo del panel Propiedades nos permitirá ajustar la luminosidad de una imagen.

Desde el menú Archivo podremos abrir la biblioteca de un archivo guardado.

Los tipos de símbolos que podremos crear con Flash son tres.

La manera que podremos abrir la ventana Biblioteca de Flash es seleccionando la opción Biblioteca

desde el menú Ventana.

La forma de poder saber si un elemento de la biblioteca está siendo utilizado en nuestra película es

visualizando la columna Número de usos de la ventana Biblioteca.

La opción ALFA del panel Propiedades nos permitirá ajustar la transparencia de una instancia.

Desde menú Modificar podremos convertir un objeto seleccionado en un símbolo.

MACROMEDIA FLASH MX

43

6. ANIMACIÓN Antes de empezar a animar una escena, hemos de conocer el escenario en donde organizaremos los elementos de nuestro proyecto. Luego, tenemos que conocer los dos métodos que nos ofrece Flash para crear una secuencia animada: la animación fotograma a fotograma y la animación por interpolación. A lo largo de este tema, se verán estos dos métodos de manera detallada. Para finalizar, verá las distintas opciones que le ofrece Flash para editar nuestra película.

6.1. Uso de escenas en Flash Las escenas son usadas para organizar una película en diferentes secciones. En un proyecto, usaremos tantas escenas como queramos. Por ejemplo, podemos crear una escena para representar la introducción de nuestra película y, a continuación, distintas escenas para cada vínculo que creemos. Si observa las imágenes que a continuación aparecen, podemos hacernos una idea de cómo se puede trabajar en Flash con las escenas.

Escena 1: Menú

Escena 2: Fundamentos

MACROMEDIA FLASH MX

44

Para crear, renombrar, borrar, duplicar y organizar las escenas de nuestra película, utilizaremos el panel Escena. Por defecto, Flash le asigna el nombre Escena 1 a nuestra escena. Conforme añadimos nuevas escenas a nuestro proyecto, se irán nombrando automáticamente como Escena 2, Escena 3, y así sucesivamente. Cuando tenga más de una escena en una película, aparecerán listadas en el orden de creación dentro del panel.

Enlace vídeo:

6.2. Animación de fotograma a fotograma Un fotograma clave es un fotograma donde se define un cambio en uno o más objetos de la escena. Para crear animaciones fotograma a fotograma, deberemos de crear tantos fotogramas claves como fotogramas tenga nuestra animación. Los fotogramas claves aparecen representados en la Línea de Tiempo de Flash con un pequeño círculo sólido dentro del fotograma, y los fotogramas claves vacíos con un círculo hueco.

Enlace vídeo:

MACROMEDIA FLASH MX

45

6.3. Extensión de imágenes de fondo en una animación Para colocar imágenes de fondo que se mantengan durante la reproducción de nuestra animación, no será necesario crear fotogramas clave en cada fotograma de la película, sino que iremos añadiendo nuevos fotogramas para que el contenido de la capa se extienda en la totalidad de la película.

Enlace vídeo:

6.4. Interpolación de movimiento entre dos puntos La interpolación es el término usado por Flash para las animaciones. Flash puede interpolar la posición, tamaño, rotación e inclinación de instancias. También podremos interpolar el color de las instancias. Una interpolación nos permitirá colocar un objeto en un punto A, moverlo a un punto B y entonces, Flash creará de forma automática todos los pasos intermedios.

Si una vez realizada una interpolación, desea cambiar el número de fotogramas entre los dos fotogramas claves, lo podrá hacer de forma automática desplazando los fotogramas a lo largo de la Línea de Tiempo.

Enlace vídeo:

MACROMEDIA FLASH MX

46

6.5. Interpolación de movimiento a lo largo de un recorrido Para crear una interpolación de movimiento a lo largo de un recorrido, deberemos dibujar la trayectoria del recorrido a seguir en una capa guía de movimiento, a la que vincularemos los objetos que desee interpolar. Puede vincular varias capas a una guía de movimiento para hacer que varios objetos sigan el mismo recorrido.

Enlace vídeo:

6.6. Interpolación de formas (Morphing) La interpolación de formas se refiere comúnmente al morphing de formas. Un morphing es la técnica de animación mediante la cual una imagen es gradualmente convertida en otra. En Flash, tendremos dos objetos en fotogramas distintos y de forma automática se crearán los pasos intermedios necesarios para que se produzca la transformación.

Hay una par de cosas que hay que tener en cuenta a la hora de realizar una interpolación de formas. Lo primero y más importante, es que los objetos que intervengan en la interpolación deben estar totalmente separados en líneas y rellenos. En otras palabras, no se puede realizar un morphing entre símbolos u objetos agrupados. En segundo lugar, sólo podemos tener una interpolación de formas por capa. Para controlar los cambios más complejos de una interpolación de formas, podremos utilizar los consejos de forma de Flash. Los consejos de formas se utilizan para identificar los puntos que deberían corresponderse en las formas inicial y final.

MACROMEDIA FLASH MX

47

Los consejos de formas contienen letras para identificar los puntos que se corresponden en las figuras inicial y final. Podremos utilizar hasta 26 consejos los cuales corresponden con las letras del abecedario (a – z).

Enlace vídeo:

6.7. Edición de animaciones en Flash Después de crear una animación, podremos editarla moviendo los fotogramas claves que la forman a otro lugar de la capa actual o a otra capa de la película. Además, podremos eliminar fotogramas o hacer cualquier otro tipo de cambio que creamos oportuno. Para editar fotograma en una interpolación, deberemos cambiar alguno de los fotogramas claves que definen la animación, o podremos insertar alguno nuevo entre el inicial y el final. También podremos utilizar las opciones de Papel cebolla situada en la parte baja de la Línea de Tiempo para visualizar y editar varios fotogramas a la vez. Esto resultará de gran ayuda para posicionar y editar una animación fotograma a fotograma.

Enlace vídeo:

MACROMEDIA FLASH MX

48

6.8. Simulación: Mostrar la totalidad de fotogramas de una capa Seleccione el fotograma de la capa almacenada en la Línea de Tiempo y utilice el menú Insertar para que el contenido de la capa se extienda en la totalidad de fotogramas.

Enlace simulación:

6.9. Simulación: Crear una nueva escena Utilice el menú Modificar para crear una nueva escena con el nombre "Noticias".

Enlace simulación:

6.10. Práctica: Chimaira intro En esta nueva práctica, haremos una animación con el logotipo de la banda Chimaira. Para ello, crearemos cuatro capas y utilizaremos los distintos elementos de la biblioteca de la plantilla que tenemos que abrir. En la primera capa, crearemos una pequeña interpolación para que aparezca el logotipo. En la segunda capa, estableceremos la carga del resto de la película. En la tercera, colocaremos un primer archivo de sonido y, para terminar, en la cuarta, cargaremos un nuevo audio y utilizaremos un clip de película que muestra una animación del logo.

MACROMEDIA FLASH MX

49

6.11. Práctica: Chimaira menú

En este tutorial aplicará los conocimientos de Macromedia Flash para crear una página de inicio de un grupo de música y sus vínculos correspondientes. Para ello, utilizaremos símbolos animados y botones que configuraremos nosotros mismos. El conocimiento y dominio de las posibilidades que ofrecen los símbolos es crucial para el aprendizaje del programa.

Recuerda: La manera para poder acceder al panel Escena es a través del menú Ventana, eligiendo seguidamente la opción Paneles. Para proceder a mantener la visibilidad de un fondo en una animación de Flash insertamos un fotograma clave en el frame de la Línea de Tiempo hasta donde deseemos prolongar la película. Las operaciones que podrá realizar en el panel Escena es crear, renombrar, borrar, duplicar y organizar las escenas. Se entiende por fotograma clave un fotograma donde se define un cambio en uno o más objetos de la escena. Para proceder a incorporar un fotograma clave en una escena accedemos al menú Insertar y seleccionando la opción Fotograma clave.

MACROMEDIA FLASH MX

50

7. SONIDO Y MÚSICA EN FLASH Con Macromedia Flash, podremos exportar distintos tipos de sonidos para usarlos en nuestras películas. A lo largo de este tema, aprenderá a agregar efectos de sonidos a los botones o a crear nuestra propia “banda sonora” sincronizando la animación con el sonido. Para finalizar, aprenderemos a controlar la calidad y el tamaño de cada sonido exportado con el cuadro de diálogo Propiedades de sonido.

7.1. Importación de sonidos Para importar archivos de sonidos, procederemos del mismo modo visto a lo largo del curso para importar archivos de otro tipo. Flash nos permitirá importar archivos WAV (sólo Windows), AIFF (sólo Macintosh) o MP3 (desde cualquier plataforma).

Flash almacena todos los sonidos importados en la biblioteca junto con las imágenes y símbolos de la escena. Al igual que ocurría con los símbolos gráficos, necesitaremos sólo una copia de un archivo de sonido para usarla en nuestra película tantas veces como queramos.

Enlace vídeo:

7.2. Añadir sonidos a una película de Flash Una vez ya hemos visto la forma de importar los sonidos en la biblioteca de nuestra película, llega la hora de asignar estos sonidos a una capa. Si vamos a utilizar varios archivos de sonido en nuestra película, es conveniente que cada sonido lo coloquemos en una capa independiente.

Enlace vídeo:

MACROMEDIA FLASH MX

51

7.3. Añadir efectos de sonido a los botones Además de añadir sonido a una película de Flash, también podremos asociar distintos sonidos a los distintos estados de un botón. En la siguiente aplicación, veremos la forma de proceder para añadir un efecto de sonido a un botón cuando lo pulsamos:

Enlace vídeo:

7.4. Edición de sonidos

Para definir el punto de comienzo de un sonido o para controlar el volumen de los sonidos que se reproducen en una película, podremos usar los controles de edición de sonidos disponibles en el panel Propiedades de Flash. Estos controles nos permitirán reducir el tamaño de los archivos de sonido eliminando las secciones no utilizadas.

Enlace vídeo:

MACROMEDIA FLASH MX

52

7.5. Compresión de sonidos La velocidad de reproducción y el grado de compresión son de gran importancia para la calidad y el tamaño de sonidos en la exportación de las películas. Cuanto más comprimido está un sonido y menor es la velocidad de representación, menores son el tamaño y la calidad. Controle la calidad y el tamaño de los sonidos exportados de forma individual mediante los parámetros del cuadro de diálogo Propiedades de Sonido. Los archivos de sonido en formato MP3 ya están comprimidos cuando los importamos en nuestra película. De todas formas, podremos volver a comprimir si es necesario.

Enlace vídeo:

7.6. Simulación: Importar un archivo de sonido Utilice el menú Archivo para importar el archivo de sonido "Vapor Transmission.wav" a la Biblioteca de nuestra película.

Enlace simulación:

MACROMEDIA FLASH MX

53

7.7. Simulación: Compresión de sonidos Utilice el menú Opciones de la Biblioteca para configurar el grado de compresión del fichero de sonido importado en la simulación anterior. En el cuadro de diálogo Propiedades de sonido, utilice la opción MP3 de la lista desplegable Compresión.

Enlace simulación:

7.8. Práctica: Creación de bandas sonoras dinámicas En este tutorial, vamos a componer una pequeña banda sonora que podamos usar en una de nuestras películas, utilizando pedazos cortos de archivos de sonido y Macromedia Flash. Estos archivos de sonidos son pequeñas muestras mezcladas de distintos arreglos musicales, y su uso nos abre nuevas posibilidades para crear interactividad de audio en Flash.

Recuerda: La opción de compresión MP3 nos permitirá exportar eventos de sonidos cortos como pulsaciones. La opción de sincronización Flujo nos permitirá sincronizar el sonido de la película para reproducirlo en un sitio Web. El tipo de archivos de sonido que podremos importar con Flash e *.WAV. El efecto que aplicaremos a un sonido si deseamos que su amplitud aumente gradualmente durante su reproducción es Aumento progresivo. La combinación de teclas que utilizaremos para abrir el cuadro de diálogo Importar es CTRL+R.

MACROMEDIA FLASH MX

54

8. INTERACTIVIDAD BÁSICA En este primer capítulo, que dedicaremos a la interactividad que podremos lograr con Macromedia Flash, nos centraremos principalmente en las acciones básicas que podremos asignar a los objetos y fotogramas de una película. Aprenderá a reproducir y detener una película en el momento que desee, a saltar a un fotograma específico o escena de una película, a cargar una página Web determinada en el navegador de Windows y otras acciones que le darán mayor dinamismo a nuestras películas.

8.1. Creación de películas interactivas Las películas interactivas en Flash se crean mediante la configuración de acciones. Las acciones son una serie de instrucciones que se ejecutarán al producirse un evento concreto. Para que se ejecute una acción, será necesario que el cabezal de lectura de la Línea de Tiempo alcance un fotograma, que el usuario haga clic en un botón o presione teclas del teclado. Las instrucciones que configuremos pueden consistir en una sola acción que indique la detección de la reproducción de una película, o bien una serie de acciones que evalúen primero una condición antes de realizar una acción. Muchas de las acciones requieren poca experiencia en programación. Otras requieren el dominio del lenguaje de programación con el fin de realizar desarrollos muy sofisticados. En el panel Acciones, es donde podremos crear y editar las acciones para un objeto o fotograma usando dos diferentes modos de edición. Podremos seleccionar acciones ya definidas desde la lista de acciones haciendo un doble clic con el botón izquierdo del ratón, arrastrando y colocando las acciones directamente en el script, y usando el botón Agregar un nuevo elemento al script.

En Modo Normal, podremos escribir acciones usando parámetros (argumentos) en los campos editables que aparecen en la parte baja del panel. En Modo Experto, escribiremos y editaremos acciones escribiendo el script directamente en el editor.

Enlace vídeo:

MACROMEDIA FLASH MX

55

8.2. Acciones en fotogramas Asigne una acción a un fotograma clave para hacer que una película lleve a cabo una acción determinada cuando al reproducirse alcance dicho fotograma. Por ejemplo, para detener una película, puede añadir una acción de “stop” en el fotograma en que desee que la película se detenga, o especificar la acción “goto” para que la reproducción de la película salte hacia el fotograma o la escena que indiquemos. Es recomendable, que a la hora de colocar acciones sobre fotogramas de la escena, creemos una capa separada y no lo hagamos directamente sobre los fotogramas que contienen los objetos de la escena. Como ya vimos anteriormente, los fotogramas con acciones se representan en la Línea de Tiempo con una pequeña “a”.

Enlace vídeo:

8.3. Acciones en objetos Del mismo modo visto anteriormente, también podremos asignar una acción a un botón o a un clip de película para hacer que se ejecute una acción cuando hagamos clic sobre el botón o pasemos el puntero del ratón sobre él, o cuando el clip de película se cargue o alcance cierto fotograma. Para poder aplicar una acción a un objeto de la escena, previamente, estos objetos deben de ser instancias colocadas sobre el escenario, si no las opciones del panel aparecerán atenuadas y no podremos aplicarlas.

Enlace vídeo:

MACROMEDIA FLASH MX

56

8.4. Modificación de acciones En el panel Acciones, hay una serie de opciones que podremos utilizar para suprimir o modificar el orden y los parámetros de las acciones del script. Estos controles resultarán muy útiles para gestionar las acciones de fotogramas y objetos que contienen varias sentencias.

8.5. Saltar a un fotograma o escena Para saltar a un fotograma específico o escena de una película, usaremos la acción “goto”. Cuando la película pasa al nuevo fotograma especificado, ya sea dentro de la misma escena o en otra, podremos indicar si queremos que la película se reproduzca a partir de ese punto (opción por defecto) o si queremos que la película se detenga en ese nuevo fotograma.

Enlace vídeo:

MACROMEDIA FLASH MX

57

8.6. Reproducir y parar una película Por defecto, cuando reproducimos una película en Flash, se reproducen todos los fotogramas de la Línea de Tiempo y, de forma automática, al llegar al final, se vuelve a reproducir la película desde el principio de manera cíclica. Utilice las acciones “stop” y “play” para parar o iniciar la reproducción de una película a intervalos específicos. Por ejemplo, podremos detener una película en el fotograma final de una escena antes de continuar con la reproducción de la siguiente.

Enlace vídeo:

8.7. Ajustar la calidad de visualización de una película

Para activar y desactivar la visualización suavizada de una película, utilizaremos la acción “toggleHighQuality”. Con la visualización suavizada desactivada, se consigue que las películas de Flash se reproduzcan a mayor velocidad. Esta acción afecta a todas las películas reproducidas con reproductor de Flash.

Enlace vídeo:

8.8. Detener todos los sonidos de una película

Para detener la reproducción de una pista de sonido sin detener la reproducción de una película, utilizaremos la acción “stopAllSounds”. Esta acción afecta a todas las películas reproducidas con el reproductor de Flash.

Enlace vídeo:

MACROMEDIA FLASH MX

58

8.9. Llamar a una URL desde Flash Para cargar una página Web específica en el navegador de Windows, usaremos la acción “getURL”. Para probar esta acción, es necesario que el archivo a cargar se encuentre en la dirección definida en el script y debemos estar conectados a Internet.

Enlace vídeo:

8.10. Controlar la ventana del reproductor de Flash Para controlar la ventana de nuestra película que aparece al ejecutar el reproductor de Macromedia Flash, utilizaremos la acción “fscommand”. Esta acción tiene dos campos: Comando y Parámetros. Introduzca la cadena que desea enviar en el cuadro Comando. Si la cadena requiere funciones, introdúzcalos en el campo de edición Parámetros. Las siguientes sentencias de este comando permiten controlar la ventana del reproductor de Flash:

COMANDO PARÁMETROS FUNCIÓN

Quit. Cierra el proyector.

Fullscreen. True/False. "True" establece el reproductor en modo de pantalla completa. "False" devuelve el reproductor al modo normal de visualización de menús.

Allowscale. True/False. "False" establece el reproductor de forma que la película se dibuje siempre al 100% y la imagen nunca se ajuste a escala. "True" establece que el reproductor vuelva al modo predeterminado Mostrar todo.

Showmenu. True/False. "True" habilita la Barra de menús tanto de la ventana de reproducción como el que aparece al hacer clic con el botón derecho del ratón. "False" oculta la Barra de menús.

Trapallkeys. True/False. "False" activa los comandos de teclado para manejar el proyector de Flash. "True" desactiva el uso del teclado para manejar el proyector.

Exec. Ruta de acceso a la aplicación.

Ejecuta una aplicación desde el interior del proyector.

MACROMEDIA FLASH MX

59

CREAR UN BOTÓN QUE NOS CIERRE LA VENTANA DEL REPRODUCTOR DE FLASH

1. Seleccione un botón de la escena al que desee asignar la acción que nos permita cerrar el proyector de Flash.

2. Vaya al menú Ventana y seleccione la opción Acciones. 3. En la lista de acciones situada a la izquierda del panel, haga clic con el ratón en la categoría

Acciones para mostrar su contenido. 4. Seguidamente, haga clic en la subcategoría Navegador/Red y haga un doble clic con el

puntero del ratón sobre la acción “fscommand” para añadirla al script. 5. En la lista desplegable Comandos para reproductor autónomo, seleccione la opción “quit”

6. Cierre la ventana Acciones de objetos y reproduzca la película desde el proyector de Flash. 7. Haga clic sobre el botón para cerrar la ventana del reproductor de Flash.

REPRODUCIR UNA PELÍCULA A PANTALLA COMPLETA

1. Seleccione la instancia o el fotograma al cual desee asignar la acción. 2. Vaya al menú Ventana y seleccione la opción Acciones. 3. En la lista de acciones situada a la izquierda del panel, haga clic con el ratón en la categoría

Acciones para mostrar su contenido. 4. Seguidamente, haga clic en la subcategoría Navegador/Red y haga un doble clic con el

puntero del ratón sobre la acción “fscommand” para añadirla al script. 5. En la lista desplegable Comandos para reproductor autónomo, seleccione la opción

“fullscreen”.

6. Por defecto, en el campo de edición Parámetros se activa la opción “true”. Esta opción establece el reproductor en modo de pantalla completa.

7. Cierre la ventana Acciones de objetos y reproduzca la película desde el proyector de Flash. DESACTIVAR LA VISUALIZACIÓN DE LA BARRA DE MENÚS DEL PROYECTOR DE FLASH

1. Seleccione la instancia o el fotograma al cual desee asignar la acción. 2. Vaya al menú Ventana y seleccione la opción Acciones. 3. En la lista de acciones situada a la izquierda del panel, haga clic con el ratón en la categoría

Acciones para mostrar su contenido. 4. Seguidamente, haga clic en la subcategoría Navegador/Red y haga un doble clic con el

puntero del ratón sobre la acción “fscommand” para añadirla al script. 5. En la lista desplegable Comandos para reproductor autónomo, seleccione la opción

“showmenu”.

MACROMEDIA FLASH MX

60

6. En el campo de edición Parámetros, sustituya la opción “true” por “false” para desactivar la visualización de la Barra de menús del proyector de Flash.

7. Cierre la ventana Acciones de objetos y reproduzca la película desde el proyector de Flash. EJECUTAR UNA APLICACIÓN DESDE EL INTERIOR DEL PROYECTOR

1. Seleccione un botón de la escena al que desee asignar la acción que nos permita ejecutar una aplicación.

2. Vaya al menú Ventana y seleccione la opción Acciones. 3. En la lista de acciones situada a la izquierda del panel, haga clic con el ratón en la categoría

Acciones para mostrar su contenido. 4. Seguidamente, haga clic en la subcategoría Navegador/Red y haga un doble clic con el

puntero del ratón sobre la acción “fscommand” para añadirla al script. 5. En la lista desplegable Comandos para reproductor autónomo, seleccione la opción “exec”.

6. En el campo de edición Parámetros, introduzca la ruta de acceso de la aplicación. 7. Cierre la ventana Acciones de objetos y reproduzca la película desde el proyector de Flash. 8. Haga clic sobre el botón para ejecutar la aplicación.

8.11. Cargar un SWF de Flash dentro de una película Para reproducir películas de Flash adicionales dentro de una película principal, utilizaremos la acción “loadMovie”. Por lo general, el reproductor de Flash sólo puede mostrar una película (archivo *.SWF), pero, gracias a esta acción, podremos cargar varias películas al mismo tiempo o pasar de una película a otra sin cargar otro documento HTML.

Enlace vídeo:

MACROMEDIA FLASH MX

61

8.12. Descargar una película de Flash Para suprimir una película de Flash previamente cargada mediante “loadMovie”, utilizaremos la acción “unloadMovie”. Siga atentamente los pasos de la aplicación siguiente para realizar esta operación correctamente.

Enlace vídeo:

8.13. Precarga básica de una película Para crear una precarga en una película que impida que ciertas acciones se reproduzcan antes de que otras se carguen, utilizaremos la acción “ifFrameLoaded”. Una precarga es una simple animación que se reproduce constantemente, mientras el resto de la película se descarga. También podremos usar la propiedad “_framesloaded” (con una acción “if”) para comprobar si el contenido de un fotograma específico está disponible. La diferencia principal entre las dos opciones radica en que la sentencia “if (_framesloaded)” permite añadir con rapidez una sentencia “else” o “else if” a la acción. La sentencia “ifFrameLoaded” permite especificar un número determinado de fotogramas en una sentencia sencilla.

Enlace vídeo:

8.14. Impresión de los fotogramas de una película Asignando la acción “print” a un botón o a otro elemento de una película, podremos imprimir fotogramas o la Línea de Tiempo principal de una película de Flash. Cada acción “print” establece solo una Línea de Tiempo para imprimir, pero la acción permite especificar cualquier fotograma dentro de la Línea de Tiempo.

Enlace vídeo:

MACROMEDIA FLASH MX

62

8.15. Simulación: Abrir una página Web haciendo uso de script Abra el panel Acciones y aplique al botón de la escena el script necesario para abrir la página Web: "www.guillermoharo.com". Para ver el resultado, pruebe la película y, finalmente, haga clic en el botón verde ubicado en el escenario.

Enlace simulación:

8.16. Simulación: Acción para cerrar el reproductor de Flash Asigne al botón las acciones necesarias para cerrar la ventana del reproductor de Flash. Utilice el menú Ventana para abrir el panel Acciones.

Enlace simulación:

8.17. Práctica: Uso del panel Acciones El panel Acciones es donde escribiremos toda nuestra programación, por lo que es importante familiarizarse con él antes de empezar a profundizar en el lenguaje de programación ActionScript.

8.18. Práctica: Siguiendo el recorrido del ratón En este tutorial, vamos a crear un efecto muy utilizado para el diseño de muchas animaciones que podemos ver en Internet. Consiste en crear una animación que haga que el cursor del ratón deje un rastro en el escenario al moverlo sobre la película.

8.19. Práctica: Creación de una clave para múltiples usuarios En esta práctica, aprenderemos a generar con Macromedia Flash un usuario y una clave para permitir el acceso de una determinada persona a una película previamente creada. Es importante, para mayor seguridad, desactivar el menú que aparece al pulsar el botón derecho sobre la película. También será conveniente proteger el archivo “*.SWF” para evitar que pueda ser abierto por personas ajenas.

MACROMEDIA FLASH MX

63

Recuerda: La acción que utilizaremos para crear un botón que nos cierre la ventana del reproductor de Flash es "fscommand". La acción que utilizaremos para saltar a un fotograma específico de la escena de una película es “goto”. La acción que utilizaremos para activar y desactivar la visualización suavizada de una película es "toggleHighQuality". El formato de vídeo que podremos incorporar dentro de nuestras presentaciones para que se reproduzcan en la Línea de tiempo es FLV y F4V. La acción que utilizaremos para cargar una película de Flash dentro de otra es "loadMovie". La forma que podemos abrir el panel Acciones de Flash es seleccionando en el menú Ventana la opción Acciones. La acción que utilizaremos para llamar a una página Web especificada en el navegador de Windows "getURL".

MACROMEDIA FLASH MX

64

9. INTERACTIVIDAD AVANZADA En este segundo capítulo dedicado a la interactividad, aprenderá a crear acciones mucho más espectaculares que las vistas en el tema anterior. Aprenderemos a arrastrar y soltar objetos sobre el escenario y a cambiar el cursor del ratón por uno que personalicemos. Además, veremos cómo asignar acciones de teclado para poder capturar la pulsación de una tecla en una película de Flash. Para finalizar, veremos otras utilidades avanzadas que nos permitirán dotar nuestra película de una gran interactividad.

9.1. Arrastrar y soltar objetos sobre el escenario de Flash En esta aplicación, aprenderá a crear objetos que podrá arrastrar y colocar de forma libre sobre el escenario de nuestra película. Añadiendo este tipo de objetos a nuestros proyectos de Flash, nos permitirá mejorar el nivel de interactividad de los mismos.

Enlace vídeo:

9.2. Creación de un cursor personalizado En esta nueva aplicación, aprenderá a ocultar el cursor estándar de Windows (representación sobre la pantalla del puntero del ratón). Para esta operación, utilizaremos la acción “Hide” que se encuentra dentro de las acciones predefinidas del objeto Mouse. Para finalizar, veremos cómo usar un clip de película que creemos como cursor personalizado.

Enlace vídeo:

9.3. Captura de acciones de teclado con Flash Podremos usar los métodos predefinidos por Flash para detectar la pulsación de una tecla en una película. Los objetos de teclado de Flash no necesitan de funciones; usan su propio método, simplemente llamaremos al objeto con una acción. Podremos obtener códigos de teclas o los valores ASCII de la pulsación de una tecla: para obtener los códigos de una tecla pulsada, usaremos el método “getCode”; para obtener los valores ASCII de una tecla, usaremos el método “getAscii”. Un código de tecla es asignado a cada tecla del teclado de un ordenador. Por ejemplo, la tecla Flecha Izquierda tiene como código asignado el número 37. Usando los códigos de tecla, nos aseguraremos de que los controles de nuestra película son los mismos en todos los teclados independientemente de lenguajes y plataformas con la que nos encontremos. Los valores ASCII (American Standard Code for Information Interchange) son asignados a los primeros 127 caracteres. Los valores ASCII suministran información sobre un carácter en la pantalla. Por ejemplo, la letra “A” y la letra “a” tienen diferente ASCII.

Enlace vídeo:

MACROMEDIA FLASH MX

65

9.4. Valores de códigos de teclado para Flash En las siguientes tablas, aparecen listados todos los códigos correspondientes a las teclas de un teclado estándar, que podremos usar para identificarlas por medio del ActionScript de una película de Flash.

LETRAS Y NÚMEROS CÓDIGO

A 65

B 66

C 67

D 68

E 69

F 70

G 71

H 72

I 73

J 74

K 75

L 76

M 77

N 78

O 79

P 80

Q 81

R 82

S 83

T 84

U 85

V 86

W 87

X 88

Y 89

Z 90

0 48

1 49

2 50

3 51

TECLADO NUMÉRICO CÓDIGO

0 96

1 97

2 98

3 99

4 100

5 101

6 102

7 103

8 104

9 105

Multiplicar (*) 106

Sumar (+) 107

Intro 108

Restar (-) 109

Decimal (.) 110

Dividir (/) 111

TECLAS DE FUNCIÓN CÓDIGO

F1 112

F2 113

F3 114

F4 115

F5 116

F6 117

F7 118

F8 119

MACROMEDIA FLASH MX

66

4 52

5 53

6 54

7 55

8 56

9 57

F9 120

F10 121

F11 122

F12 123

F13 124

F14 125

F15 126

TECLAS ESPECIALES CÓDIGO

Retroceso 8

Tabulador 9

Borrar 12

Intro 13

Mayús 16

Ctrl 17

Alt 18

Bloq Mayús 20

Esc 27

Barra espaciadora 32

Re Pág 33

Av Pág 34

Fin 35

Inicio 36

Flecha izquierda 37

Flecha arriba 38

Flecha derecha 39

Flecha abajo 40

Insert 45

Supr 46

Ayuda 47

Bloq Num 144

; : 186

= + 187

- _ 189

/ ? 191

MACROMEDIA FLASH MX

67

\ Q ~ 192

[ { 219

\ | 220

] } 221

" ' 222

9.5. Creación de campos de texto en scroll En la siguiente aplicación, aprenderemos a crear campos de texto en scroll. Para ello, previamente en el panel Propiedades, tiene que asignar una variable a un campo de texto configurado como Introducción de texto o Texto dinámico. Los campos de texto actuarán como una ventana que muestra el valor de esa variable. A cada variable asociada con un campo de texto, tendremos que asignarle la función “scroll” o “maxscroll”. El valor “scroll” es el número de la línea más alta visible en el campo de texto. El valor “maxscroll” es el número de línea de valor máximo en que el desplazamiento puede basarse en la altura del campo de texto.

Enlace vídeo:

9.6. Configuración de valores de color en una película Podremos usar las acciones predefinidas de color de objeto para ajustar el color de una película de Flash. La acción “setRGB” asignará valores hexadecimal RGB (Red, Green, Blue) a los objetos, y la acción “setTransform” nos permitirá configurar el porcentaje y valores equivalentes para el rojo, verde azul, y transparencia (Alfa) que componen un color.

Enlace vídeo:

9.7. Creación de controles de sonido Para controlar los sonidos en una película de Flash, usaremos los objetos predefinidos disponibles en el panel de acciones. Para usar estos objetos, será necesario previamente, utilizar la acción “attachSound” para insertar el sonido desde la biblioteca en la película cuando ésta se reproduzca. En esta aplicación, aprenderá a crear un control de volumen usando la acción “setVolume” y un control de balance con la acción “setPan”.

Enlace vídeo:

MACROMEDIA FLASH MX

68

9.8. Simulación: Convertir un objeto en objeto arrastrable Asigne al objeto de la escena el script necesario para convertirlo en un objeto arrastrable. Utilice el menú Ventana para abrir el panel Acciones. (Recuerde que para poder asignar las acciones necesarias, previamente el objeto de la escena deberá configurarse como un botón utilizando el panel Propiedades).

Enlace simulación:

9.9. Práctica: Creación de una calculadora

Esta es una práctica bastante avanzada en la que vamos a crear una pequeña calculadora que realice operaciones simples (suma, resta, división y multiplicación). Para empezar, diseñaremos nuestra calculadora, continuaremos creando el campo de texto del display de la calculadora y, para finalizar, asignaremos el script necesario para ponerla en funcionamiento.

9.10. Práctica: Creación de un juego de naves espaciales Con este tutorial, vamos a crear un pequeño juego de naves espaciales. Comenzaremos con una nave espacial a la que asignaremos un control de movimiento utilizando las flechas del teclado, incluiremos un láser para destruir las naves enemigas que se nos pongan por delante. Aprenderá también a crear fondos con movimiento donde se desarrollará toda la acción. Y, para finalizar, crearemos las distintas colisiones entre los objetos y un marcador que nos puntúe los enemigos que derribemos.

MACROMEDIA FLASH MX

69

Recuerda: La acción “hide” nos permite crear un cursor personalizado. La acción “getCode” nos permite hacer que la pulsación de una tecla ejecute una acción desde una película de Flash. La acción “startDrag” nos permite crear un objeto arrastrable. La acción "setTransform" nos permite configurar los valores de color de una película. La acción “setPan” nos permite crear un control de balance en Flash.

MACROMEDIA FLASH MX

70

10. PUBLICACIÓN Y EXPORTACIÓN DE PELÍCULAS Una vez terminado nuestro proyecto, llega el momento de mostrar los resultados a la audiencia, para lo que previamente deberemos publicar o exportar el archivo de Flash (*.FLA) a otro formato para reproducirlo. En este tema, aprenderá a configurar las opciones del principal formato de publicación de una película de Flash, el formato (*.SWF), único formato que admite todas las funciones interactivas de la película. Además, aprenderá a exportar imágenes estáticas o con movimiento de Flash en una amplia gama de formatos que tendremos disponibles.

10.1. Publicación de películas de Flash Publicar una película de Flash en la Web es un proceso de dos pasos. En primer lugar, prepararemos los archivos requeridos para la aplicación de Flash con el comando Configuración de publicación. Luego, en segundo lugar, publicaremos la película y todos sus archivos con el comando Publicar. El comando Configuración de publicación nos permitirá escoger el formato y especificar las configuraciones para los archivos de una película de Flash. Dependiendo del tipo de archivo especificado en el cuadro de diálogo Configuración de publicación, el comando Publicar creará los siguientes archivos:

1. Películas Flash para la Web (*.SWF). 2. Imágenes en variedad de formatos que aparecerán automáticamente si el reproductor de

Flash no está disponible (GIF, JPEG, PNG, y QuickTime). 3. Documentos HTML requeridos para mostrar una película (o en su defecto los distintos

formatos de imágenes) en nuestro navegador. 4. Proyectores independientes tanto para sistemas Windows como para Macintosh, y vídeos

QuickTime de películas Flash.

Enlace vídeo:

MACROMEDIA FLASH MX

71

10.2. Configuración de publicaciones SWF Para publicar una película en formato SWF, utilizaremos las opciones de configuración contenidas en la ficha Flash del cuadro de diálogo Configuración de publicación. Podrá configurar distintas opciones incluidas opciones de compresión de imágenes y de sonido, y una opción que nos permitirá proteger nuestras películas y evitar así que puedan ser importadas.

Enlace vídeo:

10.3. Configuración de publicaciones HTML Para publicar una película Flash en un navegador Web, deberemos de crear un documento HTML que active dicha película. Los parámetros de este documento nos permitirán determinar dónde aparecerá representado el archivo SWF dentro del navegador, el color de fondo, el tamaño de la película y otros valores configurables desde la ficha HTML del cuadro de diálogo Configuración de publicación.

Enlace vídeo:

MACROMEDIA FLASH MX

72

10.4. Visualización previa de publicaciones y configuraciones Para previsualizar una película de Flash en los formatos y con la configuración establecida con las fichas del cuadro de diálogo Configuración de publicación, usaremos la opción Previsualización de configuración del menú Archivo. Este comando exporta la película y la abre en el soporte característico de la elección realizada.

Enlace vídeo:

10.5. Exportación de películas e imágenes Para poder utilizar el contenido de una película de Flash en otras aplicaciones, podremos exportar la película a un formato de archivo de los disponibles por Flash. Si utiliza la opción Exportar Película para exportar una película Flash a uno de los formatos de imagen sin movimiento, se crea una archivo de imagen numerado por cada uno de los fotogramas de la película. También podrá utilizar esta opción para exportar el sonido de una película a un archivo WAV. Utilice Exportar Imagen para exportar el contenido del fotograma activo o de una imagen seleccionada a uno de los formatos de imagen sin movimiento. Al exportar imágenes de Flash como gráficos vectoriales (formato *.AI de Adobe Illustrator), se protege la información de los vectores.

Enlace vídeo:

10.6. Simulación: Proteger la exportación de nuestra película Utilice el menú Archivo para proteger la exportación de nuestra película de Flash y evitar así que pueda ser manipulada por otra persona. Utilice como contraseña la palabra "deftones".

Enlace simulación:

10.7. Práctica: Juego de la serpiente Para finalizar el curso y terminar con buen pie, vamos a aprender unas cuantas técnicas del entorno de Flash. Realizaremos paso a paso el famoso “Juego de la serpiente”, que se puede encontrar en numerosos móviles actuales en su versión más básica. No se preocupe si al principio le cuesta un poco todo lo que va haciendo, al final todo encajará.

MACROMEDIA FLASH MX

73

Recuerda… La opción Omitir acciones de Trace deberemos activarla en la ficha Flash del cuadro Configuración de publicaciones para hacer que el programa pase por alto acciones de seguimiento dentro de la película actual. La tecla rápida F12 nos permite exportar una película de Flash de forma rápida. La opción Exportar Película nos permite exportar el sonido de una película de Flash a un archivo *.WAV. La opción Exportar Imagen nos permite exportar el contenido del fotograma activo como gráficos vectoriales de formato de Adobe Illustrator. La opción Generar informe de tamaño nos permite activar del cuadro Configuración de publicaciones si al publicar una película creamos un archivo de texto que posteriormente utilizamos como guía para reducir el tamaño del archivo publicado.

MACROMEDIA FLASH MX

74

Resumen general La herramienta que utilizaremos si queremos crear formas a "mano alzada" sobre el escenario es la Herramienta Lápiz. Las operaciones que podrá realizarse en el panel Escena podrán crear, renombrar, borrar, duplicar y organizar las escenas. La opción que deberemos activar en la ficha Flash del cuadro Configuración de publicaciones para hacer que el programa pase por alto acciones de seguimiento dentro de la película actual es Omitir acciones de Trace. La opción que deberemos utilizar si deseamos exportar el sonido de una película de Flash a un archivo *.WAV es Exportar Película. La opción que deberemos activar del cuadro Configuración de publicaciones si al publicar una película creamos un archivo de texto que posteriormente utilizamos como guía para reducir el tamaño del archivo publicado es Generar informe de tamaño. Para seleccionar un contorno formado por líneas conectadas entre sí utilizando la herramienta Flecha haremos un doble clic en una de las líneas que lo componen. El formato de archivo con el que se guardan las películas de Flash es *.FLA. Para reconocer un fotograma clave en la Línea de tiempo de nuestra película aparece representado por un círculo negro en el fotograma. La combinación de teclas que utilizaremos para abrir el cuadro de diálogo Importar es CTRL+R. La acción que utilizaremos para crear un control de balance en Flash es “setPan”. La acción que utilizaremos para saltar a un fotograma específico de la escena de una película es “goto”. La acción que utilizaremos para llamar a una página Web especificada en el navegador de Windows “getURL”. La acción que utilizaremos para configurar los valores de color de una película “setTransform·. Son 3 los tipos de símbolos que podremos crear con Flash. La función principal de una capa guía es utilizar los contenidos de una capa como referencia para el posicionamiento de elementos en el escenario.