Flash

FLASH CS3
Manual de Laura M M R
FLASH CS3
FLASH CS3
FLASH CS3
FLASH CS3
FLASH CS3
Manual de Laura M M R INDICE
ABRIR ARCHIVOS TIPOS DE FOTOGRAMAS REALIZACION DE UN RATON HERRAMIENTAS PINCEL FLECHA NEGRA INTERPOLACION DE MOVIMIENTO TEXTO TEXTO CON EFECTO PARPADEO TRABAJAR FOTOS EN FLASH COLOCACIN DE ARCHIVOS FLASH EN DREAMWEAVER SIMBOLOS CREACION DE UN INTERFACE PARA UN CD INTERACTIVO. RESUMEN DE COMANDOS Y ACCIONES EN FLASH.
FLASH CS3
FUNCIONAMIENTO t
APERTURA DE ARCHIVOS
Es un programa multimedia, video, animacin, mviles, est pensado para pantalla. Es un programa de animacin. La animacin en photoshop es lineal, aqu se puede controlar, y se puede incorporar video a las animaciones. Para abrir flash.
Flash video encover, es un editor que permite abrir video, pero hay que abrir flash cs3 profesional.
Abrimos un achivo nuevo

El programa trae plantillas, y se pueden crear elementos nuevos, nos permite trabajar con programacin, se sirve del action scrip, se puede hacer un video juego, lo que pasa es que opciones habra que programarlas con ese lenguaje. Hay archivos de flash.. tenemos que abrir el 2.0, en los 3.0 si hay que hacer programacin hay que hacerla sobre un block de notas, por lo que hay que saber de programacin, en el 2.0 hay un asistente.
Es una mezcla extraa entre illustration y Dreamweaver.
Las herramientas son ms cortas. Las propiedades estn el la parte de abajo. El flash no trabaja en papel.
Lo ms importante de flash es que funciona como una pelcula, en la parte superior est capa, y una lnea con nmeros y una lnea roja con un guin, eso se llama en animacin lnea de tiempo. En propiedades aparece la velocidad de fotogramas, por defecto salen 12 que es lo que sale en 1 sg, doce escenas. La animacin es constante.
FLASH CS3
Dibujamos un cuadrado.
Es un programa vectorial, por lo que tengo muchas herramientas de animacin, sobre todo para deformar y modificar figuras. Si dibujamos un elemento, estamos en capa 1 con un rectangulo de color blanco y un circulo, eso significa que es un fotograma vaco.
Funciona como el illustration con color de relleno y de trazo.

