best practices for flash applications on mobile devices
DESCRIPTION
I presented best practices for mobile development with the Flash platform at the FFK10 conference in GermanyTRANSCRIPT
![Page 1: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/1.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Best practices for mobile development with the Flash PlatformMark Doherty | Flash Platform Evangelist
![Page 2: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/2.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Before starting...
2
3 questions
![Page 3: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/3.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Why Mark looks so French today?
3
![Page 4: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/4.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Ok then... who are you ?
4
Michaël ChaizeFlash Platform Evangelist
My blog: www.RIAgora.com
@mchaize
![Page 5: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/5.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Best-practices for mobile development ?
5
“Hopefully everyone understands that Michael Chaize commenting
on mobile development is equivalent to Tiger Woods
commenting on PaperVision 3D”
Lee Brimelow
![Page 6: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/6.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Menu du jour
6
Flash and screens
Design considerations
Flash best practices
Flex on mobile ?
AIR on mobile devices
Resources
![Page 7: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/7.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential. 7
Flash and screens
![Page 8: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/8.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Applications are beginning adapt to context
RIA Cloud Devices
Adobe Systems Inc.| FOTB2009
> >
![Page 9: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/9.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
9
Digital Explosion Across Multiple Screens
Consumer Electronics
Personal Computers
Mobile Phones
![Page 10: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/10.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Flash Platform - A complete system for web innovation
![Page 11: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/11.jpg)
© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Flash Player 10.1
!e only consistent browser-based runtime for connected devices
Targeting desktops, mobile phones, netbooks, tablets, and the Digital Home
On track for delivery to consumers in "rst half of 2010
Runtimes will be available over-the-air through marketplaces and Adobe.com
![Page 12: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/12.jpg)
© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Brings full Flash Player feature set to devices
New Features:
Multi-touch & gestures
Accelerometer
Screen orientation
Mobile text input
Device capabilities discovery
Globalization support (GSLib)
Mobile se#ings manager
Global error handling
Flash Player 10.1
![Page 13: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/13.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential. 13
Flash Player 10.1 API and testing
![Page 14: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/14.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential. 14
Design considerations
![Page 15: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/15.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Context
15
![Page 16: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/16.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
320px
480p
x
800p
x
480px
16
Screens
![Page 17: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/17.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
44px7mm
≠
17
Finger
![Page 18: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/18.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con!dential.
18
Usually, a "nger comes with a hand
![Page 19: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/19.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential. 19
Native keyboard
![Page 20: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/20.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Flash best practices
![Page 21: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/21.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Graphical optimizations
90%
10%
rendering pure algorithm
![Page 22: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/22.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Understand its behavior
FPS and enterFrame
events
Avoid high-rate timers
Keep FPS as low as possible
Set dynamic FPS
![Page 23: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/23.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Memory optimizations and the getSize() method
trace(getSize(new Shape()));// output: 236
trace(getSize(new Sprite()));// output: 412
trace(getSize(new MovieClip()));// output: 440
Display Objects Primitive types
var a:Number;trace(getSize(a));// output: 8
var b:int;trace(getSize(b));// output: 4
var name:String;trace(getSize(name));// output: 4
name = "";trace(getSize(name));// output: 24
![Page 24: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/24.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Reusing objects
![Page 25: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/25.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Freeing memory
var mySprite:Sprite = new Sprite();
mySprite = null;
Remember that when an object is set to null, it is not necessarily removed from memory. Sometimes the garbage collector does not run, if available memory is not considered low enough. Garbage collection is not predictable.
Object pooling
![Page 26: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/26.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Freeing MovieClips
Text
runningBoy.addEventListener(Event.ADDED_TO_STAGE,activate);runningBoy.addEventListener(Event.REMOVED_FROM_STAGE,deactivate);
function activate(e:Event):void{ e.currentTarget.addEventListener(Event.ENTER_FRAME,handleMovement);}
function deactivate(e:Event):void{ e.currentTarget.removeEventListener(Event.ENTER_FRAME,handleMovement); e.currentTarget.stop();}
Rectangle ? Alpha ? RemoveChild ? Visible ?
![Page 27: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/27.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Bitmaps
Consider bitmaps vs. vectors.
Avoid filters and blend modes.
Transparency is very expensive.
Keep bitmaps as small as possible.
cacheAsBitmap is not that easy
![Page 28: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/28.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Text
Feel the transparency > opaqueBackground
Avoid TLF
Test different anti-aliasing technics (lisibility, animation...)
Test your animations with different qualities of Stage
![Page 29: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/29.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Video
H264
![Page 30: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/30.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Flex on mobile ?
![Page 31: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/31.jpg)
© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Slider : Flex Mobile Framework
Flex applications run on Flash Player 10.1, but...
Challenges: Performance of the SDK, Different screen sizes and densities.
Based on the Flex 4 codebase, Slider will include signi"cant changes to optimize both the performance and user experience on more constrained device environments.
Slider will include new capabilities speci"cally designed for mobile development, such as a new construct for managing application “screens”. Resolution-independent layout.
A new set of user interface components will be added which are designed for mobile form factors and input methods.
31
![Page 32: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/32.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
AIR on mobile devices
![Page 33: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/33.jpg)
© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Adobe AIR for smartphones (and tablets)
Adobe AIR allows developers to build standalone applications using Flash technology
Public support from RIM and Motorola
First mobile operating system to be supported is Android
Provides Flash developers access to app stores
AIR applications can be repackaged for the iPhone
33
![Page 34: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/34.jpg)
© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
AIR Packaging & Distribution Work%ow
.ipa
.air (swf, jpg, mp3)
.air
.apk
.exe
.dmg
![Page 35: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/35.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Resources
![Page 36: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/36.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Resources
■ Slides and samples on my blog: h#p://www.RIAgora.com
■ Adobe TV
■ Optimization guides:■ Flash Player optimization for mobile devices■ Optimization for the iPhone■ AIR best practices for mobile devices■ Ads optimization
■ Technical articles:■ h#p://www.adobe.com/devnet/%ashplayer/articles/
fplayer10.1_hardware_acceleration.html
■ h#p://www.%ashmobileblog.com/
36
![Page 37: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/37.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Fight !
![Page 38: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/38.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Questions?
![Page 39: Best practices for Flash applications on mobile devices](https://reader034.vdocument.in/reader034/viewer/2022042714/554bb9fdb4c90530298b4af3/html5/thumbnails/39.jpg)
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.
Remember... slide "ve...
39
“Hopefully everyone understands that Michael Chaize commenting
on mobile development is equivalent to Tiger Woods
commenting on PaperVision 3D”
Lee Brimelow