View
226
Download
0
Category
Preview:
Citation preview
8/4/2019 Introduccion a Adobe Flash Cs5 2011
http://slidepdf.com/reader/full/introduccion-a-adobe-flash-cs5-2011 1/11
C.P.F. “Santa María de Jesús”
MANUAL DE ADOBE FLASH CS5
Profesor: Yhonny Mitac Julca
“Promoviendo una Educación Humanista”
8/4/2019 Introduccion a Adobe Flash Cs5 2011
http://slidepdf.com/reader/full/introduccion-a-adobe-flash-cs5-2011 2/11
C.P.F. “Santa María de Jesús” “Promoviendo una Educación Humanista”
Prof. Yhonny MItac Julca 2
¿QUÉ ES FLASH?
Flash Professional CS5 es una potente herramienta desarrollada por Adobe que ha superado las mejores
expectativas de sus creadores. Flash fue creado con el objeto de realizar animaciones y diseños vistosos
para la web, y gráficos interactivos.
Las posibilidades de Flash son extraordinarias, con cada nueva versión se han mejorado y simplificado las
herramientas, y cada vez es posible lograr mejores efectos con menos trabajo. Aunque su uso más
frecuente es el de crear animaciones sus usos son muchos más.
Durante mucho tiempo, Flash consiguió hacer posible lo que más se echa en falta en Internet: Dinamismo, y
con dinamismo no sólo nos referimos a las animaciones, sino que Flash permite crear aplicaciones
interactivas que permiten al usuario ver la web como algo atractivo, no estático. Con Flash podremos crear
de modo fácil y rápido desde animaciones simples para lograr algunos efectos visuales, hasta aplicaciones
complejas, como juegos .
EL ESPACIO DE TRABAJO DE FLASH
El espacio de trabajo predeterminado que “viene” con Flash es el Clásico. Probablemente al abrir el
programa te vas a encontrar con un panel de herramientas a tu izquierda, la línea de tiempo en la parte
superior, y finalmente a tu derecha el panel de propiedades. Y claro, en el centro el “lienzo” sobre el cual
vamos a trabajar.
Vamos al menú Ventana > Espacio de trabajo y seleccionemos la opción Nuevo espacio de trabajo. Va aaparecer una ventanita donde te pedirá un nombre para el espacio de trabajo. Escoge un nombre y click en
Aceptar. Ahora puedes cambiar tu espacio de trabajo como más te guste. En el menú Ventana puedes
elegir los paneles que quieras tener en el escenario, para luego organizarlos como tú quieras.
¿QUÉ ES ACTIONSCRIPT ?
ActionScript es el lenguaje de programación que ha utilizado Flash desde sus comienzos, y que por
supuesto, emplea Flash CS5. A grandes rasgos, podemos decir que el ActionScript nos permitirá realizar
con Flash CS5 todo lo que nos propongamos, ya que nos da el control absoluto de todo lo que rodea a unapelícula Flash. Absolutamente de todo.
CARACTERISTICAS PRINCIPALES
• Como ya hemos comentado, el ActionScript es el lenguaje de programación propio de Flash. El ActionScript está basado en la
especificación ECMA-262, al igual que otros lenguajes como Javascript.
• ActionScript es, como su nombre indica, un lenguaje de script, esto quiere decir que no hará falta crear un programa comple to para
conseguir resultados, normalmente la aplicación de fragmentos de código ActionScript a los objetos existentes en nuestras películas
nos permiten alcanzar nuestros objetivos.
8/4/2019 Introduccion a Adobe Flash Cs5 2011
http://slidepdf.com/reader/full/introduccion-a-adobe-flash-cs5-2011 3/11
C.P.F. “Santa María de Jesús” “Promoviendo una Educación Humanista”
Prof. Yhonny MItac Julca 3
LAS HERRAMIENTAS Y SUS UTILIDADES
Herramienta de Selección (V) úsala para seleccionar,
mover y deformar objetos (si mantienes presionado el
botón izquierdo del ratón y lo arrastras, puedes hacer
una selección rectangular)
Herramienta de Subselección (A) úsala para
modificar objetos por sus nodos
Herramienta de Transformación Libre (Q) úsala
para aumentar o disminuir el tamaño de objetos (para
aumentar o disminuir proporcionalmente, mantén
presionada la tecla Shift)
Herramienta de Transformación de Degradado (F)
(surge al mantener presionado el botón de la
herramienta de Transformación Libre úsala para
modificar degradados.
Herramienta de rotación 3D (W) y herramienta de
Traslación 3D (G) (sólo compatibles con actionscript
3.0) úsalas para transformar objetos simulando 3D
Herramienta Lazo (L) úsala para hacer selecciones a
mano alzada.
Herramienta Pluma (P) úsala para dibujar líneas
rectas o curvas.
Herramienta Añadir punto de Ancla (+) úsala para
añadir un punto de ancla en una línea (te permite
curvarla).
Herramienta Eliminar punto de Ancla (-) úsala para
eliminar un punto de ancla en una línea curva.
Herramienta Convertir punto de Ancla (C) te
permite modificar los puntos de ancla para así modificar
la curvatura de una línea.
Herramienta Texto (T) úsala para introducir un texto.
Herramienta Línea (N) úsala para dibujar una línea
recta (para dibujar una línea totalmente horizontal,
vertical o en diagonal, mantén presionada la tecla Shift)
Herramienta Rectángulo (R) úsala para dibujar un
rectángulo (para dibujar un cuadrado perfecto mantén
presionada la tecla Shift).
Herramienta Óvalo (O) úsala para dibujar un óvalo
(para dibujar un círculo perfecto mantén presionada la
tecla Shift)
Herramienta Rectángulo Simple (R) te permite
dibujar un rectángulo o cuadrado y curvar fácilmente sus
vértices.
Herramienta Óvalo Simple (O) te permite dibujar un
óvalo o círculo y cortarlo fácilmente (para que quede
una especie de “pacman” o pizza )
8/4/2019 Introduccion a Adobe Flash Cs5 2011
http://slidepdf.com/reader/full/introduccion-a-adobe-flash-cs5-2011 4/11
C.P.F. “Santa María de Jesús” “Promoviendo una Educación Humanista”
Prof. Yhonny MItac Julca 4
Herramienta PolyStar úsala para dibujar polígonos
regulares o estrellas (modifica las propiedades en el
panel propiedades).
Herramienta Lápiz ( Y) úsala para dibujar líneas a
mano alzada.
Herramienta Pincel (B) úsala para dibujar líneas (que
funcionan como rellenos) a mano alzada.
Herramienta Rociador (B) úsala para “rociar” formas
(que son símbolos en la biblioteca) sobre el escenario.
Herramienta Deco (U) permite incorporar una
decoración en el escenario (puede interpolarse).
Herramienta Hueso (X) y herramienta Vinculación (Z)
(sólo compatibles con actionscript 3.0) permiten
simular el movimiento del esqueleto humano (es una
herramienta muy interesante para animar personajes y
darles cierto realismo).
Herramienta Cubo de pintura (K) úsala para agregar
relleno a una forma cerrada compuesta por una línea, o
bien para cambiar el color de un relleno ya existente.
Herramienta Bote de tinta (S) úsala para agregar
borde a un relleno, o bien para cambiar el color de un
borde ya existente.
Herramienta Cuentagotas (I) úsala para seleccionar
un color y automáticamente pasar a la herramienta
Cubo de pintura.
Herramienta Borrador (E) úsala para borrar rellenos
y/o bordes (al seleccionarlo aparecerán tres botones:
uno sirve para regular el grosor, otro para seleccionar
qué borrar, y una canillita para borrar un objeto entero.
Herramienta Mano (H) úsala para deslizarte a lo largo
del escenario (también puede utilizarse manteniendo
presionada la barra espaciadora).
Herramienta Zoom (M) es una lupa (manteniendo
presionado Alt “aleja”). Además de la lupa puedes
presionar Ctrl + “+” para “acercar” o Ctrl + “-“ para
“alejar”.
Debajo de estas herramientas hay un “lapicito” que sirve
para seleccionar el color de borde, el alfa
(transparencia) o si prefieres que el objeto no tenga
borde. A su lado hay un cubo de pintura para
seleccionar el color de relleno, el alfa o si prefieres que
el objeto no tenga relleno.
8/4/2019 Introduccion a Adobe Flash Cs5 2011
http://slidepdf.com/reader/full/introduccion-a-adobe-flash-cs5-2011 5/11
C.P.F. “Santa María de Jesús” “Promoviendo una Educación Humanista”
Prof. Yhonny MItac Julca 5
DEGRADADOS Y PANEL DE COLOR
Si no tienes este panel en el espacio de trabajo ábrelo en el menú Ventana.
Click en el botón de relleno y selecciona el pequeño rectángulo con el degradado de blanco a negro. Verás
que puedes modificar este degradado agregando puntos y colores, moviéndolos, cambiándolos de color o
eliminándolos (presionando Ctrl).
Una vez que te guste el resultado puedes modificar el degradado con la herramienta Transformación de
degradados (puedes girarlo, achicarlo, torcerlo, etc).
BIBLIOTECA
Si no tienes este panel en el espacio de trabajo ábrelo en el menú
Ventana. En la biblioteca se encuentran los símbolos y las
imágenes, videos, sonidos o lo que sea que importes para
incorporar al escenario.
Para importar un archivo a la biblioteca debes ir al menú Archivo >
Importar > Importar a biblioteca y seguido de ello seleccionas el
archivo. Para importar video debes elegir la opción Importar video.
Para insertar un nuevo símbolo (que puede ser un Clip de película,
Botón o Gráfico) ve al menú Insertar > Nuevo símbolo, o bien
presiona Ctrl+F8. Dale un nombre, selecciona el tipo de símbolo y
clickea Aceptar. Vas a “entrar” automáticamente al símbolo creado,
y ahora puedes modificar dicho símbolo. Una vez que hayas
terminado de modificar el símbolo a tu gusto, vuelve a la Escena
8/4/2019 Introduccion a Adobe Flash Cs5 2011
http://slidepdf.com/reader/full/introduccion-a-adobe-flash-cs5-2011 6/11
C.P.F. “Santa María de Jesús” “Promoviendo una Educación Humanista”
Prof. Yhonny MItac Julca 6
principal y para incorporar el símbolo en el escenario ve a la biblioteca y arrástralo desde allí.
CLIP DE PELÍCULA / MOVIECLIP / “MC”
Puedes incorporar en él Interpolaciones de Movimiento (ya veremos más tarde qué son), otros símbolos o lo
que tú quieras.
BOTÓNTienes en él cuatro estados: Reposo, que es cuando no tiene “encima” al cursor; Sobre, que es cuando el
cursor está “encima” del botón; Presionado, que es cuando el usuario mantiene presionado el botón
izquierdo del ratón; por último la Zona Activa, que en realidad no se ve, allí puedes dibujar un rectángulo de
cualquier color para indicar qué partes del escenario pertenecen al botón.
PANEL DE PROPIEDADES
Si no tienes este panel en el espacio de trabajo ábrelo en el menú Ventana, o bien presionando Ctrl + F3.
Aquí puedes cambiar las propiedades de cualquier objeto, interpolación, símbolo, relleno, borde o lo que
sea. Puedes darles nombres de instancia a los símbolos, lo cual te va a servir de mucho cuando tengas que
programar con actionscript; puedes agregar filtros a los textos y clips de película (ya sean sombras,
desenfocados, iluminados, bisel, etc.); puedes cambiar las propiedades de color de los clips de película o
botones (alfa, tinta, brillo, etc.); puedes cambiar los tipos de letra, tamaños y colores de los textos; incluso
puedes agregar efectos a las interpolaciones de movimiento y forma.
CÓMO CAMBIAR LAS PROPIEDADES DEL DOCUMENTO
En cualquier lugar vacío del escenario da click derecho + Propiedades del documento. Ahí puedes variar el
tamaño del “lienzo”, color de fondo, fps y unidad de regla.
8/4/2019 Introduccion a Adobe Flash Cs5 2011
http://slidepdf.com/reader/full/introduccion-a-adobe-flash-cs5-2011 7/11
C.P.F. “Santa María de Jesús” “Promoviendo una Educación Humanista”
Prof. Yhonny MItac Julca 7
CAPAS
Te permiten organizar los distintos “componentes” de tu película (fondo, textos, animaciones, o lo que
necesites).
LÍNEA DE TIEMPO
8/4/2019 Introduccion a Adobe Flash Cs5 2011
http://slidepdf.com/reader/full/introduccion-a-adobe-flash-cs5-2011 8/11
C.P.F. “Santa María de Jesús” “Promoviendo una Educación Humanista”
Prof. Yhonny MItac Julca 8
INTERPOLACIONES
Se podría decir que llegamos a la parte más importante de esta guía. Acá se juntan todos los otros
conceptos para poder animar . Tenemos dos tipos diferentes de interpolación: Interpolación de movimiento e
interpolación de forma. Son bastante diferentes, la primera sirve para “mover” (como su nombre lo indica)
símbolos, sean botones, MC o gráficos, y la segunda sirve para cambiar color o forma de un objeto que no
es un símbolo. Vamos a ver cada una por separado.
INTERPOLACIÓN DE MOVIMIENTO
¿Qué es?
Una forma de animar objetos, los cuales deben ser Clips de película.
¿Qué varía del objeto?
Podemos variar el tamaño, posición en el escenario, color (mediante el panel de propiedades) o filtros.
¿Cómo se aplica?
Primero que nada seleccionamos el objeto que queremos animar, y presionamos F8 para convertirlo en un
Clip de Película. Seguido de eso insertamos un fotograma clave en el fotograma que queramos (click
derecho en el fotograma + “Insertar fotograma clave”). En este fotograma hacemos las variaciones que
queramos hacerle al clip de película. Entre el fotograma 1 y el fotograma “x” donde se encuentren las
variaciones del clip, hacemos click derecho y seleccionamos la opción “Crear interpolación clásica” (más
tarde veremos la nueva interpolación de movimiento para flash CS4 y CS5). Y ya está, podemos ver el
resultado presionando Ctrl + Enter para probar la película.
¿Qué pasa si yo quiero que pare la animación al terminar?
Para eso hace falta algo de actionscript básico. En una nueva capa, al final de la animación insertamos un
fotograma clave (F6), abrimos el panel de acciones (si no está en el espacio de trabajo lo abrimos el menú
ventana (o bien presionando F9), y escribimos esto:
Código :
stop();
Con este sencillo código (compatible con actionscript 1.0, 2.0 y 3.0) ya logramos que la película se detenga.
8/4/2019 Introduccion a Adobe Flash Cs5 2011
http://slidepdf.com/reader/full/introduccion-a-adobe-flash-cs5-2011 9/11
C.P.F. “Santa María de Jesús” “Promoviendo una Educación Humanista”
Prof. Yhonny MItac Julca 9
GUÍAS DE MOVIMIENTO
Si quieres que el clip siga un recorrido puedes utilizar las guías de movimiento.
Para aplicar una guía, debes de seguir los mismos pasos que los que sigues para aplicar una interpolación
de movimiento clásica. Luego de aplicar la interpolación, en una nueva capa dibuja con el lápiz, o con la
herramienta de línea, el recorrido que quieres que siga tu clip (debe ser una línea que tenga un extremo
“tocando” al clip en el fotograma 1 y el otro extremo “tocándolo” en el fotograma “x” donde termina la
interpolación). Selecciona la capa de la guía, da click derecho y selecciona la opción “Guía”. Corrobora que
la capa de abajo (interpolación) sea modificada por la capa de arriba, si no lo es, arrástrala hacia arriba.
Prueba la película con Ctrl + Enter.
NUEVA INTERPOLACIÓN DE MOVIMIENTO
Esta interpolación apareció con el Adobe Flash CS4 y ahora perdura en el CS5. No tiene muchas
diferencias con el anterior, pero la manera de aplicarla es distinta y las guías de movimiento se incluyen
automáticamente en la misma capa, y es más sencillo modificarlas.
Para aplicar la interpolación clásica hacía falta insertar un fotograma clave de inicio y un fotograma clave de
fin. Ahora nos ahorramos un paso, ya que sólo debemos insertar el fotograma clave de inicio, dar click
derecho al fotograma o al clip, seleccionar Crear Interpolación de Movimiento y Flash automáticamente
inserta más fotogramas. Para que el clip de película se “mueva”, o sea que tenga un cambio por el cual
quieres aplicarle una interpolación, debes de ir al último fotograma (o a cualquiera de los que abarque la
interpolación) y mover o cambiar las características del clip.
Qué pasa con las guías de movimiento. Ahora flash las incluye automáticamente en la misma capa, de un
color fluorescente, y es más sencillo manipularlas.
Abre un nuevo documento.
Dibuja un cuadrado o un óvalo y conviértelo en símbolo con F8. Dale cualquier nombre y selecciona de
tipo clip de película.
Dale clic derecho al clip recién creado y selecciona la opción Crear interpolación de movimiento
(automáticamente Flash insertará más fotogramas).
Si quieres prolongar o achicar la interpolación, simplemente ve al último fotograma de la misma y verás
que aparece un cursor diferente para variar la duración.
Ahora ve al último fotograma de la interpolación y mueve el clip de película hacia la derecha o hacia la
izquierda y aumenta su tamaño (presiona Q).
Vas a ver que apareció una línea de puntos de un color fluorescente, esa es la guía de movimiento y
puedes manipularla fácilmente con el ratón.
Pon un stop en el último fotograma de una nueva capa.
Prueba la película con Ctrl+Enter
8/4/2019 Introduccion a Adobe Flash Cs5 2011
http://slidepdf.com/reader/full/introduccion-a-adobe-flash-cs5-2011 10/11
C.P.F. “Santa María de Jesús” “Promoviendo una Educación Humanista”
Prof. Yhonny MItac Julca 10
Interpolación de forma
¿Qué es?Una forma de animar objetos, que no pueden ser símbolos, textos (para aplicarles una interpolación de
forma hay que separarlos con click derecho + separar) u objetos agrupados (deben ser separados al igual
que los textos).
¿Qué varía del objeto?
Puede variar el color, tamaño, posición y forma del objeto.
¿Cómo se aplica?
Dibujamos o incorporamos el objeto en el escenario. Insertamos un fotograma clave en el fotograma que
queramos (click derecho en el fotograma + “Insertar fotograma clave”). En este fotograma hacemos las
variaciones que queramos hacerle al objeto. Entre el fotograma 1 y el fotograma “x” donde se encuentren
las variaciones del mismo, hacemos click derecho y seleccionamos la opción “Crear interpolación de forma.
Y ya está, podemos ver el resultado presionando Ctrl + Enter para probar la película.
¿Qué pasa si yo quiero que pare la animación al terminar?
Utilizamos el código stop(); aprendido anteriormente.
Ejemplo de interpolaciones
Interpolaciones de movimiento (archivo .fla): http://www.megaupload.com/?d=U6IO2HX7
Interpolaciones de forma (archivo .fla): http://www.megaupload.com/?d=3D3AA3VP
Máscaras
Otra herramienta interesante del Flash son las máscaras. Las máscaras sirven para mostrar sólo una
determinada parte de lo que se encuentra en la capa inferior. Si yo en una capa dibujo un rectángulo, en la
capa “de abajo” tengo una foto, y a la capa del rectángulo la defino como máscara, de la foto se va a ver
sólo la parte que sea abarcada por el rectángulo. El rectángulo no se va a ver, sea del color que sea o tenga
el alfa que tenga, sólo se va a ver una parte de la foto. Para que entiendas bien pondré un ejemplo.
Supongamos que quieres hacer un sencillo efecto de lupa con una interpolación de movimiento. Tienes el
dibujo de la lupa animada (por ejemplo que va de un lado a otro) en una capa, en otra tienes una imagen o
un texto pequeño y en una última capa tienes la misma imagen o texto pero más grande. ¿Cómo se hace
para lograr el efecto de lupa?
8/4/2019 Introduccion a Adobe Flash Cs5 2011
http://slidepdf.com/reader/full/introduccion-a-adobe-flash-cs5-2011 11/11
C.P.F. “Santa María de Jesús” “Promoviendo una Educación Humanista”
Prof. Yhonny MItac Julca 11
Vamos a ver...
Para conseguir el efecto debes tener el dibujo de una lupa en una capa. Esta lupa la vas a animar para que
parezca que alguien la está moviendo de un lado a otro. En otra capa debes tener el círculo que funciona
como lupa, es decir la máscara. En otra capa vas a tener el dibujo grande, que será lo que se verá sólo al
pasar la lupa por encima. Y en una última capa vas a tener el dibujo pequeño. Es decir que la estructura es
la siguiente:
Dibuja la lupa en la capa del dibujo de la lupa, dibuja un círculo en la capa de la lupa, dibuja, por ejemplo,
una flor grande en la capa del dibujo grande y por último, una flor chica en la capa del dibujo pequeño (copiala flor grande, en la capa de la flor chica presiona Ctrl+Shift+V para pegarla en el mismo lugar y achícala
con la herramienta de transformación libre). Ahora aplícale una interpolación de movimiento a las dos
primeras capas (ten cuidado, la lupa y el dibujo de la lupa deben moverse al mismo tiempo, en la misma
dirección y del mismo modo).
Ahora, si pruebas película con Ctrl+Enter no vas a ver el efecto que esperamos, porque aún no aplicaste la
máscara. Para aplicarla, dale click derecho a la capa de la lupa y tilda la opción Máscara. Ahora sí, puedes
probar película .
Aquí está el archivo por si lo quieres bajar (formato .fla): http://www.megaupload.com/?d=ZBOHGCCQ
Ahora ya sabes todo lo básico de Flash, ya estás en condiciones, por ejemplo, de hacer un banner sencillo.
El resto depende de ti, depende de que estudies Actionscript para poder programar.
Depende de que abras Adobe Flash y te pongas curios@ a ojear todas las herramientas que no describí
aquí porque me llevaría 200 páginas más . Hay tips interesantes como lo que ya te mencioné de
mantener presionado Shift para cuadrados o círculos perfectos, el “pegar in situ” o “pegar en el mismo lugar”
(Ctrl+Shift+V), entre otros.
Espero que esta guía te haya servido de ayuda .
“Pueblo que escucha, pueblo que ora”
Recommended