1.2 Aplicar Herramientas componentes principales de la línea del tiempo son las capas y los...

25
1.2 Aplicar Herramientas La barra de herramientas contiene todo lo necesario para dibujar, editar, transformar, pintar y visualizar nuestro trabajo. a) Selección (y subselección) La herramienta selección es una de las más usadas en flash ya que tiene gran variedad de aplicaciones prácticas como se muestra en la siguiente tabla: Acción del mouse Resultado Clic en el relleno Solo selecciona el relleno Clic en el contorno Selecciona una arista del contorno Doble clic en el contorno Selecciona todos los lados del contorno Doble clic en el relleno Selecciona relleno y contorno Arrastrar en el contorno Convierte una línea en curva o edita la curvatura de líneas curvas

Transcript of 1.2 Aplicar Herramientas componentes principales de la línea del tiempo son las capas y los...

1.2 Aplicar Herramientas

La barra de herramientas contiene todo lo necesario para dibujar, editar, transformar, pintar y visualizar nuestro trabajo.

a) Selección (y subselección)

La herramienta selección es una de las más usadas en flash ya que tiene gran variedad de aplicaciones prácticas como se muestra en la siguiente tabla:

Acción del mouse Resultado

Clic en el relleno Solo selecciona el relleno

Clic en el contorno Selecciona una arista del contorno

Doble clic en el contorno

Selecciona todos los lados del contorno

Doble clic en el relleno Selecciona relleno y contorno

Arrastrar en el contorno Convierte una línea en curva o edita la curvatura de líneas curvas

Arrastrar el vértice Mueve el vértice del objeto

Arrastrar + Ctrl en el contorno

Agrega un nuevo vértice al objeto

Dibujar un rectángulo alrededor de los objetos

Selecciona todo lo que queda dentro del rectángulo

Para deseleccionar debes hacer clic fuera de cualquier objeto

Practica guiada

Selecciona color de relleno (gris) y contorno (negro)

Dibuja un rectángulo

Coloca el puntero dentro de rectángulo y cambia de color de relleno a azul claro

Coloca el puntero en el contorno

Selecciona el color de contorno amarillo, cambia las aristas del rectángulo por verde, rosa y azul obscuro

Haz una selección rectangular sobre el rectángulo que tienes dibujado

Cambia el color de relleno a rojo

Modifica el rectángulo para que te quede la siguiente figura

La herramienta subselección trabaja con los objetos a nivel vectorial (puntos y líneas), solo puedes modificar

sus nodos y trazos. Los nodos son pequeños cuadrados en cada vértice del objeto. Un nodo seleccionado se ve pintado, un nodo sin seleccionar se ve hueco. Un nodo puede ser curvo o recto. Para convertir un nodo recto en curvo se selecciona manteniendo la tecla Alt presionada, con esto saldrán dos tiradores para controlar las líneas. Con la tecla suprimir puedes eliminar nodos. Si mantienes presionada la tecla Ctrl se puede distorsionar el tamaño y la perspectiva del objeto

Los tiradores pueden trabajar en modo simétrico (se mueven los dos juntos) o asimétrico (presionando la tecla Alt se mueven en forma independiente).

b) Transformación libre (y lazo)

Con la herramienta transformación libre se puede seleccionar y deformar objetos, para seleccionar se

hace igual que con la herramienta selección, con la diferencia de que aparecen tiradores alrededor del objeto.

Los tiradores de las esquinas modifican la escala del objeto(para hacerlo más grande o peqiueño), si mantienes presionada la tecla Shift la escala será proporcional.

Los tiradores izquierdo y derecho modifican solo el ancho, los tiradores inferior y superior modifican la altura.

Los de las esquinas son para rotar el objeto, la rotación tendrá como referencia el centro del objeto, el cual lo puedes mover arrastrándolo.

Cuando seleccionas la herramienta de transformación libre, aparecen estas opciones

