cover

Manual de

Flash CS5

Manual de

Flash CS5

MEDIAactive
images

 

Manual de Flash CS5

© MEDIAactive

Primera edición, enero 2011

© 2011 MARCOMBO, S.A.
   Gran Via de les Corts Catalanes, 594
   08007 Barcelona (España)
   www.marcombo.com

en coedición con:

© 2011 ALFAOMEGA GRUPO EDITOR, S.A. de C.V.
   C/ Pitágoras 1139 – Colonia del Valle
   03100 – México D.F. (México)
   www.alfaomega.com.mx

Diseño de la cubierta: NDNU DISSENY GRÀFIC

Con la colaboración de:

images

«Cualquier forma de reproducción, distribución, comunicación pública o transformación de esta obra sólo puede ser realizada con la autorización de sus titulares, salvo excepción prevista por la ley. Diríjase a CEDRO (Centro Español de Derechos Reprográficos, www.cedro.org) si necesita fotocopiar o escanear algún fragmento de esta obra».

ISBN por Marcombo: 978-842-671-869-3

ISBN por Alfaomega: 978-607-707-136-5

ISBN (obra completa): 978-84-267-1674-3

D.L.:

 

 

Índice

La nueva interfaz del programa

Introducción

Lección 1. La interfaz del nuevo Flash CS5

Lección 2. Manipular paneles y paletas

Lección 3. Personalizar el área de trabajo

Lección 4. Preferencias y atajos de teclado

Lección 5. La Línea de tiempo

Lección 6. Adobe Bridge: el explorador de archivos

Películas y plantillas

Introducción

Lección 7. Formato vectorial y formato de mapa de bits

Lección 8. Propiedades de las películas

Lección 9. Visualizar varios archivos simultáneamente

Lección 10. Guardar documentos en Flash CS5

Lección 11. Plantillas

Herramientas de dibujo

Introducción

Lección 12. El panel Herramientas

Lección 13. El relleno de una forma

Lección 14. Ubicación y solapamiento de formas

Lección 15. Líneas y trazos

Lección 16. Rectángulos y óvalos

Lección 17. Rectángulo simple y óvalo simple

Lección 18. Polígonos y estrellas

Lección 19. Lápiz y Pincel

Lección 20. Rectas y curvas

Edición de imágenes

Introducción

Lección 21. Importar mapas de bits

Lección 22. Conversión de imágenes en formas de Flash

Lección 23. Suavizar y optimizar gráficos

Lección 24. Importar archivos de Photoshop Importar

Lección 25. Importar archivos de Illustrator

Los textos estáticos en Flash

Introducción

Lección 26. Atributos de texto

Lección 27. Bloques de texto: dimensiones y orientación

Lección 28. Espaciado entre caracteres y atributos de párrafo

Lección 29. Revisión ortográfica

Lección 30. Contornos de texto y fuentes de dispositivo

El color en Flash

Introducción

Lección 31. Borrar trazos y rellenos

Lección 32. Los trazos y el Bote de tinta

Lección 33. Los rellenos y el Cubo de pintura

Lección 34. Los colores personalizados y la paleta Color

Lección 35. Degradados y color vinculado a mapas de bits

Lección 36. Las paletas y las muestras de color

Lección 37. Transformación de rellenos

Trabajar con objetos

Introducción

Lección 38. Seleccionar y agrupar formas

Lección 39. Desagrupar y separar

Lección 40. Transformación libre de objetos

Lección 41. El panel Transformar

Lección 42. Supresión, copia y pegado de objetos

Lección 43. Organizar objetos

Lección 44. Reglas, guías y cuadrícula

Lección 45. Opciones de ajuste

Lección 46. Alineación de objetos

Las capas y la Línea de tiempo

Introducción

Lección 47. Capas y carpetas de capa

Lección 48. Eliminar y visualizar capas

Lección 49. Bloqueo y propiedades de capa

Lección 50. Visualización de la Línea de tiempo

Símbolos gráficos

Introducción

Lección 51. Creación de símbolos gráficos

Lección 52. Símbolos e instancias

Lección 53. Edición de símbolos e instancias

Lección 54. La Biblioteca y los símbolos gráficos

Lección 55. Convertir símbolos en herramientas de diseño

Lección 56. Aplicar efectos con la herramienta Deco

Fotogramas, animación y movimiento

Introducción

Lección 57. Animación fotograma a fotograma

Lección 58. Velocidad de fotogramas y duración de animaciones

Lección 59. Interpolación de movimiento

Lección 60. Recurrir a las interpolaciones clásicas

Lección 61. Modificar manualmente la aceleración

Lección 62. Editar curvas con el Editor de movimiento

Lección 63. Configurar movimientos predefinidos

Lección 64. Movimiento y color en textos

Lección 65. Trayectoria del movimiento

Lección 66. Movimiento a lo largo de un trazado

Lección 67. Uso de capas de máscara

Lección 68. Copiar y pegar interpolaciones

Lección 69. Animar con la herramienta Hueso

Lección 70. Animar con la herramienta Hueso

Lección 71. Animar en 3D

Forma

Introducción

Lección 72. Interpolación de forma

