Posts in Category "General"

Adobe Flash Professional CC 2014 is here!

It has been sometime in the making, but there’s good reason for that. The newest update is packed with stunning new features that makes Flash Professional CC 2014 an absolute must-have. Here’s what’s new:

New and improved Motion Editor

We promised to reinstate the Motion Editor when you told us that you really missed having it. And, yes! The Motion Editor is back in a slicker, smoother, and more powerful form. For more information, see Editing Motion Tweens using Motion Editor.

 

MotionEditorForBlog - resize - 1

Leveraging modern web standards – take 1 – WebGL

Last December, we added native support for HTML5 Canvas in Flash Professional, and now, it’s time for WebGL or Web Graphics Library format. You can create and publish WebGL content from within Flash Professional CC 2014 using the WebGL (preview) document type. Work with the familiar Timeline, Workspace, Tools, and other functionalities of Flash Pro, and produce WebGL content. Flash Professional leverages the GPU accelerated usage of processing and rendering of WebGL content, which is integrated with most modern-day browsers. For more information, see Creating and publishing a WebGL document.

HelpQuestions_Flash-04

 Leveraging modern web standards – take 2 – SVG

You can now export fully scalable, superior quality, and high resolution SVG images using Flash Professional. Supporting the SVG export format is a giant stride towards Flash Professional embracing open web standards. SVG images can be easily integrated with most modern web content. For more information, see Export SVG files.

HelpQuestions_Flash-02

Beautify artwork using Variable-Width Tool

The Variable-Width Tool allows you to embellish artwork. You can easily enhance uniform and standard strokes to create beautiful strokes and shapes using the Variable-Width Tool. You could also save such enhancements as width profiles and reuse at a later point. These strokes can also be shape-tweened to produce rich animation. For more information, see Enhance Strokes and Shapes using Variable-width tool.

HelpQuestions_Flash-03

 

Create, store, and manage color themes using Adobe Kuler

Flash Professional CC is now integrated with Kuler panel, a cloud-based application to create color themes using iPhone or desktop browser. With Kuler panel, you can sync your color inspirations right to Flash Professional CC via Creative Cloud. To create color themes using Kuler, visit this link. For more information about using Kuler to create color themes and managing them within Flash Professional, see Using the Kuler panel.

MyKuler

Create HTML5 Panels and Extensions

You can extend Flash Professional CC using HTML extensions. Earlier, Flash Professional CC could only be integrated with SWF extensions packaged using Adobe Extension Builder. However, with Adobe Extension Builder 3 you can create and package HTML extensions that can be submitted to Adobe Exchange. Flash Professional CC has been enhanced to leverage HTML extensions packaged using Extension Builder 3. These extensions can be downloaded using Adobe Exchange and managed using Adobe Extension Manager from within Flash Professional. For more information, see Creating HTML extensions.

Synchronizing Workspaces with Adobe Creative Cloud

You can now sync the Flash Professional CC Workspace settings with Creative Cloud. You can customize the workspace to suit your design needs, and via Creative Cloud, you can replicate the customizations across multiple machines. For more information, see Sync Flash Professional Preferences with Creative Cloud.

SyncSettings_fl

Other enhancements

  • The Object-level undo option has been re-enabled and can be accessed on the Preferences dialog. For more information, see Undo, redo, and the History panel.
  • Exporting projector files has now been re-enabled, as well. Note that the option to export projector files is available within the Commands menu. For more information, see Exporting Projector Files.

Creating HTML5 Canvas | Reusing ActionScript 3.0 assets | Flash Pro CC – Part 1

Note: This is the first of the two part series I am writing for Converting AS3 to HTML5 Canvas.

Flash Professional CC allows native HTML5 Canvas authoring! Yes, you heard it right! With its latest update, you can create HTML5 Canvas content right from within Flash Professional CC using the new HTML5 Canvas document type. This means you can use Flash Professional CC to produce rich, interactive content that adapt to the modern web needs. Flash Pro CC also allows you to add interactivity using JavaScript, as well.

HelpQuestions_Flash-01

What about legacy ActionScript content?

If you have created SWFs and other ActionScript 3.0 content types in the past, it is certainly not the end of the road! Flash Pro CC allows you to migrate and reuse ActionScript 3.0 content within an HTML5 Canvas document type. When you want to migrate, you have two options:

  1. Manually copy layers, symbols, and other library items to a new HTML5 Canvas document.
  2. Automatically port all layers, symbols, library items, and code-snippets to a new HTML5 Canvas document using the Convert AS3 to HTML5 Canvas document.

