Introducción Flash

15
Multimedia Flash CS4 es el programa en el sector de diseño gráfico para crear contenidos interactivos y animaciones de un atractivo visual formidable. Sirve para la creación de proyectos multimedia utilizando sus herramientas con funciones que nos permiten dibujar objetos, incorporar distintos programas, crear animaciones, sonido, integrar gráficos de mapa de bits Forma de viñeta Es una interfaz de trabajo mucho más intuitiva y practica para el usuario, asico como sus funciones y sistema. Es un editor de movimiento que comparte espacio en la interfaz con la imprescindible línea del tiempo desde el cual se conseguirá un contrato total sobre los fotogramas Se puede lograr un control absoluto sobre las animaciones, gracias al nuevo método de animación basados en objetos Anima objetos tridimensionales en espacios tridimensionales con nuevas herramientas de transformación y rotación 3d Crear efectos de animación similares a los de elementos encadenados, gracias a la nueva herramienta hueso que vincula unos elementos con otros. Convierte cualquier símbolo almacenado en la biblioteca de símbolos almacenado en la biblioteca de símbolos en una herramienta de diseño personalizada gracias a la herramienta decorativa del pincel rociador Cuando se ejecuta flash sin documentos abiertos, aparece la pantalla de bienvenida que presenta las siguientes áreas 1) Abrir un elemento reciente.- permite abrir los últimos documentos que se han abierto.

Transcript of Introducción Flash

Page 1: Introducción Flash

Multimedia

Flash CS4 es el programa en el sector de diseño gráfico para crear contenidos interactivos y animaciones de un atractivo visual formidable. Sirve para la creación de proyectos multimedia utilizando sus herramientas con funciones que nos permiten dibujar objetos, incorporar distintos programas, crear animaciones, sonido, integrar gráficos de mapa de bits

Forma de viñeta

Es una interfaz de trabajo mucho más intuitiva y practica para el usuario, asico como sus funciones y sistema.

Es un editor de movimiento que comparte espacio en la interfaz con la imprescindible línea del tiempo desde el cual se conseguirá un contrato total sobre los fotogramas

Se puede lograr un control absoluto sobre las animaciones, gracias al nuevo método de animación basados en objetos

Anima objetos tridimensionales en espacios tridimensionales con nuevas herramientas de transformación y rotación 3d

Crear efectos de animación similares a los de elementos encadenados, gracias a la nueva herramienta hueso que vincula unos elementos con otros.

Convierte cualquier símbolo almacenado en la biblioteca de símbolos almacenado en la biblioteca de símbolos en una herramienta de diseño personalizada gracias a la herramienta decorativa del pincel rociador

Cuando se ejecuta flash sin documentos abiertos, aparece la pantalla de bienvenida que presenta las siguientes áreas

1) Abrir un elemento reciente.- permite abrir los últimos documentos que se han abierto.

2) Crear nuevo.- muestra los tipos de archivos de flash, como documentos de flash y archivos de actionscript

3) Crear con plantilla.- muestra las plantillas que más se utilizan para crear documentos de flash

Page 2: Introducción Flash

4) Ampliar.- incluye vínculos con el sitio web de flash Exchange desde donde se puede descargar aplicaciones e información relacionada

Área de Trabajo

Línea de tiempo

Panel de herramientas

Capa

Page 3: Introducción Flash

Herramienta de Selección (V)

Herramienta de Sub-selección (A)

Herramienta de Transformación Libre (Q)

Herramienta de Rotación 3D (W)

Herramienta Lazo (L)

Herramienta Pluma (P)

Herramienta Línea (N)

Herramienta Rectángulo (R)

Herramienta Lápiz (Y)

Herramienta Pincel (B)

Herramienta Deco (U)

Herramienta Texto (T)

Herramienta Hueso (X)

Herramienta Cuentagotas (I)

Herramienta Cubo de Pintura (K)

Herramienta Borrador (E)

Herramienta Zoom (M)

Herramienta Mano (H)

Color de Trazo

Color de Relleno

Blanco y negro

Intercambiar colores

Ajustar objetos

Suavizar

Enderezar

Page 4: Introducción Flash