Lección 73. Trazos, rellenos e interpolaciones

Lección 74. Consejos de forma

Lección 75. Formas, texto y mapas de bits

Escenas, símbolos animados y botones

Introducción

Lección 76. Insertar escenas

Lección 77. El orden y el nombre de las escenas

Lección 78. Reproducción de escenas y películas

Lección 79. Control de instancias de símbolos gráficos

Lección 80. Animación de símbolos gráficos

Lección 81. Los símbolos gráficos y el Papel cebolla

Lección 82. Símbolos gráficos y clips de película

Lección 83. Clips anidados

Lección 84. Bibliotecas comunes: Botones

Lección 85. Creación de botones

Lección 86. Prueba de botones

Lección 87. Botones animados

Programación y control de la reproducción

Introducción

Lección 88. ActionScript 3.0 y las acciones

Lección 89. El panel Acciones y la introducción de código

Lección 90. Eventos e interacciones

Lección 91. Etiquetas de fotogramas

Lección 92. Anclajes

Lección 93. Copia, pegado, exportación e importación de scripts

Lección 94. La ventana Script integrada

Lección 95.Vincular un botón a una página web

Sonido y vídeo

Introducción

Lección 96. Importación y compresión de archivos de audio

Lección 97. Edición y personalización de sonidos

Lección 98. El importador de vídeo a Flash

Exportación y publicación

Introducción

Lección 99. El Explorador de películas

Lección 100. Exportación de imágenes y películas

Lección 101. Rendimiento de descarga y opciones de impresión

Lección 102. Publicación de documentos

Lección 103. Exportación avanzada de Quicktime

Lección 104. La ayuda de Flash CS5

La nueva interfaz del programa

Introducción

El software Adobe Flash CS5 Professional es la evolución de un programa que nació como un simple editor de animación vectorial. Presentaba la ventaja de crear vistosas películas de poco tamaño y, por tanto, fácilmente publicables en Internet. Esto hizo que rápidamente se popularizara su uso entre los animadores de todo el mundo. El crecimiento y la evolución de Flash han sido vertiginosos. Ha incorporado funciones de programas de dibujo vectorial y editores de imagen, procesadores de texto y páginas web, gestores de sedes y hasta un lenguaje de programación propio, renovado y ampliado en esta nueva versión de la aplicación con la aparición de ActionScript 3.0, para convertirse en un completo programa de autor capaz de generar contenido interactivo de alta calidad para plataformas móviles, digitales y web.

Images

El La complejidad de Adobe Flash CS5 Professional hace que sea recomendable fijar sólidamente ciertos conceptos antes de empezar a trabajar con los documentos. Flash es un programa que requiere ir paso a paso para conseguir sacar el máximo partido a todas sus prestaciones.

Gracias a las múltiples herramientas de creación y edición, es posible crear elaborados y profesionales sitios web interactivos, anuncios con todo tipo de contenido multimedia (sonido, imágenes, vídeo...), presentaciones, juegos, sistemas didácticos, etc.

Images

En las primeras lecciones de este manual, el usuario tomará contacto con el programa y, sobre todo, con los elementos de su interfaz. En el resto de lecciones, el usuario empezará a trabajar con el diseño, utilizando las múltiples, variadas y renovadas herramientas de dibujo, editando imágenes, manipulando textos y gestionando objetos, acciones éstas básicas para un posterior manejo del programa sin dificultades.

Images

Lección 1. La interfaz del nuevo Flash CS5

Al acceder por primera vez a Adobe Flash CS5 llama la atención la nueva disposición de las paletas, mucho más elegante y flexible que en versiones anteriores de la aplicación. En la nueva interfaz, las paletas se organizan en grupos y éstos, a su vez, en paneles verticales que se expanden horizontalmente al pulsar sobre su borde superior. En la parte superior, como en la gran mayoría de los programas, está situada la Barra de menús, que contiene los menús desplegables con todas las funciones del programa: abrir, guardar, copiar, administrar comandos... La Barra de título original ha desaparecido, dando lugar así a un nuevo espacio en el que tiene cabida el menu de elección del espacio de trabajo (Conceptos básicos, por defecto) y un cuadro de búsqueda.En la parte derecha del área de trabajo se encuentran, en este orden, las paletas Propiedades y Biblioteca que podrán estar visibles siempre que usted lo crea oportuno, distribuyéndolas por el área de trabajo o modificando su posición y tamaño dependiendo de sus necesidades. La parte inferior de la interfaz está ocupada por la Línea de tiempo, destinada a la gestión de las animaciones, y el nuevo Editor de movimiento.

1 En la primera parte de esta lección, va a aprender a ejecutar Flash desde el botón Iniciar. La lección comienza en el Escritorio de Windows. Dirija el puntero del ratón hacia la parte inferior de la pantalla y haga clic en el botón Iniciar de la Barra de tareas.

2 Haga clic en la opción Todos los programas.

Images

En la ventana de inicio encontrará las distintas opciones y posibilidades sobre la creación y abertura de documentos.

3 En principio, la práctica totalidad de los programas que instala en su equipo quedan reflejados en el menú que se despliega. Haga clic en el grupo de programas de Adobe y pulse en la subopción Adobe Flash CS5 Professional para que se ejecute el programa. (1)