Rotar y sesgar la función de los tiradores cambia cuando está habilitada, los de las esquinas rotan el objeto, los de los costados sesgan el objeto.

Escalar hace que la transformación del objeto sea en forma proporcional.

Distorsionar hace que los tiradores de las esquinas para deformar con más libertad el objeto.

Envoltura coloca más tiradores alrededor del objeto de forma que la deformación es mayor.

La herramienta lazo sirve para hacer selecciones con más libertad, dibujándolas a mano alzada. Esta herramienta cuenta con las opcion de modo polígono que

funciona con mas precisión ya que se van agregando puntos para hacer la

selección, para terminar únicamente haz doble clic y listo.

La varita mágica permite selecciona zonas de color en imágenes importadas, para esto, primero se debe separa la imagen en el menú modificar.

Rotar y sesgar

Distorcionar

Escalar

Envoltura

c) Línea

Sirve para dibujar líneas, si presionas la tecla Shift dibuja líneas en ángulos de 0, 45 y 90 grados, con la tecla Alt se dibuja la línea a partir de centro que es el primer

clic.

Al seleccionar esta herramienta aparece la opción de dibujo de objetos y ajustar objetos, el primero, al estar seleccionado agrupa contorno y relleno creando un solo objeto, si no está seleccionado, el contorno y el relleno son

objetos separados, el segundo ajusta el objeto a otros objetos.

Al seleccionar la herramienta aparecen las propiedades que se pueden cambiar como color, alto y estilo de trazo.

Dibuja la

sombrilla utilizando la herramienta línea

d) Texto

En Flash puedes utilizar cualquier fuente, este trabaja como un elemento vectorial, por esto es que son escalables: puedes aumentar o disminuir su tamaño con la

seguridad que se van a ver con una calidad excelente.

En Flash no existe diferencia entre texto en caja y texto suelto. Siempre que utilices texto, Flash creará una caja contenedora. Inicialmente, si haces un clic con la herramienta de texto en el espacio de trabajo y comienzas a escribir, el texto continuará linealmente. Si en vez de hacer clic, arrastras el mouse generando una caja, el texto quedará contenido en los límites de esta caja. Las dimensiones de la caja se pueden editar siempre utilizando la herramienta de texto.

Puede haber texto estático (es la forma básica de poner texto), texto dinámico (permite generar acciones en Action script) y texto de entrada (sirve para los casos en los que el usuario pueda ingresar texto al sistema).

Las propiedades del texto son tipo de letra, color, tamaño, alineaciones.

Con la herramienta texto realiza un diseño como el que se muestra

e) Óvalo

Se pueden crear óvalos y círculos perfectos, si se presiona la tecla Alt dibuja óvalos del centro hacia afuera, si se deja presionada la tecla Shift dibuja círculos

perfectos. La tecla Sift y Alt presionadas juntas dibuja círculos perfectos desde el centro., cambiando las propiedades de angulo inicial y angulo final se puede dibujar partes de un circulo o hacer un radio interior.

Al igual que la herramienta línea cuenta con las opciones de dibujo de objetos y ajustar objetos.

Las propiedades de la herramienta ovalo son las siguientes

Realiza la

siguiente figura utilizando la herramienta ovalo.

f) Rectángulo

Se pueden crear rectángulos y cuadrados perfectos, si se presiona la tecla Alt dibuja rectángulos del centro hacia afuera, si se deja presionada la tecla Shift

dibuja cuadrados perfectos. La tecla Sift y Alt presionadas juntas dibuja cuadrados perfectos desde el centro.

Al igual que la herramienta línea cuenta con las opciones de dibujo de objetos y ajustar objetos.

En la herramienta rectángulo se encuentra oculta la herramienta polystar que permite dibujar polígonos y estrellas, para usarla solo tienes que dejar presionado el botón del mouse sobre la herramienta rectángulo.

Las propiedades que se pueden cambiar de la herramienta rectángulo son el color de trazo, color de relleno, altura y estilo de trazo, radio de las esquinas (redondeo).

