Libro Macromedia Flash Parte 1

Prof.
Csar Augusto Sucari Quispe
GUA
EDUCATIVA
CATARULA
Aprendamo s Flash 8 PRO

Macromedia
Aprende Flash de forma rpida y sencilla

Csar Augusto Sucari Quispe Beatriz Magda Sucari Quispe
CREA PGINAS WEB INTERACTIVAS CON LA TECNOLOGA MS ACTUAL DIBUJA, INSERTA TEXTO, SONIDOS Y CREA ANIMACIONES INTERACTIVAS DISEA Y DESARROLLA JUEGOS EN FLASH
ASOCIACIN EDUCATIVA
IDEA - PERU
Aprendamos Macromedia Flash 8 |- 1 -
Prof. Beatriz Magda Sucari Quispe

Editor y director : Csar Augusto Sucari Quispe Csar Augusto Sucari Quispe Beatriz Magda Sucari Quispe Diseo y diagramacin: Beatriz Magda Sucari Quispe Beatriz Magda Sucari Quispe
Composicin y diseo:
Realizacin de cubierta:
Impreso y editado en:
IDEA PERU 2006
3ra. Edicin - Derechos Reservados 2006 Asociacin de Investigacin de Desarrollo Educativo del Altiplano IDEA ASOCIACIN EDUCATIVA IDEA PERU Jr. Fernando Rivero 321 Puno - Peru
- 2 - | Aprendamos Macromedia Flash 8
Prof. Csar Augusto Sucari Quispe

Aprendamos Macromedia Flash MX
PRESENTACIN
Al escribir un obra respecto determinado tema, lo primero que pasa por la mente del autor es volcar en ella la mayor cantidad posible de conocimientos, esto significa centrar el objetivo en el saber del propio autor, lo cual genera un obra esttica, poco pragmtica y generalmente alejada de la realidad. La dificultad no solo radica en explorar, no la mente del creador, sino, la del lector y escribir de acuerdo a sus necesidades y expectativas, dotndole al mismo de conceptos y aplicaciones dirigidas a solucionar situaciones concretas y al aprovechamiento de herramientas y software que le permitan desarrollar su creatividad. Sin embargo lo escrito solo escrito quedar, los conceptos posiblemente sean reconocidos por su exactitud, las aplicaciones practicas quizs se conviertan en ancdotas y los grficos y fotografas adornen un libro quiz muy bien presentado en la biblioteca de su casa, porque el verdadero conocimiento no est en este libro ni en ningn otro, est en usted mismo, si alcanza la sabidura practica que es insustituible, lo nico que pretendemos es que le agregue algo de tcnica. Este es una gua, no una receta que le asegure la conquista del mundo del diseo y animacin. Este es un libro que esperamos lo lea y lo ponga en practica y recoja lo mejor de l pero sobre todo comparta con los que lo rodean y exjase cada da ms, por usted mismo. Sin ms prembulos Bienvenidos al curso de Macromedia Flash para su versin 8, este curso tiene como objetivo que desarrolles tu espritu creador, tu disposicin para disear y expresar tu potencial relacionados con la animacin y la creacin de video juegos.
Csar Augusto Sucari Quispe Beatriz Magda Sucari Quispe

PROFESORES
DE
COMPUTACIN
E INFORMTICA

indice INDICE Pg. Prologo del autor UNIDAD 1 Primeros pasos 5 6 6 7 7 7 8 9 10 11 12 13 14 15 17 18 20 23 24 27 3
Como trabaja Flash? El lenguaje de programacin de flash Qu Puedo Hacer con macromedia flash? El entorno de macromedia : Flash Los paneles El inspector de propiedades La Caja de herramientas La lnea de tiempo La biblioteca Actividad 1: Animacin por interpolacin de movimiento y forma Conceptos de la lnea de tiempo Concejos de forma Actividad 2: Animacin de objetos por interpolacin de forma Transformando el texto libremente Actividad 3: Animacin fotograma a fotograma Edicin de animaciones Actividad 4 : Uso de capas guas Actividad 5 : Uso de las mascaras Actividad 6 : Creacin de botones y asignando acciones Uso del panel de acciones UNIDAD 2 Paginas, juegos y algo ms
Actividad 7 : Botones animados El comando SetProperty El comando GetProperty Actividad 8 : Uso de componentes Trabajo con componentes en macromedia flash Componente ScrollBar Componente ScrollPane Actividad 9 : Creacin de Paginas web Actividad 10 : Software Educativo : Imgenes, sonido y Animacin Publicacin de documentos en flash Actividad 11 : Principios para la creacin de videojuegos
29 30 31 30 32 33 34 35 37 39 40

indice
Unidad
Primeros pasos
Competencia
Reconoce la utilidad y entorno del programa macromedia flash y participa activamente en la elaboracin de secuencias de animacin. Capacidades: 1. 2. 3. 4. 5. Conoce los distintos elementos que componen el entorno de trabajo distinguiendo el uso de las mismas. Crea animaciones sencillas utilizando interpolaciones, aplicando el formato de acuerdo a los elementos de trabajo. Modifica elementos con la finalidad de crear animacin de mayor impacto. Organiza secuencias de animacin para presentar en las pelculas. Crea secuencias de interactividad con las animacin.
Niveles Mnimos de Logro. 1. 2. 3. 4. 5. Define la filosofa de trabajo de macromedia flash y la distribucin del entorno. Selecciona la herramienta adecuada para crear una animacin sencilla de texto y forma. Modifica elementos para crear una animacin secuencial. Diferencia formas de trabajo de macromedia flash para la animacin. Selecciona los elementos que permiten controlar la interactividad del software con el usuario.
Contenidos Conceptuales Filosofa de trabajo de Flash, el entorno, Animacin de texto y objetos, marcaras, interactividad.
Qu es FLASH?
Flash es una potente herramienta creada por Macromedia Adobe que ha superado las mejores expectativas de sus creadores. Desde la aparicin del Software de Macromedia; Flash, a mediados de 1995, en que introdujeron su version 1, la Internet ya no ha vuelto a ser el mismo lugar de antes. ya que gracias a la introduccin de este software es posible encontrar lugares repletos de toda un arsenal multimedia que los diseadores saben aprovechar muy bien para lograr sitios de gran impacto que a la postre se quedan grabados en la mente. Macromedia Flash es la herramienta estndar de edicin profesional para la creacin de publicaciones Web de gran impacto. Tanto si crea logotipos animados, controles de navegacin de sitios Web, animaciones de gran formato, o aplicaciones Web o sitios Web completos usando Flash, descubrir que por su capacidad y flexibilidad, Flash es el medio ideal para desarrollar su propia creatividad. Inicialmente Macromedia Flash fue creado con el objeto de realizar animaciones vistosas para la web, as como para crear GIFs animados. Los motivos que han convertido a Flash en el programa elegido por la mayora de los diseadores web profesionales y aficionados son varios. Veamos pues, porqu es interesante Flash. Flash ha conseguido hacer posible lo que ms se echa en falta en Internet: Dinamismo, y con dinamismo no slo nos referimos a las animaciones, sino que Flash permite crear aplicaciones interactivas que permiten al usuario ver la web como algo atractivo, no esttico (en contraposicin a la mayora de las pginas, que estn realizadas empleando el lenguaje HTML). Con Flash podremos crear de modo fcil y rpido animaciones de todo tipo. Flash es fcil de aprender, tiene un entorno amigable que nos invita a sentarnos y pasar horas y horas creando lo que nos dicte nuestra imaginacin.
Requerimie ntos del Sistema: Para utilizar Macromedia Flash necesitamos tener Cmputadora Pentium I de 200 MHz o superior. Windows 98 SE o superior Memoria RAM de 64 MB (se recomiendan 128 MB), 85 MB de espacio disponible en disco duro.
Para utilizar Flash no es importante qu versin de Windows tengamos instalada en nuestro computador. Las pantallas que se presentan en este manual se ha
Como trabaja Flash?

Los grficos vectoriales aunque tengan un nombre que a ms de uno asusta, son arch conocidos, y de seguro tambin ya ha estado familiarizado con ellos. Softwares como FreeHand, Corel Draw, Illustrator, etc. manejan este tipo de grficos, cuyas caractersticas principales son la capacidad de escalar su tamao a lo mximo de nuestro monitor sin perder calidad de imagen. Los

bordes no se vern aserrados, como de cierto sucedera si lo que estuviramos usando es una imagen de tipo bitmap o mapa de bits La tecnologa ShockWave Significa comprimir grficos y sonidos lo cual hace que la transmisin de videos por Internet sea ms rpida. Las pelculas de Macromedia Flash corresponden a grficos, texto, animacin y aplicaciones para sitios Web. Aunque estn compuestas principalmente por grficos vectoriales, tambin pueden incluir video, grficos de mapa de bits y sonidos importados. Las pelculas Flash pueden incorporar interactividad para permitir la introduccin de datos de los espectadores y la creacin de pelculas no lineales que pueden interactuar con otras aplicaciones Web. Los diseadores de Internet utilizan Flash para crear controles de navegacin, logotipos animados, animaciones de gran formato con sonido sincronizado e incluso sitios Web con capacidad sensorial. Las pelculas Flash utilizan grficos vectoriales compactos, para que se descarguen y se adapten rpidamente al tamao de la pantalla del usuario. Es muy probable que ya haya visto pelculas Flash y haya interactuado con ellas en muchos sitios Web. Millones de usuarios de Internet han recibido Flash Player con sus equipos, navegadores o software del sistema; otros lo han descargado desde el sitio Web de Macromedia. Flash Player reside en el equipo local, donde puede reproducir pelculas en navegadores o como aplicaciones independientes. Ver una pelcula Flash en Flash Player es similar a ver un DVD en un reproductor de DVD; Flash Player es el dispositivo que se utiliza para ver las pelculas creadas con la aplicacin de edicin de Flash. Los documentos de Flash, que tienen la extensin .fla, contienen toda la informacin necesaria para desarrollar, disear y probar contenido interactivo. Los documentos de Flash no son las pelculas que muestra Flash Player. Los documentos con la extensin FLA se publican como pelculas Flash, que tienen la extensin .swf y contienen slo la informacin necesaria para mostrar la pelcula. La mayora de los elementos de Flash son objetos del escenario o smbolos almacenados en la biblioteca del documento. Otros corresponden a archivos de equipos locales o remotos. La biblioteca facilita la organizacin y ayuda a optimizar el tamao de estos elementos. La caja de herramientas, los inspectores, los paneles y la biblioteca le ayudan a trabajar de manera eficiente con los diferentes elementos de un documento, ya sean simples o complejos. Los smbolos son una parte importante de la creacin de pelculas interactivas, ya que se pueden utilizar instancias de smbolos para introducir interacciones en una pelcula. Por ejemplo, es posible crear un smbolo de botn que cambie en funcin de las acciones del ratn y colocar una instancia del smbolo en el escenario. Otro tipo de smbolo, el clip de pelcula, tambin se utiliza para crear pelculas interactivas ms elaboradas. Flash permite personalizar de muchas maneras el espacio de trabajo segn sus necesidades. Mediante los paneles y el inspector de propiedades, puede ver, organizar y cambiar elementos y sus atributos. Puede cambiar el tamao de los paneles, mostrarlos y ocultarlos. Tambin puede agrupar paneles y guardar conjuntos de paneles personalizados para que la gestin del espacio de trabajo sea ms fcil. El inspector de propiedades cambia para reflejar la herramienta o el elemento con el que trabaja, lo que permite acceder rpidamente a las funciones ms utilizadas.
Algunas ventajas de utilizar Flash es que sus pelculas ocupan poco espacio, ya que utilizan distintas tcnicas de compresin para que se transmitan
Con Flash podemos tomas imgenes creadas con otros programas, ya que soporta muchos formatos grficos. Adems con Flash podemos generar videos, archivos GIF animados, secuencias de imgenes, etc. Todo ello a partir de una
El lenguaje de programacin de flash

Tal como cuando apareci el programa Macromedia Director con su propio lenguaje de programacin bautizado con el nombre de: Lingo, Macromedia Flash tambin ha introducido su propio lenguaje de programacin que va a la par con otros lenguajes como el JavaScript o el VbScript y que incluso puede interactuar con ellos, me refiero al: ActionScript.
Qu puede hacer con Flash?