4 Se abre la aplicación mostrando en su parte central una pantalla de bienvenida (2) cuyas opciones se agrupan en cuatro bloques. El primero, 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. Haga clic en la casilla de verificación de la opción No volver a mostrarlo.

5 El programa muestra un cuadro que informa del método que debemos seguir para recuperar la pantalla de bienvenida. Pulse el botón Aceptar.

Images

Debajo del escenario se encuentra la Línea de tiempo, que permite organizar y controlar el contenido de un documento.

6 Para generar un documento en blanco y abandonar definitivamente la pantalla de bienvenida, pulse sobre el enlace ActionScript 3.0. (3)

7 Éste es el aspecto que presenta Flash CS5 al crear un documento en blanco. (4) La interfaz de usuario se ha actualizado y presenta un aspecto similar al de otras aplicaciones de Adobe, lo que facilitará el trabajo a sus usuarios. La Barra de título original ha desaparecido, dando lugar así a un nuevo espacio, denominado Barra de aplicación, en el que tiene cabida el menu de elección del espacio de trabajo (Conceptos básicos, por defecto) y un cuadro de búsqueda.También en esta barra, en la parte derecha, encontramos los habituales iconos Minimizar, Restaurar-Maximizar y Cerrar. Pulse sobre el icono del programa, situado en el extremo izquierdo de la Barra de título.

8 Este icono nos conduce al menú de control, también accesible mediante la pulsación del botón derecho del ratón sobre una zona libre de la Barra de título. Sus opciones se corresponden con las del grupo de botones anteriormente comentado y afectan a la totalidad de la aplicación. Pulse sobre la opción Minimizar.

9 El programa queda reducido a un botón en la Barra de tareas de Windows. Dirija el puntero del ratón hacia la parte inferior de la pantalla y pulse sobre el botón expandido de Flash CS5.

10 Bajo la Barra de aplicación, se encuentra la Barra de menús, que contiene las diferentes opciones que componen el programa. En el centro de la pantalla se muestra el denominado Escenario, área rectangular donde se verá el archivo con el que se trabaja. Por encima del área de trabajo se encuentra la denominada Barra de edición, que se ubica justo debajo de la pestaña que identifica al documento. Este sistema de organización de los documentos abiertos en pestañas fue una noveda de la versión CS5 de Flash. Bajo el escenario se encuentran la Línea de tiempo, que permite organizar y controlar el contenido de un documento y el nuevo Editor de movimiento. El resto de elementos del área de trabajo por defecto de Flash CS5 son los paneles Propiedades y Biblioteca, y la paleta Herramientas, dispuestos en la parte derecha. Como se verá en estos primeros capítulos del libro, todos estos componentes pueden cerrarse o reubicarse en otras zonas de la interfaz según convenga al usuario. El menú Ventana ofrece acceso a otras paletas del programa y proporciona además opciones de configuración del entorno de trabajo. Despliegue ese menú y pulse sobre la opción Barras de herramientas (5).

11 Flash incorpora tres barras de herramientas, de las cuales sólo una, la Barra de edición, se muestra por defecto, tal y como indica el signo de verificación. Seleccione la opción Principal (6) con un clic de ratón.

12 Automáticamente, se muestra en pantalla una barra con diversos iconos. Comunes en las aplicaciones del entorno Windows (7), los cinco primeros representan los comandos principales del menú Archivo y el resto se corresponde con opciones de los menús Edición, Ver y Modificar. Despliegue de nuevo el menú Ventana.

13 Pulse en la opción Barras de herramientas y, después, en Controlador.

Images

14 La barra de herramientas Controlador (8) funciona como la botonera de cualquier reproductor; sus comandos permiten el control de la reproducción de las películas dentro del programa. En estos momentos los botones del Controlador se encuentran desactivados, puesto que el documento creado sólo contiene el fotograma inicial. Existen dos métodos para ocultar una barra de herramientas; el más sencillo consiste en pulsar el botón Cerrar de su Barra de título. Hágalo con la paleta Controlador.

15 Otro método consiste en desactivar la barra en el menú Ventana. Despliegue una vez más el menú Ventana, haga clic en la opción Barras de herramientas y pulse en Principal para ocultarla y dejar así el área de trabajo tal y como aparece por defecto.

Lección 2. Manipular paneles y paletas

Todos los paneles y las paletas que ofrece Flash CS5 se encuentran en el menú Ventana, desde el cual pueden mostrarse u ocultarse. Los paneles de Flash CS5 pueden distribuirse manualmente por el área de trabajo mediante la técnica de arrastre para convertirse en paletas flotantes independientes y su ubicación original puede recuperarse de forma automática gracias al comando Predeterminado, incluido en la opción Espacio de trabajo del menú Ventana. Todos los paneles activos en el área de trabajo aparecen en el menú desplegable Ventana con un signo de verificación. Si desea ocultarlos todos a la vez de forma transitoria, deberá pulsar la tecla F4 o seleccionar la opción Ocultar paneles del menú Ventana. Por último, cabe destacar la posibilidad de conservar una configuración concreta de los paneles en el área de trabajo, tanto en cuanto a su ubicación como a las características de configuración para cada uno de ellos.

