I gave this overview of Adobe Flash Lite 2.0 with Alessandro Pace back in 2006 as part of the Boston (Macromedia) Flash User Group to an audience of 50 or so designers and developers.
around • This will be used ONLY to: • Contact you about future mobile events such as this one • Gauge your level of interest in mobile technology Nothing else! • Nothing else! • Feel free to add your name & info, or skip it BFPUG - Flash Lite 2.0 3
Flash Lite 2 0 Feature Set • Flash Lite 2.0 Feature Set • Key • Video Sound • Sound • MSO • XML • Drawing API • Drawing API • Text • and more … • 2 0 Walkthroughs and Demos • 2.0 Walkthroughs and Demos • Best Practices • What’s Next? BFPUG - Flash Lite 2.0 4 • QA
Wallpapers • Standalone • Browser • Others … • Flash Lite 1.0, 1.1, 2.0 • Animation • Wallpaper (Huge sellers in Japan) • Ringtones (Huge sellers in Japan) • Ringtones (Huge sellers in Japan) • Applications and Games • Websites (40% i-Mode sites in Japan have Flash Lite content) BFPUG - Flash Lite 2.0 8
http://www.macromedia.com/mobile/supported_devices/ H d t M f t • Handset Manufacturers • Nokia Series 40 and 60 • Sony Ericsson • Samsung • NEC • more (LG BenQ Motorola? just announced at 3GSM) … more (LG, BenQ, Motorola? just announced at 3GSM) • Operators • NTT DoCoMo (Flash Cast) • KDDI • Vodafone KK • T-Mobile (News Express) BFPUG - Flash Lite 2.0 9
only “smaller” • Considerations: • Screen size (176x208, 320x208,320x240, etc) Screen size (176x208, 320x208,320x240, etc) • Color Depth • Connectivity • Security y • CPU / Memory • Usability • Bandwidth • No device uniformity - feature set divergence • Deployment, distribution, selling content • Aggregators, OTA, network operators, viral, other methods … gg g • Mobile economies outside APAC • Europe … US? • There is exists a “diversity of mobile needs” throughout the world BFPUG - Flash Lite 2.0 13 y g
1.1 • Flash 4/5 “Hybrid” • Pre AS 1.0 Flash 4 ActionScript .. tellTarget, setProperty, etc. • Limited feature set • Performance • Performance • Flash Lite 2.0 • Flash 7 • ActionScript 2.0 support (partial) • More powerful feature set • Performance versus 1.1? No official benchmarks (yet) • 2.0 is not perfect. Still in Beta! R t ll b t th M bil E i i T t Ad b BFPUG - Flash Lite 2.0 15 • Report all bugs to the Mobile Engineering Team at Adobe
• New FSCommand2 • Key Object • Mobile Shared Objects • Drawing API • System.capabilities • OOP • Text enhancements • Dynamic asset loading • Functions … and more ! • Flash Lite 2 ActionScript is NOT desktop ActionScript 2 0 ! IMPORTANT NOTES: Flash Lite 2 ActionScript is NOT desktop ActionScript 2.0 ! • Flash Lite 2 is partially AS 2.0 compliant • Think Mobile! Simplicity = K I S S Components just aren’t going to work! BFPUG - Flash Lite 2.0 17 Think Mobile! Simplicity K.I.S.S … Components just aren t going to work!
Features NOT available in 2.0 • No .FLV playback - only device video supported No .FLV playback only device video supported • Some AS 2 classes N/A - only partial AS 2 support • No XMLSocket - must still use “polling” methods • No communication between Flash Media Server • No Flash Remoting/AMF Support - use LoadVars, LoadVariables, XML object • No support for CSS with TextFields • Masking with device fonts • Bitmap smoothing while rendering at high quality • For more limitations … check the docs! • Mobile is a different ballgame. Not every desktop feature makes sense in it! • Adobe doesn’t want to “bloat” the Flash Lite player with complication (yet) • Overall, 2.0 is a step forward in the evolution of Flash Lite BFPUG - Flash Lite 2.0 19 Overall, 2.0 is a step forward in the evolution of Flash Lite
others … • How does Flash Lite 2.0 compare? • Pros - powerful, low learning curve, media rich feature set, rapid development • Cons - not preinstalled on devices yet - still in beta • What is 1.1 good at? g • Wallpapers, ringtones, games, etc. • What are people doing with Flash Lite 2.0? T ti f f t d ti t t t • Testing, proof of concepts, apps, games, demos, no one aggregating content yet • Speculation: FL 2.0 will be useful for? • business apps, games, custom UI’s • everything in 1.1 ecospace only “better”, easier to build • Media rich applications (images, video, sound) BFPUG - Flash Lite 2.0 20
2.0 is out … 1.1 is dead, right? • Wishful thinking, but answer is No! Wh ? • Why? • 1.1 is just now getting preinstalled on devices • 1.1 is a smaller footprint and can be installed on more devices • 1.1 content is huge in APAC region (specifically Japan) • There are no preinstalled 2.0 devices at this time. Optimistic: 2006, Realistic 2007 • There are monetary reasons for knowing 1.1. Developing, maintaining, fixing existing content = basic ecosystem for 1 1 content = basic ecosystem for 1.1 • 1.1 is a great stepping stone to designing and developing for mobile - there is a lower entry barrier • 2.0 is still “experimental”, meaning it is on the labs = Beta 2.0 is still experimental , meaning it is on the labs Beta • 1.1 is still important in the Flash Mobile Platform. Don’t dismiss it just yet! • Our recommendation … learn 1.1 and 2.0 BFPUG - Flash Lite 2.0 21 • Flash Lite Mobile Developer Certification = Flash Lite 1.1
this.getNextHighestDepth(), 0, 0, 100, 10 ); helloworld_txt.text = "hello world!"; trace( helloworld_txt.text ); • This could be achieved in 1.1 - using setProperties(), assign vars, etc thi … so nothing new … • However, being able to set text properties on the helloworld_txt dynamic instance IS new. //-- access to textfield object and properties helloworld_txt.textColor = 0x000000; • Easier to manage (dynamic) text instances now g ( y ) • size, textColor, textExtent, etc • We talk about FL 2.0 text enhancements later … BFPUG - Flash Lite 2.0 23
2.0 • In 1.1 … resorted to using the “keycatcher” buttons • FL 2.0 = we now have the Key object! • Key object, addListener, Key.UP, etc. thi K D f ti () { // k t h dli } • this.onKeyDown = function() { //-- key event handling } • Key.addListener( this ); • SoftKeys (LSK/RSK) MUST be 2.0 compliant. UDLR - 1.1 via keycatcher y ( ) p y • Assign Key object to: • _root • movieclip • listener object • use onEnterFrame and isDown() event BFPUG - Flash Lite 2.0 24 use onEnterFrame and isDown() event
Mobile “video standards” • 1.1 - launch external player to play .3gp video files or “fake” video with .jpg’s • Device Video introduced in 2.0 … No native playback support (.FLV, etc)! • FL2 = Video Object (partial support) Vid l () Vid () d • Video.play(), Video.pause() are new commands • Embed video into swf or load video for playback • “Bundled” Video - video vid play( “symbol://myvideo1 vid” ); • Bundled Video - video_vid.play( symbol://myvideo1_vid ); • NOTE: You must have QuickTime installed to test within Mobile Emulator! video_vid.play( “myvideo.3gp” ) id id l ( “fil // id 3 ” ) video_vid.play( “file://myvideo.3pg” ); video_vid.play( “http://www.macromedia.com/ocean.3pg” ); //-- ??? • Video in under 10 minutes - DEMO BFPUG - Flash Lite 2.0 26
great new feature … but not perfect yet • FL 2.0 Video Limitations • No rotating or skewing of video • No rotating or skewing of video • No synchronization with timeline • No compositing or blending video with other assets • No sound control for video playback • Simultaneous video playback = BAD • The old quality versus size dilemma • Can’t load massive video files (keep them small) • Loading external http:// bound videos is complicated: Operator support, open ports (RTSP), bandwidth • Looking forward to having streaming .flv sometime in the future Fl h M di S Fl h Lit i FL 3 0? Wh k ! • Flash Media Server + Flash Lite in FL 3.0? Who knows! BFPUG - Flash Lite 2.0 28
embedding sounds in .swfs and using loadMovie() • Flash Lite 2.0 = Sound Object Nati e s De ice So nd • Native vs. Device Sound • Sound Bundler Tool (.fls files) • We now have access to: • loadSound(), attachSound(), new Sound(), setPan(), setTransform(), properties, etc • Device audio (MIDI, Mfi, MP3) • System.capabilities.AudioMIMETypes[ ] - array contains all supported y y y • Device Audio Synchronization with animation: _forceframerate • No streaming with loaded sounds, ONLY event sounds Ch ll d li it ti ith A di ( 3 ti h d • Challenges and limitations with Audio (no .mp3 native, no speech codec, matching sample rates) • Sound Walkthrough - DEMO BFPUG - Flash Lite 2.0 29
a device in less than 10 minutes! • Uses Sound object • Supports stop, play, and replay functionality • Pulls ID3 tag data and displays info • MP3 Player Walkthrough - DEMO • MP3 Player Walkthrough DEMO • Is a fully fledged iTunes possible? Not yet, possibly next release? BFPUG - Flash Lite 2.0 30 y g p y , p y
use write2file.exe or other 3rd party software to load/save persistent data to device • FL 2 0 = Shared object think “super” cookie • FL 2.0 = Shared object … think super cookie • MSO = Flash Shared Objects with some differences • Limitations and distinctions: • MSO size • Other swf’s cannot access data M t li t bj t t t b k ft i d t • Must use a listener object to report back after saving data • MSO don’t work in your device “inbox” (read-only) • Can store basic Flash objects: Numbers, Strings, Boolean, Arrays, etc j g y • Effective uses for MSO’s … what to store, when • Some devices support their own persistent data. iriver u10 has it’s own device API (Flash Lite 1 1) BFPUG - Flash Lite 2.0 32 device API (Flash Lite 1.1).
random colors and last hex color is saved to MSO • Code Code Walkthrough - DEMO • XD Team has a short tutorial up at their blog • MSO’s are good for saving preferences and similar data • Other uses? … trial based apps … username/password, stock quote data, high scores for a game, etc. BFPUG - Flash Lite 2.0 33 , g g ,
Objects var myMSO:SharedObject = sharedObject.getLocal( “message” ); y j j g ( g ) SharedObject.addListener( “message”, messageLoaded ); function messageLoaded( myMSO:SharedObject ):Void { message_txt.text = ( myMSO.getSize != 0 ) ? myMSO.data.message : “”; } Oth th d d ti • Other methods and properties: • .data (remove .data and you have “non-permanent” vars in MSO) • .getLocal(), .getSize(), .clear(), .flush(), .getMaxSize(), onStatus(), addListener(), removeListener() • Use delete statement to remove variables from an MSO: delete myMSO.data.message; BFPUG - Flash Lite 2.0 34
• 1.1 = tellTarget() type Flash 4 addressing of movieclip assets. tellTarget( “/mymovie_mc” ) { //-- blah } FL 2 0 AS2 f ll d t t tibilit ! • FL 2.0 = AS2 = full dot syntax compatibility! _root.mymovie_mc.setHeader( “test”); _root.mymovie_mc._alpha = 50; _parent.mymovie_mc._alpha = 100; this._alpha = 0; • Everything works as expected: y g p • this. syntax, _root, _parent, _lockroot • You can now target button instances on the timeline • Remember that deep nesting of movieclips is still not so great an idea • Always keep in mind you are developing for mobile .. so every bit of memory counts BFPUG - Flash Lite 2.0 35 y • MovieClip object!
API (consult API docs) var myXML_xml:XML = new XML( “<test/>” ); trace( myXML_xml.childNodes[0].nodeName ); //-- etc, etc • Limitations • Memory - keep XML small • Want to keep XML “light” and “sparse” • External XML based webservices and data! myXML_xml.load( “test.xml” ); • XML versus using flat text files • If you are using just 1 value … does it make sense to store XML? • Anything you can store in XML, you could also store in text file! y g y y • Benefits for code reuse between 1.1 and 2.0 content? • Walkthrough - DEMO BFPUG - Flash Lite 2.0 36
• Not everything is supported Limitations • Limitations: • Performance (CPU), Memory (RAM) • Remember devices don’t handle gradients too well • Applications in FL 2.0 • Dynamic charts • Custom UI • Games • More! • onEnterFrame() + Drawing API = ? o e a e() a g • Peter Baird’s “Stock Chart Viewer” • Best undocumented feature of Flash Lite 2.0? BFPUG - Flash Lite 2.0 38 • Walkthroughs - DEMO
now has MovieClipLoader object. Previously 1.1 only had L dM i /L dM i N LoadMovie/LoadMovieNum • attachMovie() and createEmptyMovieClip now exists also. Previously only duplicateMovieClip and “static” holder clips. y • Loading of .jpg, .gif, .png, .swf now possible. No longer restricted to .swf jpg embedding workaround • videoMimeType, audioMimeType and imageMimeType arrays • Walkthrough - DEMO BFPUG - Flash Lite 2.0 39
by embedding graphics/assets into external .swf’s and using loadMovie() Fl h Lit 2 0 i t d i t f if j f • Flash Lite 2.0 now introduces image support for: .gif, .jpg, .png, .swf and supported device formats. • System.capabilities.imageMIMETypes[ ] y g y if ( System.capabilties.imageMIMETypes[ “image/png” ]) { //-- blah } • image_mc.loadMovie( “image1.jpg” ); Li it ti • Limitations: • 1.1 - one asset load per frame • 2.0 - You can now load up to 5 images per frame (with 10 open 2.0 You can now load up to 5 images per frame (with 10 open connections possible) • MovieClipLoader object is now available as well BFPUG - Flash Lite 2.0 40
static, dynamic, input text, scrolling text • FL 2.0 = TextField objects var mytextField:textField = this.createTextField( “test txt”, this.getHighestDepth(), 0, 0, 100, 20 ); var mytextField:textField this.createTextField( test_txt , this.getHighestDepth(), 0, 0, 100, 20 ); • 2.0 introduces a version of TextFormat object (partial support) • Ability to dynamically change (some) font properties G • Unicode Text Encoding = multi-lingual support = Globalization • Limitations: • “Flash Type” not supported T t f tti l t l i b ld it li • Text formatting only supports: color, size, bold, italic • Device text cannot be masked, used as a mask, or rendered with transparency • No CSS support • Flash components: label, textarea, textinput not supported • Textfield and textformat objects partially supported • Partial support for HTML formatting and textformat properties • Other limitations … • Walkthrough - DEMO BFPUG - Flash Lite 2.0 41 • Walkthrough DEMO
“outside world” • Allows you to make external calls from within Flash fscommand( “FullScreen”, true ); ( ) • FSCommand2 is a new API specifically for Flash Lite status = fsCommand2( “setSoftKeys”, “left”, “right” ); //-- 1.1 and 2.0 command • Flash Lite 2.0 adds to existing fsCommand2 set with the following additions: //-- extends the backlight for x seconds, so it stays on longer status = fsCommand2( “ExtendBacklightDuration”, 45 ); //-- by default, focus rect is yellow as on desktop _focusrect = true; status = fsCommand2( “setFocusRectColor”, 255, 0, 0 ); • You can also set more than two softkeys in Flash (up to 11) • See Flash Lite documentation for all commands available … • Not all fscommands are supported across all devices BFPUG - Flash Lite 2.0 42 pp • Device capability matrix
certification, errors can and do happen • New errors codes … they are different than 1.1 codes //-- Flash Lite 2 Errors 1: Out of memory 1: Out of memory 2: Stack limit reached 3: Corrupt SWF data 4: ActionScript stuck 5: (there is no error code) ( ) 6: Bad image data 7: Bad sound data 8: Root movie unloaded 9: (there is no error code) 10 URL t l 10: URL too long 11: Insufficient memory to decode image 12: Corrupt SVG data 13: Insufficient memory to load URL 14: Problem Loading URL (?) ob e oad g U ( ) • Try and catch statements work … but what’s the point? • Errors non-graceful - errors fail through to device for display B tt h dli i t l f Fl h Lit ld b i BFPUG - Flash Lite 2.0 43 • Better error handling in next release of Flash Lite would be nice
a Flash 4/5 hybrid model … tellTarget(), etc • 2.0 = AS 2.0 objects Obj t bj Obj t Obj t() var myObject_obj:Object = new Object(); myObject_obj.x = 0; var myObject2_obj:Object = { x: 0 } St i t D t T i ibl • Strict Data Typing now possible: var myNumber_num:Number = 0; //-- must be a number • Procedure vs. Object Based programming • Just because you can … doesn’t mean you always should! • Object oriented programming in FL 2.0 (mention Talbot’s talk) • Hybrid Flash Lite 1.1/AS 2.0 approach? • Use Arrays instead of Objects for storage • Walkthrough - DEMO BFPUG - Flash Lite 2.0 44 • Walkthrough - DEMO
the the ball from a random coordinate • Tween class (AS 2.0) – using objects • Device vs. Desktop … “fluidity” … how well does this perform? • Doing this in 1.1 would involve using a few more “tricks” • Walkthrough BFPUG - Flash Lite 2.0 45
valid • Download the Flash Lite 1.1 Reference Sheet htt // ttj k /d l d /fl h t/fl h t df http://www.scottjanousek.com/downloads/fl_onesheet/fl_onesheet.pdf • Adobe Lab’s FL 2.0 Best Practices http://labs.macromedia.com/wiki/index.php/Flash_Lite • “Developing Flash Lite 2.0 applications” and “Getting Started with Flash Lite” documentation • Sample Content provided … other people’s work, blogs • “Trial and Error” on devices BFPUG - Flash Lite 2.0 46
Lite 2.0 still in Beta … more testing/fixing to do? • More sophisticated content possible than previously in 1.1 • Content that takes advantage of the new dynamic media loading features, video, sound, etc. Applications that “remember” settings preferences etc Subtle • Applications that remember settings, preferences, etc. Subtle features to add more easily • New devices on horizon that need a custom FL 2.0 based UI? • Pushing more manufacturers to get Flash Lite 2.0 preinstalled onto devices Thinking about Flash Lite 2 0 more as part of Flash Platform and not • Thinking about Flash Lite 2.0 more as part of Flash Platform and not just an afterthought • Flash Lite 2.0 enabled phones and devices !? BFPUG - Flash Lite 2.0 47
to get involved in … • Building using Flash Lite either 1.1 or 2.0 • Student credit? … portfolio piece for students • Looking for content, graphics, video • Interested in helping to create this? • Contact Scott Janousek BFPUG - Flash Lite 2.0 48
market ! Nokia 6120 (1.1) Sony Ericsson W900i (1.1) Iriver u10 • FL 2.0 is a step in the right direction • Flash Lite 2.0 pre-installed devices = 2007? • Lots of deals for Adobe (BenQ/Motorola?/LG) at recent 3GSM conference BFPUG - Flash Lite 2.0 49 • Is 2006 the year for (flash) mobile?
• Desktop Flash and Flash Lite convergence … 2007, 2008? • FL 3.0? - no announcement yet. Likely 2007-2008 • MMI - man/machine interface • Mobile + Flex? … “not a product yet” • Flash Media Server and mobile media integration? (Japan only?) • Resituate Pocket PC Flash? Flash 7 based PPC Flash?? More sophisticated mobile ecosystem for Flash Lite • More sophisticated mobile ecosystem for Flash Lite BFPUG - Flash Lite 2.0 50
Flash Mobile @ Adobe - http://mobile.macromedia.com/ • Flash Mobile group - http://www.flashmobilegroup.org • Flash Mobile Forum - http://www flashmobileforum org/ • Flash Mobile Forum http://www.flashmobileforum.org/ • Yahoo Flash Mailing List ([email protected]) • Flash 2 Mobile Update - http://labs.macromedia.com/ • Scott Janousek - http://www.scottjanousek.com/blog/ • Alessandro Pace - http://www.biskero.org/ Fl h Lit E h ! • Flash Lite Exchange ! If you are a developer and want to get a free Flash Lite 2.0 player … go to the BFPUG - Flash Lite 2.0 52 labs site, or send an email to Bill Perry: bperry AT adobe.com
• 1.1 or 2.0 development? • Flash Lite 2.0 Update from Adobe Labs Site • http://labs.macromedia.com/ • Flash Lite 2.0 Player from the Adobe Store ($10 … or free if you link to it from the labs site?) • Flash Lite 2.0 Authoring guidelines, prebundled documentation, g g , p , sample code, and tutorials. • Flash Lite 2.0 capable phone • … check the supported devices page at: http://mobile.macromedia.com/ • An idea and some time to implement it … BFPUG - Flash Lite 2.0 53
l th k t • Special thanks to: • NEIA (New England Institute of Art) - http://www.aii.edu/ • BFPUG (Boston Flash Platform User Group) - http://www.bfpug.com/ • Project-a-phone - http://www.project-a-phone.com/ • Adobe Flash Mobile Group – http://www.flashmobilegroup.org • Adobe Mobile Team - http://mobile.adobe.com/ • For more questions, comments, etc, send email to: • scott AT scottjanousek.com or biskero AT gmail.com BFPUG - Flash Lite 2.0 54 j g
scottjanousek
nenonaninu
scarletplover
aiandrox
muziyoshiz
murashotaro
miichan
ytaka23
hakubishin3
kutsushitaneko
tomoki10
shingo_kawahara
oguressive
bluesmoon
addyosmani
csswizardry
brad_frost
brettharned
akosma
lauravandoore
samanthasiow
pedronauck
productmarketing
maltzj
trishagee
![Device Video • Not all devices support codec: System.capabilities.videoMIMETypes[ ]](https://files.speakerdeck.com/presentations/a8504f00762c0130492822000a1e820e/slide_26.jpg){kind=link}
