SlideShare una empresa de Scribd logo
1 de 15
Diseño de animaciones frame a frame, de forma y de movimiento
Pantalla inicial Al Abrir Adobe Flash CS3, escogemos Flash File(ActionScript 3) en la primera pantalla
Interfaz Despúes de haber seleccionado la opción indicada, nos encontramos con la interfaz básica de flash
Guardar el archivo Ahora procedemos a guardar el nuevo documento de Flash, Lo guardamos con el nombre de Animación1, dentro de una carpeta llamade de igual forma. Cabe anotar que este nombre es una sugerencia, no es de obligatoriedad dar el nombre igual.
Capas y fondo Siempre es recomendable darle nombres al as capas, dependiendo de que va a contener. Esto se logra dando doble click sobre el nombre por defecto de la capa y colocando el nuevo nombre. Despúes de haber dado un nombre a la capa, creamos un fondo parecido al que se puede ver a continuación.
Animación de formas 1 Para iniciar la animación de forma, creamos una nueva capa llamada Forma y bloqueamos la capa Fondo. Luego, dibujamos un circulo en dicha capa al cual le cambiamos el relleno.
Animación de formas 2 Ahora creamos un frame clave y un frame en el frame 20 de las capas Forma y Fondo respectivamente. Para lograr esto, damos click en el frame 20 de la capa Fondo y presionamos F5 y lo mismo para la capa Forma pero con F6. Borramos el círculo de la capa Forma y dibujamos un cuadrado.
Animación de formas 3 Para hacer la animación, damos click en primer frame de la capa forma, y en las propiedades del frame, de la opción Tween(Animación) escogemos Shape(forma). Si hemos hecho todo correctamente, tendrémos algo parecido a la imágen anterior.
Animación de movimiento 1 Para crear la animación de movimiento, insertamos una nueva capa, a la cual llamaremos Movimiento; en ella, insertamos una estrella y la agrupamos, ya que si no está agrupada no se podrá realizar la animación
Animación de movimiento 2 Ahora insertamos un frame clave en el frame 20 de la capa Movimiento y cambiamos la estrella de lugar.
Animación de movimiento 3 Para hacer la animación, damos click en primer frame de la capa Moviemiento, y en las propiedades del frame, de la opción Tween(Animación) escogemos Motion(Movimiento). Si hemos hecho todo correctamente, tendrémos algo parecido a la imágen anterior.
Animación frame a frame 1 Para realizar la animación frame a frame, insertamos una nueva capa y le damos de nombre Frame. En el primer frame colocamos un texto solo con la letra P.
Animación frame a frame 2 Luego, a distancias que se estime, insertamos frames claves y vamos agragando letras al texto, hasta completar PROGRAMACIÓN MULTIMEDIA
Ejecutamos Finalmente ejecutamos la aplicación dando Ctrl+Enter
GRACIAS

Más contenido relacionado

La actualidad más candente (18)

Practica 8
Practica 8Practica 8
Practica 8
 
Tutorial de flash
Tutorial de flashTutorial de flash
Tutorial de flash
 
Fotogramas y animacion
Fotogramas y animacionFotogramas y animacion
Fotogramas y animacion
 
5 2
5 25 2
5 2
 
Máscaras con fireworks
Máscaras con fireworksMáscaras con fireworks
Máscaras con fireworks
 
Tutorial Basico 3 Gfx
Tutorial Basico 3 GfxTutorial Basico 3 Gfx
Tutorial Basico 3 Gfx
 
Practica 16
Practica 16Practica 16
Practica 16
 
Practica 8 macromedia
Practica 8  macromediaPractica 8  macromedia
Practica 8 macromedia
 
Tipos de Animación
Tipos de AnimaciónTipos de Animación
Tipos de Animación
 
Practica 8 "Animar texto por bloques"
Practica 8 "Animar texto por bloques"Practica 8 "Animar texto por bloques"
Practica 8 "Animar texto por bloques"
 