1 Las paletas y los paneles que componen la interfaz de Flash CS5 pueden mostrarse y ocultarse siguiendo distintos procedimientos. Para empezar, haga clic en la doble punta de flecha de los paneles Propiedades y Biblioteca. (1)

2 Los dos paneles han quedado contraídos a la derecha del área de trabajo. (2) Para volver a mostrarlos podemos utilizar de nuevo la doble punta de flecha o bien dirigirnos al menú Ventana. Despliegue este menú y seleccione la opción Biblioteca.

3 Se muestra un nuevo panel mostrando el contenido del panel Biblioteca. (3) Compruebe que este panel comparte espacio también desplegado con el panel Propiedades. Haga clic sobre la pestaña Propiedades para activar ese panel.

Images

Todas las barras y ventanas pueden cerrarse o reubicarse en otras zonas de la interfaz según convenga al usuario.

4 Para volver a mostrar el contenido del panel Biblioteca, haga clic en la pestaña con ese nombre.

5 Estos paneles, igual que sucede con la paleta Herramientas, situada a la derecha de la pantalla, no son elementos fijos, sino que pueden distribuirse por el área de trabajo de modo que queden situados en el lugar que a usted más le convenga. Para ello, deberá utilizar la técnica de arrastre con el ratón. Pulse sobre la pestaña de la paleta Propiedades y, sin soltar el botón del ratón, arrastre este elemento hasta el centro del área de trabajo. (4)

6 Para colocar el panel Propiedades en su ubicación original, arrástrelo pulsando en su pestaña hasta situarlo por encima del panel Biblioteca.

7 Tenga en cuenta que, también mediante el arrastre, es posible cambiar el orden de las fichas en un panel. Pero no sólo la ubicación de los paneles puede ser modificada, sino también el tamaño de algunas de ellas. Para ello, también se utiliza la sencilla técnica del arrastre. Haga clic sobre el nombre del panel Propiedades, ahora contraído.

Images

8 Para modificar el tamaño de un panel, se debe arrastrar hacia arriba (5) o hacia abajo (6) la línea situada en su margen inferior. Haga clic en el margen inferior de este panel y arrástrelo aproximadamente dos centímetros hacia arriba.

9 Es posible ocultar todos los paneles (7) pulsando la tecla F4 o bien seleccionando la opción adecuada del menú Ventana. Despliegue dicho menú y pulse sobre la opción Ocultar paneles.

10 Para volver a mostrar los paneles predeterminados y dar así por acabado este ejercicio, despliegue una vez más el menú Ventana y pulse sobre la opción Mostrar paneles (8) o bien pulse la tecla F4.

Lección 3. Personalizar el área de trabajo

Adobe Flash CS5 permite reconfigurar las herramientas disponibles en el área de trabajo y guardar una disposición determinada de los paneles y las paletas. La posibilidad de conservar la configuración del área de trabajo es muy útil puesto que permite disponer de una configuración de colores, herramientas y disposición de los paneles concreta que le facilitará el trabajo en ciertos momentos, según el tipo de tarea que vaya a desarrollar. Pero ¿qué significa exactamente guardar la configuración del área de trabajo? Cuando usted guarda una configuración del área de trabajo, Flash almacena la disposición de las paletas, incluso aquellas que están abiertas con las pestañas activas en ese momento, y su ubicación. Cualquier área de trabajo personalizada puede eliminarse o ser devuelta a su estado inicial. Además del predeterminado, denominado Conceptos básicos, Flash CS5 ofrece otros seis espacios de trabajo (1) con una configuración predefinida: Animador, Clásico, Depurar, Diseñador, Desarrollador y Pantalla pequeña. Todos estos espacios de trabajo disponibles, más los que cree el usuario, se pueden activar tanto desde el comando Espacio de trabajo del menú Ventana como desde el nuevo comando de la nueva Barra de aplicación.

1 En este ejercicio aprenderá a personalizar el área de trabajo en distintos aspectos, personalización que, finalmente, guardaremos de modo que podamos disponer de ella cuando lo creamos oportuno. En primer lugar, ocultaremos uno de los paneles predeterminados, situado en la parte inferior de la pantalla. Despliegue el menú Ventana y haga clic sobre el comando Línea de tiempo. (2)

Images

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.

2 Al ocultar la Línea de tiempo también se oculta el Editor de movimiento. Como segunda modificación en el área de trabajo, abriremos el panel Color y lo ubicaremos con el resto de paneles. Despliegue de nuevo el menú Ventana y haga clic sobre el comando Color.

3 El panel Color se sitúa flotante en el centro del área de trabajo. Vamos a ubicarlo con el resto de paneles. Para ello, haga clic sobre la cabecera de este panel y, sin soltar el botón del ratón, arrástrelo hacia la derecha, hasta situarlo por debajo del panel Biblioteca. (3)

4 Seguidamente, pasaremos a mostrarle cómo guardar este área de trabajo. Haga clic en el menú Ventana, pulse sobre la opción Espacio de trabajo y seleccione la opción Nuevo espacio de trabajo.

