Kitabı oku: «Aprender Flash CS5 con 100 ejercicios prácticos»
Aprender
Aprender
Flash CS5
con 100 ejercicios prácticos
Título de la obra:
Aprender Flash CS5 con 100 ejercicios prácticos
Primera edición, 2010
Diseño de la cubierta: NDENU DISSENY GRÀFIC
© 2010 MEDIAactive
Pallars, 141-143 5
B 08018 Barcelona www.mediaactive.es
© 2010 MARCOMBO, S.A.
Gran Via de les Corts Catalanes, 594
08007 Barcelona
ISBN: 978-84-267-1713-9
ISBN (obra completa): 978-84-267-1533-3
D.L.:
IMPRESO EN GRAFO S.A
Todos los derechos reservados. No está permitida la reproducción total o parcial de este libro, ni su tratamiento informático, ni la transmisión de ninguna forma o por cualquier medio, ya sea electrónico, mecánico, por fotocopia, por registro u otros métodos, sin el permiso previo y por escrito de los titulares del copyright.
Presentación
APRENDER FLASH CON 100 EJERCICIOS PRÁCTICOS
100 ejercicios prácticos resueltos que conforman un recorrido por las principales funciones del programa. Si bien es imposible recoger en las páginas de este libro todas las prestaciones de Flash CS5, hemos escogido las más interesantes y utilizadas. Una vez realizados a conciencia los 100 ejercicios que componen este manual, el lector será capaz de manejar con soltura el programa y llevar a cabo la creación de películas y animaciones con imágenes, sonido y vídeo, tanto en el ámbito profesional como en el particular.
LA FORMA DE APRENDER
Nuestra experiencia en el ámbito de la enseñanza nos ha llevado a diseñar este tipo de manual, en el que cada una de las funciones se ejercita mediante la realización de un ejercicio práctico. Dicho ejercicio se halla explicado paso a paso y pulsación a pulsación, a fin de no dejar ninguna duda en su proceso de ejecución. Además, lo hemos ilustrado con imágenes descriptivas de los pasos más importantes o de los resultados que deberían obtenerse y con recuadros IMPORTANTE que ofrecen información complementaria sobre cada uno de los temas tratados en los ejercicios.
Gracias a este sistema se garantiza que una vez realizados los 100 ejercicios que componen el manual, el usuario podrá desenvolverse cómodamente con las herramientas de Flash CS5 y sacar el máximo partido de las múltiples prestaciones que ofrece el programa.
LOS ARCHIVOS NECESARIOS
En el caso en que se desee utilizar los archivos de ejemplo de este libro, puede descargarlos desde la zona de descargas de la página de Marcombo (www.marcombo.com) y desde la página específica de este libro.
A QUIÉN VA DIRIGIDO EL MANUAL
Si se inicia usted en la práctica y el trabajo con Flash, encontrará en estas páginas un completo recorrido por sus principales funciones. Pero si es usted un experto en el programa, le resultará también muy útil para consultar determinados aspectos más avanzados o repasar funciones específicas que podrá localizar en el índice.
Cada ejercicio está tratado de forma independiente, por lo que no es necesario que los realice por orden (aunque así se lo recomendamos, puesto que hemos intentado agrupar aquellos ejercicios con temática común). De este modo, si necesita realizar una consulta puntual, podrá dirigirse al ejercicio en el que se trata el tema y llevarlo a cabo sobre su propio documento de Flash.
FLASH CS5
Aunque a primera vista la creación y edición de películas y animaciones pueda parecer tremendamente complicada y sólo al alcance de profesionales y expertos, la realidad es que con programas como Flash cualquier persona con un mínimo de conocimientos de informática puede llegar a conseguir impensables creaciones.
Flash CS5, propiedad de Adobe Systems, propone una interfaz intuitiva y gráfica, con paneles y paletas de herramientas y funciones que facilitan en gran medida el trabajo al usuario. El uso de código se reserva, así, a los expertos, permitiendo el manejo del programa a cualquier alma creativa.
Son pocas las novedades que presenta la versión CS4 de Flash, aunque han hecho que el programa sea más manejable e intuitivo Con mejoras en las herramientas Deco y Huesos podrá mejorar sus animaciones. Además, el nuevo motor de texto, Text Layout Framework, podrá trabajar el texto igual que podría hacerlo en un programa de edición o maquetación.
Cómo funcionan
los libros “Aprender…”
Índice
001 La interfaz del nuevo Flash CS5
002 La Línea de tiempo
003 Adobe Bridge: el explorador de archivos
004 Formato vectorial y de mapa de bits
005 Plantillas
006 El panel Herramientas
007 El relleno de una forma
008 Ubicación y solapamiento de formas
009 Líneas y trazos
010 Rectángulos y óvalos
011 Rectángulo simple y óvalo simple
012 Dibujar polígonos y estrellas
013 Dibujar con el lápiz y el pincel
014 Trazar rectas y curvas
015 Importar mapas de bits
016 Convertir imágenes en formas de Flash
017 Suavizar y optimizar gráficos
018 Introducir textos estáticos
019 Utilizar el motor de texto TLF
020 Redimensionar y ubicar bloques de texto
021 Suavizar y separar texto
022 Borrar trazos y rellenos
023 Editar trazos con el Bote de tinta
024 Pintar con el Cubo de pintura
025 Personalizar colores
026 Crear y personalizar degradados
027 Las paletas y las muestras de color
028 Transformar rellenos
029 Seleccionar y agrupar formas
030 Desagrupar y separar
031 Transformar objetos
032 Trabajar con el panel Transformar
033 Suprimir, copiar y pegar objetos
034 Organizar objetos
035 Trabajar con reglas, guías y la cuadrícula
036 Ajustar objetos
037 Alinear objetos
038 Crear capas y carpetas de capa
039 Eliminar, visualizar y bloquear capas
040 Visualizar la Línea de tiempo
041 Crear símbolos gráficos
042 Trabajar con símbolos e instancias
043 Editar símbolos e instancias
044 Gestionar los elementos desde la Biblioteca
045 Convertir símbolos en herramientas de diseño
046 Aplicar efectos con la herramienta Deco
047 Animar fotograma a fotograma
048 Establecer la velocidad de los fotogramas
049 Insertar interpolaciones de movimiento
050 Recurrir a las interpolaciones clásicas
051 Modificar manualmente la aceleración
052 Editar curvas con el Editor de movimiento
053 Configurar movimientos predeterminados
054 Editar la trayectoria de un movimiento
055 Mover objetos a lo largo de un trayecto
056 Utilizar capas de máscara
057 Copiar y pegar una interpolación de movimiento
058 Animar con la herramienta de huesos
059 Utilizar el muelle para huesos
060 Animar en 3D
061 Interpolar formas
062 Editar interpolaciones de forma
063 Trabajar con consejos de forma
064 Formas, texto y mapas de bits en interpolaciones
065 Insertar escenas
066 Cambiar el orden y el nombre de las escenas
067 Reproducir escenas y películas
068 Controlar instancias de símbolos gráficos
069 Animar símbolos gráficos
070 Editar fotogramas con el Papel Cebolla
071 Distinguir clips de película y símbolos gráficos
072 Anidar clips de película
073 Escalar clips de película
074 Insertar y crear botones
075 Probar botones
076 Crear botones animados
077 Conocer ActionScript 3.0
078 Introducir código en el panel Acciones
079 Panel de fragmentos de código
080 Saltar a fotogramas
081 Generar eventos e interacciones
082 Incluir etiquetas de fotograma
083 Insertar anclajes
084 Insertar comentarios
085 Copiar, pegar, exportar e importar scripts
086 Editar en la ventana Script integrada
087 Vincular un botón a una página web
088 Textos estáticos, dinámicos y de entrada
089 Depurar ActionScript
090 Trabajar con componentes
091 Editar los parámetros de los componentes
092 Importar y comprimir archivos de audio
093 Editar y personalizar sonidos
094 Importar vídeos
095 Conocer el Explorador de películas
096 Exportar imágenes y películas
097 Preparar la descarga y la impresión
098 Publicar documentos
099 Exportar como vídeo QuickTime
100 Pedir ayuda en Flash CS5
001La interfaz del nuevo Flash CS5
AL ACCEDER POR PRIMERA VEZ A ADOBE FLASH CS5 vemos una disposición de los elementos similar a la versión CS4, que es mucho más elegante y flexible que en versiones anteriores de la aplicación. Una de las primeras cosas que llaman la atención es la nueva ventana de arranque, mucho más sofisticada que el sencillo rectángulo de versiones anteriores.
IMPORTANTE
El bloque de la pantalla de bienvenida Abrir un elemento reciente, posibilita la apertura de los archivos con los que se ha trabajado anteriormente. Crear nuevo ofrece una lista de tipos de documento que puede seleccionar para abrir un nuevo archivo rápidamente. Crear con plantilla expone las plantillas utilizadas con mayor frecuencia para crear nuevos documentos y posibilita la selección de las plantillas agrupadas en categorías. Por último, Ampliar enlaza con Flash Exchange para la descarga de aplicaciones e información complementarias.
1.Al abrir la aplicación se muestra en su parte central una pantalla de bienvenida cuyas opciones se agrupan en cuatro bloques. 
Haga clic en la casilla de verificación de la opción No volver a mostrarlo y, en el cuadro informativo que aparece, pulse el botón Aceptar.
Debajo del escenario se encuentran la Línea de tiempo, que permite organizar y controlar el contenido de un documento, y el nuevo Editor de movimiento.
2.Para generar un documento en blanco y abandonar definitivamente la pantalla de bienvenida, en la categoría Crear nuevo pulse sobre el enlace Action Script 3.0. 
3.Éste es el aspecto que presenta Flash CS5 al crear un documento en blanco. 
La interfaz de usuario es muy similar a la de la versión CS4 aunque puede ser adaptada a las necesidades de cada usuario. Haga clic sobre el botón de flecha del menú de elección del espacio de trabajo, donde por defecto aparece Conceptos básicos y seleccione la opción Clásico. 
4.Vuelva a activar la vista Conceptos básicos, que es en la que trabajaremos y procederemos a conocer los distintos espacios del área de trabajo.
5.En el centro de la pantalla encontramos un área en blanco donde crearemos la nueva escena. Haga doble clic sobre el número 100% que se encuentra en la parte superior izquierda de la escena e introduzca el valor 150 para aumentar el zoom. 
6.En la parte inferior de la pantalla encontrará la Línea de tiempo, con la que trabajaremos en el siguiente ejercicio. A la derecha hay varios paneles. En primer lugar encontramos un primer panel plegado en el que se esconden varias de las ventanas más útiles del programa. Haga clic sobre botón Expandir paneles para comprobar su contenido y vuelva a contraerlo. 
7.A continuación encontramos el panel Propiedades que se irá actualizando según el elemento que tengamos seleccionado. Haga clic sobre la pestaña Biblioteca para ver su contenido.
8.Como ha podido comprobar actualmente se encuentra vacío. Vuelva a activar la pestaña Propiedades y fíjese en el último panel que se encuentra a la derecha. Se trata de la barra de herramientas. En esta barra encontraremos todas las herramientas de dibujo y edición necesarias para crear nuestras creaciones. 
Todas las barras y ventanas pueden cerrarse o reubicarse en otras zonas de la interfaz según convenga al usuario.
IMPORTANTE
El botón Conceptos básicos de la nueva Barra de título del programa permite cambiar con un solo clic el espacio de trabajo, pudiendo elegir entre Animador, Clásico, Depurar, Diseñador y Desarrollador, según el tipo de trabajo que se esté llevando a cabo.
002La Línea de tiempo
LA LÍNEA DE TIEMPO ES EL PANEL PRINCIPAL de la aplicación: gracias a ella Flash es un potente software capaz de generar animaciones vistosas. Su funcionamiento es similar al de un editor de vídeo a partir del cual se pueden incluir y encadenar las imágenes y los sonidos.
IMPORTANTE
La Línea de tiempo se halla subdividida en dos áreas. En la parte izquierda se muestran todas las capas de que consta el documento. Las capas son como varias bandas de película colocadas unas sobre otras, cada una de las cuales contiene una imagen diferente que aparece en el Escenario. A la derecha del panel se visualizan los fotogramas que componen la animación. Los documentos de Flash, al igual que los largometrajes, dividen su contenido en fotogramas, de este modo se justifica su denominación de películas.
1.Para observar correctamente el funcionamiento de la Línea de tiempo, trabajaremos con una animación sencilla que consta de tres capas, representadas en la zona izquierda de la Línea de tiempo. Descargue de nuestra web el archivo Animación.fla y ábralo con Flash CS5. Cada capa dispone de su propia línea de fotogramas, en la parte derecha del panel. Haga clic en el punto situado justo debajo del icono que representa un ojo, dentro de la Capa 1.
2.Con esta acción, se ha ocultado el contenido de la Capa 1, en este caso una imagen de fondo, que ya no es visible en el Escenario. Haga clic en el punto situado justo debajo del icono que representa un ojo, dentro de la Capa 3.
El encabezado de la Línea de tiempo, de color gris y situado en la parte superior de la sección derecha del panel, indica los números de fotograma.
3.El dibujo de la montaña se oculta y sólo queda visible la Capa 2, que contiene la animación. Haga clic en la casilla número 6 de la línea de fotogramas de la Capa 2, justo donde se encuentra el segundo de los cuatro círculos que se han distribuido por esta línea.
4.Acaba de seleccionar el fotograma 6 de la Capa 2. Si ahora quisiera modificar la posición del sol en este fotograma, podría hacerlo. Dirija el puntero al fotograma número 16 de esta misma capa y haga clic en él.
5.El sol ha cambiado de ubicación. La distancia existente entre su posición en el fotograma 6 y su posición en el fotograma 16 indica, en este caso, el recorrido que efectuará el objeto cuando, al ejecutar la película, vayan pasando estos fotogramas. Será mejor ver la película para entender mejor el funcionamiento de la Línea de tiempo. Despliegue el menú Ventana, pulse sobre la opción Barras de herramientas y seleccione la barra Controlador.
6.Haga clic en el botón Ir al primer fotograma, situado en la segunda posición de la barra de herramientas Controlador. 
Los botones del Controlador se parecen a los de un reproductor. El botón Reproducir, reproduce la animación de forma automática
7.El cabezal de la Línea de tiempo se sitúa en el primer fotograma. Al iniciar la reproducción de la película, la cabeza lectora avanza mostrando el contenido de los diferentes fotogramas. Pulse cuatro veces el botón Avanzar un fotograma, el quinto de la barra Controlador, para avanzar hasta el fotograma número 5 y ver cómo actúa la animación. 
8.Cierre la barra Controlador haciendo clic en el botón aspa de su Barra de título.
IMPORTANTE
La Línea de tiempo dispone de diferentes opciones de colocación y visualización. Puede cambiar la ubicación de este elemento arrastrándolo por la pantalla, mientras que para modificar la visualización dispone de un menú de opciones, accesible mediante el icono que aparece en el extremo derecho de la numeración de fotogramas de este elemento.
003Adobe Bridge: el explorador de archivos
EL EXPLORADOR DE ARCHIVOS ADOBE BRIDGE es un avanzado sistema de gestión de archivos gracias al cual el usuario puede visualizar, ordenar y modificar algunas de las características de las creaciones disponibles.
IMPORTANTE
Adobe Bridge, aplicación común a todos los programas que forman parte de la suite Creative Studio, proporciona una completa información de cada archivo, como el nombre y el formato, sus dimensiones, su tamaño y el tipo de color y permite organizar, explorar, localizar y ver en muy poco tiempo qué activos necesita en su día a día en previsualizaciones gráficas y en miniaturas ampliables.
1.Para acceder a Adobe Bridge CS5, despliegue el menú Archivo, seleccione la opción Buscar en Bridge y pulse en el botón No para que Bridge no inicie sesión de forma predeterminada cuando abra Flash.
2.Para que usted pueda realizar sin problemas este ejercicio, utilizaremos la carpeta de imágenes de muestra que Windows proporciona por defecto con el sistema operativo. Haga clic en el icono de la carpeta Imágenes, en el panel Favoritos situado a la izquierda de la ventana, y a continuación haga doble clic sobre el icono de la carpeta predeterminada Imágenes de muestra que aparece en el panel Contenido.
3.Adobe Bridge muestra en miniaturas las imágenes que se encuentran en el interior de la carpeta seleccionada. La ventana está distribuida principalmente en tres partes. A la izquierda, se encuentran el panel de carpetas y el de filtros, en la parte central se visualiza el catálogo de imágenes y en la parte derecha se ubican los paneles de vista previa y propiedades de las imágenes. Para visualizar toda su información, haga clic en la imagen llamada Desert.
La principal ventaja que presenta Bridge es el hecho de poder visualizar las imágenes disponibles y manipularlas antes de importarlas definitivamente al área de trabajo.
Es posible ampliar la anchura del panel Metadatos arrastrando su margen izquierdo y ocultarlo mediante un doble clic en ese punto.
4.Es posible cambiar el modo de visualización de las imágenes en el programa. En este aspecto, la nueva versión del programa ofrece la opción de ver las imágenes como diapositivas en la nueva barra de herramientas. También tiene la opción de mostrar las imágenes con todos sus metadatos en la parte central del programa. Pulse sobre el botón Tira de diapositivas para ver cómo cambia la interfaz.
5.El menú Vista también permite cambiar la visualización de las imágenes. Despliegue el dicho menú y elija la opción Como detalles.
6.Ahora, en el panel Contenido de la parte inferior de la pantalla se muestra toda la información de la imagen seleccionada. En la nueva barra de herramientas de Bridge es posible encontrar extraordinarios comandos como el que permite descargar fotos desde una cámara digital o enviar archivos a Internet o a PDF. El cuadro de búsqueda también es una novedad en esta versión. Haga clic en este cuadro, situado en el extremo derecho de la barra, escriba la palabra tulips y pulse la tecla Retorno.
7.El programa realiza el rastreo en la carpeta actual y muestra la imagen encontrada. Para acabar, despliegue el menú Archivo y haga clic sobre el comando Salir para volver a Flash.
IMPORTANTE
Es posible cambiar a modo compacto la ventana del programa, de manera que pueda trabajar a la vez con Bridge y con Flash. Para ello, sencillamente deberá pulsar el icono situado en el extremo derecho de la barra de herramientas, a la derecha del cuadro de búsqueda.