Flash nos permite desarrollar los siguientes elementos: - Videos para html. - Videos en formato AVI. - Videos en Quick Time. - Gif. - Tutores. - Grficos. - Simulaciones. - Paginas Web Dinmicas. - Juegos. - Diapositivas.
La distribucin de la pantalla sigue el estilo del resto de los programas de la casa Macromedia. Este se basa en tener cada grupo de elementos separados en distintas barras y zonas de la pantalla. As podrs distribuir
Para ingresar al programa de Macromedia Flash, debes de realizar los siguientes pasos:
1. Haga clic en el botn Inicio 2. Seleccione la opcin Programas 3. Ubique y Selecciona la opcin Macromedia 4. Haga clic en la opcin Macromedia Flash 8
Si no tienes claro para que sirve alguna de las herramientas, deja un segundo el puntero del ratn sobre ese elemento. Al momento aparecer un pequeo letrero con el nombre de la
EL ESPACIO DE TRABAJO DE MACROMEDIA FLASH
Lnea de Tiempo
Escenario
Flecha de Contraccin
Caja de Herramientas
Inspector de propiedades
Paneles
DESCRIPCIN DE LOS ELEMENTOS DEL ESPACIO DE

TRABAJO
LOS PANELES
Control del men Los paneles facilitan la visualizacin, la organizacin y la modificacin de los opciones
elementos de los documentos. Las opciones disponibles en los paneles controlan las caractersticas de los smbolos, las instancias, los colores, el tipo, los fotogramas y otros elementos. Puede utilizar los paneles para personalizar la interfaz de Flash, manteniendo visibles los paneles necesarios para una determinada tarea y ocultando los dems.
Los paneles permiten trabajar con objetos, colores, textos, instancias, fotogramas, escenas y documentos enteros. Por ejemplo, puede utilizar el mezclador de colores para crear colores y el panel Alinear para alinear los objetos con otros objetos o con el escenario. Para ver una lista completa de todos los paneles disponibles en Flash, consulte el men Ventana. La mayora de los paneles incluyen un men emergente con opciones adicionales. El men de opciones se indica mediante un control en la barra de ttulo del panel. Si no aparece ningn control del men de opciones, significa que el panel no tiene men de opciones.
EL INSPECTOR DE PROPIEDADES
El inspector de propiedades simplifica la creacin de documentos facilitando el acceso a los atributos ms utilizados del elemento seleccionado, ya sea en

el escenario o en la lnea de tiempo. Puede modificar los atributos del objeto o documento en el inspector de propiedades sin acceder a los mens o paneles que contienen estas funciones. El inspector de propiedades muestra informacin y la configuracin del elemento que est seleccionado, que puede ser un documento, un texto, un smbolo, una forma, un mapa de bits, un video, un grupo, un fotograma o una herramienta. Cuando hay dos o ms tipos de objetos seleccionados, el inspector de propiedades muestra el nmero total de objetos seleccionados.
Ejemplo : El inspector de propiedades con opciones de texto
LA CAJA DE HERRAMIENTAS
Las herramientas de la caja de herramientas permiten dibujar, pintar, seleccionar y modificar ilustraciones, as como cambiar la visualizacin del Flecha escenario. La caja de herramientas se divide en cuatro secciones:
Subseleccin Transformacin de relleno Lazo Texto Rectngulo Pincel Cubo de pintura Borrador
Transformacin libre La seccin Herramientas contiene las herramientas de dibujo, pintura y seleccin. Lnea
La seccin Ver contiene herramientas para ampliar y reducir, as como Pluma para realizar recorridos de la ventana de la aplicacin. La seccin Colores contiene modificadores de los colores de trazo y valo relleno.
Lpiz Bote de tinta Cuentagotas
Mano
Zoom
Color de trazo
La seccin Opciones muestra los modificadores de la herramienta seleccionada, los cuales afectan a las operaciones de pintura o edicin de dicha herramienta. Nota : al seleccionar una de las herramientas de la seccin Herramientas, en la seccin Opciones aparecen los modificadores de la herramienta seleccionada.
Color de relleno
LA LNEA DE TIEMPO
La lnea de tiempo es una herramienta que permite realizar animaciones. Est se encuentra dividida en casillas numeradas, como si fuese una tabla; Cada fila representa una capa. En cada capa colocaremos un elemento de la pelcula y cada columna representa a un fotograma dela pelcula. La lnea de tiempo organiza y controla el contenido de una pelcula a travs del tiempo, en capas y fotogramas. Al igual que en un largometraje, las pelculas Flash dividen el tiempo en fotogramas. Las capas son como varias bandas de pelcula apiladas unas encima de otras, cada una de las cuales contiene una imagen diferente que aparece en el escenario. Los
Modificadores de las herramientas

componentes principales de la lnea de tiempo son las capas, los fotogramas y la cabeza lectora. Las capas de un documento aparecen en una columna situada a la izquierda de la lnea de tiempo. Los fotogramas contenidos en cada capa aparecen en una fila a la derecha del nombre de la capa. El encabezado de la lnea de tiempo situado en la parte superior de la lnea de tiempo indica los nmeros de fotograma. La cabeza lectora indica el fotograma actual que se muestra en el escenario. La informacin de estado de la lnea de tiempo situada en la parte inferior de la lnea de tiempo indica el nmero del fotograma seleccionado, la velocidad de fotogramas actual y el tiempo transcurrido hasta el fotograma actual. Nota: al reproducir una animacin, se muestra la velocidad de fotogramas actual, que puede diferir de la velocidad de fotogramas de la pelcula si el sistema no puede mostrar la animacin con la rapidez propiada. Puede cambiar la manera en que se muestran los fotogramas y mostrar miniaturas del contenido de los fotogramas en la lnea de tiempo. La lnea de tiempo muestra dnde hay animacin en una pelcula, incluidas la animacin fotograma a fotograma, la animacin interpolada y los trazados de movimiento. Los controles de la seccin de capas de la lnea de tiempo permiten mostrar u ocultarFotograma clave vaco y bloquear o desbloquear capas, as como mostrar el contenido de Capa oculta las capas como contornos. Puede insertar, eliminar, seleccionar y mover fotogramas en la lnea de tiempo. Tambin puede arrastrar fotogramas a una nueva posicin en Capa activa la Men misma capa o a otra capa.
Cabeza lectora Encabezado de la lnea de tiempo
Flash es un formato protegido, las pelculas que coloques en Internet no pueden ser editadas o modificadas por lo que tu trabajo es
LA BIBLIOTECA (F11)
emergente de visualizacin de fotogramas
Objetos de la capa que aparecen como contornos Capa bloqueada
en Flash, archivos importados tales como clips de video, clips de sonido, mapas de bits e ilustraciones vectoriales importadas. Animacin Biblioteca El panel muestra una lista desplegable con los nombres de todosInterpolada los elementos de la biblioteca, lo que permite ver y organizar dichos elementos mientras trabaja. Un icono situado junto al nombre de cada elemento del panel Biblioteca Icono Capa el tipo de archivo. Tiempo transcurrido, Indicador indica de gua
Animacin fotograma En la biblioteca de un documento de Flash se almacenan smbolos creados a fotograma
Men de opciones
Botn Puede abrir la biblioteca de cualquier documento de Flashindicador est Centrar fotograma Velocidad de fotogramas, mientras Botones de Papel cebolla
trabajando en Flash para poner a disposicin del documento actual los Fotograma actual, indicador elementos de la biblioteca de ese archivo. Puede crear bibliotecas permanentes en la aplicacin Flash que estarn disponibles siempre que se inicie Flash. Flash tambin incluye varias bibliotecas de muestra que contienen botones, grficos, clips de pelcula y sonidos que puede agregar a sus propios documentos de Flash. Las bibliotecas de Flash de muestra y las bibliotecas permanentes creadas por el usuario aparecen en el submen Ventana > Biblioteca (Control + L) o en su defecto en el submen ventana > Otros Paneles > Bibliotecas Comunes
Botn Orden de clasificacin Botn Estado Ancho Botn estado estrecho
Icono de la papelera Icono de propiedades
Botn Nueva carpeta Botn Nuevo smbolo
Si deseas activar la biblioteca, puedes presionar la tecla de funcin F11
Prof. Csar Augusto Sucari Quispe Forma de Trabajo

Para crear animacin de un documento de Macromedia Flash, se modifica el contenido de fotogramas sucesivos. Puede hacer que un objeto se desplace a lo largo del escenario, aumente o disminuya de tamao, gire, cambie de color, aparezca o desaparezca progresivamente, o cambie de forma. Los cambios pueden ocurrir por separado o combinados entre s. Por ejemplo, puede hacer que un objeto gire a medida que aparece y se desplaza por el escenario. Existen dos mtodos para crear una secuencia de animacin en Flash: la animacin interpolada y la animacin fotograma por fotograma. En la animacin interpolada, se crean los fotogramas inicial y final, y Flash crea los fotogramas intermedios. Flash vara el tamao, la rotacin, el color y otros atributos del objeto uniformemente entre los fotogramas inicial y final para crear la sensacin de movimiento. En la animacin fotograma por fotograma, la imagen se crea en cada fotograma. Para simplificar el proceso de creacin de animaciones interpoladas, puede distribuir varios objetos en capas distintas. Puede utilizar una capa de mscara para crear un agujero a travs del cual se pueda ver el contenido de una o varias capas situadas por debajo. Con un clip de pelcula animado, puede crear una mscara de capa dinmica.
TERMINOLOGA BSICA
LA CAPA.- El concepto de Capa es fundamental para manejar Flash de forma eficiente veamos a grandes rasgos qu son las capas.
Puedes utilizar Una Capa se puede definir como una pelcula independiente de un nico la combinacin de nivel. Es decir, una capa contiene su propia Lnea de Tiempo (con infinitos teclas fotogramas).
Los objetos que estn en una determinada capa comparten fotograma y por tanto, pueden "mezclarse" entre s. Esto es interesante a menudo, pero otras Para acceder a la veces es conveniente separar los objetos de modo que no interfieran entre ventana de s. propiedades del Para ello, crearemos tantas capas como sea necesario. El uso de mltiples capas adems, da lugar a pelculas bien ordenadas y de fcil documento. manejo (es conveniente colocar los sonidos en una capa independiente llamada "Sonidos", por ejemplo). ESCENARIO.- Es la parte ms importante tambin denominado rea de trabajo, sobre el escenario dibujaremos y colocaremos los diferentes elementos de la pelcula que estemos realizando. FOTOGRAMA.- Es una posicin en la escena que puede ser tomada por una imagen u objeto o en todo caso no contener nada INSTANCIA.- Es una copia de un elemento de la biblioteca sobre el escenario, al cual podemos modificar algunos atributos sin modificar al En ocasiones interesar original que se encuentra en la biblioteca.
Control + J
te despejar completamente INTERPOLACIN.- Tcnica de animacin para los objetos insertados en el la pantalla para poder escenario. ver bien el rea de trabajo. Puedes SMBOLO.- Son los elementos que integran luestra pelcula los cuales ocultar todos los pueden tener diferentes papeles como Clip de pelcula (Contiene animacin) paneles Botn (Se comporta como tal) y grafico (contiene imgenes estticas) momentneamente pulsando la tecla de funcin F4. para volver a ver los Aprendamos Macromedia
Flash 8 |- 15 -
CONFIGURACIN DEL ESCENARIO