5 En el cuadro de diálogo Nuevo espacio de trabajo, deberá escribir el nombre con el que desea guardar el estado actual del área de trabajo. Para ello, uno de los criterios que puede seguir es utilizar el nombre del proyecto con el que esté trabajando, y para el cual haya personalizado el área de trabajo. En cualquier caso, le recomendamos que asigne siempre nombres que pueda identificar fácilmente cuando deba recuperar un área de trabajo en concreto. En este ejemplo, escriba el término prueba (4) en el campo Nombre y pulse después sobre el botón Aceptar.

6 El programa ha guardado la configuración actual del espacio de trabajo y adapta la interfaz al cambio. Compruebe en la barra de aplicaciones, la cual contiene ahora la Barra de menús, que aparece el nombre prueba del espacio aplicado en estos momentos. (5) Otra opción interesante en cuanto a la personalización del área de trabajo es la selección de una disposición predeterminada por el programa. Para ello, despliegue el campo que en este momento muestra el nombre prueba y elija la opción Diseñador. (6)

Images

7 El cambio en la disposición de los paneles es evidente. (7) Así, el programa adapta el área de trabajo con aquellos paneles y barras de herramientas que más se utilizan en el sector del diseño. Para recuperar la configuración que hemos guardado anteriormente, haga clic en el menú Ventana, pulse sobre la opción Espacio de trabajo y seleccione la opción prueba.

8 Cualquier espacio de trabajo personalizado se puede eliminar una vez consideremos que ya no la volveremos a utilizar más. Despliegue de nuevo el campo de espacios de trabajo de la barra de aplicaciones y haga clic en la opción Administrar espacios de trabajo.

9 En el cuadro de diálogo Administrar espacios de trabajo (8) se listan todas las configuraciones personalizadas del entorno de trabajo. Desde este cuadro, como ve, es posible cambiar su nombre o eliminarlas. Seleccione con un clic el único espacio de trabajo que aparece en el cuadro y pulse el botón Eliminar.

10 En el cuadro de advertencia que aparece, pulse sobre el botón para confirmar la eliminación y después salga del cuadro Administrar espacios de trabajo pulsando el botón Aceptar.

Lección 4. Preferencias y atajos de teclado

La personalización del entorno de trabajo en Flash CS5 no se limita al control de la distribución de los conjuntos de paneles. El programa permite establecer las preferencias para las operaciones generales de la aplicación, las opciones de edición, las operaciones con el Portapapeles, el sistema de avisos del programa y el aspecto del código ActionScript durante su edición. Asimismo, los métodos abreviados de teclado de la aplicación pueden ser configurados. Éstos, también conocidos como atajos de teclado, definen los comandos que se ejecutan al pulsar una o varias teclas conjuntamente, ahorrando tiempo en la realización de las acciones. Antes de empezar a utilizar las herramientas del programa resulta interesante personalizarlo, de manera que se ajuste a los gustos y las necesidades del usuario. En esta lección veremos el modo de conseguirlo.

1 Para acceder al cuadro de diálogo Preferencias, despliegue el menú Edición y pulse sobre la opción Preferencias. (1)

Images

Desde el panel Preferencias puede personalizar las opciones de Flash CS5 para que el programa se ajuste a sus necesidades y pueda utilizarlo de la manera que le resulte más cómodo.

2 La ventana consta de nueve categorías. La primera de ellas contempla la configuración de opciones generales relativas al programa. El primer valor definible es el correspondiente a la visualización de la pantalla de bienvenida al iniciar el programa. Recuerde que, en un capítulo anterior, desactivamos la aparición de dicha pantalla, por lo que activamos automáticamente la opción Ningún documento, tal y como puede ver en el campo Al iniciar. (2) El segundo valor se refiere a los niveles del comando Deshacer. Por defecto, la aplicación permite deshacer 100 cambios realizados, en orden inverso a su ejecución. El número de niveles para deshacer y rehacer puede estar comprendido entre 2 y 300. Cuantos más utilice, más memoria del sistema se usará. Haga doble clic en el campo niveles y escriba el valor 50.

3 Entre otras muchas opciones de configuración, se ofrecen las relativas a la selección. La única opción de impresión, Deshabilitar PostScript, sólo debe ser activada si se tienen problemas al imprimir los documentos. Para definir el comportamiento de la Línea de tiempo se ofrecen dos opciones adicionales: una relativa al modo de selección de fotogramas y otra que predefine la creación de un anclaje, o marca identificativa, en el primer fotograma de cada escena. Además, desde esta categoría, también se pueden configurar el color de resaltado que diferencia el contenido de las diferentes capas y el modo en que se cierran los proyectos. También es posible habilitar la versión Cue, un gestor de versiones de archivos con dicha versión habilitada que se incluye en la suite de programas de Adobe de la que forma parte Flash CS5. Pasemos a ver el contenido del resto de categorías. Pulse en la categoría ActionScript. (3)