Para seleccionar tomamos la flecha negra y tocamos solo, porque si hay hacemos ventana recorta. Si sin seleccionar podemos tocar la figura aparece un cuarto de curva que dice que se puede deformar. Para borrar tocamos y damos a supr
FLASH CS3
Dibujamos un cuadrado.
El programa tambin funciona por coordenadas la 0,0 es la superior izquierda, y la del objeto tambin.
Si miramos el fotograma 1, aparece un rectngulo gris con un punto negro
Tipos de fotogramas:
Tipos de fotograma: Fotograma vaco- con un rectngulo de color blanco y un circulo, eso significa que es un fotograma vaco. Fotograma con dibujo- aparece un rectngulo gris con un punto negro. Significa que es un fotograma clave, significa que el cambio est permitido. Este concepto es, que no haya nada en la pantalla a que si haya algo, que se pueda cambiar la forma, el color, el cambio es que de no haber algo haya algo. Si imaginamos el cuadrado como un personaje y se quiera mover por la pantalla, hay que hacer cambios.
Le damos nombre a la capa. Con doble click en capa 1
FLASH CS3
Si queremos un cambio en la animacin, vamos al fotograma nmero dos
Insertamos un nuevo fotograma clave dando a la tecla f6
Aparece el punto negro es decir que el cambio est permitido. Desplazamos el cuadrado con coordenada 2
Vamos haciendo los movimientos. La barra de tiempo nos va dando datos.
FLASH CS3
Si hacemos hasta el fotograma 10 y movemos la gua se mueve el cuadrado. Para ver la reproduccin se activa un reproductor.
Sale un cuadro que se mueve porque se produce un cambio en la pantalla. mos a El objetivo del flash es crear pelculas. Si va-
FLASH CS3
Se activa la pelcula.
Si ahora el cuadrado en vez de moverse crece en tamao, hacemos fotogramas cambiando el alto.
FLASH CS3
Podemos mantenerlo en la pantalla y despus cambiarle el color. El fundamento de la animacin es un fotograma clave en el que se produce un cambio. Si se hace sobre un dibujo se puede construir una historia. Eliminamos los fotogramas, nos colocamos en un fotograma vacio presionamos el botn izquierdo y los seleccionamos, una vez seleccionados damos click en el botn derecho y quitamos fotogramas.
Nos colocamos en el fotograma y le damos f6 Aparece el rectngulo con en circulo
Para dibujar un personaje, lo segundo tapa a lo primero, y en este caso se lo come.
FLASH CS3
Si seleccionamos el valo y lo movemos, se comi el rectngulo.
Para dibujar diferentes elementos hay que hacerlo todo sobre capas, se dibujan las piezas se agrupan de forma individual y se van conformando las piezas. Si las piezas no queremos que se recorten, si dibujamos un rectngulo, lo convertimos en grupo.
Dibujamos un valo y tambin lo agrupamos. Lo podemos mover sin que lo recorte.
10
FLASH CS3
REALIZACIN DE UN RATN CON MOVIMIENTO
Si dibujamos un ratn. Hacemos un rectngulo
Seleccionamos la esquina de arriba sin tenerlo seleccionado, y nos llevamos la esquina
Le hacemos el culo
11
FLASH CS3
Vamos al vrtice.
Esto es el cuerpo del ratn para que no nos desaparezca lo movemos y lo convertimos en grupo.
12
FLASH CS3
Construimos las orejas.
mos a
Le damos a alt y se duplica, para simetra va-
Una vez tenemos realizadas las orejas agrupamos cada una por separado.
13
FLASH CS3
Si queremos mandar una de las orejas a la parte de atrs.
Si queremos girar alguna de las orejas
Le dibujamos los ojos y los bigotes. Para realizar los bigotes los pintamos
14
FLASH CS3
Los agrupamos para poder ponerlos encima
Montamos los bigotes encima del ratn
15
FLASH CS3
HERRAMIENTA PINCEL
La herramienta pincel
Deja escoger un pincel en el lateral y dibuja formas libres.
Para cambiar el tamao de pincel.
16
FLASH CS3
El bigote lo podramos pintar con el pincel. Hacemos el rabo
todo.
Seleccionamos todo el ratn y lo agrupamos
Ahora al ser un grupo con transformacin podemos modificar el ratn y hacerlo ms pequeo.
17
FLASH CS3
Esto es un grupo, si queremos modificarle algo, hacemos doble click dentro del grupo
Si hacemos doble click dentro de la oreja se le puede cambiar el color y la forma
18
FLASH CS3
Si pulsamos en escena, volvemos a la situacin inicial del grupo
Si queremos un queso y un decorado, creamos una nueva capa, debajo de la lnea de tiempo
19
FLASH CS3
Creamos una nueva capa que le llamamos queso. Para no hacer nada en la capa del ratn lo bloqueamos y ocultamos.
ulta.
Ahora dibujamos un queso, con la otra capa oc-
Una vez dibujado lo agrupamos. Lo transformamos y activamos la capa del ratn
20
FLASH CS3
Le podemos hacer un decorado, como un zcalo con la puerta. Creamos una capa nueva para el fondo y la colocamos debajo de todo, para que las figuras se vean por encima
El decorado se mantiene quieto si tenemos los 50 fotogramas, vamos al fotograma nmero 50 es un fotograma fijo. Se inserta con la tecla f5
Si hacemos algn cambio en el diseo se va a modificar en todos los fotogramas. Bloqueamos la caa del decorado. Volvemos al fotograma nmero 1
21
FLASH CS3
El queso no se mueve hasta que el ratn se lo empieza a comer, puede ser en el fotograma por ejemplo numero 15, nos colocamos en el fotograma 15 de la capa del ratn.
Nos colocamos en el fotograma 15 y le damos f6, porque le vamos a colocar la posibilidad que el queso se pueda usar por si el ratn se lo come. Nos queda ir a la capa del ratn que se mover a poquitos, vamos a los fotogramas, e insertamos fotogramas claves para que se mueva el ratn. El ratn llega al queso y lo va a comer a partir del fotograma 20
22
FLASH CS3
Movemos el ratn
Queremos que el queso vaya desapareciendo. Metemos fotograma clave para que reduzca el queso, se puede meter con el color del zcalo una forma que reduzca el queso. O usar la herramienta goma, hasta el fotograma que tenemos marcado. El queso tiene que estar desagrupado y ser una forma para poder borrarlo.
Ahora el ratn se da la vuelta y se marcha.
23
FLASH CS3
Al guardar el archivo, el programa lo guarda ya como una pelcula.
Flash es una especie de illustration configurado para pantalla, y web, por defecto hace espacios de 550x400 para cambiar el tamao hacemos click en el botn de tamao y lo cambiamos.
La resolucin 780x480 se ajusta en pantalla bastante bien. Las herramientas se parecen mucho al illustration, el color funciona con trazo y relleno.
24
FLASH CS3
HERRAMIENTA FLECHA NEGRA