Macromedia Flash, utiliza una diversidad de herramientas para poder desarrollar adecuadamente los diseo con plantillas estandarizadas o establecidas por el usuario. As que es necesario saber lo siguiente: a) Establecer el rea de diseo: El escenario tiene unas propiedades muy importantes, ya que coinciden con las Propiedades del documento. Para acceder a ellas, hagamos clic con el botn derecho sobre cualquier parte del escenario en la que no haya ningn objeto y despus sobre Propiedades del documento o utilizamos el men Modificar > Documento...
Cuadro de propiedades del documento o pelcula
Dimensiones: Determinan el tamao de la pelcula. El tamao mnimo es de 1 x 1 px (pxeles) y el mximo de 2880 x 2880 px.
Hay ciertos caracteres que no puede utilizar a la Coincidir: Provocan que el tamao de la pelcula coincida con el botn hora seleccionado (tamao por defecto de la Impresora, Contenidos existentes o de guardar una pelcula, ya que los elegidos como Predeterminados) windows los utiliza para funciones Color de Fondo: El color aqu seleccionado ser el color de fondo de toda la especiales. Estos pelcula. caracteres son: \ / : * > < |. Recuerda Veloc. Fotogramas: O nmero de fotogramas por segundo que aparecern que el nmero en la pelcula. mximo de caracteres para un
Unidades de Regla: Unidad que se emplear para medir las cantidades. Transformar en predeterminado: Este botn, propio de la nueva versin de Flash, permite almacenar las propiedades del documento actual y aplicarlas a todos los documentos nuevos que se creen desde ese instante en adelante. Estas propiedades por supuesto podrn ser alteradas desde este panel cuando se desee. Otra forma de poder establecer estos atributos del escenario como las dimensiones, color de fondo, etc. Es utilizando las opciones de configuracin desde el Inspector de Propiedades
b) Desplazamiento entre Escenas Para poder desplazarnos dentro de nuestra pelcula a travs de las diversos escenarios podemos hacer uso de la herramienta de navegacin que nos permite desplazarnos de un escenario a otro
Herramienta de navegacin
o podemos utilizar el panel de escenas (Men Ventanas > Paneles de Diseo > escenas) SHIFT + F2 la cual nos permite aadir, eliminar escenas, cambiar de nombre. Adems nos ayuda a ordenar la secuencia de escenas
Puedes eliminar escenas haciendo clic en el icono de basurero o crear otra utilizando el icono con el signo mas +
c) Configuracin de la Regla
Puedes activar La regla es una herramienta que nos ayuda a definir el tamao y alinear cualquier objetos con precisin. Est no se muestra de manera predeterminada, pero herramienta se puede mostrar u ocultar si se es necesario. presionando la tecla asignada a cada una de ellas. Para saber mostrar u ocultar la regla debemos de acceder al men Ver > Reglas Para qu letra (Control + SHIFT + Alt + R) o hagamos clic con el botn derecho del mouse corresponde a una cualquier parte del rea de trabajo y seleccionamos reglas del men sobre herramienta contextual. determinada, deja el ratn un segundo
d) Configuracin de la Cuadricula
La cuadricula es un serie de lneas y puntos que se intersectan ofrecindonos un fondo cuadriculado, permitindonos colocar, alinear y dibujar objetos con precisin.
Para mostrar u ocultar la cuadricula debemos de acceder al men Ver > Cuadricula > Mostrar Cuadricula o hagamos clic con el botn derecho del mouse sobre cualquier parte del escenario y seleccionamos Cuadricula > Mostrar cuadricula del men contextual. Puede establecer la distancia entre las lneas o puntos de la cuadricula si especifica la altura y ancho de cada cuadro de la cuadricula para ello debe acceder al men Ver > Cuadricula > Editar Cuadricula o hagamos clic con el botn derecho del mouse sobre cualquier parte del escenario y seleccionamos Cuadricula > Editar cuadricula del men contextual. Entonces en la ventana podemos modificar los valores:
d) Configuracin de las lneas guas
Puedes mostrar u ocultar rpidamente el panel de la biblioteca pulsando
Las lneas guas sirven alinear y colocar objetos con precisin o subdividir en escenario en sectores. Hay dos tipos de lneas guas: la horizontal y la vertical. Para aadir una lnea gua arrastremos de la regla horizontal o vertical hacia el escenario en la posicin que deseemos. Puedes modificar algunos atributos, bloquearlo o borrar, para ello hagamos clic en acceder al men Ver > Guas > Selecciona Opcin o hagamos clic con el botn derecho del mouse sobre cualquier parte del escenario y seleccionamos Guas > Selecciona opcin del men contextual. Si deseas puedes acceder a la ventana (Opcin Editar Guias)

PRACTICA 1. Disea los siguientes dibujos: cuadricula (25px x 25 px) de color rojo utiliza la herramienta lnea y
2. Disea el siguiente dibujo, utilizando una pelcula de flash con las siguientes caractersticas Dimensiones : 500 px x 300 px; fondo de color amarillo Utiliza la herramienta Elipse y Lneas Guas de color celeste (vertical cada 50 px, horizontal al centro)
MANEJO DE MACROMEDIA FLASH

Cuando se disea una pgina web o una animacin el diseador pasa por muchas fases. Tras la fase de "Qu quiero crear y cmo va a ser" viene (normalmente) la fase de diseo grfico. Llevar lo que ha producido tu imaginacin al papel (en este caso al papel de Flash).