4 ActionScript es el nombre del código de programación propio de Flash. Las opciones de este apartado permiten configurar el modo en el que se presentará dentro del editor. La sangría automática resulta muy práctica a la hora de introducir el código y no es por tanto aconsejable desactivarla. En la parte inferior del cuadro de diálogo, un botón permite recuperar la configuración original de los parámetros contenidos en este apartado. Pulse el botón Restablecer a predeterminados.

Images

Una vez acepte las modificaciones que haya introducido en el cuadro Preferencias estás quedarán guardadas y se aplicarán al programa.

5 Este botón sólo restablece las opciones predeterminadas de la categoría activa, los cambios realizados en el resto de fichas siguen tal y como los dejamos. Observe que, entre otras opciones, desde esta ficha es posible configurar los códigos de lenguaje de ActionScript 2.0 y de ActionScript 3.0. Haga clic en la categoría Formato automático (4) para ver las opciones de configuración que incluye.

6 En esta categoría se muestran toda una serie de opciones de formato automático para ActionScript cuyo efecto puede ir comprobando en la ventana de vista previa. En este caso, mantendremos todas las opciones desactivadas. Haga clic en la categoría Portapapeles. (5)

7 Las características de los diferentes tipos de imágenes copiadas en el Portapapeles pueden ser alteradas desde este apartado, de modo que se ajusten a la configuración definida cuando sean introducidas en los documentos.

8 Haga clic ahora sobre la categoría Dibujo. (6)

9 Este apartado presenta opciones relativas al uso de la herramienta Pluma, idónea para el trazado preciso de figuras, y a la configuración de los dibujos. También presenta una opción referente a la espectacular Herramienta Hueso, que permite dibujar figuras en movimiento de forma sencilla y dinámica, como se verá más adelante en este libro. Las diferentes opciones de configuración de los dibujos sirven para especificar los comportamientos de ajuste, suavizado y tolerancia al utilizar las herramientas de dibujo de Flash. Pulse ahora sobre la categoría Texto. (7)

10 En esta sección podemos indicar qué fuente utilizará Flash al sustituir las que falten en los documentos que se abran y establecer diferentes opciones de texto vertical y el método de entrada adecuado. Mantenga las opciones de esta categoría tal y como se muestran por defecto y pulse sobre la categoría Advertencias. (8)

11 Desde este apartado se deshabilitan los avisos que el programa muestra en pantalla al producirse un problema en la edición o la publicación de los archivos. Mantenga todas las advertencias activadas y pulse en la categoría Importador de archivos PSD. (9)

12 Flash CS5 permite importar archivos de Photoshop y de Illustrator directamente a los documentos de Flash. En este apartado se pueden establecer las preferencias de importación de los archivos PSD, es decir, creados en Photoshop. Pulse ahora en la categoría Importador de archivos AI. (10)

13 Lógicamente, desde esta categoría, se pueden establecer las opciones de importación para objetos creados con Illustrator. Pulse el botón Aceptar para aplicar los cambios realizados en el cuadro de preferencias. (11)

Images

14 Dedicaremos la segunda parte de este capítulo a los métodos abreviados de teclado. Flash predefine que una serie de teclas ejecuten comandos asociados. Algunos atajos de teclado son comunes a todos los programas que trabajan bajo el entorno de Windows, como los que activan operaciones tan repetidas como la copia o el pegado de objetos. Otros son propios del programa pero se pueden restablecer para que coincidan con los utilizados en otras aplicaciones o para hacer más eficaz el flujo de trabajo de Flash. Para cambiar los métodos de teclado predefinidos, abra el menú Edición y seleccione la opción Métodos abreviados de teclado.

15 En la parte superior del cuadro Métodos abreviados de teclado un cuadro desplegable muestra el conjunto de métodos seleccionado, en este caso, el estándar de Adobe. (12) Bajo éste se definen el tipo de comandos, también en un cuadro desplegable, y se listan en forma de árbol jerárquico los menús de la aplicación. (13) Haga clic en el signo + que precede a la opción Archivo. (14)

16 Se muestran de este modo todos los comandos que contiene el menú Archivo y su correspondiente combinación de teclas. Pulse en el botón de flecha del cuadro Conjunto actual y, de la lista que se despliega, seleccione la opción Flash 5. (15)

17 Aparece el listado de comandos de la versión 5 de Flash, que no presenta ninguna tecla para activar el comando Nuevo. El programa no se limita a las configuraciones predefinidas, sino que el usuario puede crear un conjunto personalizado de métodos abreviados. Para ello deberá duplicar uno de los existentes. Pulse el botón Duplicar conjunto, el primero del grupo de botones situado en la esquina superior derecha del cuadro de diálogo.

18 El programa asigna un nombre para el nuevo conjunto. En el campo Nombre de duplicado del cuadro Duplicar, escriba, por ejemplo, la palabra personal y pulse el botón Aceptar. (16)

19 Ahora ya puede proceder a variar los atajos de teclado establecidos. Seleccione el comando Nuevo del menú Archivo y haga clic en el botón que presenta un signo +, en la parte superior del cuadro Métodos abreviados.

20 Se activa el campo Presionar tecla. En él deberá introducir la tecla o la combinación de teclas que desea que active la función. Tenga en cuenta que no podrá repetir y que, para los comandos de los menús, dicha combinación deberá incluir la tecla Control. Pulse la combinación de teclas Ctrl.+J. (17)