La flecha negra tiene mltiple propiedades el trazo y el relleno son independientes.
Si queremos seleccionar el trazo si marcamos una arista, solo coge esa, para coger todo el trazo hay que hacer doble click. Para volver a colocar el trazo al relleno en la barra de herramientas est el cubo de pintura.
El programa detecta zonas huecas y rellena.
Existe el bote de tinta, est asociado con la herramienta de color de trazo. Al seleccionar un trazo lo indica en la barra de propiedades, Se le puede dar color a un elemento que no tiene trazo.
25
FLASH CS3
En flash lo segundo tapa a lo primero y tambien se lo come. Flash permite seleccionar por colores. Si los elementos que solapo son del mismo color quedan unidos. Para dibujar elementos y que no resten hay la opcin de agruparlos, y as no cambian. En animacin es mejor no usar trazo, ponerlo siempre transparente. En la parte superior tenemos la lnea de tiempo, que es lo que dificulta el programa. Es tambin una capa. El primer fotograma es un rectangulo gris con punto negro, es un fotograma clave, permite hacer mov-
imiento y cambios, si queremos mover una elipse de la pantalla. Para insertar otro fotograma pinchamos en el siguiente y le damos a F6. si movemos el elemento se produce la animacin. Esto es el fundamento del programa.
INTERPOLACIN DE MOVIMIENTO
Hacer animacin fotograma a fotograma es laborioso, el programa tiene una herramienta que es la INTERPOLACION. Marcamos un punto inicial y final y el programa realiza la parte del medio. Para trabajar con las interpolaciones tenemos que definir un estado inicial y final. Ponemos nombre a la capa, y dibujamos un circulo sin trazo. Le cambiamos las coordenadas y el tamao.
26
FLASH CS3
Para hacer que el crculo recorra la pantalla, puedo calcular las diferentes posiciones por la interpolacin. Se aplica sobre la lnea de tiempo.
La interpolacin de forma no agrupa los dibujos, la de movimiento cra una nueva estructura de simbolo. La interpolacin de forma solo trabaja sobre formas clarito Cambia el fondo del fotograma a un color verde
Por lo que se ve que hemos aplicado la herramienta. Si decidimos que del fotograma 5 al 15 la bola se mueva, vamos al fotograma 15, hemos definido el principio. En el 15 inserto un fotograma clave con f6
27
FLASH CS3
El estado inicial y el final es el mismo, si en el 15 seleccionamos la forma y cambiamos las coordenadas.
Si ahora movemos la lnea roja el programa crea el movimiento, en esta interpolacin los movimientos solo pueden ser lineales. Si cambio el tamao tambin hace la interpolacin del tamao.
Tambin se puede cambiar el color y tambin lo interpola. Si queremos volver al principio.
En el fotograma 35 borramos la pelota nos salen unas rallitas. Vamos a pegar en situ y pegamos la bola que tenamos en el primer fotograma, entonces nos vuelve al punto inicial haciendo el pedazo intermedio. Si volvemos al primer fotograma y hacemos click en la pantalla en la barra de propiedades tenemos la velocidad de los fotogramas.
28
FLASH CS3
Si aumento la velocidad disminuyo el tiempo, para modificar la velocidad, me voy al primer fotograma y en vez de 12 fotogramas puedo poner 24 Y va ms rpido.
Est bien trabajar a 48 fotogramas por segundo, pero hay que tener muchos fotogramas para que salga bien. Si las velocidades son bajas mejor que no sean inferiores a 24 fotogramas. Volvemos a fotograma 45
Queremos que del 45 al 60 la figura cambie de forma. En el 60 dibujo un cuadrado. Seleccionamos el crculo y lo borramos
29
FLASH CS3
Hacemos un rectngulo
Si le metemos sin querer un trazo al rectngulo se ven unas lneas extraas en la pantalla descomponiendo el trazo.
INTERPOLACION DE MOVIMIENTO
Abrimos un archivo nuevo.
Dibujamos un rectngulo sin trazo con unas dimensiones.
30
FLASH CS3
Si hacemos click en el lienzo el punto negro est sobre un fondo azul clarito.
El dibujo deja de ser forma y pasa a ser un smbolo
31
FLASH CS3
Se convierte el objeto de la interpolacin en una cosa superior a grupo, no se puede cambiar de forma ni color. Vamos al fotograma 30 y hacemos un fotograma clave con f6
Si queremos que vaya a la otra esquina de la pantalla le cambiamos la coordenada.
La coordenada del smbolo ahora es el centro de gravedad por eso tiene 25,25, Vamos a ventana alinear.
32
FLASH CS3
Alineamos respecto a la escena pulsando escena, y aplicando alinear respecto a donde queramos.
La diferencia con la interpolacin de forma est cuando nos colocamos en el fotograma nos cambian las propiedades.
Puedo girar la figura indicando un sentido.
33
FLASH CS3
Gira una vez sobre el desplazamiento.
Para cambiar el color hay que aplicarles propiedades al smbolo, que contiene al objeto. Para cambiar el color a un smbolo entramos en el con un click y vamos a color
Nos deja escoger color
Le cambiamos el color a la estructura que contiene al objeto, pero no al objeto. Para cortar una interpolacin nos colocamos en el fotograma de al lado le damos f6 y click botn derecho
34
FLASH CS3
El rectngulo sigue siendo un smbolo para volver a recuperar la forma inicial hay que ira a
Y se vuelve a convertir en una forma
Con las interpolaciones los movimientos son rectilneos.
TEXTO EN FLASH
Creamos un archivo nuevo
35
FLASH CS3
Vamos a hacer una animacin
Convierte el puntero del ratn en un texto.
En propiedades pone texto esttico, pero permite texto dinmico e introduccin de texto, pero vamos a trabajar en texto esttico. Tenemos el tipo de letra, tamao, color y algun efecto. Hay un cuadro con suavizado para legibilidad.
Se puede trabajar de dos maneras, haciendo click en la pantalla y escribiendo.
Aparece una caja en la que va el texto, le damos el tamao y se ajusta. El texto no es una forma, es una estructura. Si se quiere hacer un efecto de cambio de color, la opcin primera es hacerlo fotograma a fotograma, o con interpolacin que tendr que ser de movimiento porque el texto es un grupo. Pero tambin se puede descomponer en modificar.
36
FLASH CS3
Separa el texto en letras individuales.
Si volvemos a separar una letra lo separo en formas
Pero no se puede reescribir el texto, si se podra agrupar, pero no se puede cambiar lo que pone. Cogemos el texto que lo tenemos todo en una capa, y le queremos dar un efecto a una letra. Si aplicamos una interpolacin de movimiento al fotograma se lo aplica a todo el contenido.
37
FLASH CS3
EFECTO DE PARPADEO
Vamos a hacer un efecto de parpadeo. Seleccionamos el fotograma 1 y lo convertimos en interpolacin de movimiento
Nos colocamos en el fotograma nmero 20 para que haga el efecto y damos a f6
En el fotograma nmero 40 quiero que vuelva a lo inicial me pongo en el.
38
FLASH CS3
Volvemos al fotograma nmero 20 para aplicar los efectos.
Si presiono el fotograma en propiedades me da informacin sobre el fotograma, pero si hago click en el texto cambian las propiedades.
Tenemos de propiedades un grfico al que puedo modificar el color. Voy a color u escojo un efecto, con tinta y alfa podemos hacer muchas cosas. Escogemos tinta y pedimos que evoluciones de rojo a azul
39
FLASH CS3
El texto cambia. El programa calcula los cambios, y el efecto es continuo porque hicimos un bucle, si que remos que el texto se mueva, nos colocamos en el fotograma 20 tomamos herramienta transformacin libre y lo reducimos.
El texto se va reduciendo.
Si queremos que se aplique a una letra hay que separarlas en capas. Si aplicamos otro efecto como el alfa que permite jugar con la visivilidad de las cosas, si pongo cero pasa a invisible.
TRABAJO CON FOTOS