1. Los fotogramas que viene delimitados por líneas verticales (formando rectángulos) y los números de fotogramas que permiten saber que numero tiene asignado cada fotograma, cuando dura o cuando aparecerá en la película.

2. Además, en la parte inferior hay herramientas para trabajar con papel cebolla e información sobre el número de fotogramas actual (1 en imagen), la velocidad de los fotogramas (24.0 en la imagen) y el tiempo de película transcurrido (0,0s en la imagen).

Descripción de los elementos de la ventana

La barra aplicación de la parte superior de la ventana de trabajo contiene un conmutador de espacio de trabajo, menús y otros controles de la aplicación, por ejemplo: la barra de menús tiene como propósito facilitar el acceso a las distintas unidades del programa. Es similar a la de cualquier otro programa de diseño web o gráfico, aunque tiene algunas particularidades.

Otras opciones de trabajo se encuentran en la barra de herramientas. Estas aplicaciones se pueden mostrar u ocultar con el menú Ventana/Barra Herramientas.

Fotogramas

Herramienta de trabajo con fotogramas

Page 5: Introducción Flash

Principal: Muestra la barra de herramientas flotante con diversos iconos comunes los cinco primeros representas los comandos principales del menú archivo y el resto corresponde a opciones de los menús Edición, Ver y Modificar.

Controlador: Muestra la barra de herramientas controlador, funciona como controles de cualquier reproductor, sus comandos permiten el control de la reproducción de la películas dentro del programa. Los botones de controlador se encuentran desactivados mientras el documento creado solo contengo un fotograma inicial.

Barra de edición: indica el signo de verificación de la película.

Botón conceptos básicos: Permite cambiar con un solo clic el espacio de trabajo, pudiendo elegir entre según el tipo de trabajo que se esté llevado a cabo.

Mejorar la apariencia del espacio de trabajo: Flash permite cargar y guardar tus propias disposiciones de paneles, para que si en algún momento el entorno se vuelve un poco desordenado puedas recuperar tu configuración elegida desde el menú Ventanas.

Page 6: Introducción Flash

Para cargar y guardar deberás acceder a la opción trabajo - Espacio de trabajo. Nuevo espacio de trabajo y asignar un nombre a nuestro nuevo espacio de trabajo.

Page 7: Introducción Flash

Las capas

Las capas o (layer) ayudan a organizar las ilustraciones de los documentos. Los objetos de una capa pueden dibujarse y editarse sin que afecten a objetos de otras capas. En las zonas del escenario en las que no hay nada en una capa, pueden verse a través de ella las capas situadas debajo.

Para dibujar, pintar o modificar una capa o una carpeta, primero se debe seleccionar en línea de tiempo para activarlas.

Un icono con forma de lápiz junto una capa o carpeta de la línea de tiempo indica que la capa o carpeta esta activa. Solo puede haber una capa activa en cada momento (aunque se puedes seleccionar más de una capa a la vez).

Cuando se crea un documento de flash, contiene una sola capa. Para organizar las ilustraciones, animaciones y los demás elementos del documento, añada más capas.

Asimismo, es posible ocultar, bloquear o reordenar capas. El número de capas que crearse solo está limitado por la memoria del equipo. Las capas no aumenta el tamaño del archivo .SWF publicado. Solo los objetos que se ubican en las capas aumentan el tamaño del archivo.

Para organizar y gestionar las capas, cree carpetas y coloque en ellas las capas. Las carpetas de capas se pueden expandir o contraer en la línea de tiempo sin que ello afecte lo que se muestra en el escenario. Utilice capas y carpetas distintas para los archivos de sonidos, Action Script, etiquetas de fotogramas y comentarios de fotogramas. De este modo encontraras estos elementos con mayor facilidad cuando tengas que editarlos.

Page 8: Introducción Flash

Herramienta de dibujo con Flash

Lápiz

Sirve para dibujar líneas y formas, se utiliza de manera muy similar a como se emplea un lápiz real. Para aplicar un suavizado o un enderezamiento a las líneas y las formas, según se va dibujando basta con seleccionar un modo de dibujo de la herramienta.