Realiza la siguiente

figura utilizando la herramienta rectángulo.

g) Lápiz y pluma

Con la herramienta lápiz se pueden realizar dibujos a mano alzada. Para suavizar o enderezar las líneas y las formas según

se va dibujando, seleccione un modo de dibujo para la herramienta Lápiz.

Enderezar: las líneas se hacen más constantes, es decir convertirá los trazos en rectas y curvas precisas, los ángulos de las esquinas están muy marcados y la cantidad de nodos se reduce para hacer el trabajo más limpio.

Suavizar: el trazo se suaviza haciendo que las curvas sean más rectas.

Tinta: Flash no le hace nada a los trazo, aunque los limpiara para que sean más definidos.

Se puede cambiar el color y estilo de trazo desde la ventana de propiedades.

h) Pinc

el

Esta herramienta es similar al lápiz, la diferencia es que los trazos son rellenos no contornos. Cuenta con tres opciones para crear diseños más completos como

son el modo pincel, tamaño y forma

i) Bote de tinta

Agrega contornos a objetos que fueron dibujados sin ellos o eliminados. El

contorno que agregue es del color que esta seleccionado en el color de trazo. Si el objeto ya tiene contorno lo que hace es que cambia el contorno a las propiedades que estén seleccionadas en ese momento.

j) Cubo de pintura

Su función es similar al bote de tinta pero con rellenos. Agrega rellenos a objetos que fueron dibujados (con la herramienta pincel) sin ellos o eliminados. El relleno

que agregue es del color que esta seleccionado en el color de relleno. Si el objeto ya tiene relleno lo que hace es que cambia el relleno a las propiedades que estén

seleccionadas en ese momento. Esta herramienta también agrega rellenos a objetos que no están totalmente cerrados. Para esto tiene la opción de tamaño de hueco que cuenta con varias opciones, la más efectiva es cerrar huecos grandes.

k) Cuentagotas

Esta herramienta tiene la función de obtener el color de contorno o relleno de cualquier objeto, el color obtenido lo pondrá en el color de trazo o de relleno

según sea el caso. Una vez que tenemos el color se selecciona la herramienta cubo de pintura o bote de pintura para aplicar el color elegido.

l) Borrador

Borra rellenos y contornos haciendo clic sobre el objeto que queremos borrar. Se puede decidir

qué es lo que se quiere borrar, cambiar la forma del borrador para corregir errores o hacer otro tipo de efectos visuales y hacer borrar el relleno o contorno completo al activar la herramienta grifo

m) Mano

Cuando se trabaja muy cerca de un objeto, la herramienta mano es muy útil ya que arrastrando el mouse nos movemos por los objetos hasta el lugar exacto que queremos corregir.

n) Zoom

Nos permite acercar y alejar nuestro trabajo para ver el diseño desde un panorama más amplio o ver de cerca una zona en particular.

Pràcticas Cajas de Herramientas

1.3 Editar Objetos

a) Copiar, Pegar y Borrar

b) Agrupar y desagrupar

Dibuja las siguientes 3 figuras del mismo color.

Selecciona 2 de ellas, abre el menú modificar y selecciona agrupar o CTRL G.

Trata de cambiar el color a las figuras agrupadas y observa lo que sucede; luego

cámbiale el color a la figura que no agrupaste.

1.4 Definir Línea del tiempo

Se puede definir como la línea que muestra donde hay animación en un documento,

organiza y controla el contenido de un documento a través del tiempo en capas y

fotogramas.

Los componentes principales de la línea del tiempo son las capas y los fotogramas.

Un fotograma representa el contenido de la película en un instante de tiempo, el

fotograma organiza y controla el contenido de los documentos. Los fotogramas son

colocados en la línea del tiempo en el orden que se desea que aparezcan los objetos.

Así pues, una animación es una sucesión

de fotogramas. Cada fotograma tiene