21 Seguidamente, pulse el botón Cambiar para asignar la combinación introducida al comando Nuevo. (18)

Images

22 De este modo, podríamos configurar el acceso mediante el teclado a la totalidad de los comandos de la aplicación, para adaptarlos a nuestras preferencias. Para eliminar un método abreviado, una vez seleccionado, se debe pulsar el botón con el signo – del cuadro de diálogo. Para eliminar un conjunto de métodos se debe seleccionar en el cuadro Conjunto actual y pulsar el botón Eliminar conjunto, que está representado por el dibujo de una papelera. Para finalizar el ejercicio sin aplicar los cambios realizados, recuperando por tanto el conjunto de métodos predefinido por el programa, pulse el botón Cancelar.

Lección 5. La 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. La función de la Línea de tiempo es la de coordinar el tiempo de la animación, controlar las secuencias y ensamblar las distintas capas que la componen. 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, abriremos un documento con una animación sencilla ya creada denominado Ejemplo_01 que puede encontrar en la zona de descargas de nuestra sede web y almacenar previamente en la carpeta Documentos de su equipo. Antes, cerraremos el documento en blanco generado al inicio del curso. Para cerrar una película de Flash en uso, se puede utilizar la opción del mismo nombre del menú Archivo, la combinación de teclas Control+ W o el botón de aspa de la pestaña del documento. Utilice el método que prefiera.

Images

El encabezado de la Línea de tiempo, de color gris y situado en la parte superior derecha del panel, indica los números de fotograma.

2 Seguidamente abriremos el documento creado para agilizar la realización del curso. Despliegue el menú Archivo (1) y pulse sobre la opción Abrir.

3 Esta acción nos conduce al cuadro de diálogo Abrir. (2) Acceda al contenido de la carpeta Documentos, seleccione el archivo de Flash Ejemplo_01 y pulse el botón Abrir.

4 El archivo seleccionado se muestra en el área de trabajo. (3) Esta animación consta de tres capas, representadas en la zona izquierda de la Línea de tiempo. 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. (4)

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

6 El dibujo de la montaña se oculta y únicamente 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.

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

Images

8 Observe que 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. Quizás será mejor ver la película para entender mejor el funcionamiento de la Línea de tiempo. Para reproducir la película sin abandonar el área de trabajo recurriremos a la barra de herramientas Controlador. Despliegue el menú Ventana, pulse sobre la opción Barras de herramientas y seleccione la barra Controlador. (7)

9 Tal y como comentamos en una lección anterior, los botones del Controlador se asemejan a los de cualquier reproductor de vídeo o audio. Haga clic en el botón Ir al primer fotograma, situado en la segunda posición de la barra de herramientas Controlador.

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

11 Lógicamente, con el botón Reproducir, la animación se reproducirá de manera automática. Es posible reproducir la película sin necesidad de utilizar esta barra de herramientas usando las teclas adecuadas y los comandos del menú Control. Cierre la barra Controlador haciendo clic en el botón aspa de su Barra de título.

12 Para situar la cabeza lectora al principio de la película sin seleccionar ningún fotograma, pulse sobre el número 1 en el encabezado de la Línea de tiempo.

13 Para contemplar el efecto que produce la animación con el dibujo de la montaña visible, haga clic en el aspa roja situada justo debajo del icono que representa un ojo dentro de la Capa 3. (9)

14 Para iniciar la reproducción, pulse la tecla Retorno.

15 Antes de acabar este ejercicio en el que hemos empezado a conocer la Línea de tiempo, comprobaremos que este elemento dispone de diferentes opciones de visualización. Haga clic en el icono que aparece en el extremo derecho de la numeración de fotogramas de la Línea de tiempo para mostrar el menú de opciones. (10)

Images

16 Como puede ver, la Línea de tiempo puede visualizarse en distintos tamaños, mientras que, a diferencia de versiones anteriores de Flash CS4, no puede cambiar su ubicación desde este menú. Pulse sobre el comando Pequeño. (11)

17 El espacio en el que se visualizan los fotogramas se ha reducido para mostrar un mayor número de estos elementos. A continuación, cambiaremos a otro modo de visualización de la Línea de tiempo de manera que muestre una vista previa del contenido de los fotogramas. Haga clic en su icono de opciones y seleccione la opción Vista previa. (12)

18 Ésta es la forma perfecta para conocer lo que contiene cada capa y, con ello, conseguir una mejor gestión de los elementos. Por último, devolveremos la Línea de tiempo a su ubicación y modo de visualización originales. Despliegue una vez más su menú de opciones y pulse sobre la opción Normal.

Lección 6. Adobe Bridge: el explorador de archivos

Una de las novedades que presentó la versión CS3 de Flash (y del resto de aplicaciones de la suite Adobe Design Premium CS3) fue el explorador de archivos Adobe Bridge. Gracias a este avanzado sistema de gestión de archivos el usuario puede visualizar, ordenar y modificar algunas de las características de las creaciones disponibles. Bridge 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. La aplicación ofrece ahora un rendimiento mejor, un panel de filtros que hace más sencilla la búsqueda, capacidad para la agrupación de imágenes en una sola miniatura, una herramienta de lupa, la posibilidad de explorar imágenes fuera de línea y de aplicar ajustes de color coherentes entre los programas de Adobe, entre otras acciones.