No conviene engaarnos, Flash no es un programa de diseo grfico, pero su potencia en este mbito es casi tan grande como la de stos programas. Vamos a ver cmo emplear cada herramienta de dibujo para sacarle el mximo partido.
Herramientas Bsicas.
La Barra de Herramientas contiene todas las Herramientas necesarias para el dibujo y diseo de pginas web. Veamos cules son las ms importantes y cmo se usan:
Herramienta Seleccin (flecha): . Es la herramienta ms usada de todas. Su uso principal es para seleccionar objetos. permite seleccionar los bordes de los objetos o los rellenos (con un slo clic), los bordes y rellenos (con doble clic), zonas a nuestra eleccin y poder modificar sus atributos o desplazarlos en el escenario. Flecha tiene otras herramientas Opcionales: Ajustar a Objetos : Se usa para obligar a los objetos a "encajar" unos con otros, es decir, para que en caso de ser posible, sus bordes se superponga, dando la sensacin de estar "unidos". Suavizar: Convierte los trazos rectos en lneas menos rgidas.
Enderezar: Realiza la labor inversa. Convierte los trazos redondeados en ms rectilneos De igual forma puedes utilizar esta herramienta par modificar cualquier figura, el mtodo depender del elemento que quieras modificar, como vemos seguidamente: Segmentos: Al pulsar y arrastrar sobre un segmento, cambiaremos la curvatura de esa lnea. Junto al puntero del ratn aparece una pequea curva. Vrtices: si te sitas en un vrtice o sobre el final de una lnea, lo que cambiar entonces es la posicin de ese elemento, en este caso aparece junto al puntero un ngulo recto
Como en otras herramientas, la tecla Maysculas (Shift) modifica el comportamiento del pincel. Al pulsarla solo podrs moverte en horizontal o vertical
Herramienta Lnea: Permite crear lneas rectas de un modo rpido. Las lneas se crean como en cualquier programa de dibujo, se hace clic y se arrastra hasta donde queramos que llegue la lnea recta. Al soltar el ratn aparecer una lnea uniendo los dos puntos. Una vez creada la podemos modificar sin ms que seleccionar o situar el cursor encima de los extremos para estirarlos y en cualquier otra parte cercana a la recta para curvarla.
Herramienta Texto: Crea un texto en el lugar en el que hagamos clic. El uso de esta herramienta detallaremos ms adelante.
Herramienta valo: La herramienta valo permite trazar crculos o elipses de manera rpida y sencilla. Para crearlo pulsa en algn lugar de la escena y arrastra el botn, a medida que mueves el ratn ir apareciendo la elipse. Puedes utilizar la tecla ALT para crear un circulo a partir del centro o SHIFT para crear un circulo perfecto o usar ambas combinaciones.
Con le herramienta Pluma, Si no quieres crear una figura cerrada, puedes terminar el dibujo, pulsando el tecla Control y haciendo clic en el lugar de la escena
Herramienta Rectngulo: Su manejo es idntico al de la Herramienta valo, tan solo se diferencian en el tipo de objetos que crean, adems tiene una variante denominado Polistar diferente numero de lados. . La que crea polgono y estrellas de
RECTANGULO.- Al igual que la elipse se dibuja un rectngulo, aunque esta herramienta tiene un opcin que nos permite redondear las esquinas para ello en la parte de opciones (parte inferir de la barra de herramientas) activa la casilla radio de rectngulo redondeado.
En la ventana que aparece selecciona el nmero de pxeles que se utilizar para redondear las esquinas; luego dibuja el rectngulo siguiendo el mtodo habitual.
POLISTAR.- Esta herramienta nos permite dibujar polgonos y estrellas para ello debemos de hacer clic en el inspector de propiedades en el botn opciones, entonces aparece una ventana en el que debemos de seleccionar el estilo (Polgono o Estrella) de la herramienta y el numero de lados.
Herramienta Lpiz: Es la primera Herramienta de dibujo propiamente dicho. Permite dibujar lneas con la forma que decidamos, modificando la forma de estas a nuestro gusto. El color que aplicar esta Herramienta se puede modificar, bien desde el Panel Mezclador de Colores o bien desde el panel Colores que hay en la Barra de Herramientas. Al modificar con el lpiz puedes modificar el resultado final con la opcin Modo Lpiz, en la zona de opciones de la barra de herramientas. Enderezar: al soltar el botn, flash intenta convertir el dibujo en figuras geomtricas Suavizar: las lneas se suavizan, para conseguir curvas menos pronunciadas. Tinta: El dibujo no ser modificado.
Si tenemos una curva y necesitamos aadir un vrtice, podemos arrastrar la curva mientras mantenemos pulsada la tecla
Herramienta Pincel : Su funcionalidad equivale a la del lpiz, pero su trazo es mucho ms grueso. Se suele emplear para aplicar rellenos. Se puede modificar su grosor y forma de trazo. El funcionamiento es similar al de las herramientas anteriores, pero esta dispone de varias opciones para modificar su comportamiento. Modo Pincel: Hace que los trazos dibujados se comporten de distinta manera segn la opcin seleccionada. Pues hacer que dibuje detrs de otro elemento, dentro de un elemento, etc. Tamao de Pincel: aumenta o disminuye el grosor del pincel Forma del pincel: Varia el tipo de dibujo que deja el pincel, puedes pasar del estilo circular a otros en forma de lnea, cuadrada, etc.
Si ests haciendo una seleccin con el lazo, pero necesitar en cierto momento una recta, como si se hubiera hecho con el modo poligonal, mantn pulsada la tecla ALT. A partir de aqu puedes soltar el botn del ratn, y seguir dibujando como si tuvieses seleccionado el
Bloquear relleno: Esta casilla tiene utilidad al realizar rellenos de color basados en degradados. Si no est activada, cada dibujo que hagas crear un degradado nuevo. En caso contrario, el degradado creado formar parte del conjunto de dibujos creados con el pincel.
Existe una peculiaridad de flash al momento de colocar un objeto sobre otro, esta peculiaridad se denomina Solapamiento de Objetos.
Herramienta Cubo de Pintura: Permite aplicar rellenos a los objetos que hayamos creado. Al contrario que muchos otros programas de dibujo, no permite aplicar rellenos si la zona no est delimitada por un borde. El color que aplicar esta Herramienta se puede modificar, bien desde el Panel Mezclador de Colores que hay en la Barra de Herramientas. En la zona de Opciones de la barra de herramientas tiene dos opciones Cerrar figura: permite decidir si una figura que no este completamente cerrada se debe cerrar o no dependiendo den tamao del hueco. Bloquear Relleno: Permite que todos los degradados tengan un mismo centro en un lugar del escenario
Esto puede sea a la vez muy til y muy incmoda. Para evitar que una figura pueda ser partida podemos agruparla,
Herramienta Borrador: Su funcionamiento es anlogo a la Herramienta Brocha. Pero su funcin es la de eliminar todo aquello que "dibuje". La goma de borrar dispone de varios modificadores accesibles desde la zona Opciones. Modo Borrador: Mediante esta opcin se puede definir el comportamiento de la goma del borrador Borrar Normal: Afecta a todo Borrar Relleno: Slo eliminar el relleno de las figuras. Borrar Lneas: Solo eliminara las lneas, no tocara los rellenos. Borrar rellenos seleccionados: Slo eliminar la parte seleccionada del relleno Borrar Dentro: Para figuras cerradas; slo borrar en su interior completo. Grifo: Si est activada, con una sola pulsacin eliminar un elemento completo
Forma del Borrador: Para cambiar el tamao y la forma de la herramienta.
Herramientas Avanzadas.
Herramienta Lazo: Su funcin es complementaria a la de la Herramienta Flecha, pues puede seleccionar cualquier cosa, sin importar la forma, (la Herramienta Flecha slo puede seleccionar objetos o zonas rectangulares o cuadradas). En contrapartida, la Herramienta Lazo no puede seleccionar rellenos u objetos (a menos que hagamos la seleccin a mano). Al seleccionar esta Herramienta, en el Panel Opciones aparecen estas imgenes: . Esto, es la Herramienta "Varita Mgica" y propiedades de varita mgica, tan popular en otros programas de dibujo. Permite hacer selecciones segn los colores de los objetos. El tercer dibujo que aparece es ste denominado modo polgono que permite hacer selecciones poligonales. Herramienta Pluma: Crea polgonos (y por tanto rectas, rectngulos...) de un modo sencillo. Mucha gente encuentra esta herramienta complicada, aunque es una de las ms potentes que ofrece Flash. Su empleo consiste en hacer clic en los lugares que queramos definir como vrtices de los polgonos, lo que nos asegura una gran precisin. Para crear curvas, hay que sealar los puntos que la delimitan y posteriormente trazar las tangentes a ellas.
Si crear una figura con relleno blanco sobre un fondo blanco parecer que la figura no tiene relleno, pero esto no es as. Tiene un relleno de color blanco. Si pulsas en su interior podrs ver como se selecciona. No es lo
Herramienta Subseleccionador: Esta Herramienta complementa a la Herramienta Pluma, ya que permite mover o ajustar los vrtices que componen los objetos creados con dicha herramienta. Herramienta Bote de Tinta: Se emplea para cambiar rpidamente el color de un trazo. Se aplica sobre objetos, si tienen borde, cambia al color mostrado de dicho borde, por el mostrado en el Panel Mezclador de Colores Herramienta Cuentagotas: Su misin es "Capturar" colores para que posteriormente podamos utilizarlos. Para ver cmo funciona, aconsejamos ver la siguiente animacin:
Cuando seleccionamos un color puedes observar que aparece un cdigo de seis elementos, compuesto por un nmero y letras. Este es el identificador de color. Cada color que usaremos tiene su propio identificador. El identificador de color tiene dos partes: La almohadilla (#) que indica que el nmero que viene a continuacin es un color. Y el Nmero
Herramienta Transformacin Libre: , Sirva para transformar objetos, grupos, instancias o bloques de texto libremente y utilizando sus variantes, es muy til para el momento de animar
Rotar y Sesgar: permite rotar un objeto sobre un punto de referencia o inclinar sobre si mismo. Para rotar un objeto, seleccinalo con la herramienta Transformacin libre y despus selecciona la opcin rotar y sesgar. Para comenzar a girar, dirige el puntero del ratn hacia una de las esquinas y observa que se modifique el puntero a una flecha circular, arrastra y desplaza el ratn. Para inclinar un objeto sigue el mismo proceso, pero en esta ocasin utiliza los nodos laterales.
Los degradados lineales en principio realizan la transicin entre dos colores. Si quieres aadir ms colores basta con pulsar en algn punto de la barra de transicin del panel Mezclador de
Escalar : Permite modificar las dimensiones de un objeto, hacindose ms grande o ms pequeo, para ello simplemente desplace cualquier nodo a la direccin deseada.
Si deseas agregar un color aplicado a una forma al degradado, al acceder a una casilla de color, prueba a desplazar el ratn por la pantalla. Observaras cmo el puntero se trasforma en un cuentagotas. De este modo puede
Distorsionar: Sirve para dar efecto de perspectiva a un objeto, Para ello simplemente se modifican los nodos.
Envoltura: Permite modificar completamente la apariencia de un objeto, simplemente modificando los nodos y las tangentes.
Herramienta Transformacin de Relleno: Esta herramienta nos permite modificar la direccin y el efecto de transicin de color de relleno aplicado a un objeto. PRACTICA DIBUJA LOS SIGUIENTES GRFICOS
TRABAJAR CON TEXTOS


Flash abarca todo aquello que nos pueda hacer falta a la hora de crear una animacin, y por tanto, tambin todo aquello relativo a los textos. Sin embargo, Flash fue concebido para crear animaciones grficas, de modo que tratar cualquier texto como si de un objeto ms se tratase, listo para ser animado a nuestro gusto. Esto nos permitir posteriormente animar textos y crear espectaculares animaciones con muy poco esfuerzo. Flash distingue entre 3 tipos de texto: Texto esttico o normal, texto dinmico y texto de entrada (para que el usuario introduzca sus datos, por ejemplo),
Para desplazar un objeto por la pantalla selecciona la herramienta flecha. Sita el puntero del ratn sobre el objeto y arrstralo mientras mantienes pulsado
Para poder escribir, deberemos hacer clic en la Herramienta Texto y posteriormente en el punto del escenario en el que queramos empezar a escribir. Entonces nos aparecer algo as:
El recuadro que vemos es el recuadro que contendr al texto.
En la pelcula final NO se ver, pero nos servir para localizar ms fcilmente el texto y para moverlo o cambiar su tamao. Finalmente, el crculo que hay arriba a la derecha significa que el recuadro del texto se expandir segn vayamos escribiendo y tambin el texto. Esto es, todo lo que escribamos, estar en la misma lnea. Si escribimos en el recuadro creado por defecto vemos como se alarga el recuadro que lo contiene. Para cambiar de lnea, sera necesario pulsar la tecla Enter (Intro).
Si al desplazar con el ratn un objeto mantienes pulsada la tecla Mayscula observaras que slo puedes mover el objeto en lneas mltiplos de 45
Si por otra parte, queremos delimitar lo que va a ocupar nuestro texto (cosa bastante comn, creamos un cuadro de texto o acercaremos el cursor del ratn al borde del recuadro de texto, segn donde lo acerquemos, se transformar en un smbolo o en otro. Por ejemplo, si lo acercamos al borde del recuadro, se le aadir debajo de la flecha una flecha pequea de 4 direcciones como la que muestra la figura y que nos indica que podemos mover el texto:
Si lo acercamos al crculo que est en el margen superior derecha, el cursor se convierte en un flecha de "ensanchamiento", como la que muestra la figura:
Con el cursor convertido en flecha de "ensanchamiento", podemos estirar los lmites del recuadro de texto, y adems, el crculo que apareca en el margen superior derecho, se convierte en un cuadrado. Este cuadrado significa que los lmites del recuadro de texto han quedado fijados, y que al insertar ms texto, se producir un salto de lnea en lugar de ensanchar el recuadro de texto. Este sera su comportamiento al introducir texto:
Si quisiramos, (una vez definido el recuadro de texto) volver al modo anterior, basta con hacer doble clic sobre el cuadrado que est en el margen superior derecho del recuadro de texto. Tras hacerlo, se convertir en un crculo y su comportamiento ser el descrito al principio.
EL PANEL PROPIEDADES DE TEXTO

contiene las principales propiedades de todos los objetos que empleemos durante nuestra pelcula, de modo que si seleccionamos un texto, podremos ver en l todo lo que nos hace falta conocer sobre nuestro texto.
Fuente: Desde aqu, al igual que en los editores de texto ms comunes podemos seleccionar el tipo de letra o "fuente" que ms nos guste. Altura: Determina el espaciado entre los caracteres. til cuando la tipografa que empleamos muestra las letras muy juntas o para dar efectos concretos al texto. Direccin del Texto: Cambia la orientacin del texto de horizontal a vertical, tanto de izquierda a derecha como de derecha a izquierda. Ajuste automtico entre caracteres: Activar esta casilla provoca que la separacin entre caracteres se realice de modo automtico. Posicin: Nos permite convertir nuestro texto en subndices o en superdices (o dejarlo normal). URL: Si queremos que al pulsar sobre nuestro texto, el usuario vaya a una direccin web, nada ms fcil que escribirla ah. Flash la asociar al texto que ests escribiendo en ese momento. Destino: Determina si la URL a la que el texto hace referencia se cargar en la misma ventana del navegador, en una nueva ... Tipo de Lnea: Si el texto que vamos a incluir es dinmico (de lo contrario aparece sin activar), esta opcin nos permite
Si al desplazar un objeto utilizas las teclas de desplazamiento y a la hora de utilizar alguna de las teclas mantienes pulsada la tecla maysculas, el objeto se desplazar 8 pxeles en ves de uno, con

determinar cmo queremos que aparezcan las lneas (lnea nica, multilnea o multilnea sin ajuste). Configuracin: Son las clsicas opciones que permiten convertir el texto en Negrita (B), Cursiva (I), cambiar el color del texto y el tamao. Otras Propiedades: Dado que Flash trata los textos como objetos, stos tambin tienen anchura, altura y coordenadas. Podemos modificarlos a nuestro gusto, pero debemos tener en cuenta que los caracteres no deben estirarse sin motivo, pues las tipografas son una parte muy importante y deben respetarse. A la Izquierda: Todas las lneas empezarn tan a la izquierda como sea posible (dentro del recuadro de texto que hayamos definido). Centrar: Las lneas se distribuyen a la derecha y a la izquierda del punto medio del Prrafo. A la derecha: Todas las lneas empezarn tan a la derecha como sea posible (dentro del recuadro de texto que hayamos definido). Justificado: El texto se ensancha si es necesario con tal de que no quede "dentado" por ninguno de sus lmites. El resto de opciones nos permiten determinar los mrgenes (izquierdo y derecho), los sangrados de prrafo y el espacio interlineal.
TIPOS DE TEXTOS
Como ya hemos comentado, Flash distingue entre diversos tipos de textos y les da un tratamiento especial, segn el tipo que sean. Todos los tipos de textos responden a las propiedades comentadas en los puntos anteriores, y es en el Tipo de texto en lo que se diferencian. El tipo de texto se puede modificar desde el Panel Propiedades sin ms que haciendo clic sobre la pestaa "Tipo de texto":
TEXTO ESTTICO
El Texto Esttico se caracteriza por no presentar ningn cambio a lo largo de la animacin. Es importante que no confundamos la palabra "esttico" con que el texto no se mueva o malinterpretemos la frase "es el texto que no presenta cambios a lo largo de la animacin". Lo que queremos decir es que no cambia el contenido del recuadro de texto, es decir, que el texto puede estar animado (girar, cambiar de color...) y sin embargo ser esttico. As, un recuadro de texto en el que pone "Aprendamos Flash" durante toda la pelcula, es esttico, aunque dicho texto cambie de posicin, forma o color. Los textos estticos slo tienen 2 propiedades extras:

Usar Fuentes del Dispositivo: Esta opcin permite que la pelcula Flash emplee las Fuentes que tenga instaladas el usuario que ve la pelcula en su ordenador. Si dicho usuario dispone de las fuentes que hemos utilizado en la pelcula, la ver exactamente como queremos que la vea, pero si no las tiene, Flash emplear la fuente que ms se le parezca. Esto muchas veces lleva a que el resultado final (el que ve el usuario) no se parezca al que pretendamos, por lo que suele ser conveniente mantener esta opcin sin seleccionar, aunque esto conlleve un mayor tamao de la pelcula final. Seleccionable: Con esta opcin activada el usuario podr seleccionar los textos que aparezcan en la pelcula (cortarlos, copiarlos...) Actvala si lo crees conveniente.
TEXTO DINMICO
El Texto Dinmico en contraposicin al esttico s que puede cambiar su contenido (adems de estar animado). Su uso es bastante ms complejo que el del Texto Esttico, ya que cada recuadro de texto Dinmico puede ser una variable modificable mediante ActionScript, esto quiere decir que los valores y propiedades de este tipo de textos se pueden modificar mediante programacin. Un uso comn que suelen tener es el de representar los textos introducidos mediante Textos de Entrada Tienen multitud de propiedades, accesibles desde el Panel Propiedades, se puede decidir el nmero de lneas que van a tener, se puede introducir texto HTML, se puede aadir fcilmente un borde al texto o dar nombre a la variable que represente al texto Dinmico.
TEXTO DE ENTRADA
El Texto de Entrada tiene bsicamente las mismas propiedades que el Texto Dinmico, junto con algunas propias de un tipo de texto orientado a la introduccin de datos por parte de usuario, como por ejemplo el nmero mximo de lneas que puede introducir en ese campo de texto o si queremos que lo que el usuario escriba en dicho campo aparezca como asteriscos (para las contraseas). Evidentemente este tipo de texto se reflejar en nuestra pelcula como un recuadro de texto SIN contenido, ya que lo deber introducir el usuario. Como hemos mencionado antes, este tipo de texto se puede combinar con el Texto Dinmico. Flash permite crear animaciones de texto tan interactivas como las que pueden crear con imgenes (ya hemos visto lo sencillo que es convertir un texto en un enlace a otra pgina web). An as, crear animaciones con textos, que sobrepasen a las que Flash incorpora por defecto (colores, transparencias, brillos, rotaciones, movimientos o combinaciones de estos) puede resultar un trabajo de muchsimas horas y mucha paciencia. Los resultados son increbles, pero puede resultar recomendable en estos casos usar algunos programas diseados con este objetivo. Entre otros destacan el Swish, el FlaX o el MiX-Fx, con ellos podrs crear efectos de texto asombrosos en pocos minutos, aunque no podrs gozar del entorno de Flash ni podrs emplear el resto de herramientas de que dispone Macromedia Flash. ACTIVIDAD

Creacin de animaciones sencilla de texto por interpolacin de movimiento y forma Flash puede crear dos tipos de animaciones interpoladas: interpolacin de movimiento e interpolacin de formas. En la interpolacin de movimiento, se definen propiedades tales como la posicin, el tamao y la rotacin de una instancia, un grupo o un bloque de texto en un instante especfico, y despus estas propiedades se pueden cambiar en otro momento. En la interpolacin de formas, se dibuja una forma en un instante especfico y despus se modifica o se dibuja otra forma en otro instante. Flash interpola los valores o formas de los fotogramas intermedios para crear la animacin. La animacin interpolada es una forma eficaz de crear movimiento y realizar cambios ya que reduce al mnimo el tamao del archivo. En esta animacin, Flash slo guarda los valores de los cambios producidos entre fotogramas.
1.
2. 3.
4.
En el inspector de propiedades modifica las dimensiones de la pelcula con los valores 500 de ancho y 150 de alto y aplica como fondo del documento un color azul oscuro (#000066) tambin puedes seleccionar en men Modificar > Documento o presionar las teclas control + J Selecciona la herramienta texto en la caja de herramientas y elige el color blanco para el relleno Elige en el men texto, dentro de la opcin Tamao, 48 (tamao de texto) Pulsa en la parte superior izquierda del recuadro y escribe FLASH, si el texto abarca varias lneas estira el rea de texto en el recuadro inferior del cuadro de texto hasta convertirlo en una lnea Cuando termines de escribir y alinear el texto, selecciona la herramienta flecha (flecha negra) en la caja de herramientas. En la lnea de tiempo selecciona la casilla de la posicin 25 Selecciona en el men Insertar > Lnea de tiempo > Fotograma Clave. Pulsa en cualquier lugar de la escena para quitar la seleccin. Pulsa sobre el texto y arrstralo hacia la derecha.
En el fondo se aplica un color azul oscuro, observa la lnea de tiempo, aparece un fotograma clave Aparece el cursor con signo + con letra A en la parte inferior Aparece el texto en la escena El texto de fija en la escena y el puntero se convierte en una flecha. Queda marcado de color negro la casilla Aparece un circulo en la casilla y el texto aparece seleccionado El texto deja de estar seleccionado. El texto se desplaza Se activa las propiedades en el inspector Aparece una lnea continua entre las casillas 1 y 25 El texto se desplaza lentamente
5. 6.
7.
8. 9. 10.
En la lnea de tiempo, en la capa 1 selecciona cualquier casilla entre la primera y el 25 11. En el Inspector de propiedades selecciona la opcin Movimiento en cuadro Animar. 12. Para ver la animacin pulsa la tecla enter
ACTIVIDAD - 32 - | Aprendamos Macromedia Flash 8

1. 2. 3. Crea una nueva pelcula y utiliza el color negro para el fondo Selecciona la herramienta texto La escena toma el color negro
en el Inspector de propiedades, selecciona Arial Black como tipo de letra, color blanco y tamao 96 4. en la escena, inserta un bloque de texto y escribe la letra P 5. selecciona la casilla 10 e inserta un fotograma clave presionando la tecla de funcin F6 6. Edita el texto y cambia la letra P por una E (haz clic sobre el texto P y brralo y escribe la nueva letra)
Aparece la letra P con las caractersticas indicadas Aparece la misma letra en la casilla 5 Aparece la letra E

7.
8.
repite los dos ltimos pasos en la casilla 20 y 30, insertando en cada una de ellas las letras R y U Selecciona la casilla 1 y elige en el men modificar la opcin separar o presiona las teclas Control + B repite este ltimo paso para las casillas 10, 20 y 35
9. 10.
La lnea de tiempo ten 4 fotogramas claves y fotogramas de duraci El texto aparece pontos negros lo indica que se convierte objeto Casillas con fotogram clave
Para crear la interpolacin en un solo paso, selecciona todas las casillas, pulsando sobre el nombre de la capa 11. En el inspector de propiedades selecciona la opcin forma en el cuadro animar:. 12. Presiona las teclas Control + Enter para probar la animacin
Las casillas aparecen lneas continuas de co verde claro Texto cambia de forma
Las animaciones en la lnea de tiempo.- Flash distingue la animacin fotograma por fotograma de la interpolada en la lnea de tiempo de la siguiente forma: Las interpolaciones de movimiento se indican mediante un punto negro al principio del fotograma clave; los fotogramas interpolados intermedios tienen una flecha negra con un fondo azul claro. Las interpolaciones de formas se indican con un punto negro en el fotograma clave inicial; los fotogramas intermedios tienen una flecha negra con un fondo verde claro. Una lnea discontinua indica que la interpolacin se ha interrumpido o est incompleta, por ejemplo, cuando falta el fotograma clave final. Un fotograma clave sencillo viene indicado por un punto negro. Los fotogramas en gris claro despus de un fotograma clave sencillo tienen el mismo contenido sin ningn cambio y tienen una lnea negra con un rectngulo vaco en el ltimo fotograma del recorrido. Una a pequea indica que al fotograma se le asign una accin de fotograma con el panel Acciones. Una bandera roja indica que el fotograma contiene una etiqueta o un comentario. Un ancla dorada indica que el fotograma es un anclaje con nombre.
Consejos de forma Para controlar cambios de forma ms complejos o improbables utilice los consejos de forma. Los consejos de forma identifican puntos que deben corresponder en las formas inicial y final. Por ejemplo, si est interpolando el dibujo de una cara mientras cambia de expresin, puede marcar cada ojo con un consejo de forma. A continuacin, en lugar de que la cara se convierta en una figura amorfa durante el cambio, los ojos siguen siendo reconocibles y cambian de manera independiente durante el proceso
Los consejos de forma tienen letras (de la a hasta la z) para identificar los puntos que se corresponden en las formas inicial y final. Puede utilizar hasta 26. Los consejos de forma aparecen de color amarillo en los fotogramas clave iniciales, verde en los fotogramas clave finales y rojo cuando no se encuentran en una curva. Para obtener un resultado ptimo al interpolar formas, siga las directrices que se indican a continuacin: En la interpolacin de formas complejas, cree formas intermedias e interplelas en lugar de definir slo la forma inicial y final. Compruebe que los consejos de forma son lgicos. Por ejemplo, si est utilizado tres consejos de forma para un tringulo, deben estar en el mismo orden en el tringulo original y en el tringulo que se va a interpolar. El orden no puede ser abc en el primer fotograma clave y acb en el segundo. Es preferible colocar los consejos de forma en sentido contrario a las agujas del reloj a partir de la esquina superior izquierda de la forma. Para utilizar consejos de forma: 1 Seleccione el primer fotograma clave de una secuencia de forma interpolada. 2 Elija Modificar > Forma > Aadir consejo de forma. El consejo de forma inicial aparece como un crculo rojo con la letra a en algn lugar de la forma. 3 Colquelo en un punto que desee marcar. 4 Seleccione el ltimo fotograma clave de la secuencia. El consejo de forma final aparece en algn lugar de la forma como un crculo verde con la letra a. 5 Coloque el consejo de forma en el punto de la forma final que debera corresponder con el primer punto marcado. 6 Vuelva a ejecutar la pelcula para ver el cambio introducido con los consejos de forma. Mueva los consejos de forma para afinar la interpolacin. 7 Repita el proceso para agregar ms consejos de forma. Los nuevos consejos aparecen con las letras siguientes (b, c, etctera). ANIMACION DE TEXTO CON PLANTILLAS Hasta ahora estbamos animando con el estilo tradicin de animacin en flash. La nueva versin de flash profesional incluye

algunas plantillas pre establecidas para la animacin de texto sobre la lnea de tiempo que son Desenfocar, Expandir, explotar y sombra. DESENFOCAR: Crea un texto en el documento (DESENFOCAR), Haz clic con el botn derecho sobre el texto Selecciona Efectos de lnea de tiempo > Efectos > Desenfocar
EXPANDIR: Crea un texto en el documento (EXPANDIR), Haz clic con el botn derecho sobre el texto Selecciona Efectos de lnea de tiempo > Efectos > Expandir
EXPLOTAR: Crea un texto en el documento (EXPLOTAR), Haz clic con el botn derecho sobre el texto Selecciona Efectos de lnea de tiempo > Efectos > Explotar
SOMBRA: Crea un texto en el documento (SOMBRA), Haz clic con el botn derecho sobre el texto Selecciona Efectos de lnea de tiempo > Efectos > Sombra Para cada cambio que se realice en las ventanas de configuracin de las animaciones debemos de actualizar la vista para ver el cambio.
Responde al siguiente cuestionario:
1. Cules son los mtodos de animacin usados por Flash? .................................................................................................................................................... ............................................................................................................................................................ .
2. Para insertar un fotograma clave se presiona la tecla? .................................................................................................................................................... ............................................................................................................................................................ .
3. Qu diferencia existe entre (enter) y (control + enter) al momento de probar la animacin) ........................................................................................................................................................ ............................................................................................................................................................... ............................................................................................................................................................. Investiga Cuntas clases de fotogramas existen en flash? y Cules son? ........................................................................................................................................................ ............................................................................................................................................................... .............................................................................................................................................................
GRFICOS VECTORIALES Y MAPA DE BITS

Cuando nos encontramos trabajando con imgenes en cualquier programa de Windows, hay una consideracin muy importante a tener en cuenta: Las imgenes se pueden almacenar de dos formas completamente distintas, en modo vectorial o en modo mapa de bits. Imgenes Vectoriales
imagen Las imgenes que utilizan este sistema se almacenan como una serie de Vectorial: imagen que no coordenadas y datos, que son interpretados por el programa de tratamiento pierde calidad de imagen.
Para aclararnos, supongamos que almacenamos una lnea azul en modo vectorial. Para definir una lnea solamente necesitamos conocer la posicin del punto inicial y el punto final. As que eso es lo nico que almacenar, su punto de inicio, su punto final y el color de la lnea. Cuando el programa abra ese fichero representar la lnea completamente a partir de esos datos. La Imagen Mapa de Bitsventaja del diseo vectorial es que est lnea no perder calidad y el : imagen que fichero ocupar muy poco espacio, puesto que almacena muy pocos datos. muestra pxeles a mayor zoom Mapa de Bits El otro sistema que utiliza para almacenar es la de guardarlas como un conjunto de puntos de colores. Cada punto de la imagen se almacena guardando su color. Este sistema es desde luego mucho peor para almacenar una simple lnea, h de guardar mucha informacin, pero en cambio es ideal para fotografas o imgenes con muchos elementos y cambios de color.
ACTIVIDAD MOVIMIENTO DE SMBOLOS 1. Crea una nueva pelcula (500 x 150) y utiliza el color celeste para el fondo 2. Selecciona en Menu Archivo > Impotar > Importar a escenario y selecciona la imagen Avion1.GIF de la carpeta RecursosFlash. 3. Hagamos clic con el botn derecho del mouse sobre la imagen importada y selecciona Convertir en Smbolo del men 4. En la ventana de dialogo coloca avion como nombre del smbolo y asgnale el comportamiento de grfico y acepta los cambios. La escena toma el color celeste Aparece la imagen de un avin en el escenario Aparece una ventana de dialogo Aparece la imagen con un cuadro de color celeste

5. selecciona la casilla 36 e inserta un fotograma clave presionando la tecla de funcin F6 6. Selecciona cualquier casilla entre el primero y el 36, para crear la interpolacin 7. En el inspector de propiedades selecciona la opcin movimiento en el cuadro animar:. 8. Presiona las teclas Control + Enter para probar la animacin ACTIVIDAD MOVIMIENTO DE SMBOLOS Creacin de animacin sencilla de objetos por interpolacin de forma El otro modelo de interpolacin de flash, se basa en convertir una figura en otra a travs de varios fotogramas, en este caso usaremos formas lo ms sencillas posibles. Aparece un punto negro en la casilla 36 Las casillas aparecen lneas continuas de color morado con una flecha La imagen se anima
0 1
02
0 3
1. En una nueva pelcula, y dibuja un triangulo utilizando la herramienta Lpiz, comprueba que este activada la opcin enderezar en la seccin opciones de la Caja de herramientas. 2. Selecciona la herramienta cubo de pintura y elige rojo para el color de relleno y pinta el interior del triangulo 3. haz un clic sobre la casilla 10 de la capa 1 e inserta un fotograma clave 4. Elimina el triangulo (presiona la tecla supr) 5. Selecciona la herramienta rectngulo y elige amarillo para el color de relleno y dibuja un cuadrado en el escenario 6. Selecciona la casilla 20 y crea un fotograma clave. En esta ocasin elimina el cuadrado y dibuja un pentgono con la herramienta lpiz. 7. Selecciona la herramienta cubo de pintura y elige verde para el color de relleno y pinta el interior del pentgono 8. Para crear la interpolacin accede a la casilla 1 y en el inspector de propiedades selecciona forma en el cuadro Animar:. 9. Repite este ultimo paso para la casilla 10 y prueba la pelcula. Transformacin de texto libremente
El puntero se pone co de lpiz, luego apa triangulo El triangulo se pinta d indicado Se crea un fotogr aparece el tr seleccionado Aparece el cuadrado.
Aparece un pentgon casilla 20
El pentgono se pi color indicado Se muestra una lnea casilla 1 y el s fotograma
Si necesitas separar las letras de una palabra, modificar las apariencias de las letras, su curvatura, anchura, etc., puedes utilizar la opcin Separar del men Modificar. Cuando utilizamos la opcin separar, el texto pierde su categora de boque de texto y se convierte en un conjunto de figuras en forma de letras. Ejemplo
1. 2.
Con la herramienta texto escribe la palabra Sabado Selecciona el texto con la herramienta flecha
Aparece la palabra en escena

En el inspector de propiedades cambia el tipo de letra a Arial, tamao 96 y negrita Comprueba en el inspector de propiedades que el tipo de texto sea texto esttico en el inspector de propiedades amplia la distancia entre caracteres en 6 puntos En el men modificar selecciona la opcin separar (ahora cada letra es independiente para mover, etc.) Para convertirlos en formas de letras, nuevamente selecciona la opcin separar del men Modificar. Con la flecha pulsa en algn lugar de la escena para quitar la seleccin. Selecciona todas las letras menos la S En el men modificar, dentro de la opcin transformar elige Escalar, y reduce su altura. La palabra toma los nuevos atributos La distancia entre caracteres aumenta. Los caracteres aparecen seleccionados independientemente con marcos celeste Desaparece el cuadro de seleccin de texto y las letras aparecen seleccionadas como si fueran figuras. La seleccin se quita Se seleccionan las letras abado Aparece un cuadro con lneas negras y con puntos de distorsin y las letras se hacen ms pequeas.
3.
4.
5.
6.
7.
8.
9.
10.
11.
Con la herramienta subselecin, arrastra el final de la letra S, hasta que quede como en la figura de arriba. Para ello puedes usar herramienta zoom de la seccin ver 12. Haciendo uso de la herramienta flecha, selecciona nuevamente todas las letras 13. En el panel Mezclador de colores, aplica un relleno degradado radial Transformacin de objetos
Las letras aparecen seleccionadas El color del texto cambiar al del nuevo color
Puede transformar objetos grficos, adems de grupos, bloques de texto e instancias con la herramienta Transformacin libre o con las opciones del submen Modificar > Transformar. En funcin del tipo de elemento que seleccione, podr transformar, rotar, sesgar, escalar o distorsionar el elemento libremente. Se pueden cambiar o agregar elementos a una seleccin durante la operacin de transformacin. Al transformar un objeto, grupo, cuadro de texto o instancia, el inspector de propiedades para dicho elemento visualiza los cambios realizados en las dimensiones o la posicin del elemento. Durante las operaciones de transformacin que implican arrastre aparece un recuadro de delimitacin.
Modificacin de formas con el modificador de envoltura El modificador de envoltura permite deformar y distorsionar objetos. Una envoltura es un recuadro de delimitacin que contiene uno o ms objetos. Los cambios realizados en la forma de una envoltura afectan a la forma de los objetos contenidos en la envoltura. Para editar la forma de una envoltura, ajuste los puntos y los selectores tangentes.
Responde al siguiente cuestionario: 1. Qu diferencia existe entre animacin por interpolacin de forma y movimiento? ....................................................................................................... .............................................................................................................. .............................................................................................................. . 2. Qu tipo de teclado se presiona para insertar un fotograma clave? ....................................................................................................... .............................................................................................................. .............................................................................................................. . 3. En la aplicacin de rellenos(panel mezclador de colores), menciona cada una de las formas de aplicar los rellenos y menciona lo ms caracterstico de cada una de ellas. .............................................................................................................. .............................................................................................................. ........................................................................................................ 4. En base al texto modificado, experimenta con las siguientes herramientas (men modificar > transformar) y menciona los cambios que producen los mismo en el texto.
Distorsionar.- ........................................................................................ .............................................................................................................. .............................................................................................................. ................ Envoltura.- ............................................................................................ .............................................................................................................. .............................................................................................................. ............
El Panel Mezclador de Colores

El Panel Mezclador de Colores, como su nombre indica se usa para fabricar nuestros propios colores y para seleccionar los que ms nos gusten. Para seleccionar un color determinado, bastar con hacer clic en las pestaas que se encuentran junto a los iconos de las Herramientas de Lpiz y de Bote de Pintura. (Si queremos modificar el color de un borde, pulsaremos sobre la pestaa que est junto a la Herramienta Lpiz y si queremos modificar un relleno, haremos clic en la pestaa que est junto a la Herramienta Bote de Pintura.) Al hacerlo aparecer un Panel con multitud de

colores para que seleccionemos el que ms nos gusta. Tambin permite introducir el cdigo del color segn el standard que establece el HTML. Tambin se puede determinar el tipo de relleno que aplicaremos a los objetos creados (mediante la Herramienta Bote de Pintura).
Se pueden crear diferentes tipos de Rellenos Slido: Consiste en un relleno formado por un solo color. Degradado Lineal: Es un tipo especial de relleno, de modo que un color se degrada hasta convertirse en otro. Puede ir de arriba abajo o de un lado al otro Degradado Radial: Es igual que el anterior, pero los degradados tiene forma circular. Mapa de Bits: Permite colocar como relleno alguna imagen existente en la pelcula (O ajena a ella si antes se "importa")
El Panel Muestras de Color

El Panel Muestras de Color sirve para poder ver de un modo rpido y claro los colores de que disponemos, tanto slidos (un solo color) como degradados (lineales o radiales). Adems, cuando creemos un color mediante el Panel Mezclador de Colores, podremos agregarlo a nuestro conjunto de muestras mediante Agregar Muestra (que se encuentra en un men desplegable en la parte superior derecha del Panel Mezclador de Colores). Una vez est agregado el color, pasar a estar disponible en nuestro conjunto de muestras y podremos acceder a l rpidamente cada vez que trabajemos con nuestra pelcula. Cada pelcula tiene su propio conjunto de muestras y cada vez que la abramos para editarla, podremos usar las muestras que tenamos la ltima vez que trabajamos con dicha pelcula. ACTIVIDAD Creacin de animacin fotograma por fotograma La animacin fotograma por fotograma cambia el contenido del escenario en cada fotograma y es ideal para las animaciones complejas en las que la imagen cambia en cada fotograma en lugar de moverse
por el escenario. Este tipo incrementa el tamao del archivo con mayor rapidez que la animacin interpolada. En la animacin fotograma por fotograma, Flash guarda los valores de los fotogramas completos
La animacin fotograma a fotograma, en la mayora de los casos usa fotogramas clave, la lgica de animacin es la siguiente: Insertar un elemento en un fotograma clave Crear un nuevo fotograma clave Modificar un poco el elemento

Repetir los dos ltimos pasos hasta completar la animacin.
Este mtodo sobre todo es laborioso, pero los resultados pueden ser muy espectaculares. Sigue estos pasos para realizar una animacin de una gota de agua que cae. 1. En una nueva pelcula, activa la cuadricula a 25 px (ver > cuadricula > mostrar cuadricula) para un mejor diseo 2. Crea un circulo sin borde, de color celeste en una de las celdas de la cuadrilla, utiliza el zoom de la zona superior de la escena para poder ver mejor el trabajo, un 400% ser suficiente 3. Pulsa F6 para insertar un nuevo fotograma clave El fondo del escenario aparece como una hoja cuadriculada. Aparece un circulo en la escena y en la primera casilla de la capa aparece el indicador de fotograma clave. Aparece el mismo circulo y la cabeza lectora de la lnea de tiempo se ha desplazado a la segunda casilla. Con un nuevo fotograma clave. El circulo se desplaza
4. Selecciona la herramienta flecha y desplaza el crculo hacia la siguiente celda de debajo de su ubicacin actual aproximadamente la mitad del circulo. 5. has un clic en cualquier parte de la escena para quitar la seleccin del circulo 6. Transfrmalo levemente con la herramienta flecha modificando los bordes del circulo, para que parezca que se est cayendo. 7. Repite del pasos 3 al 6, hasta tener 10 fotogramas claves como se observa en la figura de la parte de abajo 8. Para ver la animacin pulsa enter o control + enter. 9. Cambia el nombre de la capa 1, por la de gota, para ello has doble clic sobre el nombre de capa 1
Se quita la seleccin Al momento de acercarte al borde el puntero aparece con un arco pequeo, esto nos permite modificar los bordes.

Para mejorar la animacin, crea una nueva capa y asgnale el nombre de cao, en ella dibuja un cao de agua al inicio de la cada de la gota de agua. Crea otra capa y denomnala fondo, en ella crea un ambiente para la animacin.
Edicin de animaciones Tras crear un fotograma o un fotograma clave, puede moverlo a otro lugar de la capa actual o a otra capa, eliminarlo y hacer otros cambios. Slo puede editarse los fotogramas clave. Puede ver fotogramas interpolados, pero no editarlos directamente. Para editar fotogramas interpolados, cambie uno de los fotogramas clave de definicin o inserte un nuevo fotograma clave entre el inicial y el final. Edicin con papel cebolla En general, Flash slo muestra un fotograma de la secuencia de animacin en el escenario. Para facilitar la ubicacin y edicin de la animacin fotograma por fotograma, puede ver varios fotogramas a la vez en el escenario. El fotograma situado bajo la cabeza lectora aparece de color normal, mientras que los fotogramas circundantes aparecen atenuados; cada fotograma parece estar dibujado sobre hojas de papel traslcido (papel cebolla) colocadas una encima de otra. Los fotogramas atenuados no pueden editarse. Para ver varios fotogramas de una animacin en el escenario de forma simultnea Haga clic en el botn Papel cebolla: .
Todos los fotogramas entre los marcadores Iniciar Papel cebolla y Finalizar Papel cebolla (en el encabezado de la lnea de tiempo) aparecen superpuestos como un solo fotograma en la ventana de la pelcula. Para controlar la visualizacin del papel cebolla, realice una de las siguientes acciones: Para ver los fotogramas de papel cebolla como contornos, haga clic en el botn Contornos de papel cebolla.

Para cambiar la posicin de los marcadores de papel cebolla, arrastre el puntero hasta la nueva ubicacin. En general, los marcadores se mueven de forma conjunta con el puntero del fotograma actual. Para poder editar todos los fotogramas situados entre los marcadores de papel cebolla, haga clic en el botn Editar varios fotogramas. En general, la opcin Papel cebolla slo permite editar el fotograma actual. Sin embargo, puede ver el contenido de cada fotograma situado entre los marcadores y editarlo aunque no se trate del fotograma actual.
Nota: las capas bloqueadas (con el icono del candado) no aparecen cuando se activa la opcin de papel cebolla. Para evitar la confusin producida por mltiples imgenes, puede bloquear u ocultar las capas que no desea visualizar con esta opcin. Para cambiar la visualizacin de los marcadores de papel cebolla: Haga clic en el botn Modificar marcadores de papel cebolla y elija un elemento del men: Mostrar marcadores siempre muestra los marcadores en el encabezado de la lnea de tiempo, est activada o no la opcin de papel cebolla. Anclar marcas de papel cebolla bloquea los marcadores en la posicin actual en el encabezado de la lnea de tiempo. En general, el rango de papel cebolla es relativo al puntero del fotograma actual y los marcadores de papel cebolla. Al anclar los marcadores evita que se muevan con el puntero del fotograma actual. Papel cebolla 2 muestra dos fotogramas a cada lado del fotograma actual. Papel cebolla 5 muestra cinco fotogramas a cada lado del fotograma actual. Papel cebolla todo muestra todos los fotogramas a cada lado del fotograma actual. Responde al siguiente cuestionario: 1. Dibuja la forma que toma el cursor al memento de modificar los contornes de un objeto (gota de agua)
2.
Al hacer uso de la herramienta subseleccin, que elementos aparecen en el objeto modificado? 1. . _ _ _ _ _ _ _ _ _ _ _ _ _ _ 2.- _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _

PRINCIPIOS DE LA ANIMACIN El arte de una animacin correcta se basa en dos cosas: slido conocimiento de dibujo y un gran deseo de conocer cmo se comporta cada cosa que nos rodea. Los animadores son maestros del movimiento y resuelven de modo creativo los problemas. Si no vemos una solucin simplemente lo creamos. Somos actores con lpices, Debemos estudiar y entender el rendimiento de emociones y los conceptos fsicos. Un animador de xito ve el mundo que los rodea como si transcurriese a cmara lenta. Existen muchos principios que se aplican a la hora de crear una buena animacin. Vamos a explorar algunos de los mtodos que ayudan a hacer a los personajes y los movimientos algo entretenido y, sobre todo, creble, Estas tcnicas dan vida a la animacin y segn progresemos, las conexiones entre ellas ser ms notoria. Las tcnicas y los principios de los que vamos a hablar en esta seccin son los siguientes: Fotograma Clave Encoger y estirar Lapso temporal Anticipacin, accin, reaccin y trasladacin de la accin Arcos Animacin de personajes y especificas de los mismos
Fotograma Clave En flash, los fotogramas clave son el equivalente a los puntos clave de la animacin clsica. Los puntos clave son las poses ms extremas o sutiles de movimiento trazadas antes de la animacin. Una vez creadas las poses se trabaja el lapso temporal de una clave de dibujo a otra. Flash crea las animaciones intermedias gracias a la interpolacin de movimiento. Muchas veces deberemos ajustar las animaciones interpoladas aadiendo ms fotogramas clave para lograr el movimiento deseado. Encoger y Estirar Al encoger y estirar los personales conseguimos que aparenten ser de carne y hueso. Se proporciona la sensacin de uniformidad y volumen a los personajes. Sin la posibilidad de encoger y estirar los personajes pareceran muy rgidos como si fueran de piedra. La teora fundamental que se esconde detrs de las reacciones del sujeto tiene que ver con la velocidad y las fuerzas de movimiento. Es importante mantener los volmenes en el sujeto slido durante toda la animacin, sin importar si est encogido o estirado. Lapso Temporal Hay dos reinos temporales de los que debe de ser consiente un animador: el lapso temporal del movimiento y el lapso temporal del rendimiento. Se trata de dos elementos cruciales que aaden a la animacin su credibilidad y atractivo. El lapso temporal del movimiento proporciona a la animacin un sentido de peso y gravedad. Aumentar la velocidad o disminuirla son aspectos importantes de un lapso temporal creble. Tambin llamados tiempo de demora, estos aspectos se utilizan para que los puntos iniciales o los puntos ms altos de un movimiento no sean robticos. Tambin proporcionan a un objeto ese momento de ingravidez cuando alcanza el punto ms alto de un arco. Vamos a crear una animacin de que basa plenamente en los principios temporal del movimiento y del rendimiento.
PRACTICA PELOTA BOTANDO
1. Inicia un proyecto de flash y establece la velocidad de los fotogramas a 24 fps. Cambia el nombre de la capa existente por Pelota. Seleccione la herramienta valo. Mantenga pulsada la tecla mayus mientras crea un crculo. (al pulsar la tecla mayus la herramienta trazar un circulo perfecto, en lugar de un ovalo) 2. A continuacin, seleccione el circulo (haga doble clic sobre l para seleccionar tanto el trazo como el relleno) y pulse la tecla F8 para convertirlo en un clip de pelcula. Llame al clip de pelcula Pelota. Asegrese de que la pelota tenga el tamao y escala sean similares a la del dibujo, de lo contrario el lapso de tiempo ser distinto al utilizado en el ejemplo.
3. Cree una nueva capa y llmela fondo. Colquela bajo la capa en la que est la pelota (pelota). En esta capa dibuje un sencillo fondo con una lnea horizontal para la orientacin en la que se sita el plano del fondo y bloquee la capa pelota.
4. En la lnea de tiempo, vaya al fotograma 14 e inserte un fotograma en ambas capas ejecutando Insertar > Lnea de

tiempo > Fotograma o pulsando la tecla F5. como est animando a una velocidad de 24 fps, los 14 fotogramas tericamente son la mitad aproximadamente. Creemos que se trata de un buen lapso temporal en este caso. Este ejercicio desarrolla una animacin en bucle y eso significa que no deber tener un comienzo o final (la pelota botara por siempre). Por lo tanto, el ultimo fotograma debe estar unido al primero. Cuando se reproduzca el ltimo fotograma de la animacin, la pelota debera estar en una posicin en la que coincida con la del fotograma 1. si no es as, la animacin parecer detenerse cada vez que pase de nuevo al fotograma 1. para lograr esta continuidad revise el siguiente paso. 5. Seleccione la pelota del fotograma 1 y observe el pequeo hueco circular en el centro del clip de pelcula (quizs est en la parte superior del punto de registro del clip de pelcula) ahora puede mover este circulo llamado punto central, utilizando la herramienta Transformacin libre y cambiando el punto desde donde se escala, rota, sesga, etc una instancia. 6. En el fotograma 14 de la capa pelota. Cree un fotograma clave ejecutando Insertar > lnea de tiempo > fotograma clave o pulsando la tecla F6, selecciona cualquiera de los primeros 14 fotogramas de la capa pelota y cree una interpolacin de movimiento en el inspector de propiedades o a travs del men contextual que aparece al hacer clic con el botn derecho del ratn o ejecutando Insertar>Lnea de tiempo>>crear interpolacin de movimiento. Como el fotograma 14 es ahora un fotograma clave idntico al fotograma 1, la animacin se desarrollar en un bucle. Sin importar dnde mueve la pelota entre los fotogramas 2 y 13, siempre terminar en este punto para coincidir con el primer fotograma. As se crea un bucle de animacin.
cuando la pelota bote hacia arriba, estar luchando contra la fuerza de la gravedad y por lo tanto se mover ms lentamente que cuando cae (porque se ve empujada por la gravedad) 7. En el fotograma 4, cree un fotograma clave (F6) en la capa pelota y mueva la pelcula (objeto pelota) hasta su posicin aplastada, que es el punto de impacto contra el suelo. 8. Seleccione la herramienta Transformacin Libre en el fotograma 4 y sela par aplastar y estirar el objeto pelota. Trabaje siempre con la altura y anchura al estirar y aplastar. Cuando ms aplaste la pelota, ms necesitar compensar la anchura. Es importante compensar de este modo para mantener

la verosimilitud del volumen de la pelota, observe como el punto central podr conservar la posicin de la pelota.
tanto al caer como al elevarse, querr estirar la pelota para dar la sensacin de que est desplazndose rpidamente. Este efecto ser un poco ms brusco al caer pues la pelota se mover ms rpidamente. 9. Seleccione el fotograma 2 y cree otro fotograma clave. En el fotograma clave estire la pelota verticalmente y encoja horizontalmente. Querr que la pelota vuelva a sus proporciones originales despus del estiramiento que acaba de crear y antes del impacto contra el suelo 10. Seleccione y copie el fotograma 1. pegue este fotograma en el fotograma 3. sin o aade este fotograma clave quizs la interpolacin del movimiento har que la pelota adquiera una posicin aplastada antes de alcanzar el suelo y eso no sera correcto. Al duplicar el fotograma 1 en el 3 volver a crear las proporciones originales una vez la pelota se estire y en el instante anterior a que se aplaste contra el suelo. Sin embargo como hemos copiado y pegado el primer fotograma, la pelota estar en la posicin equivocada. 11. Seleccione la herramienta papel cebolla y haga clic en la capa pelota para acceder al modo de silueta, que facilitar la visualizacin, mueva la pelota del fotograma 3 hacia debajo de modo que quede libremente bajo la posicin estira del fotograma 2 y ligeramente sobre la posicin aplastada del fotograma 4.

Vamos a animar la pelota botando hacia arriba y en el punto ms alto del arco, recuerde que el ascenso ser ligeramente ms lento, pues la pelota estar luchando en contra de la gravedad por lo tanta, los fotogramas claves no estar tan cerca entre si al caer; existir ms tiempo entre los fotogramas clave. De nuevo, la pelota debera recuperar sus proporciones circulares originales antes y despus de que estire el botar hacia arriba.
Ahora la lnea de tiempo debera de mostrar el siguiente aspecto
12. Ahora debe estirar la pelota antes de que alcance el punto ms alto del arco. Cree un fotograma clave en el fotograma 8. Estire la pelota verticalmente 13. Copie el fotograma 3. pguelo en el fotograma 6. de este modo har que la pelota conserve sus proporciones originales despus de aplastarse contra el suelo y antes de estirarse.
FOTOGRAMA 6 FOTOGRAMA 8
Ahora debe de aadir el tiempo de demora. Como el fotograma 1 y 14 son idnticos, la pelota aparentar golpear una pared invisible. Durante un breve instante se detendr bruscamente, algo que deberamos evitar. Es necesario suavizar el movimiento de entrada y de salida en el punto ms alto. Para ello, cree otro fotograma clave que haga que la pelota se eleve ms que en los fotogramas 1 y 14 14. Copie y peque el fotograma 14 en el fotograma 10. en el fotograma 10, seleccione el regulador de aceleracin del inspector de propiedades y elija el valor de 100
15. En el fotograma 12 cree ahora otro fotograma clave y mueva la pelota al punto ms alto que alcance la pelota. Ese punto ya no estar en los fotogramas 1 y 14 Imagine lo que siente su estomago cuando conduce su auto a alta velocidad subiendo una colina. Esa ser la sensacin que quiera que tenga la pelota (aparicin momentnea de ingravidez). Aadiendo ms tiempo en menos espacio fsico en ese punto lo conseguir. 16. En el fotograma 12 ajuste el fotograma la aceleracin a 100. eso har que la pelota vaya decelerado hasta el fotograma 14. La lnea de tiempo definitiva debera de aparecerse a la imagen del ejemplo.
para darle mayor realismo agrega una nueva capa y en ella desarrolla la sombra de la pelota, puedes utilizar los fotogramas 1, 4, 6 y 14 para crear los puntos de animacin. Adems de la animacin tradicional podemos realizar otros tipos de animacin utilizando lenguaje de programacin script. Para conseguir animaciones relacionadas

ACTIVIDAD Botando una pelota Para el siguiente ejemplo configuramos el documento a 550 x 400 pixels, a 30 fps con fondo blanco. Luego, crearos una lnea de horizonte, utilizamos para ello un rectngulo de 125 px de alto y 550 de ancho.
Dibuja la pelota, es un crculo de 25 x 25 pixels con un degradado radial de blanco a negro (En vez de una pelota puedes usar un personaje del estilo de una rana, y queda bastante divertido) Lo primero es hacer el clip de la pelota. Seleccionamos nuestro dibujo, pulsamos F8 y creamos un smbolo de tipo grfico al que llamamos pelota. Como centro de Transformacin elegimos el Centro y Abajo. Una vez convertido en Smbolo volvemos a pulsar F8 y creamos un smbolo de tipo MovieClip tambin con el centro de transformacin Abajo y al Centro. Es en este Movieclip donde vamos a Crear nuestra animacin, En este MovieClip vamos a utilizar 3 capas como se muestra en la imagen. Una para la animacin, una capa gia y otra para la acciones.

Una vez hecha la animacin de la pelota, tienes que medir cul ha sido exactamente el desplazamiento en el eje "x". En el caso de la animacin del ejemplo es 82 Si pruebas la pelcula, ya tendremos nuestro bote animado pero nos encontramos con dos pequeos problemas. El primero que la pelota bota sobre el mismo sitio, y el segundo que el primer y ltimo fotograma se repiten. Para arreglar estos dos problemas metemos este cdigo en el penltimo fotograma: gotoAndPlay(1); this._x += 67.5; La primera lnea de cdigo hace que no se reproduza el ltimo fotograma y as evitamos la superposicin. La segunda incremente en "x" la cantidad de pixels que necesitamos para que la pelota avance sin que se note un salto, si probamos la animacin de la pelota bota hasta llegar al final pero no regresa Para que la pelota vuelva por la izquierda cuando sale por la derecha yo he usado esto. Aunque puedes usar muchsimos mtodos distintos if (this._x > 550){ this._x = -25; } Y con esto hemos conseguido una animacin completa en infinita con tan solo 15 fotogramas y 5 lneas de cdigo. Para que la animaci sea mas realizaste puedes modificar su anchura y altura de la pelota con la finalidad de darle realismo a la animacin.

Efecto de rebote gravitacional por ActionScript Uno de los efectos que muchas veces no usamos en nuestras pelculas, pero que quisiramos de todos modos aprender, es el efecto de la gravedad. Vamos a ver simplemente como aplicar el efecto, de acuerdo a un aumento de un valor, que nos permitir ver como aparentemente nuestro objeto "cuadro" cae.
Cambiemos la velocidad de fotogramas a "30". En la capa 1 creamos un rectngulo y lo convertimos en un clip de pelcula presionando F8, y le daremos nombre de instancia, "objeto"
En una nueva capa, asignamos las siguientes acciones: fuerza = 1;7 velocidad = 0; _root.onEnterFrame = function() { velocidad += fuerza; objeto._y += velocidad; }; Ahora probemos la pelicula ("ctrl + enter"). Entendamos estas cortas lneas: fuerza = 1; velocidad = 0; fuerza y velocidad son nuestros valores iniciales, fuerza es la unidad que nos indica la fuerza con que caer el "objeto", pero, al estar dentro del controlador "onEnterFrame", sera acumulativo, es decir :

1, 1+1, 2+1, 3+1, 4+1 ... etc, y gravedad es el movimiento cuando nuestro clip "objeto", aun no ha sido liberado. _root.onEnterFrame = function() { en nuestra escena principal, crearemos nuestro controlador de eventos "onEnterFrame" a la que asignaremos una funcion. velocidad += fuerza; la velocidad inicial de nuestro clip "objeto"= es 0, pero aumentara de acuerdo a ese acumulado de valores que mencionamos antes. objeto._y += velocidad; finalmente asignaremos ese incremento de valores a nuestro clip "objeto", para darle el efecto de "caida" o "gravedad", Hasta aqui todo va muy bien, pero ahora vamos a crear un efecto rebote a partir de este efecto "gravedad" Agreguemos estas onEnterFrame lneas dentro de nuestro controlador
if (objeto._y>400) { objeto._y = 400; velocidad *= -1; } entonces las lneas quedaran de la siguiente forma. fuerza = 1; velocidad = 0; _root.onEnterFrame = function() { velocidad += fuerza; objeto._y += velocidad; if (objeto._y>400) { objeto._y = 400; velocidad *= -1; } }; Analicemos las lneas que hemos agregado: if (objeto._y>400) { objeto._y = 400; cuando "objeto" supere la posicin limite inferior de la pelcula, esta lnea evita que "objeto" siga cayendo. Si su pelcula tiene una altura diferente, solo cambien ese 400 por dicha altura. velocidad *= -1; multiplicamos el valor de la cada por (-1), lo que crea el efecto de rebote. Por pura curiosidad, cambiemos el valor de velocidad en esta ultima linea por 0.95, veremos como cada vez rebota menos nuestro "objeto".

ACTIVIDAD Efecto de nieve en Flash Debemos abrir un nuevo documento de Flash y cambiar el color blanco del fondo del escenario por uno oscuro que permita distinguir el efecto de nieve que se pretende realizar.
Crear un Clip de pelicula, seleccionando en el men: Insertar > Nuevo smbolo y nombrarlo nieve
Dentro de dicho Clip de Pelcula, dibujar un crculo blanco sin bordes, con la herramienta valo, de aprximadamente 4 x 4 pxeles. Seleccionar en la biblioteca del Clip de pelcula (nieve) y haz clic sobre l, con el botn derecho del mouse. En el men hacer click a la opcin Vinculacin y seleccionar la opcin Exportar para ActionScript . Este Clic de Pelcula ser el copo de nieve que posteriormente se programar.
Crear otro Clip de pelcula cuyo nombre ser Control, de igual forma que el anterior tambin exportar para actinscript, y dejarlo en blanco. Regresa al escenario y Arrastrarlo al escenario y ponerle por nombre de instancia control_cs .
Crear un tercer Clip de Pelicula cuyo nombre ser Ice, donde dibujar un rectngulo sin bordes y de color blanco con alpha 14% (tambin se exporta para ActionScript), este Clip de pelcula es para realizar el efecto de que la nieve se acumula.
Crea otro clip de pelcula y llamado poster la misma que contiene el dibujo de un cartel, y en el borde superior de dicho cartel coloca el Clip de Pelcula Ice, luego asigna como el nombre de instancia Ice_cs.
Regresa al escenario e introduce el carte y asignale como nombre de instancia poster_cs. Crea una nueva capa y denominala acciones, en esta capa posteriormente, se procede a programar el evento onEnterFrame para que cada vez que entre se ejecute la funcin que crea los copos de nieve llamada, en este caso, AnimacionNieve . control_cs.onEnterFrame = function() { AnimacionNieve(); }; Posteriormente se programa la funcin createSnow:
function AnimacionNieve() {
/* Crea un copo de nieve a partir de nieve que est en la biblioteca */
i = _root.getNextHighestDepth(); tmp = _root.attachMovie("nieve", "nieve_cs"+i, i);

/* El copo de nieve cae desde una posicin horizontal en [1,550] */
tmp._x = nieveazar (1, 550);

/* Inicialmente, se coloca el copo de nieve fuera del escenario */

tmp._y = -1;
/* Ahora se particulariza el copo de nieve estableciendo aleatoriamente su transparencia, * velocidad y tamao */
tmp._alpha = nieveazar (50, 100); tmp.speed = nieveazar (1, 10); tmp._xscale = nieveazar (70, 110); tmp._yscale = tmp._xscale;
/* Todo copo de nieve inicia su descenso inmediatamente despus de creado */
tmp.moving = true; tmp.onEnterFrame = movernieve; }

/* moveSnow es responsable de la dinmica del copo de nieve */
Ahora se programa la funcin movernieve.

function movernieve() {
/* Si el copo est en movimiento... */
if (this.moving) {
/* El copo desciende segn su velocidad prefijada */
this._y += this.speed;
/* Para mayor realismo, el copo experimenta un desplazamiento lateral, oscilatorio */
this._x += Math.cos(this._y/10);
/* Si el copo colisiona con ice_cs detenerlo. Como no se desea que el copo permanezca detenido para indefinidamente, verificar que se utilizar un un contador (stopCounter) transcurra tiempo
prudente antes de remover el copo */
if (this.hitTest(_root.poster_cs.ice_cs)) { this.moving = false; this.stopCounter = 0; }

/* Finalmente, los copos que lleguen al suelo sern eliminados de inmediato */
if (this._y>327) { removeMovieClip(this); } } else {

/* Entrar aqu implica que el copo est detenido por colisionar con Ice_cs. Por ende, se incrementa el contador stopCounter, y si ste supera la cota superior preestablecida, copo */ se procede a eliminar el
this.stopCounter++; if (this.stopCounter>500) { this.onEnterFrame = null; this.removeMovieClip(); } }

}
Por ltimo, randRange es una funcin auxiliar que devuelve un nmero aleatorio entre dos extremos, ambos inclusive.
function nieveazar (min:Number, max:Number):Number { var randomNum:Number = Math.floor(Math.random()*(max-min+1))+min; return randomNum; }
Por ultimo tenemos como resultado
Puedes agrafar el fondo del escenario para mejorar la presentacin de esta animacin

Libro Macromedia Flash Parte 1

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Libro Macromedia Flash Parte 1

Uploaded by

Copyright:

Available Formats

Prof.

Csar Augusto Sucari Quispe

Aprendamo s Flash 8 PRO

Aprende Flash de forma rpida y sencilla

Prof. Beatriz Magda Sucari Quispe

Impreso y editado en:

IDEA PERU 2006

- 2 - | Aprendamos Macromedia Flash 8

Prof. Csar Augusto Sucari Quispe

Csar Augusto Sucari Quispe Beatriz Magda Sucari Quispe

Aprendamos Macromedia Flash 8 |- 3 -

Prof. Beatriz Magda Sucari Quispe

- 4 - | Aprendamos Macromedia Flash 8

Prof. Csar Augusto Sucari Quispe

Aprendamos Macromedia Flash 8 |- 5 -

Prof. Beatriz Magda Sucari Quispe

- 6 - | Aprendamos Macromedia Flash 8

Prof. Csar Augusto Sucari Quispe

Aprendamos Macromedia Flash 8 |- 7 -

Prof. Beatriz Magda Sucari Quispe

- 8 - | Aprendamos Macromedia Flash 8

Prof. Csar Augusto Sucari Quispe

Como trabaja Flash?

Aprendamos Macromedia Flash 8 |- 9 -

Prof. Beatriz Magda Sucari Quispe

El lenguaje de programacin de flash

Prof. Csar Augusto Sucari Quispe

Qu puede hacer con Flash?

Aprendamos Macromedia Flash 8 |- 11 -

Prof. Beatriz Magda Sucari Quispe

EL ESPACIO DE TRABAJO DE MACROMEDIA FLASH

- 12 - | Aprendamos Macromedia Flash 8

DESCRIPCIN DE LOS ELEMENTOS DEL ESPACIO DE

Prof. Csar Augusto Sucari Quispe

Ejemplo : El inspector de propiedades con opciones de texto

Modificadores de las herramientas

Aprendamos Macromedia Flash 8 |- 13 -

Prof. Beatriz Magda Sucari Quispe

emergente de visualizacin de fotogramas

Objetos de la capa que aparecen como contornos Capa bloqueada

Animacin fotograma En la biblioteca de un documento de Flash se almacenan smbolos creados a fotograma

Botn Orden de clasificacin Botn Estado Ancho Botn estado estrecho

Icono de la papelera Icono de propiedades

- 14 - | Aprendamos Macromedia Flash 8

Botn Nueva carpeta Botn Nuevo smbolo

Si deseas activar la biblioteca, puedes presionar la tecla de funcin F11

Prof. Csar Augusto Sucari Quispe Forma de Trabajo

Prof. Beatriz Magda Sucari Quispe

CONFIGURACIN DEL ESCENARIO

Cuadro de propiedades del documento o pelcula

- 16 - | Aprendamos Macromedia Flash 8

Prof. Csar Augusto Sucari Quispe

Aprendamos Macromedia Flash 8 |- 17 -

Prof. Beatriz Magda Sucari Quispe

d) Configuracin de las lneas guas

Puedes mostrar u ocultar rpidamente el panel de la biblioteca pulsando

- 18 - | Aprendamos Macromedia Flash 8

Prof. Csar Augusto Sucari Quispe

Aprendamos Macromedia Flash 8 |- 19 -

Prof. Beatriz Magda Sucari Quispe

MANEJO DE MACROMEDIA FLASH

- 20 - | Aprendamos Macromedia Flash 8

Prof. Csar Augusto Sucari Quispe

Aprendamos Macromedia Flash 8 |- 21 -