Lynda.com: HTML5 Canvas and WebGL in Flash Professional CC

Pleased to present a new course for Lynda.com: HTML5 Canvas and WebGL in Flash Professional CC!

Create a shared pool of content for a set of related projects—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 video, 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 use Flash’s familiar toolset to build and manage assets that fit into a modern web publishing workflow.

Topics include:

  • Using code snippets and actions
  • Assembling and animating a scene for video
  • Rendering the video
  • Laying out an ad with WebGL and JavaScript
  • Programming a game in HTML5 Canvas

 

Starling, Feathers, and Adobe® AIR® with IntelliJ IDEA

As mentioned in my previous post about Apache Flex® and Adobe® AIR® with IntelliJ IDEA… I have also recorded a free series of videos around Starling, Feathers, and Adobe AIR with IntelliJ IDEA.

You may be aware that I have a full, extended course on using Starling and Feathers to build a mobile application using Adobe AIR published over at Lynda.com: Building a Mobile App with Feathers and Starling. That course is much more involved but this set of videos should be a good introduction to using these frameworks in IntelliJ IDEA.

You can watch the playlist over on YouTube, or as embedded below:

Full source on GitHub: https://github.com/josephlabrecque/MobileStarling


Apache Flex, Flex, and Apache are either registered trademarks or trademarks of the Apache Software Foundation in the United States and/or other countries, and are used with permission as of 2015. The Apache Software Foundation has no affiliation with and does not endorse or review the materials provided at this website.

Adobe, Adobe AIR, and Adobe Flash Builder are either registered trademarks or trademarks of Adobe Systems Incorporated in the United States and/or other countries.

Apache Flex® and Adobe® AIR® with IntelliJ IDEA

I have recorded a free series of 10 videos around Apache Flex and Adobe AIR with IntelliJ IDEA. I believe that moving forward, IntelliJ IDEA is the best IDE for learning and using Apache Flex. Adobe Flash Builder used to fill this role, but Adobe has discontinued it’s free licensing to students for some time now… and will most likely not be updating that tool in the perceivable future. As a bonus – IntelliJ IDEA is an absolute beast that can handle just about anything ;)

You can watch the playlist over on YouTube, or as embedded below:

Full source on GitHub: https://github.com/josephlabrecque/MobileFlex

I’m also working on a similar series focused on using Starling, Feathers, and Adobe® AIR® with IntelliJ IDEA.


Apache Flex, Flex, and Apache are either registered trademarks or trademarks of the Apache Software Foundation in the United States and/or other countries, and are used with permission as of 2015. The Apache Software Foundation has no affiliation with and does not endorse or review the materials provided at this website.

Adobe, Adobe AIR, and Adobe Flash Builder are either registered trademarks or trademarks of Adobe Systems Incorporated in the United States and/or other countries.

Announcing AS3-WebVTT

AS3-WebVTT is a set of ActionScript 3.0 utility classes which enable the parsing and sorting of standard WebVTT (.vtt) files for video captioning.

AS3-WebVTTdemo

Why write a WebVTT parser in AS3? Simple. A lot of video is still served with Flash Player or AIR – we certainly still use it extensively at the University of Denver. Recently, we’ve found the need to integrate captioning through a standard format across our video delivery tools. We settled on support for the WebVTT standard and now make our work available for everyone. Another example of web standards and Flash innovation working hand in hand!

So how is it used?

  1. Download the code and include it in your project.
  2. Import edu.du.captions.utils.CaptionsHandler – this is the only class you need to interact with from your application code.
  3. Create a new instance of the CaptionsHandler class: captionsHandler = new CaptionsHandler();
  4. You will need to stream a video, and create a text field for the captions to display in. This should be in your app already apart from the text object for captions support.
  5. Invoke captionsHandler.gatherCaptions(captionsPath); passing in string representing a .vtt file location. It will then be loaded, read, and parsed.
  6. Invoke captionsHandler.renderCaptions(CurrentVideoTime, TextFieldForDisplay); – passing in the current playback time of the video and the text field object whenever appropriate to render captions to the screen. You could use a Timer, for instance.

The video and text objects are completely under your control. Experiment with text positioning and format to get the desired results. You can see an example of all of this in the demo project.

If you do improve the classes – please contribute back to the project! Everything is pretty solid right now but there is always room for improvement. Some pieces of the WebVTT specification (such as alignment) are currently ignored by the parser.

You can find the source code along with a set of demos over at: https://github.com/du-otl/AS3-WebVTT

I’ve also recorded a video to show how this works in both a pure AS3 environment and with using the visual tooling in Flash Professional CC: