ManualEdge1A

UNIVERSIDAD CNCI

1

INTRODUCCIÓN
El propósito de este manual es enseñar Adobe Edge Animate, enfocandose en la animación, con o
sin conocimientos previos en la materia.
En este manual de Adobe Edge Animate se tratan temas iniciales como son el espacio de trabajo,
creación de figuras básicas, creación de escenarios y la animación de figuras básicas y texto, así
también importar imágenes yanimarlas.
Además te muestra videos

para poder utilizar mejor las herramientas del software y conocer

más a fondo el tema.
Al finalizar el curso, el estudiante conocerá Adobe Edge animate y será capaz de dominar la
herramienta para la creación de animaciones.
Para ver este manual, es necesario la instalación de Adobe Acrobat Reader.

2

UNIVERSIDAD CNCI

ÍNDICE
SEMANA 1

SEMANA 3

Tema 1. ConociendoEdge.
Pg. 2

Tema 6. Importación de gráficos.
Pg. 34

Tema 2. Creación de figuras básicas.
Pg. 5

Tema 7. Tipos de fotogramas clave.
Pg. 37

Tema 3. Configuración de un escenario.
Pg. 13

Tema 8. Guardar y abrir un documento.
Pg. 43

SEMANA 2

SEMANA 4

Tema 4. Espacio de trabajo.
Pg. 17
Tema 5. Crear texto.
Pg. 26

Tema 9. Convertir elementos en
símbolos.
Pg. 46
Tema 10. Animación de figurasbásicas.
Pg. 51
Actividad 1.
Pg. 58
Actividad 2.
Pg. 59

UNIVERSIDAD CNCI

1

Tema 1.

Conociendo Edge Animate.

Adobe Edge Animate es un nuevo programa de la empresa Adobe Systems Incorporated. Primero
lo llamaron solo Adobe Edge, pero al incrementar los productos decidieron agregarle la palabra
Animate.
Otros productos de la línea Edge son: Edge Reflow, Edge Code, Edge Inspect y Edge Web Fonts.El modo de trabajo y la interfaz con el ususario son muy parecidos al de Adobe After Effects y
Adobe Flash.
Adobe Edge Animate fue lanzado en el año 2011, y a finales de este mismo año, la empresa anunció
que no desarrollará Adobe Flash para los navegadores en dispositivos móviles, solamente para
aplicaciones nativas. Este software está basado en HTML5, CSS3, JavaScript y jQuery, pero nonecesariamente se deben de tener conocimientos de programación.

SEMANA 1 DIA 1
2

UNIVERSIDAD CNCI

Tema 1.

Conociendo Edge Animate.

Las animaciones creadas en Adobe Edge Animate se pueden reproducir en navegadores
modernos, Android, iOS y Windows Phone. Estas no requieren plugins especiales para la
reproducción como los necesita Flash.
Con Adobe Edge Animate podemos maquetar visualmente una páginaweb, insertando imágenes,
textos, animaciones, juegos y modificar propiedades CSS3. Incluye una línea de tiempo dónde
se define el comportamiento de cada uno de los elementos que contenga el archivo y modificar
la duración de los efectos de cada uno de los elementos; además te permite organizar los
elementos y las librerías.
Los archivos creado en Adobe Edge Animate tienen la extensión .an cuandose guardan.

SEMANA 1 DIA 1
UNIVERSIDAD CNCI

3

Tema 1.

Conociendo Edge Animate.

El entorno de Edge Animate se compone por paneles, barras y ventanas que podemos mover y
desplazar; al conjunto de estos se le conoce como espacio de trabajo.

Barra de menús

Panel Elementos Panel Lecciones
Menú del panel

Panel Propiedades

Ventana del
documento

Menú
del
panel
Espacio de trabajo

Zoom
Botonesde
reproducción

Panel Línea de tiempo

SEMANA 1 DIA 1
4

UNIVERSIDAD CNCI

Panel Biblioteca

Tema 2.

Creación de figuras básicas.
En el menú del Panel se encuentran las distintas figuras que vienen predeterminadas en Adobe
Edge Animate como son: Rectángulo, Rectángulo redondeado y Elipse.

Figuras básicas

Rectángulo
Selecciona la herramienta Rectángulo, luego con el botón izquierdo del mouseda click sobre
el espacio de trabajo y sin soltar el botón del mouse arrastra hacia cualquier lado para dibujarlo.

Dibujo de la herramienta Rectángulo

Para dibujar un cuadrado, se sigue el mismo procedimiento pero al momento de arrastrar hacia
algún lado para dibujarlo, mantén presionada al mismo tiempo la tecla Shift.
Después de dibujar la figura, en el panel Propiedades aparecen todas las...