Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

LinkedIn Learning

Adobe Animate CC: HTML5 Canvas and WebGL

via LinkedIn Learning

Overview

Create a shared pool of content for a set of related projects—an HTML5 video, a WebGL-rendered interactive ad, and an HTML5 Canvas game—using Flash Professional CC.

No longer restricted to only ActionScript and Flash Player, Flash Professional CC offers more publishing possibilities than ever before. Developers can now use Flash to build assets and animation that target platforms such as HTML5 Canvas and WebGL. And adding JavaScript allows for playback on just about any modern desktop or mobile device.

This course focuses on using Flash Professional CC to create a shared pool of content for a set of related projects: an HTML5 video, an interactive ad, and a simple web-based game. Author Joseph Labrecque shows how to use Flash's familiar toolset to build and manage assets that fit into a modern web publishing workflow.

Syllabus

Introduction
  • Welcome
  • What you should know before taking this course
  • Using the exercise files
1. Working in HTML5 Canvas and WebGL
  • Project concept
  • Using the conversion commands
  • Using code snippets and actions
  • About publish targets
  • HTML5 integration with Brackets
2. Animating HTML5 Video
  • Assembling the scene
  • Examining the skeletal character
  • Animating the scene
  • Character and titles animation
  • Rendering the video and HTML5 integration
3. Ad Design with WebGL and JavaScript
  • Laying out the ad document
  • Animating the content
  • Exploring the button asset
  • WebGL and JavaScript
  • HTML5 WebGL integration
4. Programming a Game in HTML5 Canvas
  • Arranging the game elements
  • Game setup and initialization
  • Player setup and movement
  • Collectibles generation
  • Collectibles movement
  • Scorekeeping and collision detection
  • Timekeeping and detecting game over
  • Canvas web integration
Conclusion
  • Next steps

Taught by

Joseph Labrecque

Related Courses

Reviews

Start your review of Adobe Animate CC: HTML5 Canvas and WebGL

Never Stop Learning!

Get personalized course recommendations, track subjects and courses with reminders, and more.

Sign up for free