In this article, I will explain the second option in detail. To get started, download and extract the contents of Banner.zip file, and open Banner.fla in Flash Professional CC.

Command

When you publish the file, here’s how the SWF output looks:

Converting ActionScript 3.0 assets to HTML5 Canvas

To convert the ActionScript assets and reuse them in an HTML5 Canvas document, do the following:

  1. In Flash Pro CC, select Commands > Convert to HTML5 Canvas from AS3 Document Formats option.
  2. Flash Pro CC creates a new document, and when prompted, provide a meaningful name (for example, Banner_HTML5.fla) and save the document. The new document contains all layers, symbols, library items, and code-snippets (absolutely)! You will observe that the layers and library items in the new HTML5 Canvas document are composited in just the same way as that of Banner.fla file. The Output panel shows warnings generated while copying/importing AS3 document assets into the HTML5 Canvas doc.

The effect of Conversion

  • The (Canvas) suffix besides the file name indicates that it is an HTML5 Canvas document.
  • Ensure that you study the warnings in the Output panel. These warnings help you understand all the content conversions that occurred during the migrations. Since not all ActionScript 3.0 features are supported by HTML5 Canvas, Flash Pro CC applies defaults to or removes all such unsupported content types. For information, see this article. In the Banner.fla, you can notice the following conversions:
    • Label (Layer) – this is a normal label layer, and is migrated without without any changes.
    • Code (Layer) – this layer has frame scripts (ActionScript code) in frames 114, 141, 142, and 278.
      • The layer is copied and the objects on stage are intact.
      • ActionScript code is commented out for all 4 frames (114, 141, 142, and 278).
    • Lines (Layer) – this layer contained a dashed stroke in the original ActionScript 3 document.
      • The layer is copied and the object on stage is intact.
      • Dashed stroke is not supported with HTML5 Canvas and hence, is converted to a solid stroke.
      • Txt (Layer) – this layer has 3 instances of Text symbols.
        • AntiAlias of text is not supported with HTML5 Canvas, and is converted to DeviceFonts.
        • AutoKern is not supported with HTML5 Canvas, and is removed.
        • LineType is not supported with HTML5 Canvas, and is converted to MultiLineNoWrap.
        • StaticText is not supported with HTML5 Canvas, and is converted to DynamicText.
      • All other layers are copied as is.
  • ActionScript code is preserved, but commented out. As a post-migration step, it is important that you write JavaScript code that substitutes functionality of ActionScript code. This will be explained in the next post, as part of this series.

Try publishing the HTML Canvas file by pressing Ctrl + Enter (Command +Enter for MAC) or go to File > Publish to launch the output in your default browser.

The output is a smoothly running HTML5 Canvas animation, with underlying standard compliant HTML and JavaScript code. Here’s how it looks:


In my next part, I am going to tell you how to convert the ActionScript bits in to JavaScript to build interactivity. Stay tuned!

Introducing Native HTML5 Canvas in Flash Pro CC

HTML5 Canvas workflow

Have you ever wondered what it would be like to create animated content using a familiar authoring environment, while being able to target a diverse set of platforms like HTML5 Canvas, in addition to Flash Player and AIR?

Great news – the latest version of Flash Professional CC, available now, includes native HTML5 Canvas support. As you may recall, Flash Professional CC was released in June, marking its rebirth as a modernized 64-bit authoring tool for multiple platforms. This update continues that theme, emphasizing its focus on HTML5.

The new HTML5 Canvas support lets you create interactive content leveraging well-established Flash Pro paradigms of timeline, frame-scripts and creation tools, all customized for the HTML5 Canvas platform. Add frame-script using native support for JavaScript including code-hinting, code-coloring, and more.

Check out more details here, or download the free trial.

Thanks and we hope you enjoy this update!

Rich Lee, Sr. Product Marketing Manager
Ajay Kumar Shukla, Sr. Product Manager

Flash Professional CC Update 1 – now available!

Hello everyone,

Firstly, a BIG thank you for providing feedback and reporting bugs. Your inputs have gone a long way in helping us investigate and fix these bugs. We are happy to announce that Flash Pro CC Update 1 (13.0.1) is now live! The update contains fixes for the following bugs:

  • The first curve, drawn using a Wacom tablet, is straightened out.
  • Flash Pro CC freezes when closing the application, intermittently.
  • Flash Pro CC crashes on setting some specific fonts in code editor preferences.
  • Flash Pro CC crashes on exporting images and SWF files on Mac 10.6.

For more information and full list of bugs fixes, see the release notes.

Cheers,

Suhas Yogin