Flash Duban
Flash DubanFlash Duban
Flash Duban
 
Texto en movimiento.dj 8
Texto en movimiento.dj 8Texto en movimiento.dj 8
Texto en movimiento.dj 8
 
Michael
MichaelMichael
Michael
 
Michael
MichaelMichael
Michael
 
Practica 8
Practica 8Practica 8
Practica 8
 
Practica 8
Practica 8Practica 8
Practica 8
 
Relleno autocar
Relleno  autocarRelleno  autocar
Relleno autocar
 
Practica 16
Practica 16 Practica 16
Practica 16
 

Destacado (18)

Pasos para interpolacion de movimiento
Pasos para interpolacion de movimientoPasos para interpolacion de movimiento
Pasos para interpolacion de movimiento
 
Animacion Basica
Animacion BasicaAnimacion Basica
Animacion Basica
 
Elementos de adobe flash
Elementos de adobe flashElementos de adobe flash
Elementos de adobe flash
 
Animaciones Básicas en flash
Animaciones Básicas en flashAnimaciones Básicas en flash
Animaciones Básicas en flash
 
Adobe dreamweaver Cs3
Adobe dreamweaver Cs3Adobe dreamweaver Cs3
Adobe dreamweaver Cs3
 
Historia de flash
Historia de flashHistoria de flash
Historia de flash
 
Gráficos en Flash CS3
Gráficos en Flash CS3Gráficos en Flash CS3
Gráficos en Flash CS3
 
Historia de flash
Historia de flashHistoria de flash
Historia de flash
 
Adobe Dreamweaver CS3
Adobe Dreamweaver CS3Adobe Dreamweaver CS3
Adobe Dreamweaver CS3
 
El Radiodrama
El RadiodramaEl Radiodrama
El Radiodrama
 
Principios de animación
Principios de animaciónPrincipios de animación
Principios de animación
 
Tecnicas de animación flash
Tecnicas  de animación flashTecnicas  de animación flash
Tecnicas de animación flash
 
Conceptos básicos de arte
Conceptos básicos de arteConceptos básicos de arte
Conceptos básicos de arte
 
Animacion con Flash
Animacion con FlashAnimacion con Flash
Animacion con Flash
 
Software de animación
Software de animaciónSoftware de animación
Software de animación
 
Elementos del programa de diseño flash 5
Elementos del programa de diseño flash 5Elementos del programa de diseño flash 5
Elementos del programa de diseño flash 5
 
PLANEACION Politicas y reglas
PLANEACION Politicas y reglas PLANEACION Politicas y reglas
PLANEACION Politicas y reglas
 
INTERFAZ DE USUARIO DE FLASH
INTERFAZ DE USUARIO DE FLASHINTERFAZ DE USUARIO DE FLASH
INTERFAZ DE USUARIO DE FLASH
 

Similar a Animación básica en Flash

Manual de Flash Cs6
Manual de Flash Cs6Manual de Flash Cs6
Manual de Flash Cs6saydo2007
 
Practica 5 de photoshop
Practica 5 de photoshopPractica 5 de photoshop
Practica 5 de photoshopRuth Guerrero
 
09 Dibujo Vectorial Con Draw. Capas
09 Dibujo Vectorial Con Draw. Capas09 Dibujo Vectorial Con Draw. Capas
09 Dibujo Vectorial Con Draw. CapasJosé M. Padilla
 
Presentación 5
Presentación 5Presentación 5
Presentación 5taniamabel
 
Presentación practica # 5
Presentación practica # 5Presentación practica # 5
Presentación practica # 5pablo burbano
 
Presentación practica # 5
Presentación practica # 5Presentación practica # 5
Presentación practica # 5pablo burbano
 
Capas, fotogramas, linea de tiempo
Capas, fotogramas, linea de tiempoCapas, fotogramas, linea de tiempo
Capas, fotogramas, linea de tiempoCesar Estrada
 