Para dibujar con la herramienta: primero selecciona la herramienta lápiz, segundo seleccione un estilo y color de trazo, tres seleccione un modo de dibujo de las opciones de caja de herramientas (enderezar, suavizar, tinta)

Selección de los atributos de estilo y peso del trazo en panel: arrastre con el escenario para dibujar con la herramienta lápiz

Pluma

Para dibujar líneas o curvas se puede utilizar la herramienta pluma. Puede crear segmentos de líneas rectas o curvas o ajustar el Angulo y la longitud de los segmentos rectos, así como la pendiente de los segmentos curvos. Al dibujar con la herramienta pluma, puede hacer clic para crear puntos en los segmentos de las líneas rectas o bien hacer clic y arrastrar para crear puntos en los segmentos y líneas curvas.

Puede ajustar los segmentos de las líneas curvas y restas ajustando los puntos de líneas. Puede convertir líneas curvas en líneas rectas y viceversa. También puede mostrar los puntos de las líneas creadas con otras herramientas de dibujo de flash, como la herramienta lápiz, pincel, línea, ovalo o rectángulo y poligonal.

Animaciones

Trabajo con Capas

Page 9: Introducción Flash

Nueva Capa: Como su nombre lo indica sirve para insertar una nueva capa, en la que escena actual. Crea capas normals (en el siguiente apartado se veran los distintos tipos de capas).

Crear Caparta: Nos sirve para crear carpetas que nos ayudaran a organizar nuestras capas.

Borrar Carpeta: Borra la capa seleccionada.

Cambiar nombre: Para cambiar el nombre de una capa, basta con hacer doble clic en el nombre actual.

Propiedades de la capa: Si hacemos dible clic en

el icono junto al nombre de la capa, podremos acceder a un panel con las propiedades de la capa en que hayamos hecho clic. Podremos modificar todas las opciones que hemos comentado anteriormente y alguna mas de menor importancia.

Trabajo de capas con opciones avanzadas

Mostrar/Ocultar capas: Este boton permite ver ucultar todas las capas de la peculas. Es muy util cuando tenemos muchas capas y solo queremos ver una de ellas.ya que permite ocultar todas a la vez, para despues mostrar solo la actual. Para activar la vista de una capa en concreto. (o para ocultarlas) basta co hacer clic en la capa correspondiente en el punto (o cruz) que se encuentra baji el icho “mostrar/ocutlar caops”

Bloquear capa: Bloque la edicion de todas las capas de modo que no podemos modificaslas hasta desbloquearlo. Para bloquear o desbloquear hacer en el punto o icono candado situado en la capa actual baja el icho bloqeuar capas.

Manipulación de botones

¿Qué es un botón?

Los símbolos de tipo botón son los que aportan la mayor parte de la interactividad de las películas flash, con aquel que la está visualizando. Un botón en flash es igual que cualquier botón en cualquier entorno informático, sea web o cualquier otro.

Son elementos que se prestan a que el usuario los presione, desencadenando al hacerlo una serie de acciones, también es habitual el ver como este tipo de

Page 10: Introducción Flash

elementos reaccionan cuando se les pasa el ratón por encima o cuando están pulsados.

En flash su interfaz está diseñada de manera especial para creación de botones, lo que nos permite crear todos los efectos de una manera muy sencilla.

Creación de botones

Crear un botón es un proceso relativamente sencillo: bastara con dibujar con flash el aspecto del botón y convertir nuestro objeto a símbolo de tipo botón y posteriormente veremos como completarlo internamente, lo que nos ayudara a entender mejor dicha estructura.

Seleccionamos el botón /convertir objeto y asignaremos un nombre a nuestro nuevo símbolos.

Ahora lo complementaremos internamente, a determinar cómo debe reaccionar el botón en función de las acciones del ratón, lo editaremos haciendo clic con el botón derecho del ratón sobre nuestro nuevo botón y seleccionando la opción edición. Esto nos lleva a la pantalla de edición de botones que básicamente se limita a cambiar el aspecto de la línea de tiempo.

Los botones tienen su propia línea del tiempo y está formada únicamente por 4 fotogramas uno por cada estado posible del botón:

1. Reposo: Aspecto por defecto del botón, es decir, cuando el puntero del botón no está situado sobre el

