27
Curso Básico De Flash 8 (Conceptos Básicos De Flash) Parte 1 Bienvenido Al Curso Básico De Flash 8 , este curso esta dirigido particularmente a personas que están iniciando con el aprendizaje de flash, y aquí aprenderás desde como crear un documento nuevo , la utilización de las principales herramientas , también aprenderás a utilizar los principales paneles de diseño , al finalizar el curso sabrás como hacer visibles los paneles y herramientas de diseño web con el método de teclas , el método del teclado hace que los trabajos se realicen con mayor prontitud. También aprenderás los conceptos básicos que se manejan en la línea de tiempo y hasta como hacer animaciones de textos y aplicación de botones . Una vez que hayas concluido con la totalidad del Curso Básico Flash 8 tendrás los suficientes argumentos como para comenzar hacer pequeñas animaciones en forma semiprofesional, estas animaciones las podrás colocar sin ningún problema el en los diferentes portales que existen en Internet de forma gratuita. 1. Conceptos Básicos De Flash Descripción De Flash Macromedia Flash Professional 8 , le proporciona todas las herramientas necesarias para crear y publicar diseños y animaciones en la web en forma profesional. Con Flash puedes llegara crear desde aplicaciones básicas de animación hasta complejas aplicaciones con contenido Web ( paginas web ). Macromedia Flash Professional 8 es un programa esencialmente para hacer animaciones vectoriales , sin embargo, también se pueden crear aplicaciones de Flash con una amplia variedad de contenido multimedia que incluye imágenes , sonido , vídeo y efectos especiales . Si solo son incluidas animaciones vectoriales, puedes utilizar las herramientas de Flash como

Curso básico de flash 8

Embed Size (px)

Citation preview

Page 1: Curso básico de flash 8

Curso Básico De Flash 8 (Conceptos Básicos De Flash) Parte 1

Bienvenido Al Curso Básico De Flash 8, este curso esta dirigido particularmente a personas que están iniciando con el aprendizaje de flash, y aquí aprenderás desde como crear un documento nuevo, la utilización de las principales herramientas, también aprenderás a utilizar los principales paneles de diseño, al finalizar el curso sabrás como hacer visibles los paneles y herramientas de diseño web con el método de teclas, el método del teclado hace que los trabajos se realicen con mayor prontitud. También aprenderás los conceptos básicos que se manejan en la línea de tiempo y hasta como hacer animaciones de textos y aplicación de botones. Una vez que hayas concluido con la totalidad del Curso Básico Flash 8 tendrás los suficientes argumentos como para comenzar hacer pequeñas animaciones en forma semiprofesional, estas animaciones  las podrás colocar sin ningún problema el en los diferentes portales que existen en Internet de forma gratuita.

1. Conceptos Básicos De Flash

Descripción De Flash

Macromedia Flash Professional 8, le proporciona todas las herramientas necesarias para crear y publicar diseños y animaciones en la web en forma profesional. Con Flash puedes llegara crear desde aplicaciones básicas de animación hasta complejas aplicaciones con contenido Web (paginas web). Macromedia Flash Professional 8 es un programa esencialmente para hacer animaciones vectoriales, sin embargo, también se pueden crear aplicaciones de Flash con una amplia variedad de contenido multimedia que incluye imágenes, sonido, vídeo y efectos especiales. Si solo son incluidas animaciones vectoriales, puedes utilizar las herramientas de Flash como son (línea, óvalo, rectángulo polígono, etc.), si son utilizadas este tipo de herramientas vectoriales el peso (kbs) del archivo será mas ligero a la hora de que este sea publicarlo en la web, sin embargo, si son incluidas animaciones con imágenes las cuales tengan extensión jpg, gif, png, mapa de bits, etc. el peso (kbs) de los archivos resultara ser mas pesado y por lo tanto tardara más tiempo en ser visualizado en la web. Flash Professional 8 es una poderosa herramienta de con la que podrás diseñar y desarrollar grandes presentaciones (Animaciones, Juegos, InterfacesdeNavegación.), Los proyectos de Flash pueden abarcar desde simples animaciones hasta contenido de vídeo.

Creación De Documentos

