Kitabı oku: «Aprender Flash CS6 con 100 ejercicios prácticos»
Aprender Flash CS6 con 100 ejercicios prácticos
© 2012 MEDIAactive
Primera edición, 2012
© 2012 MARCOMBO, S.A.
Gran Via de les Corts Catalanes, 594
08007 Barcelona
www.marcombo.com
En coedición con:
© 2012 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: NDENU DISSENY GRÀFIC
«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-84-267-1841-9
ISBN por Alfaomega:
D.L.:
Printed in Spain
| Presentación |
APRENDER FLASH CS6 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 CS6, 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 CS6 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 CS6
Aunque a primera vista la creación y edición de películas y animaciones pueda parecer sólo al alcance de profesionales y expertos, con programas como Flash cualquier persona con un mínimo de conocimientos de informática puede llegar a conseguir impensables creaciones.
Flash CS6, 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. En las últimas versiones, además, el uso de códigos se hace más accesible a cualquier alma creativa, sin necesidad de conocimientos del lenguaje. Así, el panel Fragmentos de código ofrece la posibilidad de crear códigos interesantes con un simple doble clic en la opción deseada, mientras que la nueva extensión Toolkit for CreateJS permite exportar fácilmente cualquier creación como contenido HTML5.
AIR Debug Launcher permite probar el funcionamiento de aplicaciones comunes (gestos táctiles, orientación de la pantalla, acelerómetro…) en dispositivos móviles virtuales. También se ha incorporado la posibilidad crear aplicaciones con Adobe AIR preem-paquetado, lo que evita a los usuarios la necesidad de realizar descargas adicionales.
Finalmente se incorpora la posibilidad de exportar automáticamente símbolos y secuencias de animación en hojas de sprite.
| Cómo funcionan los libros “Aprender…” |
| Índice |
001 La interfaz del nuevo Flash CS6
002 La Línea de tiempo y el Controlador
003 Vectores y mapas de bits
004 Utilizar plantillas y crear plantillas
005 El panel Herramientas
006 El relleno de una forma
007 Ubicación y solapamiento de formas
008 Líneas y trazos
009 Opciones de rectángulos
010 Rectángulo simple y óvalo simple
011 Dibujar polígonos y estrellas
012 Dibujar con el lápiz y el pincel
013 Trazar rectas y curvas
014 Importar mapas de bits
015 Convertir imágenes en formas de Flash
016 Suavizar y optimizar gráficos
017 Introducir textos estáticos
018 Utilizar el motor de texto TLF
019 Redimensionar y ubicar bloques de texto
020 Suavizar y separar texto
021 Borrar trazos y rellenos
022 Editar trazos con el Bote de tinta
023 Pintar con el Cubo de pintura
024 Personalizar colores
025 Crear y personalizar degradados
026 Las paletas y las muestras de color
027 Transformar rellenos
028 Seleccionar y agrupar formas
029 Transformar objetos
030 Trabajar con el panel Transformar
031 Suprimir, copiar y pegar objetos
032 Organizar objetos
033 Trabajar con reglas, guías y la cuadrícula
034 Ajustar objetos
035 Alinear objetos
036 Crear capas y carpetas de capa
037 Eliminar, visualizar y bloquear capas
038 Visualizar la Línea de tiempo
039 Crear símbolos gráficos
040 Trabajar con símbolos e instancias
041 Editar símbolos e instancias
042 Gestionar los elementos desde la Biblioteca
043 Convertir símbolos en herramientas de diseño
044 Aplicar efectos con la herramienta Deco
045 Animar fotograma a fotograma
046 Establecer la velocidad de los fotogramas
047 Insertar interpolaciones de movimiento
048 Recurrir a las interpolaciones clásicas
049 Modificar manualmente la aceleración
050 Editar curvas con el Editor de movimiento
051 Configurar movimientos predeterminados
052 Editar la trayectoria de un movimiento
053 Mover objetos a lo largo de un trayecto
054 Utilizar capas de máscara
055 Copiar y pegar una interpolación de movimiento
056 Animar con la herramienta de huesos
057 Utilizar el muelle para huesos
058 Animar en 3D
059 Interpolar formas
060 Trabajar con consejos de forma
061 Formas, texto y mapas de bits en interpolaciones
062 Insertar escenas
063 Reorganizar escenas
064 Reproducir escenas y películas
065 Controlar instancias de símbolos gráficos
066 Animar símbolos gráficos
067 Editar fotogramas con el Papel Cebolla
068 Crear símbolos de película
069 Anidar clips de película
070 Crear una hoja de sprite
071 Escalar clips de película
072 Insertar y crear botones
073 Editar y probar botones
074 Crear botones animados
075 Conocer ActionScript 3.0
076 Introducir código en el panel Acciones
077 Panel de fragmentos de código
078 Saltar a fotogramas
079 Generar eventos e interacciones
080 Incluir etiquetas de fotograma
081 Insertar anclajes
082 Insertar comentarios
083 Copiar, pegar, exportar, importar y editar script
084 Insertar acciones móviles
085 Probar aplicaciones AIR para móviles
086 Depurar ActionScript
087 Trabajar con componentes
088 Editar los parámetros de los componentes
089 Textos estáticos, dinámicos y de entrada
090 Importar y comprimir archivos de audio
091 Editar y personalizar sonidos
092 Importar vídeos
093 Conocer el Explorador de películas
094 Exportar imágenes y películas
095 Preparar la descarga y la impresión
096 Publicar documentos
097 Exportar como vídeo QuickTime
098 Publicar con Android empaquetado
099 Instalar Toolkit for CreateSJ
100 Exportar HTML con Toolkit for CreateJS
| 001 | La interfaz del nuevo Flash CS6 |
AL ACCEDER POR PRIMERA VEZ A ADOBE FLASH CS6 vemos una disposición de los elementos similar a la versión CS5, que es muy elegante y flexible. La pantalla de arranque es mucho más moderna y la ventana de bienvenida es muy similar a la de la versión anterior y tiene prácticamente los mismos elementos.
IMPORTANTE
En la pantalla de bienvenida, el bloque Crear con plantilla expone las plantillas de uso habitual para la creación de nuevos documentos con formatos estándar. 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, para que pueda crearlos rápidamente y con las características más adecuadas. Ampliar enlaza con Flash Exchange para la descarga de aplicaciones e información complementarias. Por último, Aprendizaje le permite acceder a ayuda sobre temas específicos.
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.
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.
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.
3 Éste es el aspecto que presenta Flash CS6 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.
4 Seleccione la opción Animador.
5 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.
6 Ocupando la mayor extensión de la pantalla, en el cuadrante superior izquierdo, encontramos un área en blanco donde crearemos la escena. Haga doble clic sobre el número 100% que se encuentra en la parte superior izquierda de la escena e introduzca el valor 70 para reducir el zoom.
7 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.
8 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.
9 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 una escena.
Todas las barras y ventanas pueden cerrarse o reubicarse en otras zonas de la interfaz según convenga al usuario. Deberá para ello arrastrarlas desde la barra que se encuentra en su cabecera.
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, Desarrollador y Pantalla pequeña según el tipo de trabajo que se esté llevando a cabo.
| 002 | La Línea de tiempo y el Controlador |
EL PANEL LÍNEA DE TIEMPO ES FUNDAMENTAL para la creación de animaciones vistosas: Su funcionamiento es similar al de un editor de vídeo. Trabaja con capas y permite marcar la duración de cada elemento en escena.
IMPORTANTE
La Línea de tiempo se halla subdividida en dos áreas. En la parte izquierda se muestran todas las capas que contiene el documento. Puede imaginar que son películas colocadas unas sobre otras, cada una de las cuales contiene un elemento del Escenario. Al pie del panel se visualizan los fotogramas que componen la animación; efectivamente, los documentos de Flash, tal como las películas y los vídeos, dividen su contenido en fotogramas.
1 Para comprender el funcionamiento de la Línea de tiempo, trabajaremos con una animación sencilla que consta de cuatro capas. Descargue de nuestra web el archivo Presentación Flash CS6, guárdelo en su equipo y ábralo con Flash CS6, usando la opción Abrir del menú Archivo.
2 En la parte izquierda del panel puede observar las diferentes capas (Círculos, Texto, Forma 1 y Fondo) y a su derecha, que capa dispone de su propia línea de fotogramas.
3 Es el botón Mostrar u ocultar y ha ocultado el contenido de la capa Fondo, una trama que ya no es visible en el Escenario.
4 El texto se oculta y sólo quedan visibles las capas Círculos y Formas 1. Haga clic en la casilla número 6 de la línea de fotogramas de la Formas 1,
justo donde se encuentra el segundo de los tres círculos negros de esta capa.
5 Acaba de seleccionar el fotograma 6 de la capa Forma 1 y en la escena se muestra el contenido de este fotograma de la animación.
Haga dos clics sobre el botón con icono de ojo (Mostrar u ocultar todas las capas) para mostrarlas todas.
6 Haga un clic sobre el número 15 en la línea de tiempo.
7 Han aparecido nuevos elementos en escena y la Forma 1, que veíamos hace unos instantes, ha cambiado de forma y ubicación.
Pulse en cabezal de la Línea de tiempo, que es el rectángulo de color rosa ubicado ahora sobre el fotograma 15, y arrástrelo al fotograma 1 y luego hasta el 21.
8 De este modo puede realizar una previsualización manual, pero 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.
9 Haga clic en el botón Ir al primer fotograma, situado en la segunda posición del panel Controlador, que se ha abierto en pantalla
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, el cabezal avanza mostrando el contenido de los diferentes fotogramas. Pulse el botón Avanzar un fotograma, penúltimo del panel Controlador, para avanzar fotograma a fotograma.
11 Luego pulse en el botón Reproducir, que ocupa el cuarto lugar en el panel.
12 Cierre el 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.
| 003 | Vectores y mapas de bits |
LOS ORDENADORES UTILIZAN DOS TIPOS de imágenes para presentar los gráficos e ilustraciones: vectores y mapas de bits. Las imágenes vectoriales se definen matemáticamente en forma de series de puntos unidos por líneas, mientras que los gráficos de mapa de bits están formados por cientos o millones de puntos de diferentes colores que se sitúan uno al lado del otro: se trata en este caso de los píxeles.
IMPORTANTE
Las imágenes vectoriales no dependen de la resolución, es decir, su presentación en pantalla dependerá de la calidad del dispositivo que se posea: cuanto mejor sea la impresora o el monitor, más calidad tendrá su impresión o su presentación en pantalla. Por otra parte, los gráficos de mapa de bits, también denominados gráficos raster, los crean escáneres y cámaras digitales. El ordenador debe procesar la información de color de cada uno de estos puntos antes de poder visualizar la imagen en pantalla, de manera que ésta tarda más en cargarse.
1 Una forma es una imagen creada con las herramientas de dibujo de Flash, que presenta, por tanto, un formato vectorial. Podemos comprobarlo en el panel Propiedades del programa. Este panel, situado por defecto a la derecha del Escenario, presenta como principal característica su sensibilidad al contexto: cambia su contenido adaptándose a la herramienta o el elemento seleccionado. Pulse sobre uno de los círculos en el área de trabajo y observe el cambio en el mencionado panel.
2 El panel nos informa de que se trata de una forma, y activa parte de las opciones de edición de la misma. La imagen de fondo es un mapa de bits. Haga clic sobre ésta para seleccionarla.
3 La inclusión de este tipo de archivos de imagen en los documentos de Flash presenta un inconveniente al aumentar el tamaño, puesto que pierde definición, como es habitual. Para comprobar este hecho cambiaremos el grado de visualización del Escenario, que por defecto se muestra a un 100%. Abra el menú Ver y pulse sobre la opción Acercar.
4 En el extremo derecho de la Barra de edición del archivo, el cuadro del control de zoom indica que el grado de visualización se ha incrementado hasta el 200%.
5 Se despliega un submenú que contiene todos los modos de visualización predefinidos por el programa. Seleccione 800%.
6 Con este aumento puede apreciar que, mientras el texto mantiene un contorno suave, el mapa de bits de fondo ha perdido mucha definición.
7 Antes de terminar este ejercicio, seleccione el texto Flash CS6 con un clic y observe cómo cambia el contenido del panel Propiedades, para mostrarle la gran cantidad de características personalizables en una capa de texto.
IMPORTANTE
Flash CS6 utiliza el formato vectorial, pero es capaz de interpretar los mapas de bits; gracias a ello, es posible introducir fotografías y otros mapas de bits en las animaciones.
| 004 | Util izar plantillas y crear plantillas |
LAS PLANTILLAS SIMPLIFICAN LA CREACIÓN de documentos nuevos, ya que eliminan muchas de las tareas necesarias para iniciar el trabajo. Se utilizan de un modo similar a las de los procesadores de texto y las aplicaciones de edición de páginas Web, y presentan la ventaja de preservar el estado de los documentos que funcionan a tal efecto.
IMPORTANTE
Las plantillas de Flash CS6 presentan la ventaja de preservar el estado de los documentos de origen, puesto que las plantillas no se abren en pantalla, sino que el programa crea un documento nuevo con sus mismas características, evitando de este modo que el documento original pueda ser modificado.
1 En esta lección veremos el funcionamiento de las plantillas de Flash CS6. Para comenzar, almacenaremos nuestro documento con este formato y, posteriormente, crearemos un documento nuevo a partir de esta plantilla. Abra el menú Archivo y pulse sobre la opción Guardar como plantilla
1 En el campo Nombre del cuadro Guardar como plantilla escriba la palabra Presentación, elija la Categoría animación y pulse el botón Guardar.
2 La función de las plantillas es la de generar documentos nuevos que sean un duplicado de éstas para facilitar el uso repetido de ciertos elementos sin el riesgo de modificar el original por accidente. Cierre la plantilla recién creada pulsando el botón de aspa de su pestaña, en la cabecera del escenario.
3 Despliegue el menú Archivo y pulse sobre la opción Nuevo.
4 Se abre la ventana Nuevo documento mostrando activa la pestaña General y bajo ésta se listan los diversos tipos de documentos que se pueden generar con el programa. Haga clic en la pestaña Plantillas.
5 Se muestran las siete categorías predeterminadas de plantillas. Haga clic sobre el nombre de la categoría Animación, para ver qué tipo de documentos contiene y seleccione con un clic alguna de las plantillas existentes.
6 En la parte de la derecha del cuadro de diálogo se muestra una vista previa de la plantilla seleccionada y debajo se sitúa, si lo hay, el texto descriptivo. Seleccione la plantilla Presentaciones, que creamos pasos atrás y, para crear un nuevo documento basado en ésta, pulse el botón aceptar.
7 Se abre un documento nuevo, como testifica su nombre en la pestaña del escenario.
IMPORTANTE
El programa guarda las plantillas en el interior de una carpeta llamada Templates, que se encuentra entre las creadas por el programa durante la instalación. Como sucede con el resto de las carpetas destinadas a guardar los diferentes aspectos de configuración del programa (grupos de paneles, herramientas, métodos abreviados de teclado, etc.), su ubicación puede variar en función de la versión del sistema operativo utilizado.
| 005 | El panel Herramientas |
EL PANEL HERRAMIENTAS DE FLASH CONTIENE los elementos que le permiten crear contenidos. Se sitúa por defecto a la derecha del área de trabajo y su aspecto y contenido es similar al del otras aplicaciones de diseño y retoque fotográfico.
IMPORTANTE
El panel Herramientas, situado por defecto en la parte derecha del área de trabajo, presenta un funcionamiento similar al del resto de paneles de la aplicación, aunque no puede ser agrupado con ningún otro. Por el contrario, sí puede ser desacoplado de su situación predeterminada mediante el método de arrastre para encajarlo en el lateral derecho del área de trabajo o colocarlo en el centro de la misma como paleta flotante.
1 Si es necesario, cree un nuevo documento del tipo Action Script 3.0, que usa el lenguaje más actual de Flash, ajústelo a la ventana y guárdelo con el nombre Práctica 1.
2 El panel Herramientas se organiza en seis secciones. En las primeras dos se sitúan las herramientas de dibujo y selección de objetos. Para activar una herramienta basta con pulsar sobre su icono. Pulse sobre el icono de la herramienta Rectángulo, situada en la novena posición en este panel.
3 El panel Propiedades muestra en este caso las características relacionadas con el tipo de figuras que permite dibujar la herramienta Rectángulo que, como ya supondrá, se utiliza para crear rectángulos y cuadrados. Pulse en el área de la esquina superior izquierda del documento y, sin soltar el botón del ratón arrastre en diagonal hasta dibujar un rectángulo.
4 La penúltima sección del panel Herramientas está dedicada a las opciones de color. Haga clic en la muestra de Color de relleno, situada bajo un bote de pintura, y pulse sobre la muestra de color que más le guste.
5 El cuadro Color de relleno del panel Herramientas toma el tono seleccionado. Asimismo el panel Propiedades presenta el color seleccionado junto a la imagen de un cubo de pintura; éste indica que la tonalidad seleccionada se aplicará a partir de ahora al relleno de las formas dibujadas con la herramienta Rectángulo. Pulse sobre la punta de flecha de esta herramienta y seleccione la opción herramienta óvalo.
6 Pulse la tecla Mayúsculas y dibuje un óvalo mediante la técnica de arrastre.
7 La tecla Mayúsculas hace que se trace un óvalo en lugar de un círculo. Si usara la herramienta rectángulo del mismo modo, trazaría un cuadrado. El interior de la figura es del color que hemos seleccionado. Active la herramienta Texto con un clic sobre su icono, que presenta una letra T en el panel Herramientas, haga clic en algún punto libre del Escenario, escriba el texto Flash CS6 y pulse en otro punto para confirmarlo.
8 En la sección Ver del panel se sitúa la herramienta Zoom, representada por el dibujo de una lupa, que ofrece opciones de control del grado de visualización del Escenario. Por su parte, la herramienta Mano permite desplazar el documento entero mediante el método de arrastre.
IMPORTANTE
El panel Herramientas se puede configurar de modo que muestre la disposición de comandos que más nos facilite el trabajo con los archivos. Para ello, es preciso dirigirse al menú Edición de la aplicación y seleccionar la opción Personalizar panel de herramientas. Desde el cuadro de diálogo que se abre podrá agregar, eliminar y cambiar de posición cualquier icono de herramienta.
| 006 | El relleno de una forma |
EN FLASH SE CONSIDERAN EL TRAZO (el borde o silueta de la forma) y el relleno (el color que se aplica al interior de las figuras cerradas) como elementos independientes, a pesar de que ambos puedan ser creados al mismo tiempo. Por lo tanto, no basta con hacer clic sobre un punto de una forma de Flash para seleccionar, simultáneamente, el borde y el relleno de la misma.
IMPORTANTE
Los bordes definen el contorno de la figura y son considerados por el programa como líneas, cada segmento de las cuales puede ser modificado independientemente. Los trazos pueden ser transformados en rellenos a través de las opciones de menú de la aplicación, que presenta comandos de edición exclusivos de los rellenos, aunque no permite su conversión en trazos.
1 Para seleccionar el relleno de una forma se debe pulsar en el interior de la misma, pero para seleccionar trazo y relleno debe hacerlo con un arrastre. Seleccione el relleno con un clic.
2 El primer cuadro de color del panel Propiedades, que es el que afecta a los trazos, se desactiva, mostrando en su interior una franja diagonal de color rojo.
3 Como en el caso del rectángulo, queda seleccionado el relleno de la figura. El panel de propiedades nos indica también que este objeto no dispone de color de trazo. Abra el menú Modificar y seleccione la opción Forma.
4 El submenú ofrece dos opciones para la transformación de los rellenos. Seleccione el comando Expandir relleno.
5 Se visualiza el cuadro de diálogo Expandir relleno, que permite redimensionar el interior de las formas sin alterar su borde. El campo Distancia se establece el número de píxeles al que va a ser aplicada la modificación. Escriba el valor 14.
6 Haga clic en el botón de opción Hundir para que las dimensiones del relleno se reduzcan y pulse en el botón Aceptar para aplicar los cambios.
7 Efectivamente, la figura se contrae ligeramente. Si tuviera un trazo, el trazo no sería modificado y probablemente quedaría un espacio en blanco entre trazo y relleno. Para acabar el ejercicio, modificaremos el color de relleno del relleno de la forma seleccionada, operación que podemos llevar a cabo desde el panel Propiedades. Haga clic en la muestra de relleno de este panel.
8 En la paleta de colores, pulse sobre la muestra que más le guste
9 Para acabar este ejercicio, deseleccione el óvalo pulsando en la zona gris de la derecha del Escenario.
IMPORTANTE
Es posible seleccionar más de un elemento a la vez. Para aplicar en una única acción cualquier propiedad. Para ello, se debe hacer clic sobre todos los elementos mientras se mantiene pulsada la tecla Mayúsculas. Para deshacer una selección sin necesidad de hacer otra, se puede optar por utilizar el comando Anular todas las selecciones del menú Edición, por presionar conjuntamente las teclas Ctrl.+Alt.+Mayúsculas o por la simple pulsación en una zona libre del área de trabajo con la herramienta Selección.
| 007 | Ubicación y solapamiento de formas |
EL COMPORTAMIENTO DE TRAZOS Y RELLENOS también difiere cuando dos formas se sitúan una encima de otra dentro de una misma capa, tanto en el momento de ser dibujada la segunda como si esta última o parte de ella es reubicada.
IMPORTANTE
Al eliminar el relleno de una forma, ésta desaparece. Ello es debido a que en las opciones de la herramienta Rectángulo o similar está establecido por defecto que las formas se creen sin un color de trazo. Si la forma tuviera trazo, éste se conservaría al eliminar su relleno.
1 La herramienta Selección puede ser utilizada a mano alzada, es decir, creando un marco rectangular mediante la técnica de arrastre. Las formas, o las partes de éstas que queden dentro del marco serán las seleccionadas. Seleccione con un arrastre todo el círculo.
2 En el panel Propiedades se muestran, entre otros datos, el tamaño y la ubicación del objeto seleccionado. Haga clic en el campo AN (anchura) del panel, introduzca el valor 115 y pulse la tecla Retorno.
3 Para seleccionar sólo parte del óvalo, pulse fuera de éste, a su derecha y abajo y, sin soltar el botón del ratón, arrastre hasta situar el puntero en el centro de la figura.
4 Ha quedado seleccionada únicamente la porción de la figura que estaba comprendida dentro del marco de selección.
5 Para romper el bloqueo de los valores de anchura y altura, pulse en el icono de cadena que está a la izquierda de AN. Quedará dividido en dos partes.
6 A continuación, haga clic en el campo AL (altura), inserte el valor 45 y pulse la tecla Retorno.
7 Haga clic en el interior del campo X, que determina su posición en este eje, y sin soltar el botón del ratón, arrástrelo hacia la izquierda hasta ubicar el segmento de óvalo bajo el rectángulo.
8 Del mismo modo, haga un arrastre sobre el campo Y mientras observa cómo se desplaza la forma y ubíquela en medio del rectángulo.
9 Seleccione el relleno del rectángulo, haga clic sobre el campo AN, teclee el valor 150 y pulse la tecla Retorno. Repita la operación con el valor H, referente a la altura.
10 Al modificar las dimensiones del rectángulo puede comprobar que se ha eliminado el fragmento del mismo que se solapaba con el del fragmento del óvalo que ha desplazado.
11 Pulse ahora la tecla R para activar la herramienta Rectángulo usando su acceso directo de teclado.
12 Trace un nuevo rectángulo, debajo del anterior y de dimensiones similares.
13 Pulse la tecla O para activar la herramienta Óvalo y trace un óvalo, similar al de nuestra imagen, que se solape con el rectángulo por el lado derecho de éste.
14 Haga un clic en el círculo y compruebe cómo se seleccionan ambas figuras.
IMPORTANTE
Los campo X e Y del panel Propiedades contienen los valores de posición horizontal y vertical, respectivamente, de la selección actual. El valor del cuadro X indica la distancia que existe desde el lateral izquierdo del Escenario hasta el punto de registro del objeto seleccionado. Evidentemente un objeto no se limita a un punto de información de color y cada uno de ellos presenta una ubicación distinta, pero se determina que uno sea el que defina la posición del objeto: es el punto de registro.
| 008 | Líneas y trazos |
LA HERRAMIENTA LÍNEA PERMITE CREAR LÍNEAS rectas de distintos grosores, tipos y colores que se pueden establecer en el panel Propiedades. Además de ofrecer la posibilidad de variar elementos tales como el tipo de trazo, el color y el grosor de una línea, Flash permite crear un estilo de línea totalmente personalizado.
IMPORTANTE
Aunque la herramienta para dibujar líneas es la denominada, precisamente, Línea, también es posible hacerlo con la herramienta Rectángulo. Si dibujamos un rectángulo sin espacio para el relleno, en el que una de sus dimensiones (altura o anchura) sea de píxel, el programa interpretará que se trata de una línea.
1 En este ejemplo práctico veremos el modo de dibujar líneas, formas de Flash únicamente compuestas por trazo. Para activar la herramienta Línea, pulse sobre el octavo icono del panel Herramientas.
2 Haga clic en un punto del extremo izquierdo del lienzo y arrástrelo hasta el extremo opuesto en línea recta, mientras pulsa la tecla Mayúsculas para que sea totalmente horizontal.
3 Comprobemos ahora qué información nos ofrece el panel Propiedades sobre esta línea. Haga clic sobre la herramienta Selección en el panel Herramientas y pulse sobre la línea que acaba de trazar.
4 Pulse en la punta de flecha del cuadro Color de trazo del panel Propiedades
5 En la parte inferior de la muestra de color del trazo se encuentra la sección destinada a modificar su grosor y su estilo. Haga doble clic en el interior del campo Trazo, introduzca el número 15 y pulse la tecla Retorno.
6 El menú desplegable situado a la debajo del cuadro Trazo permite cambiar el tipo de trazo de manera directa. Pulse el botón de flecha del cuadro desplegable Estilo, elija el estilo denominado De puntos
7 Active de nuevo la herramienta Línea en el panel Herramientas y haga clic sobre el botón Editar estilo del trazo del panel Propiedades, representado por un lápiz junto al campo Estilo.
8 Se abre el cuadro de diálogo Estilo del Trazo. Haga clic en la casilla de verificación de la opción Esquinas marcadas, pulse en el botón de flecha del cuadro desplegable Tipo y seleccione con un clic la opción Con sombra.
9 Aparecen nuevas opciones. Cambie otras características de su elección y pulse el botón Aceptar para aplicar los cambios.
10 El nuevo tipo de trazo será el utilizado por todas las herramientas que los dibujen. Haga clic en el extremo izquierdo del lienzo, por debajo de la línea anteriormente dibujada y, pulsando la tecla Mayúsculas, trace otra igual a la anterior mediante la técnica de arrastre.
Puede cambiar el grosor arrastrando el botón deslizante de la sección Trazo.
IMPORTANTE
Flash permite editar los estilos predefinidos, a excepción del primero de ellos (llamado Fina), cuyas características son inalterables. Para configurar un estilo de trazo personalizado se debe acudir a la ventana Estilo del Trazo desde el icono de lápiz situado a la derecha del campo Estilo, en el panel Propiedades.
| 009 | Opciones de rectángulos |
LAS HERRAMIENTA RECTÁNGULO DE FLASH permite dibujar de modo directo las formas geométricas que su nombre indica, así como definir y modificar de forma independiente trazo y fondo.
IMPORTANTE
En el área de opciones del panel Herramientas, aparece en último lugar el modificador Ajustar objetos que, representado por el dibujo de un imán, facilita el ensamblaje de formas. Este modificador también aparece en las herramientas Selección, Línea, Óvalo, Rectángulo Simple, Óvalo simple y PolyStar. Independientemente de la herramienta seleccionada, el método para dibujar figuras geométricas siempre es el mismo: la técnica de arrastre.
1 Con un arrastre de la herramienta Selección, seleccione todo el contenido del lienzo del documento en pantalla, y pulse la Suprimir para borrarlo.
2 Active la herramienta Rectángulo y trace una forma en la esquina inferior derecha.
3 Presenta el mismo trazo establecido en el ejercicio anterior.
4 Despliegue el cuadro Estilo de trazo y seleccione el estilo Muy fino.
5 Seguidamente, haga clic sobre el icono de la opción Extremo que aparece en el panel Propiedades y, tras comprobar que la opción Redondeado se encuentra seleccionada, pulse sobre ella para ocultar la lista.
6 Ahora estableceremos el valor del radio de esquina, teniendo en cuenta que si éste es de cero grados, valor seleccionado por defecto, las esquinas serán cuadradas. Haga doble clic en el primer control numérico de los cuatro situados bajo la sección Opciones de rectángulo, escriba el valor 10 y pulse la tecla Retorno.
7 Para comprobar el efecto de la modificación realizada en la configuración de la herramienta, dibuje un rectángulo mediante la técnica de arrastre en la parte superior izquierda del lienzo.
8 Las esquinas de la figura dibujada presentan una curvatura. Active de nuevo la herramienta Rectángulo, cambie el valor del primer control de radio de curvatura por 90 y pulse la tecla Retorno.
9 Trace un rectángulo y observa cómo se hace mucho más pronunciada la curvatura de sus esquinas.
10 Con un arrastre seleccione toda la forma, haga un clic en la muestra del color de trazo y seleccione un color contrastante.
11 Pulse sobre el controlador del Trazo y deslícelo hacia la derecha, hasta que el valor sea cercano a 50,
12 El trazo prácticamente se traga el fondo.
Despliegue una vez más el menú Estilo, seleccione la opción Punteada,
Sólo con jugar con las propiedades de trazo y relleno, puede conseguir resultados gráficos muy interesantes.
IMPORTANTE
Flash permite deshabilitar las opciones de color de borde o de relleno de una forma. De esta manera, la figura puede quedar formada únicamente por los segmentos de trazo que la delimitan o, por el contrario, presentar el aspecto sólido. La pulsación del icono Sin color de la paleta de colores, reconocible por la franja roja que lo cruza en diagonal, desactiva independientemente las opciones de color del trazo y del relleno.
| 010 | Rectángulo simple y óvalo simple |
LAS HERRAMIENTAS DE DIBUJO Rectángulo simple y Óvalo simple permiten crear rectángulos, cuadrados, óvalos y círculos y se diferencian de las herramientas utilizadas en el ejercicio anterior en que todas sus propiedades pueden ser editadas en cualquier momento desde el panel Propiedades.
IMPORTANTE
Recuerde que también puede crear cuadrados perfectamente proporcionados, manteniendo pulsada la tecla Mayúsculas mientras arrastra la herramienta Rectángulo.
1 Pulse Ctrl.+A para seleccionar todo el contenido del lienzo y elimínelo.
2 Pulse en el botón de punta de flecha de la herramienta Rectángulo del panel Herramientas y seleccione la herramienta Óvalo simple.
3 Mediante la técnica de arrastre, trace un óvalo simple mientras pulsa la tecla Mayúsculas para que el resultado sea un círculo perfecto cuyas dimensiones modificaremos después desde el panel Propiedades.
4 Obtenemos efectivamente un círculo simple, cuyas características podemos ver ya en el panel Propiedades. A diferencia de lo que ocurre al utilizar las herramientas Rectángulo y Óvalo, al trazar estas formas con el modo de dibujo simple, éstas se mantienen seleccionadas para que podamos modificar en cualquier momento sus principales propiedades. Bloquee altura y anchura, cambie el valor que corresponde a la anchura a 200 y pulse la tecla Retorno.
5 Desde el panel Propiedades de óvalo simple también es posible modificar los ángulos inicial y final de la forma. Cambie el Ángulo inicial a 25.
6 Cambie ahora el Ángulo final a 300.
7 ¿No le recuerda un famoso videojuego? También es posible especificar un radio interior dentro del óvalo o círculo. Los valores numéricos del campo Radio interior deben estar comprendidos entre el 0 y el 99 y representan el porcentaje de relleno del fragmento de óvalo que se elimina. Haga clic en su controlador y arrástrelo hacia la derecha hasta el valor 50 para ver su efecto.
8 Aparece un agujero en medio de la figura.
La herramienta Rectángulo simple funciona de manera idéntica a la que acabamos de ver, con la diferencia, claro está, de que las propiedades que se muestran en el panel Propiedades son las de esa forma. Así, además de su ubicación, sus dimensiones y su color de trazo y de relleno, es posible también modificar directamente los radios de las esquinas de un rectángulo redondeado (como vimos en el ejercicio anterior).
IMPORTANTE
La opción Cerrar trazado permite establecer si el trazado está cerrado y se encuentra activada por defecto. Un trazado abierto dibujaría únicamente el trazo, sin relleno. Por último, el botón Restablecer recupera todos los controles originales de la herramienta Óvalo simple y el estado inicial de la forma creada.
| 011 | Dibujar polígonos y estrellas |
LA HERRAMIENTA POLYSTAR POSIBILITA EL TRAZADO directo de formas geométricas tales como polígonos y estrellas. Una vez dibujadas, todas las figuras pueden ser deformadas siguiendo diversos métodos.
IMPORTANTE
La herramienta PolyStar carece por defecto de método directo de teclado para su activación, por lo que para seleccionarla es necesario acudir al menú emergente de la herramienta Rectángulo de la paleta de herramientas del programa.
1 En este ejercicio trabajaremos con la herramienta de dibujo PolyStar, que se encuentra agrupada con las herramientas Rectángulo y Óvalo en el panel Herramientas. Elimine la forma creada en el ejercicio anterior y pulse sobre el pequeño triángulo que aparece junto al icono de la herramienta Óvalo Simple y elija la herramienta PolyStar.
2 De forma predeterminada la herramienta dibuja polígonos de cinco lados, es decir, pentágonos. Vamos a comprobarlo. Pulse en medio del documento y, sin soltar el botón del ratón, arrastre en línea recta y hacia arriba hasta conseguir la figura deseada.
3 En función del punto en que se libere el botón del ratón, varía no sólo el tamaño de la figura sino también su orientación. Para deshacer el trazado del pentágono, despliegue el menú Edición y pulse sobre la opción Deshacer Añadir forma.
4 Para seleccionar el tipo de figura geométrica que quiere trazar, pulse el botón Opciones de la sección Configuración de herramienta del panel Propiedades.
5 Esta acción nos conduce al cuadro de diálogo Configuración de herramienta, en el que es posible seleccionar una serie de parámetros en relación a las características de las figuras. En primer lugar, haga clic en el botón de flecha del cuadro Estilo y seleccione la opción Estrella.
6 Haga doble clic en el interior del campo Lados, introduzca el número 6 desde el teclado y, para aplicar la nueva configuración a la herramienta PolyStar, pulse el botón Aceptar.
7 Antes de dibujar la figura, conmutaremos los colores de relleno y trazo. Para ello, haga clic en el icono Intercambiar colores, el que muestra dos pequeños cuadros blanco y negro con una flecha doble en el panel Herramientas, y seguidamente trace la estrella pulsando en el centro del escenario y, sin soltar el botón del ratón, arrastrando hacia arriba.
8 Una vez trazada una figura es posible modificar su forma de diferentes modos. Pulse sobre la herramienta Subselección, la segunda del panel Herramientas.
9 La herramienta Subselección permite cambiar la posición de cualquier vértice o vector de una forma, o bien ajustar los segmentos curvos para cambiar la pendiente o la dirección de la curva. Para ello, haga clic sobre una de las puntas de la estrella y arrástrela unos centímetros y compruebe cómo se alarga.
IMPORTANTE
El parámetro modificable Tamaño de puntos de estrella, en el cuadro Configuración de herramienta, sólo afecta a las estrellas, no a los polígonos. Determina su profundidad, es decir, a qué distancia se sitúan los puntos de origen de las puntas respecto a los que conforman su extremo. Cuanto más cercano a 0 sea el valor del cuadro Tamaño de puntos de estrella, más profundos serán los puntos creados.
| 012 | Dibujar con el lápiz y el pincel |
FLASH PRESENTA HERRAMIENTAS DE DIBUJO que permiten el trazado de formas a mano alzada. La herramienta Lápiz está destinada a dibujar trazos y la herramienta Pincel, en cambio, está destinada a pintar rellenos de diferentes tamaños y estilos.
IMPORTANTE
Evidentemente, resulta muy complicado realizar trazos precisos siguiendo el método de arrastre, pero la herramienta Lápiz presenta una serie de modificadores a fin de que los trazos resulten equilibrados. En la sección Opciones del panel Herramientas puede observar el icono del modificador seleccionado por defecto, Enderezar. Este modificador corrige las imperfecciones del trazado dibujado convirtiéndolo en una sucesión de segmentos rectos.
1 Haga clic sobre la herramienta Lápiz, décimo icono del panel Herramientas.
2 Funciona de manera muy similar a como se emplea un lápiz para realizar un dibujo, es decir, a mano alzada. Haga doble clic en el interior del cuadro Trazo, introduzca el número 3, pulse la tecla Retorno y cambie el Estilo a Sólido.
3 Para comprobar el efecto que produce la herramienta Lápiz, haga clic, arrastre en línea recta hacia la derecha y después, sin levantar el puntero, en diagonal hacia arriba y a la izquierda.
4 El programa corrige automáticamente el trazo al soltar el botón del ratón.
5 Haga clic sobre la punta de flecha del modificador Enderezar, que es el último botón del panel Herramientas, seleccione la opción Suavizar
6 Deshaga la última acción pulsando Ctrl.+Z y active la herramienta Pincel, onceavo icono del panel Herramientas.
7 La herramienta Pincel sólo pinta rellenos. Para comprobarlo, trace una línea recta en algún punto del documento.
8 También el trazado de la pincelada se corrige automáticamente, suavizándose.
9 Los dos últimos menús desplegables de la sección Opciones del panel Herramientas permiten cambiar el tamaño y la forma del pincel. Despliegue el penúltimo, Tamaño de pincel, y escoja una opción más gruesa.
10 Trace una línea ligeramente ondulada en el lienzo.
11 Despliegue el menú Forma del pincel, último icono del panel Herramientas, y escoja alguna otra opción
12 En el menú Modos pincel, el antepenúltimo del panel Herramientas, la opción Pintar Normal, solapa tanto las líneas como los rellenos situados en la misma capa. La segunda de las posibilidades, Pintar rellenos, pinta rellenos y áreas vacías de la capa seleccionada, pero no afecta a las líneas, y con el modificador Pintar detrás activo, los rellenos del pincel sólo afectan a las áreas vacías del documento, respetando tanto los bordes como los rellenos preexistentes.
IMPORTANTE
El menú emergente Modo de lápiz muestra las tres opciones de configuración de la herramienta Lápiz. Si la opción Enderezar interpreta el trazado en clave de segmentos rectos, la segunda de las opciones, Suavizar, corrige automáticamente los trazados convirtiéndolos en suaves segmentos curvos. La última de las opciones del menú, Tinta, no aplica ninguna modificación a los trazos dibujados, respetando por tanto el trazado a mano alzada.
| 013 | Trazar rectas y curvas |
LA HERRAMIENTA PLUMA PERMITE AL USUARIO la creación de segmentos de líneas rectas o curvas. La herramienta Subselección posibilita seleccionar los puntos de las líneas y los contornos de las formas y modificar estos objetos desplazando o ajustando los puntos que los conforman.
IMPORTANTE
Las figuras que se crean utilizando las diversas herramientas de dibujo de Flash se definen mediante un número variable de puntos de anclaje. Esta forma de componer trazados mediante puntos se ve más claramente en el caso de los objetos dibujados con la herramienta Pluma, pues en este caso es el propio usuario quien va creando uno a uno los puntos de anclaje que definen el trazo.
1 Elimine el contenido del documento en pantalla y active la herramienta Pluma, sexto icono del panel Herramientas.
2 Con la herramienta Pluma puede crear punto a punto el trazado de la forma. Haga clic en el documento y, luego pulse en otro punto a la misma altura para crear una línea horizontal.
3 La siguiente pulsación sobre el área de trabajo generará un tercer punto y el segmento correspondiente entre este último punto y el anterior. Cada nueva pulsación generará un punto y el segmento recto correspondiente. Sabiendo esto, haga clic varias más para dibujar, por ejemplo una especie de corona.
4 La herramienta Subselección, segunda del panel Herramientas, permite seleccionar los puntos de anclaje de los contornos de líneas y formas, así como ajustar estos puntos para modificar su posición. Pulse sobre esta herramienta.
5 Para remodelar la figura creada, pulse sobre uno de los puntos de anclaje de la figura y, sin soltar el botón del ratón, arrástrelo hasta deformarla.
6 Los puntos que conforman un trazado pueden ser eliminados. Para ello, haga clic en el botón de punta de flecha de la herramienta Pluma, seleccione la herramienta Eliminar punto de ancla
7 Pulse Ctrl.+A para seleccionar todo y pulse la tecla Suprimir.
8 Active la herramienta Pluma y haga clic sobre un punto y, sin soltar botón del ratón, arrastre hacia la izquierda.
9 Ahora pulse más arriba de este punto y, sin soltar el ratón, arrastre hacia la derecha.
10 Aparece una línea curva con tiradores definen la orientación de las curvas. Para crear un tercer punto del trazado, haga clic a la derecha del primer punto
11 Finalmente, haga clic en el punto de origen para cerrar la forma.
12 Active la herramienta Subselección y tire de alguno de los tiradores de color verde para modificar la forma creada.
IMPORTANTE
Otra de las variantes de la herramienta Pluma es la que posibilita la creación de nuevos puntos de anclaje en los trazados. De forma predeterminada, la herramienta Pluma cambia a Añadir punto de ancla al colocar el puntero sobre un trazado seleccionado o a Eliminar punto de ancla cuando se coloca en un punto de ancla existente.
| 014 | Importar mapas de bits |
FLASH CS6 PERMITE IMPORTAR IMÁGENES CREADAS en otras aplicaciones. Los mapas de bits (en una gran variedad de formatos de archivo) se importan como objetos individuales de la capa activa y quedan automáticamente almacenados en la Biblioteca del documento.
IMPORTANTE
Puesto que importar un mapa de bits aumenta el tamaño del archivo de Flash en el que se incluye, es recomendable comprimir las imágenes importadas. Flash predetermina el formato de compresión JPEG para ellas. El cuadro de diálogo Propiedades de mapa de bits, accesible desde la propia Biblioteca, muestra la información del archivo de imagen de origen y posibilita el ajuste de una serie de parámetros relacionados con la resolución de este tipo de gráficos.
1 En este ejercicio importaremos una fotografía (mapa de bits) de formato comprimido. Descargue para ello de nuestra web el archivo Calles.jpg y guárdelo en su equipo.
2 En Flash, abra el menú Archivo, seleccione la opción Importar y pulse sobre la opción Importar a escenario.
3 Esta acción nos conduce al cuadro de diálogo Importar. Haga doble clic sobre el archivo que ha descargado.
4 La imagen importada se visualiza en el centro del Escenario y sus principales características se muestran ya en el panel Propiedades.
5 A continuación, pulse sobre la pestaña Biblioteca, a la derecha de la pestaña del panel Propiedades.
6 Seleccione el archivo Calles.jpg y compruebe cómo en la parte superior del panel se actualiza una vista previa.
7 Seguidamente, haga doble clic sobre su vista previa.
8 Se abre el cuadro de diálogo Propiedades de mapa de bits que muestra información acerca de la importación, las dimensiones reales de la imagen y su resolución. Pulse el botón Aceptar para cerrar este cuadro.
9 Una vez contamos con una imagen importada en la Biblioteca podemos situarla en el Escenario tantas veces como queramos, sin que esto suponga un incremento en el tamaño del documento. Haga clic sobre el nombre de la imagen en el panel Biblioteca y arrástrela hasta el vértice superior izquierdo del documento.
10 A continuación reduciremos el tamaño de la imagen recién insertada. Selecciónela usando la herramienta de selección, haga clic en el menú Modificar, seleccione la opción Trasformar y haga clic sobre la opción Escalar.
11 Haga clic sobre el botón de punta de flecha del campo Zoom y seleccione la opción 25%.
12 Ahora que puede ver sus límites,
13 Arrastre ahora otra copia de la imagen, esta vez desde su vista previa en el panel Biblioteca.
14 Desde el panel Biblioteca, reduzca su ancho a 300 y ubíquela alineada con la esquina inferior derecha del escenario.
IMPORTANTE
Flash aplica el formato comprimido JPEG a todos los mapas de bits importados, independientemente de su extensión original. Este formato puede originar pérdidas en la calidad de las imágenes mostradas a una gran resolución. Para evitar este problema, el campo Compresión del cuadro de propiedades permite adaptar la imagen al formato PNG, que conserva las propiedades de color de la imagen original, sin compresión y, por tanto, sin merma. Esta opción sólo debe ser utilizada en casos en los que prime más la calidad de las imágenes que el tamaño final de la película, y está completamente desaconsejado para los archivos que tengan como destino final su visionado en Internet.
| 015 | Convertir imágenes en formas de Flash |
LAS INSTANCIAS DE LOS MAPAS DE BITS no pueden ser editadas con las herramientas de dibujo de Flash, a menos que sean transformadas en formas. Existen dos métodos para convertir instancias de mapas de bits en objetos editables: convertirlas en gráficos vectoriales con áreas de color diferenciadas o separar la instancia.
IMPORTANTE
Si convierte una instancia de un mapa de bits en un gráfico vectorial, éste ya no aparecerá vinculado a la imagen importada. Esta última podrá ser eliminada del panel Biblioteca sin que el gráfico vectorial generado a partir de ella sufra alteración alguna.
1 Cambie el zoom a la opción ajustar a ventana, elimine la forma trazada al fondo y seleccione la primera instancia de imagen del documento.
2 Utilizaremos con esta instancia un método de conversión que nos dé como resultado un gráfico vectorial independiente que presente claramente el aspecto de un dibujo. Para ello, abra el menú Modificar, pulse sobre la opción Mapa de bits y haga clic sobre la opción Trazar mapa de bits.
3 El cuadro de diálogo Trazar mapa de bits presenta una serie de parámetros modificables, en función del aspecto que queremos que presente el gráfico vectorial producto de la conversión. En el campo Umbral de color, introduzca el valor 80.
4 En el campo Área mínima, inserte el valor 10 para que el programa asigne un mismo color a un mayo número de píxeles.
5 Haga clic en el botón de punta de flecha del campo Umbral de esquina, seleccione la opción Pocas esquinas.
6 El cuadro desplegable Ajustar a curva sirve para indicar cómo deben ser los contornos del gráfico generado. Pulse el botón de flecha de este cuadro y seleccione la opción redondeado y pulse el botón Aceptar para dar inicio al proceso de conversión de la imagen.
7 Tras este proceso la instancia queda convertida en una forma de Flash. Al contener menor información, el gráfico vectorial generado presenta un tamaño menor, pero ha perdido gran parte de la definición del archivo original. Para observar mejor su aspecto, haga clic en el fondo del escenario.
8 La nueva conversión ha distorsionado la imagen y ha reducido el número de colores. La imagen da la sensación de que ha sido pintada.
9 La opción Separar se ejecuta de inmediato y la imagen queda convertida en una forma de Flash con la particularidad de que conserva aún el vínculo con la imagen de la que procede, el mapa de bits almacenado en la Biblioteca. Este vínculo permite que el relleno en que se ha convertido la instancia conserve los atributos de color de la imagen original.
IMPORTANTE
Para comprobar si una imagen se ha convertido en relleno y, por lo tanto, puede ser manipulada como tal, diríjase al panel Propiedades, concretamente a la sección Relleno y trazo.
| 016 | Suavizar y optimizar gráficos |
UNA FORMA TRAZADA O SEPARADA DE un mapa de bits pasa a ser considerada como un relleno por parte de Flash. El programa presenta una serie de opciones que facilitan el suavizado del contorno del relleno creado y la optimización de las curvas presentes en sus diferentes fragmentos, diferenciados por el color de los mismos.
IMPORTANTE
La aplicación del comando Suavizar bordes de relleno permite la creación de fragmentos de relleno con contornos curvos diferenciados, a partir de una forma. Su uso en gráficos con muchos detalles puede aumentar el tamaño del archivo de un documento de Flash.
1 Seleccione la segunda imagen, es decir, que la hemos separado, despliegue el menú Modificar, pulse sobre la opción Forma y seleccione el comando Suavizar bordes de relleno.
2 Automáticamente se visualiza el cuadro de diálogo del mismo nombre. En el campo Distancia, introduzca la cifra 20.
3 El campo Número de escenarios controla la cantidad de curvas utilizadas para la aplicación del efecto. En este campo, inserte el valor 4.
4 Como queremos que la forma seleccionada se expanda el número de píxeles indicados en el cuadro Distancia, compruebe que la opción Expandir está seleccionada y pulse Aceptar.
5 La imagen se expande. Deseleccione la imagen para comprobar el resultado: Los nuevos píxeles conservan los atributos de color del mapa de bits original y las esquinas de la imagen se redondean.
6 La aplicación de este modificador sobre formas con muchos detalles puede acarrear el aumento del tamaño del documento. Para subsanar este problema, Flash permite ajustar el número de curvas de las formas a fin de optimizarlas. Veamos qué sucede al intentar optimizar una imagen separada de un mapa de bits. Seleccione con un arrastre toda la imagen, abra el menú Modificar, seleccione la opción Forma y, en el sub-menú desplegado, pulse sobre el comando Optimizar.
7 Esta acción nos conduce al cuadro de diálogo Optimizar curvas. La Intensidad de optimización puede definirse introduciendo el valor adecuado o deslizando el ratón pulsado en dicho campo. Introduzca el valor 70 y pulse el botón Aceptar.
8 Dado que en el cuadro de diálogo Optimizar curvas se hallaba marcada la opción Mostrar mensaje con totales, aparece una ventana de advertencia en la que se informa del grado de optimización que se va a aplicar. Haga clic también en Aceptar de este cuadro.
La optimización sólo se aplica a las esquinas de la forma y no altera el contenido del relleno, puesto que éste carece de curvas. Al seguir esta forma vinculada a los atributos de color del mapa de bits de la Biblioteca, su relleno se considera una forma unitaria.
IMPORTANTE
Los cinco primeros comandos del submenú Modificar/Forma permiten mejorar el resultado de los dibujos en los que aparecen curvas. La opción Suavizar modera las curvas, reduciendo sus imperfecciones. La opción Enderezar efectúa una serie de pequeños ajustes a las líneas y las curvas ya dibujadas (no actúa sobre los segmentos rectos), de forma que las líneas resultantes proporcionan una sensación más estilizada. Las opciones avanzadas de las dos anteriores permite personalizar el efecto. Finalmente, la opción Optimizar afina las líneas curvas y los contornos de relleno reduciendo el número de curvas utilizadas para definirlos.
| 017 | Introducir textos estáticos |
FLASH DISPONE DE UNA HERRAMIENTA que permite incluir texto, cuyo contenido y apariencia pueden ser modificados durante su introducción o tras la misma. Al crear un texto nuevo, Flash emplea los atributos del texto predeterminados por el programa.
IMPORTANTE
Al crear un texto nuevo, Flash emplea los atributos del texto predeterminados por el programa. Para cambiar los atributos de fuente o párrafo del texto existente, es necesario seleccionarlo primero. Cuando hay texto seleccionado, los atributos se modifican mediante el panel Propiedades.
1 Empezaremos este ejercicio dibujando una figura para comprobar el comportamiento de los textos. Active la herramienta Rectángulo del panel Herramientas, seleccione un color claro de relleno y trace una forma en el cuadrante superior derecho del documento.
2 Una letra T mayúscula identifica la herramienta Texto en el panel Herramientas. Active dicha herramienta,
3 Automáticamente aparece una caja de texto. Escriba directamente la palabra Dinamismo y active la herramienta Selección para comprobar el aspecto.
4 La palabra introducida se muestra dentro de un marco rectangular azul que demarca el bloque de texto.
5 El campo Estilo permite elegir a partir de un desplegable un atributo de texto, como negrita o cursiva. Despliegue el campo Estilo y elija la opción Bold por ejemplo.
6 Cada fuente presenta unos caracteres diferenciados, tanto en estilo como en tamaño. El tamaño de los textos, al igual que el grosor de los trazos, viene indicado en puntos (independientemente de las unidades de regla que presente el archivo). Haga clic en el valor del Tamaño de fuente y con un arrastre, adapte el tamaño del texto al del rectángulo de fondo.
7 Tenga en cuenta que los atributos seleccionados se aplicarán a todos los textos introducidos a partir de este momento. Active la herramienta Texto pulsando sobre ella en el panel Herramientas y haga clic en un punto fuera del rectángulo para crear un nuevo bloque de texto.
8 Escriba la palabra Movimiento y active la herramienta Selección.
9 La palabra introducida presenta los atributos de fuente seleccionados para el bloque anterior.
IMPORTANTE
No es necesario seleccionar el bloque de texto para cambiar sus atributos. Durante la introducción del texto, como en todos los programas destinados a la edición de este tipo de elementos, es posible alterar las características del mismo.
| 018 | Utilizar el motor de texto TLF |
TLF RESPONDE A LAS SIGLAS DE TEXT LAYOUT FRAMEWORK, el nuevo tipo de texto predeterminado en Flash CS6. Este tipo de texto permite editar textos y manipularlos como si trabajase con un programa de maquetación, de hecho es el mismo motor de texto utilizado por InDesign.
1 Antes de empezar descargue el archivo Texto.fla y ábralo con Flash CS6.
2 Este archivo contiene un texto que utilizaremos para conocer el nuevo motor de texto. Si utiliza la herramienta Texto para editarlo deberá seleccionar la parte del texto que le interesa, por el contrario si utiliza la herramienta Selección los cambios se aplicarán a todo el texto. Seleccione el cuadro de texto con la herramienta Selección.
3 Como ya conocemos las herramientas de grupo Carácter pasaremos a trabajar el párrafo. Despliegue el menú Párrafo y en la categoría Alinear seleccione la opción Justificar con la última línea alineada al principio.
4 Ahora veremos cómo se organiza el texto en el cuadro de texto. Despliegue el menú Contenedor y flujo y en la categoría Caracteres máx seleccione la última.
5 Observe que el texto ahora ocupa la totalidad del cuadro. A continuación modificaremos los Efectos de color del texto. Despliegue dicho menú y en la categoría Estilo seleccione la opción Tinta.
6 Aumente el valor Tinta hasta el 50% utilizando el botón deslizante y modifique los valores de los colores Rojo, Verde y Azul hasta que consiga un tono que le guste.
7 Por último modificaremos algunas de las características básicas del Título como la fuente, el tamaño y el color. Esta vez active la herramienta Texto y seleccione la palabra Dinamismo.
8 Despliegue el menú Familia y seleccione la fuente Century Gothic y aplique el estilo Bold.
9 Seleccione ahora todo el texto con un arrastre y aumente el tamaño del texto: Haga un clic sobre el número 12 del campo Tamaño
Fíjese que en la parte inferior del cuadro de texto aparece ahora una cuadro con una cruz roja. Este cuadro indica que el texto sobrepasa el cuadro. Solucionaremos este inconveniente en el próximo ejercicio.
Si desea modificar sólo una parte del texto, debe seleccionarla con la herramienta texto. Para editar toda la caja, basta con que ésta esté seleccionada.
| 019 | Redimensionar y ubicar bloques de texto |
FLASH SITÚA EN BLOQUES INDEPENDIENTES los diferentes textos estáticos de un documento, pero gracias al motor de texto TLF se puede dividir un texto en dos cuadros manteniendo la continuidad del texto. El programa, por defecto, adapta automáticamente las cajas de texto a su contenido y presenta el texto con una orientación horizontal.
IMPORTANTE
Es posible modificar la dirección de texto desde el comando dirección de texto del panel Propiedades. Los textos horizontales siempre presentan un flujo de izquierda a derecha, y el selector que aparece en el bloque cuando está en modo de edición posibilita fijar una anchura determinada para el mismo. Los textos verticales, por su parte, pueden presentar un flujo de izquierda a derecha o en la dirección opuesta, y el selector de sus bloques permite fijar, esta vez, una altura determinada para los mismos.
1 Seleccione la herramienta Texto y haga clic sobre el indicador de texto desbordado.
2 Fíjese que tras haber hecho clic sobre ese dicho cuadro el puntero del ratón ha cambiado de aspecto. Se ha convertido en una flecha con un texto incrustado, lo cual significa que el texto que sobresale del cuadro anterior se insertará en un nuevo cuadro. Haga clic en algún punto vacío del documento y cree un nuevo cuadro de texto con un arrastre de ratón.
3 Fíjese en que efectivamente el texto restante ha pasado al siguiente cuadro. Puede ocurrir que en el nuevo cuadro vuelva a aparecer el indicador de cuadro desbordado. En ese caso cambiaremos la dimensión del nuevo cuadro. Seleccione la herramienta Selección y arrastré uno de los puntos de anclaje del cuadro de texto para adaptar la caja a su contenido.
4 Suelte el ratón cuando el cuadro haya adquirido la dimensión adecuada. A continuación modificaremos la posición y orientación de este cuadro. Con la herramienta Selección seleccione el segundo cuadro y despliegue el panel Posición y tamaño.
5 Haga clic sobre el valor del campo X y sin soltar el botón desplace el ratón hacia izquierda y derecha hasta que el cuadro se sitúe en la posición mas conveniente.
6 Haga lo mismo con el campo Y.
7 Comprobemos ahora que efectivamente se trata de un texto enlazado, tal como indica la línea que conecta los dos cuadros. Seleccione la herramienta Texto y haga clic al final de la palabra Dinamismo. En esa posición pulse la tecla Retorno y compruebe como el texto se desplaza al siguiente cuadro.
8 Por último comprobaremos que a pesar de tratarse de un único texto el estilo de cada cuadro puede ser modificado independientemente. Seleccione la segunda caja de texto.
9 Ajuste el tamaño del texto, desde el apartado Caracter del panel Propiedades, a la caja que lo contiene.
10 Despliegue el campo Color y seleccione la muestra que prefiera
11 Observe que los cambios se han aplicado únicamente sobre el texto de este segundo cuadro.
IMPORTANTE
En el cuadro de diálogo Preferencias del programa, concretamente en la categoría Texto, se puede establecer la orientación, el flujo y el ajuste aplicable a los bloques de texto vertical.
| 020 | Suavizar y separar texto |
PARA REPRESENTAR LOS TEXTOS ESTÁTICOS CONTENIDOS en un documento, Flash crea contornos a los caracteres. Estos contornos son utilizados durante la reproducción del archivo, una vez éste ha sido exportado o publicado.
IMPORTANTE
Sólo en el texto horizontal estático, el usuario puede utilizar fuentes especiales denominadas fuentes de dispositivo. De este modo, el reproductor de Player utilizará la información de fuente de los sistemas de los usuarios que reproduzcan el archivo, obviando por tanto los contornos.
1 En este ejercicio, conoceremos el modo de asegurar la correcta visualización de los textos estáticos durante la reproducción de los archivos de Flash. Para ello utilizaremos de nuevo el documento Práctica 1. Ábralo y, con la herramienta Selección, haga clic sobre la palabra Dinamismo.
2 Observe en el panel Propiedades que, en lugar de texto TLF, se trata de texto clásico. Despliegue el menú Texto, despliegue la opción Fuente y pulse sobre la fuente Algerian y escoja la opción Bold.
3 Debe tener en cuenta que en función de la fuente seleccionada y el tamaño del texto es posible que éste no se visualice correctamente en el documento final, publicado o exportado, de Flash.
4 Los textos con tamaños pequeños (por debajo de los 10 puntos) que utilicen las fuentes de dispositivo pueden ser más nítidos y legibles que los que presentan contornos de fuente exportados.
5 Abra el menú Modificar y seleccione la opción Separar.
6 Automáticamente el programa genera un bloque de texto independiente para cada una de las letras que componían la palabra.
7 Despliegue el menú Modificar y pulse sobre la opción Separar para transformar en una forma independiente el carácter seleccionado.
8 Pulse sobre el rectángulo de color de fondo y desplácelo fuera del texto.
9 Ahora puede ver la letra D, que se ha ido al fondo. A partir de este momento, esta letra pasa a ser considerada por el programa como un relleno independiente, que puede ser editado con las herramientas de dibujo de Flash destinadas a tal efecto. Con la herramienta Subselección, haga un lazo para seleccionar la palabra entero: Ahora la letra D está compuesta por vectores.
IMPORTANTE
En lugar de separar los caracteres de un texto para corregir los problemas de visualización de las fuentes, también se puede optar por acudir a las opciones del submenú Modo de vista previa del menú Ver y seleccionar la opción Suavizar texto. Esta opción facilita la lectura de los textos más pequeños, ya que alinea los contornos de texto con los límites de los píxeles.
| 021 | Borrar trazos y rellenos |
LA PROPIA DEFINICIÓN DE LAS FORMAS de Flash comporta que la herramienta Borrador presente notables diferencias en su uso respecto al habitual de herramientas similares en otros programas de diseño, tanto de dibujo como de retoque fotográfico.
IMPORTANTE
A diferencia de otros programas de diseño, como Photoshop, Flash no aplica un color de fondo a las áreas borradas, simplemente elimina su contenido. La herramienta Borrador permite la supresión directa de todas las formas que aparecen en el Escenario que estén contenidos en la capa activa.
1 En este ejercicio aprenderá a usar la herramienta Borrador. Haga clic sobre el decimosexto icono de la paleta Herramientas, para activarla.
2 Pulse sobre la palabra Movimiento y, sin soltar el botón, arrastre el ratón sobre ella.
3 La acción no ha afectado al texto, pero sí elimina el color de la imagen que está debajo de éste, que como recordará está separado y, por lo tanto, definido como forma.
4 Haga clic sobre el botón de flecha de la herramienta Forma de borrador, la última de la paleta Herramientas, y seleccione una de las formas cuadradas.
5 Intente borrar parte de la palabra Dinamismo, del rectángulo y de la fotografía de la esquina superior izquierda.
6 En este caso se borran la letra D y la imagen, pues ambas habían sido convertidas en formas, así como el rectángulo, pero no el resto de la palabra.
7 El primer icono de la sección Opciones del panel Herramientas, que es el antepenúltimo de la barra, contiene un menú emergente que determina de qué manera afecta la herramienta a bordes y rellenos. Pulse sobre la punta de flecha situada junto a este icono y seleccione el modificador Borrar líneas.
8 Para comprobar cómo actúa el modificador seleccionado, intente de nuevo borrar la palabra Dinamismo, el rectángulo y la fotografía de la esquina superior izquierda.
9 Sólo afecta al borde del rectángulo. Despliegue de nuevo el menú emergente Modo borrador, seleccione ahora la opción Borrar rellenos entro
10 Se borra sólo el rectángulo, pero no el segmento de fotografía que se solapa con él. Pulse Ctrl.+Z dos veces.
11 La herramienta Borrador presenta un modificador que permite suprimir completamente segmentos de trazo o áreas rellenas de un mismo color, el modificador Grifo.
Con una simple pulsación queda eliminado todo el fragmento de relleno.
IMPORTANTE
El Modo de borrador llamado Borrar normal elimina tanto las líneas como los rellenos situados en la misma capa. Las opciones Borrar rellenos y Borrar líneas afectan a estos elementos independientemente. Borrar rellenos seleccionados sólo suprime las áreas de relleno previamente seleccionadas, nunca los trazos. La última de las opciones, Borrar dentro, tampoco afecta las líneas, discrimina las áreas de relleno de distinto color, y afecta únicamente al fragmento de relleno sobre el que se realiza la pulsación.
Ücretsiz ön izlemeyi tamamladınız.
