FLASH MX

Animación para la webAnimación para la web

• Es una herramienta estándar de amplio uso en la actualidad, para el diseño de sitios web de gran impacto.

• Es parte de la familia de productos Macromedia para el diseño web (Dreamweaver, Fireworks, Freehand...)

• Los proyectos desarrollados con Flash MX pueden ser completamente multimediales e interactivos, lo cual ha logrado que esta herramienta se use con frecuencia en el diseño web.

¿Que es Flash?

¿Que es Flash?• Los archivos finales generados con Flash MX

para su distribución en la web, tienen como características principales:• Son de pequeño tamaño, por lo cual se

descargan rápidamente• Pueden contener audio y/o video• Pueden ser interactivos, gracias al uso del

lenguaje ActionScript

Ver Archivos Flash

• Para visualizar un archivo Flash que se encuentre dentro de una pagina web, es necesario que el PC posea instalado el Flash Player (reproductor de contenidos Flash)

• El Flash Player es un Plugin que se añade al navegador y que es necesario para reproducir los contenidos en formato Flash

• Este plugin se puede descargar gratuitamente de la pagina oficial de Macromedia http://www.macromedia.com

Archivos Flash Ejecutables• Algunos archivos producidos con Flash MX,

pueden tener la extensión .EXE por lo cual no requieren del Flash Player.

• Estos archivos son de mayor tamaño que aquellos que se encuentran dentro de las paginas web, ya que el empaquetamiento como ejecutable les añade el visor de contenidos Flash.

Ver Archivos Flash

Con Flash MX se pueden crear:• Software multimedia• Gráficos vectoriales• Logotipos animados• Barras de navegación• Animaciones de todo tipo con sonido• Aplicaciones en línea • Juegos

Caracteristicas de Flash MX

Flash MX trabaja con herramientas de dibujo y pintura que generan Gráficos Vectoriales.

Flash MX es el software mas completo para el desarrollo de Animaciones y aplicaciones interactivas para la web

Flash Posee un lenguaje de programación orientado a objetos (POO), llamado ActionScript

Caracteristicas de Flash

• Los proyectos que se desarrollan con la aplicación se denominan “Peliculas”

• Los archivos de proyecto de Flash que se guardan en el PC, poseen la extensión .FLA y están representados por un icono con el logotipo de Flash MX.

• Las películas que se usan en el diseño web, usan la extensión SWF.

Peliculas Flash

• Para Microsoft® Windows: procesador Intel Pentium a 200 MHz o equivalente con Windows 98 SE, Windows ME, Windows NT 4.0, Windows 2000 o Windows XP, 64 MB de RAM (se recomiendan 128 MB), 85 MB de espacio disponible en disco; monitor en color de 16 bits con capacidad para una resolución de 1024 x 768 y una unidad de CD-ROM.

• Para Macintosh: Power Macintosh con Mac OS 9.1 (o posterior) o Mac OS X versión 10.1 (o posterior); 64 MB de memoria RAM libre para aplicaciones (se recomiendan 128 MB), más 85 MB de espacio libre en disco, monitor en color con capacidad de visualización en 16 bits (miles de colores) con una resolución de 1024 x 768 y una unidad de CD-ROM.

Requerimientos de instalación

• Microsoft Windows 95, Windows 98, Windows ME, Windows NT 4.0, Windows 2000, Windows XP o posterior; o un Macintosh PowerPC con System 8.6 o posterior (incluido OS X 10.1 o posterior).

• El complemento (plugin) de Netscape que funcione con Netscape 4 (o posterior) en Windows, o con Netscape 4.5 (o posterior) o Internet Explorer 5.0 (o posterior) en Mac OS.

Instalación Flash Player

• Flash MX• Swish Max• Mix FX• Swf Quick• AnFX• Swift 3D

Software de Desarrollo SWF

Trabajar en Flash MX

Información General

• Las películas producidas con Flash MX, pueden ser lineales o no lineales

• Las películas Lineales son todas aquellas en las cuales la reproducción se realiza de forma continua de principio a fin.

• Las películas No Lineales brindan la posibilidad al usuario de interactuar con el contenido,por medio de objetos como botones, menús y barras de navegación