Solo se permite un efecto por fotograma. Esto permite realizar un efecto muy comn en flash que es la trenza, permite jugar con la desaparicin de un objeto para que aparezca otro. Flash permite trabajar con fotos, y se pueden hacer desaparecer, la condicin es que las fotos tenga un tamao acorde con flash. flash Vamos a una foto la copiamos y la pegamos en
40
FLASH CS3
A la foto le llamamos Corua 1 le damos nombre a la capa
Ya nos aparece un fotograma clave en el 1, Creamos una interpolacin de movimiento
En el f20 hago cambio y tambin en el 40, metemos fotograma clave con f6 Nos colocamos en el fotograma 20 hacemos click en la foto y le cambiamos el color a alfa 0%
41
FLASH CS3
La foto desaparece. stes efectos se hacen superpuestos. Localizamos otro foto
La interpolacin de movimiento para superponer un efecto tiene que ser sobre otra capa. Anulamos la capa Corua y la ocultamos Creamos otra
Vamos a edicin y pegamos la nueva foto, el programa tiende a igualr sus capas, aparecen fotogramas
Invertimos la forma de colocar la foto, damos alfa en el primer fotograma y en el 40 otra. Conseguimos una transicin entre una foto y la
Si la transicin la hacemos a 100 fotogramas y velocidad 25 hara mejor la transicin. Guardamos el trabajo de dos maneras, como archivo flash y como swf, que se guarda solo si hacemos control enter. Podemos exportar el contenido a un sitio de Internet.
42
FLASH CS3
Localizamos la carpeta que tenemos de sitio en Internet, y lo guardamos.
Lo guardamos como swf, aparece un por defecto, sale un asistente.
43
FLASH CS3
Le marcamos las calidades que nos sugiere, la pelcula ya la coloca dentro del sitio web, vamos a comprobar si en la carpeta del sitio tenemos el archivo swf
COLOCACIN DE ARCHIVOS FLASH EN DREAMWEAVER

Si hacemos click en el archivo nos lo genera. Ahora abrimos Dreamweaver nos aseguramos que estamos en el sitio pruebas.
Creamos un documento HTML, y creamos una estructura. Guardamos la pgina
44
FLASH CS3
Insertamos tabla de dos filas dos columnas y ancho 800
Insertamos tabla de dos filas dos columnas y ancho 800
Centramos la tabla con ella seleccionada
45
FLASH CS3
Seleccionamos la primera celda y le damos el ancho.
Damos dimensiones a la siguiente y a la celda grande colocamos las fotos. Colocamos el puntero del ratn en la esquina superior izquierda y vamos a insertar.
Nos aparece insertado el flash
46
FLASH CS3
Si hacemos f12 lo vemos en el explorador, adapta la animacin al cuadro de la celda sin poner los botones de navegacin. Las reproducciones cuando forman parte de una web, su reproductor desaparece y se centran al tamao que hemos definido. Son un elemento ms de la pgina web. En el diseo web hay que insertar todo nuestro trabajo en tablas y capas. Estas interpolaciones que vimos hasta ahora solo nos dejan desplazar linealmente, pero la animacin de movimiento tambin nos permite que sea de trayectoria.
MOVIMIENTO A LO LARGO DE UNA TRAYECTORIA

Si tenemos un circulo en la pantalla.
Le llamamos a la capa bola.
47
FLASH CS3
Si le damos al icono
Se crea una capa nueva
trazo
Dibujamos una lnea irregular con la herramienta
48
FLASH CS3
punto zar.
La trayectoria no se puede cruzar en ningn La herramienta lpiz tiene la opcin de suavi-
Pintamos en la capa gua bola
Una vez que tenemos un objeto y una trayectoria nos colocamos en el fotograma de la capa bola y lo convertimos en una interpolacin de movimiento
49
FLASH CS3
La bola busca un punto de inicio. Se va al que tiene ms cerca, con la herramienta seleccin si queremos mover la bola se desplaza por la gua.
La gua tiene que ser una forma
50
FLASH CS3
Decidimos cuantos fotogramas queremos, vamos a la capa de la gua y en el fotograma 40 la repetimos con f5 que es un fotograma normal sin cambio.
clave
Vamos a la capa bola y hacemos un fotograma
La bola se mueve por la gua. Colocamos en el primer fotograma la bola en el principio y en el ltimo fotograma la bola al final. Y conseguimos que se mueva por la gua, sin que esta sea visible. Una trayectoria solo vale para una capa
Para hacer una trayectoria elptica, podemos coger una elipse quitarle el relleno, cortar un trocito y convertirla en trayectoria. Esto lo hacemos en la capa gua. Con la goma borramos un trocito de la elipse.
Para que parezca que gira hay que poner la capa de la tierra debajo de todo y otra encima de todo que tape el giro respecto de la gua.
51
FLASH CS3
SIMBOLOS
Determinados elementos necesitan tener animacin propia, una ambulancia va por una carretera y al mismo tiempo se mueve la sirena. El programa tiene la opcin de creacin de smbolos. SIMBOLOS Se pueden hacer tres tipos:
Grficos: elementos agrupados que tiene la condicin de smbolos. Botones: permiten colocarnos encima de ellos y desplazarnos a algn punto de la pelcula. Click de pelcula: es un smbolo que incorpora
en su interior movimiento. Por ejemplo un pjaro que mueve las alas. talla. Cmo creamos un smbolo. Nos sale un panel con la biblioteca vaca. Solo vale para el archivo que se tiene en pan-
52
FLASH CS3
tipo
Sale un asistente, nos pide un nombre y que
Cambia la pantalla
La cruceta define el centro de gravedad, la lnea de tiempo no es la de la pelcula es la del elemento mosca. Creamos una mosca
53
FLASH CS3
Con cada cosa en una capa diferente
Le podemos aplicar movimiento a las alas de la mosca. 10. El cuerpo no se mueve, hacemos f5 hasta el foto
Vamos a capa ala1 nos ponemos en foto1 click botn derecho y marcamos interpolacin de movimiento. Vamos a transformacin y giramos el ala creamos un fotograma clave en el 5 y 10. el 10 lo dejamos como est el 1 y en el 5 movemos el ala para abajo.
cena.
Una vez creado el smbolo volvemos a la es-
El smbolo queda guardado en la biblioteca, si la queremos colocar solo tenemos que hacer click y arrastrar sobre la pantalla.
54
FLASH CS3
gua.
Podemos hacer una trayectoria con una capa Y creamos los fotogramas de movimiento
La mosca la podemos cambiar de tamao para que parezca que se acerca. Insertamos en el medio un fotograma clave en el que modificamos el tamao de la mosca con la herramienta transformacin.
CREACIN DE UN INTERFACE PARA UN CD INTERACTIVO

