Flash Professional CS6 gets retooled for game, mobile app development
By Michael Baumgardt, Macworld.com – July 18, 2012
It has been fascinating to watch the evolution of Adobe Flash. What started out as a simple animation program 15 years ago has been transformed over time into a full-fledged development platform for interactive apps on the Web. Now, Flash Professional CS6 has evolved into a powerful authoring environment for creating animation and multimedia content for immersive interactivity across desktops, devices, tablets, smartphones, and televisions.
Because of its wide platform and device support, Flash has long been marketed as a develop-once-deploy-everywhere platform. Today, the largest markets for such technology are mobile games and devices, so it’s no surprise that Adobe has focused on these categories in the Flash CS6 update.
The one major drawback to this strategy is that the available feature set usually tends to be the lowest common denominator of all platforms. Adobe hopes to compensate for this through prebuilt, native extensions that access platform- or device-specific capabilities. It seems promising that this strategy could open the game developer market for Adobe via Flash CS6.
Sprite sheets and Stage3D
Flash’s animation antecedents clearly make it great software for game designers, and its new sprite sheet feature offers many advantages for game development. Sprite sheets let you convert vector art animations into bitmaps that are saved in a single large image file. By showing only a small portion of the image and moving the position of the image, Flash cycles through all frames of the animation. Sprite sheets are particularly important for devices with low processing power.
Generating sprite sheets in Flash CS6 is quite simple: Create a pixel-based animation and put all the sprites in one large flat image file. In a game, you create the animation by loading this single image and moving it quickly from one coordinate to another. This technique has been used in game development for years because it requires the least amount of processing power; the Graphics Processing Unit (GPU) does the heavy work.
When Flash was first developed, the goal was to create animations for the Web, and bandwidth was the main issue. Animating vector art was advantageous because of the small file size. Since running the animation relied on the processing power of a desktop computer, this worked out fine. But with so many mobile devices surfing the Web and becoming a de facto game platform, game developers could not use Flash vector art in games anymore because they simply could not be sure that the game would run smoothly. Sprite sheets fix this problem and make creating games with vector art possible. You can keep working with vector art in an animation, but convert to bitmap imaging for the final game.
From animated vector to bitmap: Flash CS6’s sprite sheet feature will export an animation as a series of frames, all saved in a single file. Flash even optimizes the arrangement to ensure the smallest possible file size.
Not only does Flash CS6 make the process of creating sprite sheets easier than in the past, using them lets you quickly and efficiently adapt your game to different devices. Create your game in high resolution (for the iPad), then change the settings of the stage and export your elements again, say, for a mobile phone.
I created a small animation by using a vector image of a penguin that I imported from Illustrator. After resizing the stage for an older iPhone 3G, and exporting the elements again, the same animation would run without a hitch. What makes working with this new feature so convenient is that it can also export sprite sheets in Starling format. Starling is a popular ActionScript open source game engine for Flash that can be used to create browser-based games as well as games for all major mobile platforms, including iOS and Android. It also supports Stage3D, a new method of 2D and 3D rendering developed by Adobe.
Previously code-named Molehill, this new technology allows you to render up to 100,000 z-buffered triangles at full-screen HD resolution at 60Hz. Before Stage3D, the Flash Player could only manage a few thousand triangles.
Check out this demo from the Adobe Labs, to get a feel for what is possible. You can even download the source code for this game to understand how it works.
Another nice feature is that Flash will optimize your sprite sheet by cropping the sprites before packing them together. So instead of using the same size for each frame, Flash automatically adjusts the size, reducing the total required file size. This is a major timesaver because games have numerous sprite sheets.
Stage3D is a powerful 3D engine. On the Adobe website you will find this 3D game tutorial running at 60 frames per second as an example of what is possible.
Wide platform and device support
For a long time, Flash was only available for the Web. That changed in 2008 when Adobe developed AIR (Adobe Integrated Runtime). AIR is available on iOS, Mac OS X, Android, BlackBerry Tablet OS, and Windows, which makes Flash a powerful cross-platform development tool. You can even develop in Flash for Internet-enabled televisions (running on Adobe AIR for the Digital Home). Adobe also increased Flash CS6’s maximum stage size to 8192-by-8192 pixels.
Adobe is supporting mobile developers with various features, most of which are specifically geared toward games.
While cross-platform developer tools tend to be limited to the most common features on all the devices, Adobe hopes that there will be a market for third-party developers to provide additional features for Flash—a way for developers to just download an .ane file and put it into their Library path. For example, to allow your app to vibrate an iOS or Android phone, you’d use the Vibrate.ane file.
Some extensions are already on Adobe’s developer site, and Adobe plans to rotate extensions on and off of the site based on relevance and when new content becomes available. At this point, you have to hunt these extensions down on your own, which I find a little annoying. The developer community would greatly benefit if Adobe offered a central directory where developers could post their extensions and have users rate them.
Simulation, multiple AIR SDK support, and more
Flash CS6 features Adobe Air mobile simulation, which allows you to test for accelerometer and GPS functions. Normally, the only way to test this would be to download your app to the device. This is tedious and impractical when you are debugging your software. So the simulator allows you to enter GPS coordinates to see how your app would respond. You can tilt it with precision to determine if your games behave as planned. This very useful tool already existed in Device Central, but that utility was dropped from CS6.
Testing mobile applications can be cumbersome, particularly if your app relies on GPS. In the simulator, you can test your app by entering geolocation data, and by using the gyro and various hand gestures. The other useful Flash feature is the SDK support for multiple AIR versions. Because Adobe releases new AIR SDKs regularly, you might have several versions of AIR simultaneously on your computer. It was a bit of a hassle if you wanted to test your app against those different versions. So in the Help menu, there is a new dialog box, Manage AIR SDK, where you can add all your instances. You won’t be able to manage older SDK versions. But as soon as new SDK versions become available, you could plug them in here and it will be available in the Properties panel in the Target list.
Flash CS6 doesn’t support HTML5 yet, but Flash can still be used as a basis for creating HTML5 animations using Zoe and CreateJS. The CreateJS Framework, by Gren Skinner, consists of EaseJS, TweenJS, SoundJS, and PreloadJS, which are are all published under the MIT license. You’ll also find Zoe, which works similarly to Adobe’s now-defunct Wallaby. So while in-software-support for HTML5 is not currently available, Flash can still be used as a basis for creating HTML5 animations using Zoe and CreateJS.
Macworld’s buying advice
Hollywood is starting to produce 3D movies at 60 fps, and it’s likely that in the near future, we will become accustomed to 3D at 60 fps. Eventually, movies and games running at 24 fps will look jerky and old-fashioned. Adobe is offering a way to create such enhanced realism and fluidity today with Flash Professional CS6. This upgrade is also a must-have for game developers. It provides them with an easy way to create sprite sheets, and facilitates export and optimization for a variety of platforms.
Editor’s Note: The article is reprinted from MACWorld.com.