Peliculas

Pelicula Lineal

Escena 1 Escena 2 Escena 3

1 2 3

E1 E2 E3

Escena Inicial

Pelicula No Lineal

• Las películas Flash utilizan gráficos vectoriales compactos, para que se descarguen y se adapten rápidamente al tamaño de la pantalla del usuario.

Imagenes Vectoriales

Las imágenes del tipo vectorial se representan con trazos geométricos, controlados por cálculos y fórmulas matemáticas, que toman algunos puntos de la imagen como referencia para construir el resto.

La principal ventaja de las imágenes vectoriales es su capacidad de almacenar los dibujos en un archivo muy compacto, ya que sólo se requiere la información necesaria para generar cada uno de los vectores. Los vectores pueden definir algunas propiedades de los objetos como el grosor de la línea o incluso el color de relleno de los objetos

Imagenes Vectoriales

• Flash ofrece varios métodos tanto para crear ilustraciones originales como para importarlas desde otras aplicaciones.

• Se pueden crear objetos con las herramientas de dibujo y pintura, así como modificar los atributos de los objetos existentes

• También es posible importar gráficos vectoriales, gráficos de mapa de bits y video desde otras aplicaciones y modificarlos en Flash

Ilustraciones en Flash MX

• Flash permite animar objetos para dar la impresión de que se mueven por el escenario, así como cambiar su forma, tamaño, color, opacidad, rotación y otras propiedades

• También se puede crear una animación fotograma a fotograma, creando una imagen diferente para cada fotograma.

• Otra posibilidad consiste en crear una animación interpolada, es decir, crear los fotogramas primero y último de una animación y dejar que Flash cree los fotogramas intermedios

Animación

• Flash permite crear películas interactivas en las que los espectadores pueden utilizar el teclado o el ratón para pasar a diferentes partes de la película, mover objetos, introducir información en formularios y realizar muchas otras acciones

• Puede crear películas interactivas creando scripts de acciones mediante ActionScript

Peliculas Interactivas

• Flash proporciona clips de película con parámetros definidos, denominados componentes, que son de gran utilidad para desarrollar elementos más complejos en películas Flash

• Cada componente de Flash incorporado tiene su propio conjunto exclusivo de métodos de ActionScript que permite establecer y cambiar los parámetros de edición y opciones adicionales en tiempo de ejecución

Desarrollo de Aplicaciones

Los ActionScripts son cadenas de ordenes variables y funciones que se pueden asociar a un frame o a un objeto. ActionScript es un lenguaje conducido por eventos, esto significa que los Scripts (osea las ordenes que le damos a Flash) se ejecutan cuando suceden una serie de eventos o sucesos.

ActionScripts

Un concepto de vital importancia que debe tomarse en cuenta en todo momento en el diseño de películas Flash, es la optimización de los contenidos importados.La optimización se puede entender como la disminución al máximo del tamaño que ocupan en disco los archivos multimediales (entiéndase mapas de bits, audio y video) evitando en lo posible la perdida de calidad

Optimización de contenidos

Recuerde que uno de los principales objetivos que se busca al desarrollar una película Flash para la web, es que la misma se pueda descargar en el menor tiempo posible, lo cual garantice que aquellos usuarios que posean conexiones lentas no tengan problemas en visualizar correctamente los contenidos

Optimización de contenidos

Optimización de Fotografías:• El formato de mayor uso en la fotografía digital es el

JPEG (Joint Photographic Experts Group)• Este formato posee un algoritmo de compresión con

perdida, que disminuye el tamaño del archivo y como consecuencia la calidad de la imagen.

• Flash puede recomprimir los mapas de bits utilizando este algoritmo, el cual produce archivos finales de menor tamaño pero con menor calidad, por lo cual hay que tener mucho cuidado cuando se haga uso del mismo.

Optimización de contenidos

Optimización de Sonido• El formato de mayor uso en las películas Flash es el

MPEG-2 Layer 3 o mejor conocido como MP3 debido a la alta compresión que le introduce a los archivos de audio.

• Los archivos de audio que se utilicen en el diseño de películas, deben capturarse, editarse, codificarse y exportarse con software especializado