Guia 3 flash _11_1
Guia 3 flash _11_1Guia 3 flash _11_1
Guia 3 flash _11_1hgm2007
 
Guia 3 flash _11_2
Guia 3 flash _11_2Guia 3 flash _11_2
Guia 3 flash _11_2hgm2007
 
Guia 3 flash _11_3
Guia 3 flash _11_3Guia 3 flash _11_3
Guia 3 flash _11_3hgm2007
 
Técnicas avanzadas y capas de ajustes
Técnicas avanzadas y capas de ajustesTécnicas avanzadas y capas de ajustes
Técnicas avanzadas y capas de ajustesdreico1119
 
Tecnicasavanzadasycapasdeajustes
TecnicasavanzadasycapasdeajustesTecnicasavanzadasycapasdeajustes
Tecnicasavanzadasycapasdeajustesdreico1119
 

Similar a Animación básica en Flash (20)

Flashmacro
FlashmacroFlashmacro
Flashmacro
 
Flash 8
Flash 8Flash 8
Flash 8
 
Flash 8
Flash 8Flash 8
Flash 8
 
Manual de Flash Cs6
Manual de Flash Cs6Manual de Flash Cs6
Manual de Flash Cs6
 
Practica 5 de photoshop
Practica 5 de photoshopPractica 5 de photoshop
Practica 5 de photoshop
 
09 Dibujo Vectorial Con Draw. Capas
09 Dibujo Vectorial Con Draw. Capas09 Dibujo Vectorial Con Draw. Capas
09 Dibujo Vectorial Con Draw. Capas
 
Presentación 5
Presentación 5Presentación 5
Presentación 5
 
Capas en flash
Capas en flashCapas en flash
Capas en flash
 
Capas en flash
Capas en flashCapas en flash
Capas en flash
 
Presentación practica # 5
Presentación practica # 5Presentación practica # 5
Presentación practica # 5
 
Presentación practica # 5
Presentación practica # 5Presentación practica # 5
Presentación practica # 5
 
Practica 12
Practica 12Practica 12
Practica 12
 
Capas, fotogramas, linea de tiempo
Capas, fotogramas, linea de tiempoCapas, fotogramas, linea de tiempo
Capas, fotogramas, linea de tiempo
 
Guia 3 flash _11_1
Guia 3 flash _11_1Guia 3 flash _11_1
Guia 3 flash _11_1
 
Guia 3 flash _11_2
Guia 3 flash _11_2Guia 3 flash _11_2
Guia 3 flash _11_2
 
Guia 3 flash _11_3
Guia 3 flash _11_3Guia 3 flash _11_3
Guia 3 flash _11_3
 
Iv bimestre a3
Iv bimestre a3Iv bimestre a3
Iv bimestre a3
 
Práctica 8
Práctica 8Práctica 8
Práctica 8
 
Técnicas avanzadas y capas de ajustes
Técnicas avanzadas y capas de ajustesTécnicas avanzadas y capas de ajustes
Técnicas avanzadas y capas de ajustes
 
Tecnicasavanzadasycapasdeajustes
TecnicasavanzadasycapasdeajustesTecnicasavanzadasycapasdeajustes
Tecnicasavanzadasycapasdeajustes
 

Más de Jaime Hernández

Más de Jaime Hernández (8)

Diseño de videojuegos basado en mda
Diseño de videojuegos basado en mdaDiseño de videojuegos basado en mda
Diseño de videojuegos basado en mda
 
Tipos de videojuegos
Tipos de videojuegosTipos de videojuegos
Tipos de videojuegos
 
El sonido en flash con action script 3
El sonido en flash con action script 3El sonido en flash con action script 3
El sonido en flash con action script 3
 
POO y AS3
POO y AS3POO y AS3
POO y AS3
 
Mover Con Click
Mover Con ClickMover Con Click
Mover Con Click
 