Para comenzar a trabajar con Macromedia Flash Professional 8, lo primero que debes de tomar en cuenta es la creación del documento en cual vas a desarrollar la presentación, los pasos a seguir son los siguientes, primero te mostrare una ruta larga en la cual se describen los tipos de documentos que contiene Macromedia Flash Professional 8.

Page 2: Curso básico de flash 8

Seccionar Archivo >> Nuevo

Una vez que das enter (clic) en el paso dos, se te presentara una nueva ventana en la cual te pedirá que selecciones el tipo de documento flash que quieras utilizar.

Los tipos de documentos son: Documento de Flash, Presentación de Flash, Aplicación de formularios Flash, Archivo Action Script, Archivo comunic. Action Script, archivo JavaScript de Flash y Proyecto de Flash.

Cada uno de estos documentos tiene una finalidad específica. Sin embargo, en esta ocasión solamente nos enfocaremos al Documento de Flash.

Haga clic en Aceptar y aparecerá la forma del documento predeterminada por Macromedia Flash Professional 8.

El documento predeterminado incluye el nombre del documento (Sin título-1). El tamaño del documento (550 x 400 píxeles). El color de Fono del documento (blanco “#FFFFFF”). Los colores se representa por el símbolo # y luego una secuencia de de seis letras y

números alternados Ej. para el color rojo la secuencia es #FF0000. Una forma más rápida para crear un documento Flash es simplemente presionar las

teclas de ctrl. + N.

Page 3: Curso básico de flash 8

Propiedades Del Documento

En escasas ocasiones se trabaja con documentos con características de tamaño, color de fondo, velocidad de fotogramas etc. predeterminadas por Macromedia Flash Professional 8. Así que tendrás que aprender a editar las características del diseño preestablecido por Macromedia Flash Professional 8. Para modificar las características del documento se siguen los uno de los procedimientos siguientes.

El primero de los procedimientos es Modificar >> Documento. Este procedimiento tal vez resulte el más largo, pero nunca esta demás conocer más

de una forma para obtener un fin.

Page 4: Curso básico de flash 8

La segunda opción es simplemente hacer clic en el espacio de Tamaño de la barra de Propiedades, si colocas el cursor sobre el espacio señalado en la imagen aparecerá la leyenda (Propiedades del documento).

La tercera opción es la más fácil porque solamente tienes que presionar ctrl. + J. esta opción también puede resultar la más complicada de seguir ya que tienes que recordar el comando.

Una vez que utilices una de las opciones antes mencionadas aparecerá el cuadro de dialogo Propiedades del documento, en el cual modificaras propiamente el documento. Este cuadro de Propiedades de documento tiene varias opciones.

Este cuadro de Propiedades de documento tiene varias opciones a modificar, la primera de ellas es que puedes incluir un Titulo (nombre) para el archivo swf, con este nombre será más fácil de localizar tu archivo por los buscadores web.

También puedes incluir una breve descripción del archivo, esto hará que el archivo contenga más datos y de esta forma serás más popular en la web.

En las casillas de Dimensiones de (ancho y alto), podrás modificar el tamaño del documento. Por el momento trabajaras con un documento de dimensiones 300 px X 300 px de ancho y alto.

Para cambiar el Color de fondo del archivo, solamente hacer clic en el recuadro del color y de esta forma cambiaras el color. En este caso usar como color de fondo (azul o bien #0000FF).

La velocidad de fotogramas es de suma importancia para animaciones las cuales están programadas con código ActionScript en las cuales la transición tiene que avanzar rápido o disminuir la velocidad. Este concepto se describirá con más detalle en capítulos siguientes.

Por ultimo podrás modificar la opción de Unidades de regla, en las cuales se incluyen: Pulgadas, Pulgadas (decimales), Puntos, Centímetros, Milímetros y Píxeles. Las Unidades de regla que se recomiendan usar son los Píxeles.

Page 5: Curso básico de flash 8

Al aceptar las propiedades del documento antes descritas se te presentara de forma inmediata la siguiente imagen en la cual se te describen las propiedades del documento.

Estas son Tamaño del documento (dimensiones), Fondo (color de fondo), Velocidad de fotogramas (fps), nombre del documento, así también se te presenta la barra de herramientas.

Page 6: Curso básico de flash 8

Hasta este punto cuantas con la información necesaria para crear y modificar las diferentes características de un documento de Macromedia Flash Professional 8, en el siguiente punto de este capitulo veras la descripción de las herramientas de trabajo más utilizadas en Macromedia Flash Professional 8.

Curso Básico De Flash 8 (Herramientas De Trabajo) Parte 2

Descripción Herramientas De Trabajo.

Las herramientas de Macromedia Flash Professional 8 proporcionan una gran variedad de ayuda cuando se trabaja en animaciones con vectores líneas, textos, óvalos, rectángulos. Flash también incorpora herramientas con las cuales puedes editar los vectores dibujados en cuanto a Color de relleno o Color de degradado. Con el fin de hacer más práctico la utilización de las herramientas de flash te menciono como invocar las diferentes herramientas desde el teclado. A continuación te presento una descripción de las herramientas más usadas en flash.

La primera herramienta que se describirá es la Herramienta De Selección, ya que es la que aparece seleccionada por defaul. Esta herramienta es de gran ayuda por que es la que mueve a los objetos dibujados o imágenes a través del escenario, te ayuda a editar las formas que selecciones en cuanto a color tamaño etc, también mueve los objetos de la biblioteca a la escena. Cuando tengas seleccionada otra herramienta por ejemplo la Herramienta De Texto y quieras la Herramienta De Selección para que no te desplaces hasta el panel de herramientas vasta con que presiones la letra V en el teclado.

La segunda herramienta que se describirá es la Herramienta De Línea. Como el nombre lo menciona sirve para dibujar líneas rectas las cuales puedes modificar a líneas curvas con la ayuda de la Herramienta De Selección. La forma rápida para invocar la Herramienta Línea es la letra N en el teclado.

Herramienta Texto con ella podrás introducir 3 clases de campos de texto, el más común es el campo de Texto extático con este tipo de texto podrás realizar animaciones en la línea de tiempo. Los otros dos tipos de campos de textos son el Texto dinámico e Introducción de texto estos tipos de texto siempre van acompañados de código ActionScript por la complejidad para trabajar con este tipo de texto, solamente se realizaran animaciones con campos de Texto estático. Forma rápida para invocar la herramienta de texto es la letra T en el teclado.

La Herramienta De Óvalo sirve para dibujar círculos perfecto (10×10 píxeles), u óvalos (10×30 píxeles). Para invocar la Herramienta De Óvalo en forma rápida es la letra O en el teclado.

Herramienta De Rectángulo, con ella podrás dibujar cuadrados perfectos (10×10 píxeles) o bien rectángulos (10×30 píxeles), con la ayuda de una Herramienta Para El Rectángulo te ayudara a dar bordes redondeados, en su momento se explicara a detalle el manejo de

Page 7: Curso básico de flash 8

esta sub herramienta. Si dejas presionado la herramienta de rectángulo aparecerá una herramienta diferente la cual es PolyStar y te ayudara a dibujar formas de Estrellas o formas de Polígonos (pentágonos, hexágonos, etc.). forma rápida de invocar la Herramienta De Rectángulo es presionar la letra R.

Las Herramientas De Bote De Tinta letra S en el teclado y Cubo De Pintura letra K en el teclado, sirven para modificar el color del borde y el color de relleno de la forma dibujada respectivamente. No es muy recomendable usar estas herramientas desde este panel, en lo particular modifico los colores de relleno y borde desde el panel de propiedades en su momento lo explicare a detalle.

Por ultimo te daré una descripción de la Herramienta De Transformación De Relleno. Esta herramienta muy útil cuando se usan colores degradados ya que modifica la perspectiva del degradado. La forma rápida para invocar esta herramienta es la letra F en el teclado.

Paneles más utilizados

Macromedia Flash Professional 8 dispone de una serie de paneles los cuales hacen que el trabajo para realizar animaciones sea más fácil y rápido de aprender. Estos paneles están agrupados en diferentes secciones, los diferentes paneles de los que dispone Macromedia Flash Professional 8 los podrás visualizar si haces clic en la Herramienta De Ventana. Los paneles más utilizados son: Propiedades, Biblioteca, Acciones, Mezclador de colores y Transformación. En el siguiente punto te daré una descripción de cada uno de estos paneles así como también una forma rápida para invocarlos.

Page 8: Curso básico de flash 8

Panel De Propiedades

En el Panel De Propiedades Se muestran las diferentes opciones que puedes llegar a editarle a una forma vectorial antes de dibujarla. Para invocar el panel de propiedades presionar ctrl. + F3. En el Panel De Propiedades están incluidos el panel de Filtros y Parámetros. Estos paneles son de mucha ayuda, sin embargo, estas herramientas no serán expuestas en la explicación.

Por ejemplo; cuando tienes seleccionada la Herramienta De Selección (V) en el Panel De Propiedades se te muestra el tamaño del escenario (dimensiones de documento), color de fondo y velocidad de fotogramas 12 fps, también se te muestra el tipo de versión que estas usado (Reproductor: 8 en este caso y la versión de ActionScript: 2).

Page 9: Curso básico de flash 8

Cuando seleccionas la Herramienta Línea (N) el panel te presenta el nombre de la herramienta, el color de línea y el tamaño de la línea.

Las propiedades que se presentan para la Herramienta Texto (T) son el tipo de texto (estático, dinámico e introducción de texto), color, tamaño, tipo de alineación, etc.

Las propiedades que presentan para la Herramientas Óvalo (O),

Herraminta Rectángulo (R)

Page 10: Curso básico de flash 8

y la Herramienta PolyStar

son similares ya que te muestran el color de línea (trazo), color de relleno, tamaño de trazo, tipo de trazo. En particular cada una de estas herramientas tiene una finalidad específica, en puntos subsecuentes se profundizara con más detalle cada una de estas herramientas, al hacer un ejercicio para cada una de ellas.

Panel Biblioteca

El Panel Biblioteca es donde se guardan y organizan los símbolos creados en Flash, El Panel De Biblioteca muestra en nombre del Documento, en este caso como aun no se a nombrado con un nombre especifico, flash le coloca el nombre de Sin título-1. también  te muestra los diferentes tipos de símbolos estos son Clip de película, Botón y Gráfico, flash nombra a los diferentes símbolos como Símbolo 1, Símbolo 2, Símbolo 3…n, sin embargo resulta más practico nombrar a cada uno de los símbolos con nombres especifico que describa o que esta colocado en cada uno de ellos. En su momento en el punto incorporación de símbolos se explicara con más detalle cual es la propiedad que tienen cada uno de los símbolos. Se pueden colocar tantos símbolos de cada tipo como sean necesarios para la realización de una animación. El Panel De Biblioteca también cuenta con la opción de Bote De Basura (eliminar) es de suma importancia para eliminar símbolos que no nos sean útiles solo basta con seleccionar el símbolo y luego presionar el Bote De Basura. La forma más rápida para invocar el panel de biblioteca es presionando ctrl. + L ó F11.

Page 11: Curso básico de flash 8

Panel De Acciones

En el Panel De Acciones se presentan las diferentes funciones de código ActionScript con las cuales puedes controlar la línea de tiempo, se puede agregar cogido ActionScript a símbolos tipo Botón, Clips de película y a Fotogramas. Hay dos formas para obtener las funciones de código la primera es presionar el signo de y de esta forma aparecerán las diferentes funciones. La segunda opción es presionar y luego hacer doble clic en los diferentes libros mostrados, las funciones de código ActionScript son las mismas en cualquiera de los dos casos. El título del panel Acciones cambia a Acciones – Botón, Acciones – Clip de película o Acciones – Fotograma, según el elemento que esté seleccionado. Para mostrar el Panel Acciones presionar F9.

Page 12: Curso básico de flash 8

Panel De Mezclador De Colores

El Panel De Mezclador De Colores es de gran utilidad cuando se trabaja con formas vectoriales (Óvalos o Rectángulos) los cuales tengan por color de relleno o color de trazo (borde) un degradado Lineal o Radial. Este panel además del los Tipos de Relleno (Ninguno, Sólido, Lineal, Radial y Mapa de bits ) también incluye la opción del Color Alfa con cual te puedes ayudar para hacer opacos los diferentes colores aplicados. Las opacidades Color Alfa van desde 0 % hasta 100 %. El Panel De Mezclador De Colores esta acompañado por el Panel De Muestras De Colores. Para la invocación del El Panel De Mezclador De Colores basta con presionar en el teclado shift + F9.

Page 13: Curso básico de flash 8

Panel Transformar

Cuando se tiene que editar una forma vectorial o una Imagen Importada ya sea que la tengas que hacer más grande o la tengas que girar (rotar) una cierta cantidad de grados, este panel es el conveniente para tal efecto. Ya que el Panel De Transformar te proporciona las opciones de agrandar una forma cualesquiera que esta sea con la opción de agrandar solamente a lo Ancho o a lo Alto y si seleccionas la Casilla De Restringir la forma a editar mantendrá las proporciones tanto a lo ancho y alo alto. Con este panel también puedes Rotar una forma o Sesgarla horizontal o verticalmente según sean las necesidades. Para la invocación del Panel Transformar presionar la secuencia de teclas ctrl. + T.

Page 14: Curso básico de flash 8

En este punto has obtenido los conocimientos suficientes para saber que función tienen los diferentes paneles diseño web en Macromedia Flash 8. Si cuentas con alguna duda en los puntos aquí expuestos no dudes en dejar tu comentario y con gustos serán atendidos a la menor brevedad

Curso Básico De Flash 8 (Espacio De Trabajo) Parte 3

Establecer El Espacio De Trabajo

Cuando se trabaja con Macromedia Flash Professional 8 establecer el área de trabajo es de mucha importancia ya que te permitirá tener un panorama más amplio de tu área de trabajo, y de esta forma no amontonaras paneles innecesarios en el espacio de trabajo. Si se colocan los diferentes paneles en posiciones estratégicas tendrás una mejor perspectiva de todo el escenario.

Una primera recomendación para establecer el espacio de trabajo es colocar la Barra de Herramientas en la parte izquierda de la pantalla, el Panel de Acciones en la parte inferior y el Panel de Propiedades por encima del Panel de Acciones.

Page 15: Curso básico de flash 8

Los Paneles de Mezclador de Colores, Transformar y el Panel de Biblioteca los puedes colocar en la parte derecha de la pantalla, tal y como se muestra en la imagen. Recuerda que estos son los paneles más utilizados para la realización de animaciones en Macromedia Flash.

Una segunda opción para agrupar los paneles más usados es colocarlos en una sola barra, esta acción se realiza: Primero hacer visibles cada uno de los  paneles (ctrl. + L = Panel Biblioteca, ctrl. + T = Panel de Transformar, shift + F9 = Panel Mezclador de Colores), luego arrastrando uno a uno arrastrándolos por la parte marcada (como se muestra en # 1 en la imagen), cuando el panel es insertado en

Page 16: Curso básico de flash 8

otro panel se coloca una franja de color negro como lo marca el paso # 3 de la imagen. La parte marcada con el # 2 de la imagen indica que esta oculto el menú de cada uno de los paneles. Y con la pare marcada con el # 4 podrás desplazar los paneles a cualquier parte del documento Flash.

Establecer el espacio de trabajo

Las herramientas de selección,  borrador y cambio de color también son de mucha importancia cuando se esta trabajando con presentaciones Flash, ya que como el nombre de cada herramienta lo indica, la Herramienta de Selección sirve para; seleccionar símbolos, colores, fotogramas en la línea de tiempo, propiedades del documento, etc. y la Herramienta de Borrador perite borrar partes del relleno de alguna forma dibujada, quitar bordes.

En esta sección incluiré como dar color de relleno y color al borde sin la necesidad de que tengas que trabajar con el panel de mezclador de colores shift + F9. Las herramientas con las que se trabajaran en este punto son las Herramientas de Selección, Bote de Tinta, Cubo de Pintura, Borrador, Borrador Grifo, las herramientas 3 y 4 están incorporadas a las herramientas 5 y 6 respectivamente.

Page 17: Curso básico de flash 8

Herramienta de Selección (V)

La primera herramienta a definir es la herramienta de selección la cual aparece seleccionada de forma automática cada vez que se inicia (abre) el programa de Flash, para invocarla de forma rápida es presionando la tecla (V) en el teclado.

Esta herramienta te ayudara a editar (dibujos) formas vectoriales como son: rectángulos, óvalos, líneas, o sea podrás seleccionar parte o formas completas de algún dibujo para luego modificarlas.

Page 18: Curso básico de flash 8

La imagen muestra 3 diferentes cuadros, el cuadro 1 muestra que no posee ninguna selección.

El cuadrado 2 esta seleccionada parcialmente. El cuadrado 3 esta seleccionado completamente. El cuadrado 4 esta modificado por uno de sus extremos mientras que el cuadrado 6

esta modificado tanto en la parte superior como inferior. Esto se logra tomando por uno de los extremos la parte que se quiera modificar.

En el cuadrado 5 se presenta una forma de dos colores tanto en el borde como en el relleno, aquí solamente se selecciono parte del dibujo y luego se modifico tanto el color de borde como el de relleno.

. Curso Básico De Flash 8 (Herramienta De Borrador) Parte 4

Herramienta de Borrador (E) Tipo de borrador & Opciones de borrador.

Page 19: Curso básico de flash 8

La Herramienta de Borrador posee dos opciones de borrar, la primera opción es seleccionar el (tamaño y forma de borrador), y la segunda opción es seleccionar que es lo que se quiere eliminar de una forma vectorial dibujada. Una forma rápida para invocar la herramienta de borrador es presionar en el teclado la letra E.

Cuando se selecciona la herramienta borrador te da la opción de que escojas el tamaño y forma del borrador, según sean las necesidades de borrado. Puedes elegir entere 5 diferentes tamaños de óvalos, la segunda opción que tienes para elegir el tamaño y forma, son entre 5 diferentes tamaños de cuadrado.

Page 20: Curso básico de flash 8

Las opciones más comunes para eliminar (borrar) formas vectoriales son: borrado normar, borrar rellenos, borrar líneas. Cada una de estas opciones son específicas para cada necesidad que se tenga.

Page 21: Curso básico de flash 8

En la siguiente imagen se muestran los tres diferentes tipos de borrado. Los cuadros marcados con el # 1 están borrados con la opción de barrar normal, este tipo de opción permite borrar tanto color de relleno como el color de borde sin hacer distinciones entre estos.

Los cuadros marcados con el # 2 están borrados con la opción de borrar rellenos, este tipo de borrador no elimina nada de contorno (borde) por más que pases el borrador por encima del contorno.

Las formas vectoriales marcadas con el # 3 están borradas con el borrador de líneas, con esta opción no borraras nada de relleno, y solo podrás borrar los contornos (bordes) de las formas vectoriales dibujadas. La opción de borrar rellenos es lo contrario a borrar líneas.

Page 22: Curso básico de flash 8

Herramienta de borrador Grifo.

Además de las opciones de tamaño, forma y tipos de borrado de las cuales te puedes ayudar para eliminar formas dibujadas. Flash incluye una herramienta (Grifo) con la cual se eliminan de un solo clic los bordes o rellenos seleccionados, para hacer visible la herramienta de (Grifo), primero seleccionar la herramienta de borrador y luego el Icono De Grifo tal y como se muestra en la imagen.

Page 23: Curso básico de flash 8

Para eliminar bordes o rellenos solamente tendrás que situarte en la posición a borrar y luego simplemente hacer clic. Esta herramienta es de lo más fácil de manejar como lo podrás constatar.

En las imágenes marcadas como 1,1 el icono de borrador se situó sobre el borde del cuadrado y luego se elimino.

En la imagen marcada con 1,2 lo que se elimino de la forma vectorial fue el relleno. La imagen marcada con 1,3 se elimino en la parte superior el color de relleno y en la

parte inferior se elimino el color de borde.

Page 24: Curso básico de flash 8

En este punto has obtenido los conocimientos para poder editar una forma vectorial en cuanto al borrado de trazo y relleno. En capítulos posteriores te mostrare como cambiar el color de trazo y de relleno de diferentes formas geométricas.