• Flash MX brinda la posibilidad de recodificar al formato MP3 todos los sonidos digitales, en el momento de la exportación de película

Optimización de contenidos

• Al igual que en un largometraje, las películas Flash dividen el tiempo en fotogramas. En el escenario se compone el contenido de los fotogramas individuales de la película, dibujando ilustraciones directamente o bien modificando ilustraciones importadas

El Escenario de Flash MX

En el escenario se componen los fotogramas individuales de una película

El Escenario de Flash MX

• Puede cambiar la visualización del escenario cambiando el grado de aumento/reducción, o moviendo el escenario dentro del entorno de trabajo de Flash.

• También puede ajustar la visualización del escenario mediante los comandos de visualización.

Herramientas de Visualización

Cuadrícula, guías y reglas

Flash incluye reglas y guías que ayudan a dibujar y diseñar objetos de manera precisa. Es posible colocar guías en un documento y ajustar objetos a las mismas o activar la cuadrícula y ajustar objetos en ésta

Herramientas de Visualización

Cuadricula

Para mostrar u ocultar la cuadrícula de dibujo:• Seleccione Ver > Cuadrícula > Mostrar

cuadrícula. Para activar y desactivar el ajuste a las líneas

de la cuadrícula:• Seleccione Ver > Cuadrícula > Ajustar a

cuadrícula. Para establecer preferencias para la cuadrícula:• Seleccione Ver > Cuadrícula > Editar

cuadrícula

Herramientas de Visualización

Uso de las guías

• Si las reglas son visibles, puede arrastrar las guías horizontales y verticales de las reglas en el escenario.

• Puede mover, bloquear, ocultar y eliminar las guías.

• También puede ajustar objetos a las guías y cambiar el color de las guías y la tolerancia al ajuste (a qué distancia máxima deben estar los objetos para ajustarlos a una guía)

Herramientas de Visualización

Uso de las reglas

• Si se muestran las reglas, éstas aparecen en la parte superior y a la izquierda del documento.

• Puede cambiar la unidad de medida que se utiliza en las reglas; la unidad predeterminada es píxeles.

• Al mover un elemento en el escenario con las reglas visibles, aparecerán unas líneas en las reglas indicando las dimensiones del elemento.

Herramientas de Visualización

Creación de un documento nuevo• Cada vez que se abre Flash, la aplicación

crea un nuevo archivo con la extensión FLA. • Durante la sesión de trabajo es posible crear

otros documentos de Flash. • Para establecer el tamaño, la velocidad de

fotogramas, el color de fondo y otras propiedades de un documento nuevo, utilice el cuadro de diálogo Propiedades del documento.

Trabajo con Flash MX

• Seleccione Archivo > Nuevo

• Elija Modificar > Documento

• En la sección Velocidad de fotogramas, introduzca el número de fotogramas de animación que deben mostrarse cada segundo. La mayoría de las animaciones que se ven en los equipos, especialmente las que se reproducen desde un sitio Web, no necesitan una velocidad superior a 8-12 fps (fotogramas por segundo). La velocidad de fotogramas predeterminada es de 12 fps.

Creación de un documento nuevo

Trabajo con Flash MX

En Dimensiones, realice una de las acciones siguientes:

• Para especificar el tamaño del escenario en píxeles, introduzca los valores en los cuadros de texto Anchura y Altura.

• El tamaño predeterminado de la película es de 550 x 400 píxeles. El tamaño mínimo es de 1 x 1 píxel; el tamaño máximo es de 2.880 x 2.880 píxeles

Creación de un documento nuevo

Trabajo con Flash MX

• Para establecer el color de fondo de la película, haga clic en el triángulo del cuadro Color de fondo y seleccione un color de la paleta.

• Para especificar la unidad de medida para las reglas que puede visualizar en la parte superior y lateral de la ventana de la aplicación, seleccione una opción del menú emergente situado en la esquina superior derecha

Creación de un documento nuevo

Trabajo con Flash MX

• También puede abrir una plantilla como documento nuevo. Puede elegir entre varias plantillas estándar incluidas en Flash o abrir una plantilla guardada previamente.

Uso de Plantillas

Trabajo con Flash MX

Fin de Primera Clase