logo
g Text Version
Beauty & Self
Books & Music
Career
Computers
Education
Family
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
Money
News & Politics
Relationships
Religion & Spirituality
Sports
Travel & Culture
TV & Movies

dailyclick
Bored? Games!
Nutrition
Postcards
Take a Quiz
Rate My Photo

new
Painting
Heart Disease
Horror Literature
Dating
Hiking & Backpacking
SF/Fantasy Books
Healthy Foods


dailyclick
All times in EST

Full Schedule
g
g Flash and Animation Site

BellaOnline's Flash and Animation Editor

g

CreateJS Extension for Flash CS6


One of the most awaited new features for FlashR CS6 is the ability to publish your Flash animations as HTML5, which can be used in several ways including web and mobile devices. The Toolkit for CreateJS is a great breakthrough for Flash lovers who want to continue to use Flash to create animations for games, advertising and more but want to take advantage of the new HTML5 Canvas that's supported by mobile and desktop browsers.

The Toolkit exports the necessary HTML and JavaScript that control the preloading, graphics, sound and animations. Once you have these Flash assets converted to HTML5 assets, you are ready to build your HTML5-based game or project outside of Flash.

Your first step is to download the free binary file for Toolkit for CreateJS from the Adobe website.

http://www.adobe.com/products/flash/flash-to-html5.html

  1. Open Adobe Extension Manager CS6.

  2. Click the Install button and find the Toolkit-for-CreateJS.zxp file that you just downloaded. Once the new extension is listed in the Extensions window, you can close the Manager dialog box.

  3. Open Flash CS6. For testing purposes, let's draw a rectangle on the stage. Convert it to a Movie Clip called box.

  4. Insert a frame on Frame 50 of the Timeline, add a Keyframe and move the box to the other side of the stage.

  5. Right-click anywhere on the Timeline and add a Classic Tween.

  6. Click Control - Test Movie - In Flash Professional and the box moves across the stage.

  7. To open the new CreateJS panel, click Window - Other Panels - Toolkit for CreateJS. You can dock this panel with the others on the side of the workspace.

    As you can see, we have several settings. For this example, let's keep the default settings and just click the Output button to choose a location for our files to be stored.

  8. Click the Publish button and a browser will open and display your animation as HTML5.

As of now, you can use this new feature to export vectors, bitmaps, classic tweens, and sound to HTML5. It does not support bitmap fills, shape tweens, IK, masks or blends. For example, I tested this on the Flash lip synch sample template file and it couldn't convert the complex animation. But it's a start.

*Adobe provided a copy of this software to me for review purposes.



Join us in the Flash forum. | Join us in the Digital Art and Design forum.

|


Add CreateJS+Extension+for+Flash+CS6 to Twitter Add CreateJS+Extension+for+Flash+CS6 to Facebook Add CreateJS+Extension+for+Flash+CS6 to MySpace Add CreateJS+Extension+for+Flash+CS6 to Del.icio.us Digg CreateJS+Extension+for+Flash+CS6 Add CreateJS+Extension+for+Flash+CS6 to Yahoo My Web Add CreateJS+Extension+for+Flash+CS6 to Google Bookmarks Add CreateJS+Extension+for+Flash+CS6 to Stumbleupon Add CreateJS+Extension+for+Flash+CS6 to Reddit



 



RSS | Related Articles | Editor's Picks Articles | Top Ten Articles | Previous Features | Site Map


For FREE email updates, subscribe to the Flash and Animation Newsletter


Past Issues


print
Printer Friendly
bookmark
Bookmark
tell friend
Tell a Friend
forum
Forum
email
Email Editor


Content copyright © 2013 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.

g


g features
Duplicate Background Layers in Motion 5

Ken Burns Effect In Motion - Record Keyframes

Ken Burns Effect In Motion 5 - Set Up

Archives | Site Map

forum
Forum
email
Contact

Past Issues
memberscenter


vote
Poetry
Daily
Weekly
Monthly
Less than Monthly



BellaOnline on Facebook
g


| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2013 Minerva WebWorks LLC. All rights reserved.


BellaOnline Editor