Act 6 flash 8

480 visualizaciones

Publicado el

0 comentarios
0 recomendaciones
Estadísticas
Notas
  • Sé el primero en comentar

  • Sé el primero en recomendar esto

Sin descargas
Visualizaciones
Visualizaciones totales
480
En SlideShare
0
De insertados
0
Número de insertados
1
Acciones
Compartido
0
Descargas
8
Comentarios
0
Recomendaciones
0
Insertados 0
No insertados

No hay notas en la diapositiva.

Act 6 flash 8

  1. 1. REGIONAL META Fecha: Abril 17 de 2012 INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA Versión: 6 TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE Sistema de Gestión SOFTWARE Página 1de 13 de la Calidad ANIMACIÓN CON GUÍAS DE MOVIMIENTOOtro tipo de animación que se puede obtener con el programa de Flash, es una animación que siga un patrónque sirva de guía a una forma vectorial o una imagen. En el siguiente ejemplo aprenderás a crear una animaciónintroduciendo una capa de Guía de movimiento, además aprenderás a usar la HerramientadeDibujo de objetoque es una forma diferente de agrupar una forma vectorial en sus partes de borde y color de relleno. Crear un documento de Propiedades ctrl. + J, las dimensiones son 500 * 200 píxeles de ancho y alto, colocar como color de fondo #000000 y velocidad de fotogramas 12 fps. Esta animación es llevara acabo en su totalidad en la Escena. Primero, presionar por dos segundos la herramienta de Rectángulo hasta obtener el submenú de la Herramienta de PolyStar.
  2. 2. REGIONAL META Fecha: Abril 17 de 2012 INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA Versión: 6 TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE Sistema de Gestión SOFTWARE Página 2de 13 de la CalidadEn el Panel de Propiedades seleccionar el color de borde#0000FF y color de relleno #FFFF00. Hacer clicen la casilla de Opciones, y después en el Panel de Configuración de herramientas seleccionar el Estilo deEstrella y Número de lados 5.Después de haber seleccionado las propiedades de la forma vectorial a dibujar, presionar el icono deDibujo de objeto en el panel de herramientas o simplemente presionar la letra J en el teclado, así la formavectorial quedara automáticamente agrupada. Si el dibujo no esta agrupado o insertado en un símbolo decualquier Tipo la animación con Guía de movimiento no tendrá éxito. Ahora dibujar la estrella de 5 lados, de dimensiones 90.0 * 85.5 píxeles de ancho y alto, colocar la estrella en cualquier lugar por el momento las coordenadasnotienen importancia. Una vez que hayas terminado de dibujar la estrella aparecerá alrededor de esta un margen en color azul esto indica que el dibujo esta agrupado. En el Panel de Propiedades aparecerá la leyenda de Objeto de dibujo esta leyenda confirma también que la forma vectorial a sido agrupada.
  3. 3. REGIONAL META Fecha: Abril 17 de 2012 INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA Versión: 6 TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE Sistema de Gestión SOFTWARE Página 3de 13 de la CalidadSeleccionar el frame número 65 en la Línea de tiempo y en el insertar un fotograma clave F6. Seleccionarla estrella de este fotograma y moverla a un punto de coordenadasdiferente al original.
  4. 4. REGIONAL META Fecha: Abril 17 de 2012 INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA Versión: 6 TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE Sistema de Gestión SOFTWARE Página 4de 13 de la CalidadSeleccionar un fotograma entre el número 1 y el número 64, en el panel de Propiedades seleccionar lasopciones de AnimarMovimiento, Girar Horario y 10 veces. Hasta este punto esta creada una animación deuna forma vectorial que se trasladara girando de un punto a otro dependiendo de donde hayas colocado laestrella del fotograma número 1 y la estrella del fotograma número 65. En los pasos siguientes trazaras unaruta por donde se trasladará la forma vectorial.A continuación inserta una CapadeGuía de movimiento, en esta capa automáticamente se insertaran 65fotogramas.
  5. 5. REGIONAL META Fecha: Abril 17 de 2012 INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA Versión: 6 TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE Sistema de Gestión SOFTWARE Página 5de 13 de la CalidadRecuerda que tienes seleccionada la opción de Dibujo de objeto, lo más recomendable es que quites estaselección presionando en el teclado la letra J. Con ayuda de la herramienta de Lápiz Y, Pincel B o Pluma P,trazar una guía por toda la Escena.Seleccionar la herramienta de Ajustar a objetos para que cuanto acerques un poco la estrella al inicio dela guía esta tengan una atracción magnética.Cuando termines de trazar la guía seleccionar la estrella del fotograma número 1, tomar esta estrella por elcentro y en ella aparecerá automáticamente un círculo en el centro. Luego que tienes tomada por el centro ala estrella, moverla hasta la parte en donde inicia la guía.
  6. 6. REGIONAL META Fecha: Abril 17 de 2012 INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA Versión: 6 TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE Sistema de Gestión SOFTWARE Página 6de 13 de la CalidadAhora seleccionar la estrella del fotograma número 65, tomarla por el centro y moverla hasta la parte endonde finaliza la guía. Presionar ctrl. + Entery ver como la estrella hace el recorrido que trazaste por todala Escena.
  7. 7. REGIONAL META Fecha: Abril 17 de 2012 INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA Versión: 6 TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE Sistema de Gestión SOFTWARE Página 7de 13 de la Calidad ANIMACIÓN CON MÁSCARAS CONVERTIDASLas animaciones que involucran la intervención de capas convertidas en máscaras, son de suma importancia enanimaciones básicas tanto de forma como de movimiento.Las animaciones de máscaras muestran solamente una parte de una imagen, texto o forma vectorial.En el ejemplo que a continuación se te presenta trabajaras con una combinación de animaciones de movimientoy forma en una misma capa, posteriormente esta capa será transformada en una capa de máscara.La capa máscara estará aplicara a una imagen importada a la Escena. El total de la animación como en el caso anterior se trabajara en la Escena. Crear un documento de Propiedades ctrl. + J, las dimensiones son 500 * 400 píxeles de ancho y alto, color de fondo #FFFFFF, velocidad de fotogramas 12 fps. A la primera capa de la Escena cambiarle el nombre por el de imagen. Después importar ctrl. + R una imagen de dimensiones 500 * 400 píxeles de ancho y alto, colocar la imagen importada en coordinadas X: 0.0 y Y: 0.0.
  8. 8. REGIONAL META Fecha: Abril 17 de 2012 INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA Versión: 6 TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE Sistema de Gestión SOFTWARE Página 8de 13 de la CalidadInsertar una segunda capa y cambiarle el nombre a esta por el de máscara.Aquí es en donde se trabajara propiamente con la combinación animada de movimiento y forma.Dibujar en el primer fotograma un Rectángulo R, presionar el icono de Dibujo de objeto o simplemente laletra J en el teclado.El rectángulo carecerá de borde y noimporta el color de relleno porque este no se observara en lapresentación del archivo swf final.Las dimensiones son 40 * 400 píxeles de ancho y alto. Colocar esta forma vectorial en coordenada X: -40.0y Y: 0.0.
  9. 9. REGIONAL META Fecha: Abril 17 de 2012 INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA Versión: 6 TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE Sistema de Gestión SOFTWARE Página 9de 13 de la CalidadSeleccionar el frame número 20 e insertar un fotograma clave F6. Seleccionar el rectángulo de estefotograma y cambiarlo a nuevas coordenadas X: 500.0 y Y: 0.0.Seleccionar un fotograma entre el número 1 y el número 19, en el Panel de Propiedades seleccionar laopción Animar Movimiento.
  10. 10. REGIONAL META Fecha: Abril 17 de 2012 INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA Versión: 6 TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE Sistema de Gestión SOFTWARE Página 10de 13 de la CalidadInsertar un fotograma clave F6 en el frame número 40, seleccionar el rectángulo de este fotograma y luegocambiar las dimensiones a 500.0 * 400.0 píxeles y las nuevascoordenadas son X: 0.0 y Y: 0.0.
  11. 11. REGIONAL META Fecha: Abril 17 de 2012 INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA Versión: 6 TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE Sistema de Gestión SOFTWARE Página 11de 13 de la CalidadCrear ahora la animación de tipo Forma, seleccionar un fotograma entre el número 20 y el número 39. enel panel de Propiedades seleccionar la opción de Animar Forma. De esta forma el rectángulo crecerá hastacubrir por completo la imagen.Para finalizar la animación insertar un fotograma clave F6 pero ahora en el frame número 60. Seleccionar elrectángulo del fotograma 60 y cambiarlo a coordenadas X: -500.0 y Y: 0.0.
  12. 12. REGIONAL META Fecha: Abril 17 de 2012 INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA Versión: 6 TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE Sistema de Gestión SOFTWARE Página 12de 13 de la CalidadSeleccionar un fotograma entre el número 40 y el número 59. En el Panel de Propiedades optar por laopción Animar Movimiento, con esta animación el rectángulo se desplazara al lado izquierdo y al mismotiempo la imagen se estará ocultando.Lo único que falta por hacer es transformar la capa en donde esta insertada la animación a Capa de tipomáscara. Hacer clic con el botón derecho del ratón sobre la capa máscara, en el menú emergenteseleccionar la opción de Máscara.Cuando cambias una capa a la opción de máscara los iconos de estas cambian a un color y de aspecto.Finalmente insertar un fotograma F5 en el frame número 60 de la capa imagen. Ahora ya esta lista laanimación y puedes presionar sin ningún inconveniente ctrl. + Enter y ver como trabaja la animación final.
  13. 13. REGIONAL META Fecha: Abril 17 de 2012 INSTITUCION EDUCATIVA CAPITAN MIGUEL LARA Versión: 6 TECNOLOGÍAS DE LA INFORMACIÓN Y DISEÑO Y DESARROLLO DE Sistema de Gestión SOFTWARE Página 13de 13 de la CalidadHasta aquí quedan concluidas las explicaciones sobre las Herramientas Básicas de trabajo en MacromediaFlash 8, también se dan por concluido las Animaciones Básicas que NO involucran Código ActionScript.

×