1 El nuevo sistema de gestión de archivos Adobe Bridge permite automatizar flujos de trabajo entre los diferentes programas de la suite Adobe CS5, aplicar ajustes de color coherentes entre dichos programas y acceder a las funciones de control de versión, entre otras opciones. Para acceder a Adobe Bridge CS5, despliegue el menú Archivo y seleccione la opción Buscar en bridge. (1)

Images

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.

2 La principal ventaja que presenta Bridge es el hecho de poder visualizar los documentos y las imágenes disponibles y manipularlos antes de importarlos definitivamente al área de trabajo. Para que usted pueda realizar sin problemas este ejercicio, utilizaremos la carpeta de imágenes de muestra que Windows 7 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.

3 A continuación haga doble clic sobre el icono de la carpeta predeterminada Imágenes de muestra que aparece en el panel Contenido. (2)

4 Adobe Bridge muestra en miniaturas las imágenes que se encuentran en el interior de la carpeta seleccionada. Observe que 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. (Evidentemente, puede trabajar con sus propias imágenes si lo desea.)

5 En la paleta Metadatos se muestra la información de la imagen seleccionada. Sepa que es posible ampliar la anchura de este panel arrastrando su margen izquierdo y ocultarlo mediante un doble clic en ese punto. En el panel Propiedades de archivo, parte de la paleta Metadatos, se especifica el nombre y el tipo de archivo así como la fecha de creación o inclusión en la carpeta y la fecha en que la imagen fue modificada. También puede consultar las dimensiones del archivo, el color indexado y el tamaño. Es posible cambiar el modo de visualización de las imágenes en el programa, así como cambiar a modo compacto la ventana del programa, de manera que pueda trabajar a la vez con Bridge y con Flash. Para modificar el modo de visualización de su colección de imágenes en la ventana de Adobe Bridge, despliegue el menú Vista y elija la opción Como detalles. (3)

Images

Es posible ampliar la anchura del panel Metadatos arrastrando su margen izquierdo y ocultarlo mediante un doble clic en ese punto.

6 Una de las mejores características de Bridge es la herramienta de búsqueda que contiene, perfeccionada en esta versión con un interesante panel de filtros que nos permite establecer criterios de búsqueda sin necesidad de acceder al cuadro Buscar y ordenar la lista de resultados de diferentes maneras. Vamos a probarlo. Imaginemos que queremos mostrar únicamente las imágenes clasificadas con 3 estrellas. En el apartado Clasificaciones del panel Filtro, pulse sobre la primera, la de 3 estrellas. (4)

7 Aparecen así en el panel Contenido las imágenes clasificadas con esta puntuación. Para ordenarlas por nombre, haga clic en la punta de flecha del campo que muestra el término Ordenar por Clasificación de la barra de herramientas del programa y seleccione la opción Por nombre de archivo.

8 Una vez comprobada la utilidad del panel de filtros, localizaremos otra imagen utilizando ahora el cuadro Buscar. Haga clic en el menú Editar y pulse sobre la opción Buscar.

9 Se abre el cuadro de diálogo Buscar, en el cual, principalmente, debemos indicar la ubicación en la cual se debe realizar el rastreo y los criterios en los que se basará la utilidad para hacerlo. Imaginemos que queremos localizar una imagen de la cual sólo recordamos el nombre con que fue guardada en la carpeta Imágenes (localice y guarde en dicha carpeta la imagen llamada Roma. jpg que puede encontrar en la zona de descargas de nuestra sede web). Haga clic en el botón de punta de flecha del campo Buscar en y seleccione la opción Imágenes.

10 En el apartado Criterios, debemos especificar el criterio en el cual deberá basarse el rastreo En este caso introduciremos el nombre del archivo manteniendo las opciones Nombre de archivo y contiene en el apartado Criterios. Haga clic en el campo Introducir texto, escriba la palabra Roma. (5)

Images

11 Los botones con los signos + y – que aparecen en el apartado Criterios nos permiten añadir o eliminar criterios de búsqueda. Para que empiece el rastreo, haga clic en el botón Buscar.

12 Tras realizar la búsqueda por las carpetas y subcarpetas del directorio indicado, el programa muestra el archivo de imagen Roma en la ficha Contenido. El modo de visualización se adapta al que habíamos seleccionado anteriormente, Como detalles. Desde esta aplicación, puede llevar a cabo alguna manipulación sobre la imagen, como un cambio de orientación o, incluso, su eliminación. Para girar 180 grados la imagen, selecciónela, despliegue el menú Editar y pulse sobre el comando Rotar 180º. (6)

13 Observe el resultado en la imagen Roma 180 que puede encontrar en la zona de descargas de nuestra sede web y repita la operación para dejar la imagen con su aspecto original.

14 Para terminar este ejercicio, despliegue el menú Archivo y haga clic sobre el comando Salir para volver a Flash.