asignado un número en la línea del

tiempo.

Un fotograma clave es un fotograma con contenido

específico. Se identifican por un punto negro en el centro.

Fotograma normal después de un fotograma clave sigue siempre un fotograma

normal, no representan contenido nuevo y se caracteriza por ser

un cuadro blanco sobre fondo gris. Este tipo de

fotograma permite que se extienda el tiempo de

duración de un fotograma clave.

Fotograma vacío es el fotograma que no tiene contenido. Su color es blanco. Este tipo

de fotograma es muy útil cuando se quiere que un objeto desaparezca y vuelva a

aparecer.

Fotograma de interpolación de movimiento la característica

principal de este fotograma es que su color es morado y

representa el movimiento de un objeto en cuestión. El

movimiento se representa por una flecha apuntando hacia la

derecha. Por ejemplo los movimientos pueden ser

desplazamientos en forma recta, curvas, giros, tamaños, etc.

Fotograma de animación de forma se representa con color verde y cambia la forma

inicial del objeto a la que se desee transformar finalmente, de

una manera progresiva. También se caracteriza por tener una

flecha como la interpolación de movimiento.

Para crear una interpolación de forma deberás actuar de forma similar que para crear

una de movimiento. Una vez tengas los fotogramas de inicio y fin de la animación

deberás seleccionar todos los fotogramas que participen en ella y abrir el panel

Propiedades. Selecciona la opción Forma en el menú desplegable Animar y listo!!.

Ejercicio: En la siguiente película identifica los diferentes tipos de fotogramas y escribe

dentro del cuadro el nombre del fotograma que corresponda:

Insertar Fotogramas:

Eliminar fotogramas:

Copiar y mover fotogramas:

1.5 Utilizar Capas

Las capas son como láminas transparentes que sobreponemos una con otra. Cada

capa puede contener todos aquellos objetos que queramos y los objetos de una capa

no influirán o afectaran sobre las demás capas.

Los objetos que estén en una determinada capa comparten fotograma y pueden

mezclarse entre sí. En ocasiones es conveniente separar los objetos de modo que no

interfieran entre sí. Para ello, crearemos tantas capas como sea necesario. El uso de

múltiples capas además, da lugar a películas bien ordenadas y de fácil manejo.

Descripción de las capas

Es posible realizar distintas acciones en una capa, como son: insertar, renombrar,

bloquear, ocultar, eliminar y propiedades de la capa.

Insertar capas. Esta opción nos permite crear o insertar capas normales.

1. En la ventana de capas presionamos la opción de insertar capa.

Capa. Nos

muestra un lápiz

que nos indica

que podemos

dibujar o hacer

cambios.

Mostrar como líneas

de contorno.

Bloquear y desbloquear.

Insertar guía de movimiento. Insertar guía de movimiento.

Insertar capa. Eliminar capa.

Mostrar y ocultar.

Renombrar capas. Esta opción nos permite renombrar una capa ya existente.

1. Seleccionamos la capa, damos doble clip y ponemos el nombre actual.

Bloquear y desbloquear capas. Bloquear una capa es de gran ventaja ya que los

objetos que tenga la escena seguirán apareciendo pero no podrán ser seleccionados

ni editados.

1. Para bloquear se da clic sobre el símbolo de la columna

correspondiente a la capa que deseamos bloquear o desbloquear.

Mostrar y ocultar capas. Esta opción es muy útil cuando tenemos muchas capas y solo

queremos ver una de ellas, podemos ocultar las demás y mostrar solo la capa en la

que deseamos trabajar.

1. Para mostrar u ocultar una capa basta con hacer clip en el siguiente botón .

Eliminar capas. Esta opción la utilizamos para borrar una capa.

1. Seleccionamos la capa que deseamos eliminar y presionamos el botón .

Propiedades de las capas. La ventana de propiedades de una capa es muy

importante conocerla ya que en ella podemos obtener nuevas propiedades.

