Este documento presenta una guía sobre el uso de Macromedia Flash para crear animaciones en páginas web. Explica cómo crear bloques de texto, símbolos, capas y animaciones fotograma por fotograma e interpoladas. También describe cómo crear una animación de movimiento usando una capa guía. El documento concluye con actividades prácticas y una bibliografía.
1. COMUNIDAD FRANCISCANA PROVINCIA DE LA SANTA FE Código
COLEGIO FRANCISCANO DE SAN LUIS BELTRAN PGF 02 R-04
Proceso
GESTION DE FORMACION Página 1 de 5
L.F.1813 de octubre 20 de 2003 Procedimiento
DISEÑO CURRICULAR
GUIA No.2 DE TECNOLOGIA E INFORMÁTICA
GRADO 10º CURSO 1-2-3 PERIODO: II FECHA 24 – 04 - 2013
ALUMNO_________________________________________________________________________________
DOCENTE: Lic. GREGORIO PEÑA CORONADO
DESEMPEÑO: Reconocer la utilidad en cuanto a dinamismo que ofrece flash para la implementación de
animaciones en las páginas Web.
INDICADOR DE DESEMPEÑO
• Sabe cómo se estructura una película
• Conoce y maneja las herramientas para crear ilustraciones
CONTENIDOS:
Creación de bloques
Creación de símbolos
Capas
Creación de animaciones
Ejercicios
ADICIÓN Y EDICIÓN DE TEXTOS
En Flash MX se puede agregar texto a un documento y establecer su tamaño, tipo de letra, estilo, espacio, color
y alineación. También se puede manipular el texto como si fuera un objeto o una forma básica para crear
efectos sofisticados.
CREACIÓN DE BLOQUES DE TEXTO
1. Hacer clic en la herramienta Texto.
2. Hacer clic en el escenario.
Aparecerá un bloque expansivo de una línea como este:
A medida que se escribe el bloque será mayor.
3. Escribir el siguiente texto:
También se puede crear un bloque de texto con una anchura definida:
1.
2. Hacer clic en la herramienta Texto.
3. Hacer clic en el escenario.
Selector de cambio de tamaño
4. Arrastrar el selector de cambio de tamaño hacia la derecha:
5. Escribir el siguiente texto:
2. COMUNIDAD FRANCISCANA PROVINCIA DE LA SANTA FE Código
COLEGIO FRANCISCANO DE SAN LUIS BELTRAN PGF 02 R-04
Proceso
GESTION DE FORMACION Página 2 de 5
L.F.1813 de octubre 20 de 2003 Procedimiento
DISEÑO CURRICULAR
GUIA No.2 DE TECNOLOGIA E INFORMÁTICA
Un bloque expansivo de una línea tiene un selector redondo en la esquina superior derecha y un bloque de
texto de una anchura fija tiene un selector cuadrado. Cuando se cambia el tamaño de un bloque de texto con un
selector redondo, pasara a ser un bloque de texto con un selector cuadrado.
CREACIÓN Y EDICIÓN DE SÍMBOLOS
Un símbolo es una imagen, una animación o un botón reutilizables. Una instancia es la presencia de un
símbolo en el escenario. Los símbolos ayudan a reducir el tamaño de un archivo y a simplificar la edición de una
película. Los símbolos también son necesarios para crear una interactividad sofisticada.
CREACIÒN DE UN SIMBOLO
Para crear un símbolo primero se debe tener una forma o figura en el escenario para convertirla en símbolo:
1. Crear la siguiente figura en el escenario:
2. Hacer clic en el menú Ventana de la Barra de Menú.
3. Seleccionar la opción Biblioteca.
Debe aparecer la siguiente ventana:
4. Hacer clic en al herramienta Flecha.
5. Hacer doble clic sobre la figura creada en el escenario (para seleccionarla).
6. Arrastrar la figura hacia la biblioteca.
Aparecerá el siguiente cuadro de dialogo:
7. Escribir Rectángulo en el campo Nombre.
8. Seleccionar Grafico como Comportamiento.
9. Hacer clic en Aceptar.
El rectángulo del escenario será ahora una Instancia del Símbolo Rectángulo de la Biblioteca.
3. COMUNIDAD FRANCISCANA PROVINCIA DE LA SANTA FE Código
COLEGIO FRANCISCANO DE SAN LUIS BELTRAN PGF 02 R-04
Proceso
GESTION DE FORMACION Página 3 de 5
L.F.1813 de octubre 20 de 2003 Procedimiento
DISEÑO CURRICULAR
GUIA No.2 DE TECNOLOGIA E INFORMÁTICA
CAPAS
Las capas pueden considerarse como hojas apiladas de acetato transparente. Cuando una capa esta vacía, las
capas situadas debajo pueden verse a través de esta.
Las capas ayudan a organizar las ilustraciones en un documento o película. Las ilustraciones de una capa
pueden dibujarse y editarse sin que afecten a las ilustraciones de otras capas. Las capas pueden organizarse
en carpetas en la línea de tiempo.
El dibujo y la edición de formas o figuras se realizan en la capa activa. Para activar una capa se debe
seleccionar un objeto que se encuentre en el escenario que haga parte de esa capa.
Capa activa
La capa activa se resalta en la Línea de Tiempo y un icono en forma de lápiz indica que puede editarse.
También se puede seleccionar una capa en la línea de tiempo para activarla.
INSERTAR CAPAS
Para insertar una capa en la línea de tiempo:
1. Hacer clic en el menú Insertar.
2. Seleccionar la opción Capa.
También se puede hacer clic en el siguiente icono en la Línea de Tiempo para insertar una capa
Deberá aparecer lo siguiente:
BORRAR CAPAS
Para borrar una capa en la línea de tiempo:
1. Seleccionar la capa a borrar
Hacer clic en el siguiente icono en la Línea de Tiempo
CREACIÓN DE ANIMACIONES
Existen dos métodos para crear una secuencia de animación en Flash:
1. Animación Fotograma por Fotograma.
2. Animación Interpolada.
4. COMUNIDAD FRANCISCANA PROVINCIA DE LA SANTA FE Código
COLEGIO FRANCISCANO DE SAN LUIS BELTRAN PGF 02 R-04
Proceso
GESTION DE FORMACION Página 4 de 5
L.F.1813 de octubre 20 de 2003 Procedimiento
DISEÑO CURRICULAR
GUIA No.2 DE TECNOLOGIA E INFORMÁTICA
En la animación Fotograma por Fotograma se crea la imagen en cada fotograma.
En la animación Interpolada se crean los fotogramas inicial y final y Flash crea los fotogramas intermedios.
Flash varía el tamaño, la rotación, el color u otros atributos del objeto uniformemente entre los fotogramas inicial
y final para dar una impresión de movimiento.
La animación Interpolada es una técnica esencial para la creación de movimiento y cambio en una película,
que al mismo tiempo reduce el tamaño del archivo.
FOTOGRAMAS CLAVE
Un Fotograma Clave es un fotograma en el cual puede especificarse cambios en un botón o en una animación.
En la animación Interpolada se crean fotogramas clave en puntos importantes de la línea de tiempo y Flash se
encargara de crear los fotogramas intermedios. Los fotogramas clave se indican mediante círculos en un
fotograma. Un fotograma clave de una capa que no contiene gráficos esta en blanco.
CAPAS DE GUIA DE MOVIMIENTO
Se puede utilizar una capa de guía de movimiento para trazar la ruta que describirá un objeto:
1. Hacer la siguiente figura en la parte media del lado izquierdo del escenario:
La figura deberá quedar ubicada en el escenario de la siguiente forma:
Lo que se desea hacer es que la figura (circulo) de la izquierda se mueva hasta el lado derecho del escenario
pero trazando una trayectoria curvilínea.
2. Hacer clic en la herramienta Flecha.
3. Hacer doble clic sobre la figura dibujada (circulo).
4. Hacer clic en el menú Insertar.
5. Seleccionar la opción Convertir en Símbolo.
6. Llamar el símbolo como Circulo.
7. Hacer clic derecho sobre el fotograma 30 de la capa en donde se encuentra el símbolo Círculo.
8. Seleccionar la opción Insertar Fotograma.
9. Hacer clic en el menú Insertar.
10. Seleccionar la opción Guía de Movimiento.
5. COMUNIDAD FRANCISCANA PROVINCIA DE LA SANTA FE Código
COLEGIO FRANCISCANO DE SAN LUIS BELTRAN PGF 02 R-04
Proceso
GESTION DE FORMACION Página 5 de 5
L.F.1813 de octubre 20 de 2003 Procedimiento
DISEÑO CURRICULAR
GUIA No.2 DE TECNOLOGIA E INFORMÁTICA
Aparecerá lo siguiente en la línea de tiempo:
11. Hacer clic en la herramienta Lápiz.
12. Dibujar una línea curva desde el círculo hasta el extremo derecho del escenario.
13. Seleccionar el fotograma 1 en la capa del símbolo Círculo.
14. Hacer clic en la herramienta Flecha.
15. Hacer clic en el modificador Ajustar a Objetos
El ajuste alinea automáticamente los elementos entre ellos
16. Mover el círculo hasta que su punto central se encuentre en un extremo de la línea.
17. Hacer clic en el menú Insertar.
18. Seleccionar la opción Crear Interpolación de Movimiento.
19. Hacer clic derecho sobre el fotograma 30 de la capa en donde se encuentra el símbolo Círculo.
20. Seleccionar la opción Insertar Fotograma Calve.
21. Mover el círculo de modo que se ajuste al otro extremo de la línea.
Para ver el resultado: Hacer clic en el menú Control y seleccionar la opción Reproducir.
ACTIVIDAD EN CLASE
1. Ejercicios prácticos propuestos por el docente.
ACTIVIDAD EXTRACLASE
Realice una animación en Macromedia Flash donde debe aplicar todo lo aprendido, el trabajo debe presentarlo
la próxima clase.
BIBLIOGRAFIA
GONZALEZ Joel. Manual de Macromedia Flash
CORSORO, Sandro. Macromedia flash, curso práctico. Editorial Microinformática, 2002
gregorioalbertopc.blogspot.com
6. COMUNIDAD FRANCISCANA PROVINCIA DE LA SANTA FE Código
COLEGIO FRANCISCANO DE SAN LUIS BELTRAN PGF 02 R-04
Proceso
GESTION DE FORMACION Página 5 de 5
L.F.1813 de octubre 20 de 2003 Procedimiento
DISEÑO CURRICULAR
GUIA No.2 DE TECNOLOGIA E INFORMÁTICA
Aparecerá lo siguiente en la línea de tiempo:
11. Hacer clic en la herramienta Lápiz.
12. Dibujar una línea curva desde el círculo hasta el extremo derecho del escenario.
13. Seleccionar el fotograma 1 en la capa del símbolo Círculo.
14. Hacer clic en la herramienta Flecha.
15. Hacer clic en el modificador Ajustar a Objetos
El ajuste alinea automáticamente los elementos entre ellos
16. Mover el círculo hasta que su punto central se encuentre en un extremo de la línea.
17. Hacer clic en el menú Insertar.
18. Seleccionar la opción Crear Interpolación de Movimiento.
19. Hacer clic derecho sobre el fotograma 30 de la capa en donde se encuentra el símbolo Círculo.
20. Seleccionar la opción Insertar Fotograma Calve.
21. Mover el círculo de modo que se ajuste al otro extremo de la línea.
Para ver el resultado: Hacer clic en el menú Control y seleccionar la opción Reproducir.
ACTIVIDAD EN CLASE
1. Ejercicios prácticos propuestos por el docente.
ACTIVIDAD EXTRACLASE
Realice una animación en Macromedia Flash donde debe aplicar todo lo aprendido, el trabajo debe presentarlo
la próxima clase.
BIBLIOGRAFIA
GONZALEZ Joel. Manual de Macromedia Flash
CORSORO, Sandro. Macromedia flash, curso práctico. Editorial Microinformática, 2002
gregorioalbertopc.blogspot.com