This document provides an overview and lessons learned from real world projects using Adobe AIR and the Starling framework for mobile development. It discusses how AIR allows for faster development across iOS and Android using existing AS3 skills. The state of the AIR ecosystem in 2013 is examined, highlighting mature libraries like Starling, Feathers and Away3D. Tips are provided around tool selection, common issues like touch handling and textures, and best practices for composition, layout and deployment. Real examples demonstrate list rendering and scrolling techniques. Resources for continuing education with Starling are also listed.

1. Going Mobile with
AIR + Starling
Lessons from Real World projects
Presented by Amos Laber

2. About Me
Amos Laber
Game Developer, Coder, Architect
Background in C++, Console games, 3D
Engines.
Later: Flex, AS3, Casual and 2D Games.
Blog:
www.flexwiz.net

3. Content and Scope
The state of AIR as a mobile ecosystem (2013)
Practical use of Starling, Feathers and ANE
Tips, Common Problems and Practices

4. Demo

5. AIR vs. Native
Trivial: Need iOS and Anrdoid at the same time
AIR = Shorter timelines (Rapid development)
Leverage existing knowledge and code - Faster to
implement
Personal preference: AS3 over Java or Obj-C
Captive Runtime: App is same as native

6. The AIR Ecosystem
AIR 3.5 (FP 11.5) made a big shift from enterprise
into mobile (without Flex).
A new generation of AS3 frameworks has reached
maturity
Adobe Gaming SDK: Starling, Feathers,
Away3D
Also Flare3D, Citrus, Nape, DragonBones
New Tools: ASC2, Scout, FlashBuilder 4.7

7. Production Goals
Get stuff done fast.
But no cutting corners!
Spend time on the game (creative),
not on boilerplate code.
UI Elements tend to be the #1 time consuming
- try to minimize and simplify them.

8. Choosing Tools
Code and Art Toolchain
Glyph Designer

9. Choosing Libraries
Frameworks
Libraries
Gestouch

10. Extensions (ANEs)
Services:
Game Center
In App Payments:

11. Game Framework
Do we need one?
Game Framework (or Engine) will provide
features and classes that are commonly used in
games / apps.
It takes time to learn how to efficiently use one
and it creates another dependency
I decided to roll my own.

12. The Parallel Universe
Starling forms a parallel universe where
flash display list is completely hardware
accelerated.

13. Migrating to Starling
Starling vs. 'classic' Flash
Rendering: CPU
flash.display.*
Vector fonts
|Flash|
|||
Rendering: GPU (H. Accel OpenGL)
starling.display.*
|Starling (Stage3D)| fonts
Bitmap
Vector Shapes
N/A (* Quad only)
Bitmap / BitmapData
Image / Texture
Sprite and DisplayObject
Same
flash.events
starling.events (faster)

14. Starling Basics
Compose the display list the same way as in flash.
Layering Sprites, images and
buttons
Compose your views/ screens
Alpha blending and hierarchy
works the same way as in Flash.

15. Starling App Setup
Load all assets (mostly bitmaps) on initialize.
Nearly all display objects are images
Best is to pack them up into sprite sheets
Determine screen size with stage_resize event. Use
it across the app for layouts.

16. Sprite Sheets

17. UI Setup - Feathers
Decide when to use custom UI, case by case
Prepare a bitmap font and skin elements
(Bitmap font text field is provided)
Works best with a theme

18. Integrating ANEs
Drop into project and update the manifest /permissions
Watch out for default mode - should not throw errors.
Well documented and supported ANE are a better choice.
Don't waste time on building them - too many dependencies (iOS
and Android ver, SDK compatibility)
Testing is only done on the device. They're native.
Recommended: MilkMan and FreshPlanet

20. Example:
List and Item Renderer
import feathers.controls.List;
var list:List = new List();
list.itemRendererType= PetItemRenderer;
list.dataProvider = petList;
list.layout = new TiledColumnsLayout();
list.scrollerProperties.scrollBarDisplayMode = SCROLL_BAR_DISPLAY_MODE_FIXED;

21. Example:
The Item Renderer
class ItemVO {
name:String; image:Texture; locked:Boolean;
}
protected override function draw():void
{
var dataInvalid:Boolean = this.isInvalid(INVALIDATION_FLAG_DATA);
if (dataInvalid) {
|updateImage(data.image);|
|label.text = data.name;|
|label.visible = !data.locked;|
|image.blendMode = data.locked? BlendMode.ERASE :|

22. Composing Tips
Alpha and PNG w/Alpha works best - don't bake it
Use Tile Patterns with TiledImage.
Stretch elements with Slice9Image /Slice3Image.
Use scrollRect for simple masking and smooth
scrolling

23. Example:
Scroll and Mask
Castle gate was masked with scrollRect,
animated by tweening scrollRect.y
+
+

24. Common issues to
watch for

25. Touch
AIR SDK own touch handling is not very useful
3rd party libraries can fill in the gap
Gestouch is my recommended library:
Multitouch gestures for Starling or classic flash
http://github.com/fljot/Gestouch

26. Textures
Things to know
GPU memory on devices is limited.
iPhone 3GS has 24 MB
Standalone textures are rounded up to power of 2 size (e.g.
1024x1024 pixels).
Once created, the texture is uploaded to GPU.
When maxed out, the OS will close the app without
warning, exception or stack trace.

27. Textures
Best Preactices
Create the textures on demand - not when the Assets are
loaded.
Make sure to release with texture.dispose() when
removed from stage.
Pack everything to sprite sheets! We use TexturePacker
Have a central asset manager to hold textures

28. Textures
Sample Code
private var _textures:Dictionary;
..
public function getTexture(name:String):Texture
{
|if (_textures[name] == undefined)
{|
|
var data:Object = _loadedAssets[name];|
|
if (data is Bitmap)|
|_textures[name] = |
Texture.fromBitmap(data as Bitmap, false, false);
|}|
return _textures[name];
}
public function disposeTexture(name:String):void
{
if (_textures[name]) {
Texture(_textures[name]).dispose();
|textures[name] = |
null
|;|

29. Screen Size and Layout
Avoid hardcoded pixel sizes. Use relative align or
percentage
iPad Retina support No need to duplicate the assets (x1, x2, x4...)
Selective scale
Test layout in different screen sizes on simulator

30. and Something
extra

31. Deployment
Main Markets
Discoverability, Promotion
Apple App Store

32. Promote you App
For Zero Cost
Create a Facebook fan page.
Create a Twitter account and tweet frequently.
Make a YouTube video with actual gameplay footage.
Prepare a press kit with screenshots and marketting blurb
and send it for review to selected web sites.

33. Tracking Data
Weekly Downloads
iOS
Android
Chart was not exported from SlideRocket

34. Takedown
Is Starling Right for you?
AIR proved a viable solution for mobile
Starling is now a Solid and Mature framework
Developers can get stuff done faster

35. Resources
Starling Wiki:
wiki.starling-framework.org/
Starling Forum:
forum.starling-framework.org/
gotoAndLearn:
My Blog:
www.flexwiz.net
gotoandlearn.com
Flash Daily:

36. QA
&
[ Ask me anything ]

37. Thank You
@amosLaber
note@amosl.com