1. Damos clic derecho sobre el siguiente símbolo que aparece en la parte

izquerda del nombre de la capa y seleccionamos la opción de propiedades y se

abrirá una ventana en la cual podemos modificar todas las propiedades de una

capa.

Tipos de capas

Capas normales; son las que por defecto crea Flash, estas son las más utilizadas y se

emplean para colocar objetos, sonidos, acciones, ayudas, etc.

Práctica de capas normales

1.- Inserta las figuras que se te piden a continuación

2.- Cambiarle el nombre a las capas con el nombre de cada figura.

3.- Junta los objetos.

4.- Acomoda las capas en el siguiente orden cuadrado, pentágono y circulo observa

lo que sucede y escríbelo

_____________________________________________________________________________________

Capas Guía; estas capas se utilizan para agregar la ubicación de objetos en cualquier

animación. En cualquier momento puede convertirse una capa normal a capa guía y

viceversa.

Práctica capa guía

1.- Utiliza la herramienta lápiz y dibuja dos líneas en forma de cruz como aparece en la

figura.

2.- Inserta una nueva capa.

3.- Inserta un círculo y agrúpalo, copia el círculo 7 veces y acomódalos como se

muestra en la figura.

4.- Abre el menú contextual de la capa 1 y selecciona la opción guía.

5.- Presiona Ctrl + enter

6.- Escribe lo que observaste ________________________________________

Capas guía de movimiento; esta capa se utiliza para dibujar una o varias líneas que se

encargaran de marcar la trayectoria de una animación. Las capas guías permiten

desplazar una animación a lo largo de un camino recto complejo.

Práctica de capa movimiento

1. Inserta un círculo y agrúpalo

2. Abre el menú contextual de la capa 1 y selecciona añadir guía de

movimiento

3. Selecciona la capa guía y dibuja con la herramienta lápiz la ruta como se

muestra en la figura

4. En el fotograma 25 de la capa 1 abre el menú contextual y selecciona

insertar fotograma clave, realiza el mismo procedimiento en la capa guía

Presiona Ctrl Enter y explica lo que sucede.

Capas màscara; esta capa permite mostrar y ocultar partes de una imagen o gràfico

de la capa situada debajo. Para crear una capa mascara, se especifica que una

capa es una capa de mascara y se dibuja o coloca una forma rellena en la capa.

Este tipo de capas se utiliza en cualquier forma rellena, como grupos, texto y símbolos.

La capa de máscara muestra el área de capas vinculadas situada debajo de la forma

rellena y afecta únicamente a las capas vinculadas.

Práctica de capa Máscara

1.- Escribe un texto de tamaño grande en la capa normal.

2.- Crea una nueva capa y selecciónala, abre el menú contextual y da clic en

máscara.

3.- Haz clic en el candado para abrirlo y dibuja un círculo un poco más grande que el

texto.

4.- Selecciona el fotograma 20 e inserta un fotograma clave en ambas capas.

5.- En el fotograma 1, el círculo queda antes del texto y en el fotograma 20 muévelo

después del texto de ambas capas.

Por último crea una interpolación de movimiento en la capa máscara y presiona

Ctrl + Enter . Escribe lo que sucede.

Realiza la siguiente práctica.

1. Iniciamos importando una imagen la cual quedara en una capa normal.

2. Realiza el mismo procedimiento de la pràctica capa màscara y deberás obtener el

siguiente resultado.

Evaluación

Realimentación

1.- Dibuja una pecera con diferentes objetos.

2.- Haz que los objetos se muevan en el interior de la pecera.

3.- Guarda el archivo como swf y como flv.

Práctica Integradora

1.- Utiliza las herramientas necesarias para dibujar un parque.

2.- Dibuja un niñ@ en una patineta.

3.- Haz que la niña o niño patine por todo el parque.

4.- Escribe tu nombre y realízale una capa máscara.

5.- Guarda el archivo como swf y como flv.