Lineas Aleatorias
Lineas AleatoriasLineas Aleatorias
Lineas Aleatorias
 
Crear circulos II
Crear circulos IICrear circulos II
Crear circulos II
 
Navegando por contenidos
Navegando por contenidosNavegando por contenidos
Navegando por contenidos
 

Último

PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxPROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxAlan779941
 
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...JohnRamos830530
 
Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21mariacbr99
 
Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estossgonzalezp1
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITMaricarmen Sánchez Ruiz
 
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfRefrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfvladimiroflores1
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanamcerpam
 
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxEL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxMiguelAtencio10
 
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptxEVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptxJorgeParada26
 
How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.FlorenciaCattelani
 
Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfAnnimoUno1
 

Último (11)

PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxPROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
 
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
 
Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21
 
Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estos
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNIT
 
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfRefrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvana
 
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxEL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
 
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptxEVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
 
How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.
 
Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdf
 

Animación básica en Flash

  • 1. Diseño de animaciones frame a frame, de forma y de movimiento
  • 2. Pantalla inicial Al Abrir Adobe Flash CS3, escogemos Flash File(ActionScript 3) en la primera pantalla
  • 3. Interfaz Despúes de haber seleccionado la opción indicada, nos encontramos con la interfaz básica de flash
  • 4. Guardar el archivo Ahora procedemos a guardar el nuevo documento de Flash, Lo guardamos con el nombre de Animación1, dentro de una carpeta llamade de igual forma. Cabe anotar que este nombre es una sugerencia, no es de obligatoriedad dar el nombre igual.
  • 5. Capas y fondo Siempre es recomendable darle nombres al as capas, dependiendo de que va a contener. Esto se logra dando doble click sobre el nombre por defecto de la capa y colocando el nuevo nombre. Despúes de haber dado un nombre a la capa, creamos un fondo parecido al que se puede ver a continuación.
  • 6. Animación de formas 1 Para iniciar la animación de forma, creamos una nueva capa llamada Forma y bloqueamos la capa Fondo. Luego, dibujamos un circulo en dicha capa al cual le cambiamos el relleno.
  • 7. Animación de formas 2 Ahora creamos un frame clave y un frame en el frame 20 de las capas Forma y Fondo respectivamente. Para lograr esto, damos click en el frame 20 de la capa Fondo y presionamos F5 y lo mismo para la capa Forma pero con F6. Borramos el círculo de la capa Forma y dibujamos un cuadrado.
  • 8. Animación de formas 3 Para hacer la animación, damos click en primer frame de la capa forma, y en las propiedades del frame, de la opción Tween(Animación) escogemos Shape(forma). Si hemos hecho todo correctamente, tendrémos algo parecido a la imágen anterior.
  • 9. Animación de movimiento 1 Para crear la animación de movimiento, insertamos una nueva capa, a la cual llamaremos Movimiento; en ella, insertamos una estrella y la agrupamos, ya que si no está agrupada no se podrá realizar la animación
  • 10. Animación de movimiento 2 Ahora insertamos un frame clave en el frame 20 de la capa Movimiento y cambiamos la estrella de lugar.
  • 11. Animación de movimiento 3 Para hacer la animación, damos click en primer frame de la capa Moviemiento, y en las propiedades del frame, de la opción Tween(Animación) escogemos Motion(Movimiento). Si hemos hecho todo correctamente, tendrémos algo parecido a la imágen anterior.
  • 12. Animación frame a frame 1 Para realizar la animación frame a frame, insertamos una nueva capa y le damos de nombre Frame. En el primer frame colocamos un texto solo con la letra P.
  • 13. Animación frame a frame 2 Luego, a distancias que se estime, insertamos frames claves y vamos agragando letras al texto, hasta completar PROGRAMACIÓN MULTIMEDIA
  • 14. Ejecutamos Finalmente ejecutamos la aplicación dando Ctrl+Enter