VIDEO2BRAIN:
Spanish | Video2Brain | Vídeo Training | Formador: Jorge Gonzáles Villanueva | 440 MB
Curso Video2Brain: Animate CC Para Interatividad y Juegos
En este Curso Video2Brain Animate CC Para Interatividad y Juegos o Creación de
elementos interactivos con Animate y CreateJS. Con este
curso vas a aprender a crear juegos y contenidos interactivos HTML5 basados en
canvas.
Curso Adobe Animate
permite crear animaciones HTML5 y, además, con las librerías de CreateJS que
lleva incluidas, también permite añadir animación, controlar animaciones y la
navegación dentro de ellas, usando programación.
Con las Clases de Adobe Animate aprenderás a
hacer tus contenidos interactivos, generar elementos dinámicamente, usar sprite
sheets, reproducir sonidos o modificar textos, todo ello para su publicación
como contenidos HTML5.
Adobe Animate CC, te
permite crear juegos, infografías y banners interactivos combinando la potencia
de la línea de tiempo con la flexibilidad de la programación JavaScript apoyada
en CreateJS.
Introducción a Programación con Adobe Animate CC
Adobe Animate
es la apuesta de Adobe para crear contenidos animados e interactivos en HTML5;
En este capítulo veremos en qué se basa, los principios necesarios para
trabajar con este programa y cómo podemos añadir interactividad con él.
- Adobe Animate y HTML5: un poco de historia
- Qué es CreateJS
- Integración de los contenidos de Animate
- Ejemplo de programación con Adobe Animate
Control de la línea de tiempo en Animate
Las
propiedades más básicas que se pueden controlar son las de control de la
animación, tanto para parar y poner en marcha animaciones como para poner el
cabezal en fotogramas concretos o hacer modificaciones sobre la misma línea de
tiempo
- Estructura de la línea de tiempo en EaselJS
- Control de animación y navegación por la línea de tiempo
- Comunicación entre clips de película en Animate
- Modificando las propiedades de los elementos
- Generando elementos en tiempo de ejecución
- Elementos adicionales: botones y gráficos
Adobe Animate e interactividad
Para crear
juegos y para hacer contenidos que vayan más allá de la simple animación es
necesario añadir interactividad a nuestros proyectos.
En este
capítulo aprenderemos a recibir información del usuario.
- Los eventos en CreateJS
- Eventos relacionados con la línea de tiempo
- Añadir interactividad a elementos de la línea de tiempo
- Control de clips desde el teclado
- Control de colisiones en Animate
Animación de personajes: sprite sheets
El control de
personajes animados se puede hacer utilizando sprite sheets, que son mapas de
imagen que hacen que el rendimiento de la animación sea superior.
Aprenderemos
en este capítulo a utilizar este tipo de objetos.
- Creación de sprite sheets
- Carga de sprite sheets
- Control de la animación de los sprites
- Eventos en los sprites. Cambios de animación
El control de tiempo en Animate
Es
fundamental conocer TweenJS, que permite crear animaciones desde la
programación.
Gracias a
ello podemos crear efectos matemáticos, físicos, juegos complejos y, en
general, ampliar aún más las posibilidades de Animate.
- TweenJS y la animación basada en programación
- Aplicando aceleraciones sobre la animación
- Concatenando animaciones con callbacks
- El tiempo en Animate
CreateJS y Texto. Trabajo con datos en Animate
Un elemento
fundamental en la programación del canvas es el uso del texto: veamos cómo
cambiar textos dinámicamente, cómo formatearlos y cómo recuperar datos externos
para su aplicación dentro de nuestros proyectos.
- Creación y modificacion de textos en tiempo de ejecución
- DOMElement en Animate
- Carga de datos externa: Ajax
- Comunicación de Animate con el resto de la página
Imágenes, sonido y vídeo en Animate. Precarga de elementos
Podemos
trabajar con imagen, tanto bitmap metida en nuestra biblioteca, como archivos
externos. Y disponemos de toda una API de dibujo para simplificar la creación
de gráficos propia de los canvas HTML.
También
podremos cargar sonido y vídeo en Animate.
- Cargando imágenes en Animate desde la bilbioteca
- Añadiendo vídeo al HTML5 generado con Animate
- La API gráfica de EaselJS
- Control del sonido en Animate mediante programación
- Control de precarga de elementos en Animate