Trato las fotos en fotoshop las guardo en png y en flash las importo
Aparecen los archivos en la biblioteca
55
FLASH CS3
Aparecen los archivos en la biblioteca
No ponemos nada hasta el fotograma 15, y en el 15 arrastramos la de mapa de bits. Borramos con la goma los pixeles que tenemos encima de la foto anterior, la capa de abajo tiene que estar bloqueada.
Se ajusta la velocidad y se decide cuando se detiene la pelicula Comprobamos que tenemos los candados, colocamos un nueva capa encima y le llamamos acciones. Nos colocamos en esa capa y vamos a el ultimo fotograma Vamos a acciones
Ahora hacemos una navegacin. Bloqueamos todo y creamos los botones.
Intentamos encontrar la tipografa de los Beatles. Vamos a crear los botones de la interface, bibliografa y canciones. Se crean en la biblioteca.
56
FLASH CS3
Damos nombre y ponemos lo que es.
Estamos en un nuevo modulo de trabajo. Aparecen cuatro fotogramas.
La cruceta sirve para el botn. Lo alineamos respecto a la cruceta.
57
FLASH CS3
Le damos efecto al texto.
Cambiamos a sobre damos f6 y fotograma clave , podemos dibujar un cuadrado, cambiarle de color etc..
En presionado no queremos nada, metemos f5
En zona activa metemos un fotograma clave f6.
Nos cargamos el cuadrado y hacemos un rectngulo por encima de la palabra.
58
FLASH CS3
Llevamos el botn creando una capa al fotograma 70 y comprobamos que funciona
Si queremos hacer ms cosas sobre el botn, como que el cuadrado parpadee Se puede hacer con el click de pelcula. Pues puedo insertar un smbolo dentro de otro.
Vamos al botn, para editarlo se hace doble click en el botn. Nos ponemos en el cuadrado en
59
FLASH CS3
padeo
Lo convertimos en smbolo, le llamamos par-
Se convierte en smbolo
Lo seleccionamos y le damos doble click para estar dentro del
Le doy el efecto
60
FLASH CS3
Si queremos hacer botones iguales pero solo cambiar el texto. Vamos a escena 1 y abrimos panel biblioteca. Cogemos el botn y
icono.
Editamos el botn, con doble click sobre el
61
FLASH CS3
Cambiamos los fotogramas
Vamos a hacer un efecto sobre los botones y convertir el archivo autoejecutable. a uno. Vamos a hacer que los botones aparezcan uno
Hacemos fotogramas clave cada cinco para poner los botones Nos colocamos en cada fotograma y eliminamos todos los botones menos 1
62
FLASH CS3
Guardamos el archivo y vamos a la carpeta en la que estamos guardando los archivos. Tenemos un archivo swf, si el ordenador no tuviera instalado el reproductor de flash no se podra ver, habra que verlo en lnea.
able
Si entramos en swf creamos un archivo ejecut-
63
FLASH CS3
Lo convertimos en ejecutable. Exe.
Se carga el archivo ms el programa que permite ejecutar el archivo
PARADA DE PELICULAS
Vamos al archivo punto fla.
En la capa acciones en el foto 50 detenemos la pelcula. En esta capa nos ponemos en foto 1
64
FLASH CS3
Activamos el panel de las acciones f9
Vamos a navegador red, comprobamos que es asistente de las funciones presionado.
65
FLASH CS3
Le damos doble click a la orden.
Fscomand, altera las funciones sobre la pelcula que vamos a generar.
66
FLASH CS3
Significa pantalla completa.
Se nos coloca la palabra verdadero, la pelcula se ver a pantalla completa.
Sale en pantalla completa pero no mantiene la proporcin. sas Para salir de la ventana completa damos esc. Si nos interesa mantener el tamao de las coVamos a acciones y metemos otro fscomman
67
FLASH CS3
Vemos que hay un comando que nos permite mantener la escala.
Nos pone la opcin true , tenemos que borrarlo, porque sino se permite escalar Procurar que esto sea siempre as. Esto sirve para crear archivos multimedia. Quedara ponerle a cada botn su funcin.
RESUMEN DE COMANDOS Y ACCIONES DE FLASH