2. Sobre: Aspecto del botón cuando situamos el botón sobre el3. Presionado: Apariencia que deseamos tenga nuestro botón mientras lo

mantengamos pulsado4. Zona Activa: Aquí debemos indicar el área real en la que queremos que

actué nuestro botón. Esto es importante sobre todo en botones compuestos solo por texto

Pareciera que la limitación de fotogramas podría implicar una limitación en la capacidad de espectacularidad y utilidad de estos símbolos, pero no es así, los botones pueden contener otros símbolos como clic o gráficos. La unión de las posibilidades de todos los símbolos pueden dotar a los botones de efectos asombrosos.

Page 11: Introducción Flash

Manipular video

Existen dos metodologías a seguir para trabajar con archivos de video en flash. La primera de ellas consiste en integrar el archivo dentro de la película importándolo a la biblioteca o en la línea de tiempo, mientras que la segunda contempla la carga progresiva del video desde una fuente externa.

Por su parte, la segunda opción presenta la ventaja adicional de poder editar el clic de video en una aplicación independiente, además de permitir una descarga progresiva que habilita al usuario para visualizar el contenido que haya sido descargado hasta el momento. Y por supuesto, ofrece todas las ventajas que el método “en B Ber” no posee (velocidad independiente del frame rate de la película flash, tamaño y duración sin límites, sincronización completa constante de audio y video).

No obstante, existe una pequeña desventajas al uti8lkuizar esta opción y es que requiere una conversión del archivo original FLV (flash video), propio y exclusivo de la herramienta de Macromedia

Importar video en flash

Abrimos Macromedia de flash e importamos con Control + R y buscamos nuestro video, nos aparece la ventaja del asistente con 2 opciones: importar todo el video o editar o hacer pequeños clic de nuestro video en cuestión y muy fácil de aplicar

Suponiendo que nuestro video ya está editado trabajaremos con la opción importar todo el video. Nos aparece perfil de compresión podemos escoger 512, y hacemos clic en el botón edición. Las opciones para personalizar el ancho de banda van de 0KBps a 750 KBps y especifica la velocidad aproximada de descarga del video. La configuración de calidad de video oscila entre 0 y 100 y especifica el nivel de compresión de todos los fotogramas. También es posible especificar una velocidad de fotogramas claves. La velocidad de descarga puede variar para lograr un nivel de compresión uniforme.

Ahora veamos la configuración avanzada, hacemos clic en el botón edición y utilizaremos donde dice escala para modificar el tamaño en que se apreciara nuestro video, se recomienda en forma exagerada poner a 300px o a todo caso de acuerdo al diseño que ya tienes planificado, tenemos una vista previa que nos ayuda en todo momento. Hacer clic en el botón siguiente ahora se coloca el nombre a nuestra configuración con una descripción para recordarlo en otro momento. Botón siguiente por último finalizar.

Nos saldrá un mensaje diciendo que necesitaremos mas fotogramas para hacer nuestro video, le daremos si. Apreciaremos que tenemos nuestro video en la línea

Page 12: Introducción Flash

de tiempo y en la librería apareció un nuevo elemento con icono de cámara de video, ese es nuestro incorporado. Y aunque no es FLV, lo vamos a hacer enseguida.

Abrimos nuestra librería o biblioteca y le damos clic derecho a nuestro video incorporado, vamos a propiedades y escogemos exportar, le damos la ruta donde guardar nuestro FLV y hemos terminado.

Ahora tenemos que reproducirlo, para eso hay 2 formas básicas de hacerlo: podemos usar el componente mediaplayback o actionscript. Lo haremos de las 2 formas.

Con componente mediaplayback: abrimos Macromedia flash y oprimimos control + f7, se abrirá la ventana de componentes, le damos al signo más de media componentes y arrastramos al escenario el componente mediaplayback. Teniendo seleccionado el componente apretamos alt + f7, se verá la ventana del inspector de componentes, teniendo la pestaña parámetros seleccionada podemos escoger entre FLV y MP3, le damos FLV.

En URL colocamos la dirección de nuestro archivo (si no se encuentra en nuestra carpeta actual darle la ruta completa donde localizarlo) y ahora corre tu flash y listo ya funciona.