Es un programa vectorial, se pueden introducir fotos. Su funcin principal es la animacin, est pensada para que sea una animacin controlada, se pueden introducir acciones en actionscript, tiene aplicacin en el diseo web y para los mviles. Se crea un archivo fuente, que es el generador con extensin .fla, que solo sirve para modificar el archivo, el reproducible es el swf. Funciona en pixeles a 72 ppp. Aunque permite la impresin. Se comporta como una pelcula, lo que tenemos son escenas, en las que podemos almacenar los trabajos. Hay que tener el control de una lnea de tiempo. Existen tres tipos de fotograma
68
FLASH CS3
TIPOS DE FOTOGRAMAS
1. Fotograma clave vaco, rect6angulo con un cuadrado en el interior. No hay contenido en el fotograma de la capa, pero puede haberlo Si dibujamos un cuadrado el fotograma cambia a gris con negro. 2. Fotograma clave, permite el cambio, y es cuando dibujamos algo, el cambio nos permite crear la animacin.
El primer fotograma siempre va a ser clave.
3. si queremos hacer un cambio vamos al fotograma 2, y le damos a F6, que aade un nuevo cuadro gris con punto negro y podemos hacer el cambio.
icin.
Si doy a control enter, tengo el cambio de pos-
4. fotograma normal, no permite el cambio, mantiene un elemento en una Posicin. Nos colocamos en el fotograma por ejemplo 15, y podemos darle a f5, aparece en gris, y un rectngulo, la forma es la misma hasta ese fotograma.
69
FLASH CS3
bio.
En esos fotogramas no se genera ningn cam-
Esto nos lleva a controlar la velocidad de la animacin. Si hacemos click en la pantalla blanca, la velocidad es de 12 por segundo, es lo que reproduce. Si la velocidad es fija, la animacin dura ms si tenemos ms fotogramas.
UTILIZACIN DE CAPAS
Sirven para ir creando los diferentes elementos que tiene la animacin, cada elemento debemos separarlo en capas, para crear capa nueva hacer click en el icono insertar capa.
ELIMINAR FOTOGRAMAS
Si estamos en el fotograma, suprime lo de dentro pero no el fotograma, para eliminar fotograma hay que hacer doble click en los fotogramas y click en botn derecho para que salgan las opciones
70
FLASH CS3
t
Si no tenemos fotogramas el programa no deja hacer nada
Tenemos que tener un fotograma clave vaco. Nos colocamos en el fotograma y hacemos f6 o f7 para hacer un fotograma clave vaco para dibujar, y entonces si podemos dibujar.
71
FLASH CS3
Manual de Laura M M R HERRAMIENTAS DE FLASH
HERRAMIENTAS
Tiene las herramientas parecidas a las del illustrator, divide cualquier objeto vectorial en trazo y relleno.
SELECCION DE OBJETOS
Tiene dificultad para seleccionar los objetos.
etc..
Selecciona pero tambin modifica, deforma,
Si hacemos click en el azul solo seleccionamos eso, nos llevamos el contenido pero se separa del trazado.
72
FLASH CS3
tura.
Para volver a colocarlo, se usa el bote de pin-
BOTE DE TINTA
El bote de tinta le coloca el trazado
73
FLASH CS3
La flecha negra selecciona y separa, si solo queremos un trozo de rectngulo
Recorta lo que seleccionamos, con la flecha negra.
LO SEGUNDO TAPA A LO PRIMERO

Funciona con la regla de lo segundo tapa a lo primero, pero en este programa tiene la propiedad que tambin se lo come.
74
FLASH CS3
Para dibujar algo hay que hacer el dibujo por separado, y se colocan en capas diferentes o se hacen grupos. Dibujamos un crculo, lo separamos y lo convertimos en grupo.
ta.
Al agruparlo si dibujo algo encima no se recor-
Los grupos siempre estn por encima de las formas, para que se vean los ojos hay que agruparlos.
Dibujamos una boca.
A un crculo le quitamos otro porque recorta el segundo, y agrupamos.
75
FLASH CS3
En la parte inferior de la barra de herramientas hay un imn que siempre est presionado y un crculo, que no debe de estar presionado
Si est presionado la figura ya la dibuja agrupada, cualquier cosa que dibujemos nos la hace como grupo. Presionarlo solo cuando dibujemos grupos.
76
FLASH CS3
RECTANGULO
La herramienta rectngulo, permite dibujar una forma, la herramienta rectngulo simple, dibuja el rectngulo como si fuera un grupo. Lo dibuja directamente.
Las ventajas son las propiedades de la herramienta. Dibujamos dos rectngulos, uno con una herramienta y otro con otra.
77
FLASH CS3
El verde es una forma
Es un rectngulo simple y aparecen otras propiedades, le podemos poner un radio a las esquinas.
Se le pueden poner radios diferentes a las esquinas, se modifica la pieza ms fcilmente. Para recortar una esquina al naranja, no podemos porque se comporta como un grupo y lo selecciona todo.
78
FLASH CS3
FLECHA BLANCA
Selecciona un punto de ancla determinado que podemos mover. El rectngulo simple se puede convertir en una forma, para eso tenemos que modificarlo.
Le desaparecen las propiedades, es un paso irreversible, se podr convertir en grupo, pero las propiedades del radio de las esquinas desaparecen.
HERRAMIENTA TRAZO
Tenemos pluma, lnea recta y lpiz. El pincel aqu no es de trazo, se comporta como los rellenos.
79
FLASH CS3
Son elementos de trazo. Se puede modificar.
HERRAMIENTA PLUMA
Hace trazados mediante curvatura. Necesita la ayuda de la herramienta alt, para fijar los puntos. En funcin de los manejadores se va colocando.
80
FLASH CS3
Con la flecha blanco podemos mover los puntos de las curvas de forma independiente. Si seleccionamos la curva con la flecha negra, en la barra de herramientas aparece, suavizar y enderezar.
HERRAMIENTA LAPIZ
El lpiz hace ms o menos lo mismo. En la parte inferior de la barra de herramientas aparecen el icono de grupo y otros
El programa es capaz de modificar un poco los trazos que realizamos con suavizar y enderezar. Las figuras hechas con trazo se pueden con el cubo de pintura rellenar de color.
81
FLASH CS3
HERRAMIENTA PINCEL
leno. No funciona como un trazo lo hace como un rel-
En la barra de herramientas aparece.
82
FLASH CS3
Se puede cambiar el pincel.
En funcin de la forma que tengamos podemos modificar el tamao, pero no poniendo el nmero de pixeles.
Podemos combinar forma y tamao para hacer un pincel. Existe tambin el modo de trabajo.
83
FLASH CS3
Permite dibujar segn formas hechas. Si pintamos normal pinta por encima de todo.
Si escogemos pintar detrs.
84
FLASH CS3
Pinta por la parte de atrs del rectngulo.
Con pintar dentro, slo pinta dentro de la figura.
GOMA DE BORRAR
Se puede poner en distintos modos.
85
FLASH CS3
Se puede poner de distintas maneras
MOVIMIENTO DE LOS ELEMENTOS

Se pueden introducir smbolos que tienen su propio movimiento. Tenemos un pjaro que mueve las alas, y que se mueve a travs de un escenario. Hay que distinguir los elementos con movimiento propio, y que aparte se mueven. Siempre para mover elementos se crea en el fotograma clave la interpolacin, se les cambia a los elementos en este el centro de gravedad, y cuando est cambiado se siguen creando los fotogramas claves. Hay que crear smbolos.
86
FLASH CS3
Lo creamos como click de pelcula, porque tiene movimiento propio. Pasamos a otra pantalla.
Creamos las capas.
Nos aseguramos de la capa en la que estamos y dibujamos el pjaro.
87
FLASH CS3
Se van a mover las alas, por lo que en treinta fotogramas no se mueven, vamos en la capa del pjaro al 30 y damos f5
Movemos el ala 1 la prxima a nosotros, usamos el fotograma del ala en una interpolacin de movimiento.
88
FLASH CS3
Nos permite seleccionar el centro de gravedad y colocarlo donde nos interesa lo colocamos en donde vamos a modificar el movimiento. Y definimos los 3 puntos de movimiento. Insertamos fotogramas clave con f6 en el 15 y el treinta. Vamos al 15 y hacemos el movimiento.
Hacemos lo mismo con la otra ala.
Con las alas hechas salimos del modo pjaro y volvemos a la escena n 1
89
FLASH CS3
Vamos a la biblioteca y arrastramos el pjaro a la pantalla.
Si damos a control enter, vemos el movimiento del pjaro.
En flash hay elementos que son formas, otros grupos, imgenes, smbolos. A veces pintamos sobre una foto y lo que pintamos se coloca por atrs.
90
FLASH CS3
TEXTO EN FLASH
Permite trabajar de varias maneras,
Aparecen tres opciones de texto:
Esttico, es el que ms se utiliza. Para rtulos texto, etc..
TEXTO ESTTICO
91
FLASH CS3
Las nicas posibilidades que tengo estn en las propiedades.
El suavizado es que en funcin de los usos que le damos podemos trabajar sobre las fuentes este siempre carga las fuentes, se pone esta opcin para leer bien las fuentes. Trazar las fuentes como mapas de bits lo representa como mapa de bits. Aunque las letras siguen siendo vectoriales. Con texto esttico poner suavizado para animacin o para legibilidad.
TEXTO DINAMICO
Texto dinmico, simula tipos de texto como si los representase una pgina web.
Si hacemos control enter, vemos la pelcula diferente.
92
FLASH CS3
El texto se puede seleccionar.
La introduccin de texto hay que hacerlo sobre algo como un rectngulo. Hacemos un rectngulo y lo agrupamos. Miramos que tengamos introduccin de texto, hacemos un rectngulo de texto y lo colocamos en el interior del rectngulo.
Sirve para que si hacemos un control enter, hacer reas de texto en las que podemos escribir.
Esto sirve para crear formularios de acceso a Internet, abra que asociar estos cuadros de texto a una programacin. Valdra para crear un interface de un cdigo y una contrasea. Para formularios de acceso se usara esta opcin, para mucho texto se usara texto dinmico y para rtulos texto esttico. Para hacer una animacin con texto podemos partir de una frase y partiramos de la opcin de texto esttico.
93
FLASH CS3
Tendramos que separar las letras.
Separa las letras como si fueran individuales, pero siguen siendo letras.
Si separamos por segunda vez.
94
FLASH CS3
Cada uno de los textos se convierten en formas, son manchas. Para hacer animacin lo ideal seria que tuviramos cada elemento en capas diferentes si queremos que se muevan, el programa tiene una opcin para ello.
Desaparecen los elementos de la capa 1 y los separa en capas diferentes.
95
FLASH CS3
Se pueden ir modificando la animacin, a medida que avanza el tiempo si queremos que las letras cambien de color. Necesitaremos tantos fotogramas como letras. Hacemos f5 fotograma normal en el 13, en el 1 tenemos uno clave, en el fotograma 2 tenemos otro clave f6. vamos al fotograma 1 de la capa 1 y lo cambiamos de color. Y lo levantamos. Hacemos lo mismo sobre las otras capas, en la segunda vamos al 13 y repetimos la letra, esta cambia en el paso siguiente. Pero tiene que volver a su posicin. Tenemos tres cambios. Ponemos fotogramas clave en el dos y el tres, con f6.
Vamos creando los fotogramas hasta el final.
Otro sistema para hacer animacin en texto
Para centrar el texto vamos a ventana alinear, pulsamos escena y lo centramos. La interpolacin de movimiento permite hacer variaciones en los fotogramas. Si pinchamos la letra podemos cambiar el color a alfo de forma que va apareciendo de invisible a visible. Para parar la pelcula, colocamos una nueva capa encima, en el ltimo fotograma colocamos un stop que est en acciones, globales, stop y lo colocamos.
96
FLASH CS3
De esta manera ya se para la pelcula.
TEXTO GIRATORIO
Con la herramienta texto escribimos una A, bastante grande. ma. Vamos a hacer que la letra gire sobre s mis-
Buscamos la relacin entre un smbolo y una lnea de tiempo. Una forma es convertir el fotograma en interpolacin de movimiento, decidir lo que tarda en girar, por ejemplo en 15 fotogramas, vamos a introducir en 15 un fotograma clave.
Si vamos al fotograma 1 nos permite cambiar color tinta, etc, pero si hacemos click en el fotograma cambia la barra de propiedades, y nos deja hacer cambios.
97
FLASH CS3
Si queremos poner la letra en otra posicin, si queremos que gire en el primer fotograma y en el ltimo tiene que estar en el mismo lugar. Para trabajar con letras no se hace sobre la lnea de tiempo de la pelcula, se hace de otra forma. Para hacer los giros sobre las letras vamos a modificar separar.
Lo distribuimos en capas
A la capa 1 le llamamos acciones.
98
FLASH CS3
la A
Nos olvidamos de todas las capas menos de
En vez de trabajar sobre la lnea de tiempo la convertimos en smbolo.
99
FLASH CS3
Modificamos la letra para que haga el giro, entramos en el smbolo con doble click en la letra A.
Ya estamos dentro del smbolo, en la escena 1 letra A, aparecen nuevas capas, podemos convertir el fotograma clave en interpolacin de movimiento, y colocamos el giro en 15 fotogramas.
100
FLASH CS3
Vamos al 1, y le damos el giro,
Nos colocamos en el fotograma 16, ponemos uno clave, vamos a acciones y paramos el movimiento con stop. Hacemos lo mismo para todas las letras, cada una en su capa. Y vamos a la escena, movemos las letras para que aparezca una detrs de otra
101
FLASH CS3
Para que las letras nos queden tenemos que igualar los fotogramas con f5

Flash

Cargado por

Información del documento

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Flash

Cargado por

Copyright:

Formatos disponibles

FLASH CS3

Abrimos un achivo nuevo

Es una mezcla extraa entre illustration y Dreamweaver.

Funciona como el illustration con color de relleno y de trazo.

Si miramos el fotograma 1, aparece un rectngulo gris con un punto negro

Le damos nombre a la capa. Con doble click en capa 1

Si queremos un cambio en la animacin, vamos al fotograma nmero dos

Insertamos un nuevo fotograma clave dando a la tecla f6

Vamos haciendo los movimientos. La barra de tiempo nos va dando datos.

Nos colocamos en el fotograma y le damos f6 Aparece el rectngulo con en circulo

Para dibujar un personaje, lo segundo tapa a lo primero, y en este caso se lo come.

Si seleccionamos el valo y lo movemos, se comi el rectngulo.

Dibujamos un valo y tambin lo agrupamos. Lo podemos mover sin que lo recorte.

REALIZACIN DE UN RATN CON MOVIMIENTO

Si dibujamos un ratn. Hacemos un rectngulo

Seleccionamos la esquina de arriba sin tenerlo seleccionado, y nos llevamos la esquina

Construimos las orejas.

Le damos a alt y se duplica, para simetra va-

Si queremos mandar una de las orejas a la parte de atrs.

Si queremos girar alguna de las orejas

Los agrupamos para poder ponerlos encima

Montamos los bigotes encima del ratn

Deja escoger un pincel en el lateral y dibuja formas libres.

Para cambiar el tamao de pincel.

El bigote lo podramos pintar con el pincel. Hacemos el rabo

Seleccionamos todo el ratn y lo agrupamos

Si hacemos doble click dentro de la oreja se le puede cambiar el color y la forma

Si pulsamos en escena, volvemos a la situacin inicial del grupo

Ahora dibujamos un queso, con la otra capa oc-

Una vez dibujado lo agrupamos. Lo transformamos y activamos la capa del ratn

Ahora el ratn se da la vuelta y se marcha.

Al guardar el archivo, el programa lo guarda ya como una pelcula.

HERRAMIENTA FLECHA NEGRA

El programa detecta zonas huecas y rellena.

El estado inicial y el final es el mismo, si en el 15 seleccionamos la forma y cambiamos las coordenadas.

Tambin se puede cambiar el color y tambin lo interpola. Si queremos volver al principio.

Dibujamos un rectngulo sin trazo con unas dimensiones.

El dibujo deja de ser forma y pasa a ser un smbolo

Si queremos que vaya a la otra esquina de la pantalla le cambiamos la coordenada.

Puedo girar la figura indicando un sentido.

Gira una vez sobre el desplazamiento.

Nos deja escoger color

Y se vuelve a convertir en una forma

Con las interpolaciones los movimientos son rectilneos.

Vamos a hacer una animacin

Convierte el puntero del ratn en un texto.

Se puede trabajar de dos maneras, haciendo click en la pantalla y escribiendo.

Separa el texto en letras individuales.

Si volvemos a separar una letra lo separo en formas

Nos colocamos en el fotograma nmero 20 para que haga el efecto y damos a f6

En el fotograma nmero 40 quiero que vuelva a lo inicial me pongo en el.

Volvemos al fotograma nmero 20 para aplicar los efectos.

TRABAJO CON FOTOS

A la foto le llamamos Corua 1 le damos nombre a la capa

Ya nos aparece un fotograma clave en el 1, Creamos una interpolacin de movimiento

La foto desaparece. stes efectos se hacen superpuestos. Localizamos otro foto

Localizamos la carpeta que tenemos de sitio en Internet, y lo guardamos.

Lo guardamos como swf, aparece un por defecto, sale un asistente.

COLOCACIN DE ARCHIVOS FLASH EN DREAMWEAVER

Creamos un documento HTML, y creamos una estructura. Guardamos la pgina

Insertamos tabla de dos filas dos columnas y ancho 800

Insertamos tabla de dos filas dos columnas y ancho 800

Centramos la tabla con ella seleccionada

Seleccionamos la primera celda y le damos el ancho.