Flash on mobiles
getting started with flash on mobile
about me


• Weyert de Boer
• Flash Designer / Developer at Nothing
• Co-Author of books about Flash Lite
  and AIR
• Flash Lite developer since Late 2004
• Worked on Flash-based UI for Motorola,
let's talk about...

          The past of mobile flash
let's talk about...

          The past of mobile flash

      Past and future of mobile flash
let's talk about...

          The past of mobile flash

      Past and future of mobile flash

       Monetizing and distribution
let's talk about...

          The past of mobile flash

      Past and future of mobile flash

       Monetizing and distribution

    Optimisation tips for mobile flash
let's talk about...




          The past of mobile flash
The past of mobile flash




 In 2003 Flash Lite 1.0 got released
 which came with a limited feature-set
 of the Flash Player 4




                                         8
The past of mobile flash




 In 2006 a more powerful version of
 Flash Lite got released 2.1 which
 added support for XMLSockets




                                      9
The past of mobile flash




 Flash Lite 3 introduced support for
 Flash Video like H.264 in 2007.




                                       10
let's talk about...




        The future of mobile flash
The future of flash mobile




 October 2009 Flash Player 10.1 was
 announced the first full-blown flash
 player for mobile devices




                                      12
The future of flash mobile

   Browser Plugins       Current                 2010



    Desktop class    Flash Player 10.1
                                         Flash Player 10.1

   High-end class
     (smartphones)

                      Flash Lite 3.1

                                          Flash Enabled
   Low-end class

                                         (source: Mark Doherty, Adobe)



                                                                         13
The future of flash mobile




     What’s new in Flash Player 10.1?




                                        14
The future of flash mobile
                   ActionScript 3
                     Multitouch
                 Screen orientation
                    Geolocation
                  Accelerometers
                  Native text input
   Memory and cpu performance improvements
 Support for Palm Pre, Blackberry, Apple , Android,
             Windows Mobile, Symbian
  Hardware based rendering and video decoding


                                                  15
The future of flash mobile




    AIR and mobile, what about that?




                                       16
The future of flash mobile




    Flash for the iPhone leverages AIR
   technology for the building process




                                         17
The future of flash mobile




    Final result of the Flash for iPhone
   solution is an application bundle file
   which can easily be installed on the




                                           18
The future of flash mobile




 Similar solutions in the future for other
 mobile platforms like Android, Symbian




                                         19
The future of flash mobile




   Contextual applications the new hot
 thing, same content on different devices




                                        20
let's talk about...




      Monetizing and redistribution
Monetizing and redistribution




 In the early years it was difficult to
 redistribute the flash player and you
 were depending on preinstalled




                                          22
Monetizing and redistribution




  Hard time to earn money with flash
  content via content providers or




                                      23
Monetizing and redistribution



  Easiest way to earn money with
  mobile flash content is by
  collaborating in contests or get a
  grant via the Open Screen Project




                                       24
let's talk about...




    Optimisation tips for mobile flash
Optimisation tips for mobile flash
content

• Every sixty seconds
• GC has it’s own will (not controllable)
• Cleanup after yourself




                                            26
Optimisation tips for mobile flash
content

 Demo




                                    27
Optimisation tips for mobile flash
content

         Tip #10
      Remove elements
      when not needed


                                    28
Optimisation tips for mobile flash
content

          Tip #9
   Use or load elements
    or data on demand


                                    29
Gotchas and optimisation tips


         Tip #8
 Use external assets for
   efficient memory
          usage

                                30
Optimisation tips for mobile flash
content

           Tip #7
    Optimise artwork by
   limiting colour depth


                                    31
Optimisation tips for mobile flash
content

         Tip #6
   Use vector art only
  when really necessary


                                    32
Optimisation tips for mobile flash
content

          Tip #5
        Avoid using
    transparent images
       were possible

                                    33
Optimisation tips for mobile flash
content

               Tip #4
          Watch out for
          gotoAndPlay()



                                    34
Optimisation tips for mobile flash
content

          Tip #3
     Embedded fonts
   means vector and so
   harder on the mobile
          device
                                    35
Optimisation tips for mobile flash
content

           Tip #2
      Don’t use images
      bigger then really
          necessary

                                    36
Optimisation tips for mobile flash
content

           Tip #1
    Consider keyframe
      animation over
    timeline or scripted
           tweens
                                    37
Optimisation tips for mobile flash
content

      Most important
    Actually test on the
   target device and not
    only on the desktop

                                    38
Optimisation tips for mobile flash
content




         Thanks to
      Thomas Joos and
       Mark Doherty

                                    39
Optimisation tips for mobile flash
content




           Book Raffle


                                    40
thank you!

SFUG Flash on Mobile and Devices

  • 2.
    Flash on mobiles gettingstarted with flash on mobile
  • 3.
    about me • Weyertde Boer • Flash Designer / Developer at Nothing • Co-Author of books about Flash Lite and AIR • Flash Lite developer since Late 2004 • Worked on Flash-based UI for Motorola,
  • 4.
    let's talk about... The past of mobile flash
  • 5.
    let's talk about... The past of mobile flash Past and future of mobile flash
  • 6.
    let's talk about... The past of mobile flash Past and future of mobile flash Monetizing and distribution
  • 7.
    let's talk about... The past of mobile flash Past and future of mobile flash Monetizing and distribution Optimisation tips for mobile flash
  • 8.
    let's talk about... The past of mobile flash
  • 9.
    The past ofmobile flash In 2003 Flash Lite 1.0 got released which came with a limited feature-set of the Flash Player 4 8
  • 10.
    The past ofmobile flash In 2006 a more powerful version of Flash Lite got released 2.1 which added support for XMLSockets 9
  • 11.
    The past ofmobile flash Flash Lite 3 introduced support for Flash Video like H.264 in 2007. 10
  • 12.
    let's talk about... The future of mobile flash
  • 13.
    The future offlash mobile October 2009 Flash Player 10.1 was announced the first full-blown flash player for mobile devices 12
  • 14.
    The future offlash mobile Browser Plugins Current 2010 Desktop class Flash Player 10.1 Flash Player 10.1 High-end class (smartphones) Flash Lite 3.1 Flash Enabled Low-end class (source: Mark Doherty, Adobe) 13
  • 15.
    The future offlash mobile What’s new in Flash Player 10.1? 14
  • 16.
    The future offlash mobile ActionScript 3 Multitouch Screen orientation Geolocation Accelerometers Native text input Memory and cpu performance improvements Support for Palm Pre, Blackberry, Apple , Android, Windows Mobile, Symbian Hardware based rendering and video decoding 15
  • 17.
    The future offlash mobile AIR and mobile, what about that? 16
  • 18.
    The future offlash mobile Flash for the iPhone leverages AIR technology for the building process 17
  • 19.
    The future offlash mobile Final result of the Flash for iPhone solution is an application bundle file which can easily be installed on the 18
  • 20.
    The future offlash mobile Similar solutions in the future for other mobile platforms like Android, Symbian 19
  • 21.
    The future offlash mobile Contextual applications the new hot thing, same content on different devices 20
  • 22.
    let's talk about... Monetizing and redistribution
  • 23.
    Monetizing and redistribution In the early years it was difficult to redistribute the flash player and you were depending on preinstalled 22
  • 24.
    Monetizing and redistribution Hard time to earn money with flash content via content providers or 23
  • 25.
    Monetizing and redistribution Easiest way to earn money with mobile flash content is by collaborating in contests or get a grant via the Open Screen Project 24
  • 26.
    let's talk about... Optimisation tips for mobile flash
  • 27.
    Optimisation tips formobile flash content • Every sixty seconds • GC has it’s own will (not controllable) • Cleanup after yourself 26
  • 28.
    Optimisation tips formobile flash content Demo 27
  • 29.
    Optimisation tips formobile flash content Tip #10 Remove elements when not needed 28
  • 30.
    Optimisation tips formobile flash content Tip #9 Use or load elements or data on demand 29
  • 31.
    Gotchas and optimisationtips Tip #8 Use external assets for efficient memory usage 30
  • 32.
    Optimisation tips formobile flash content Tip #7 Optimise artwork by limiting colour depth 31
  • 33.
    Optimisation tips formobile flash content Tip #6 Use vector art only when really necessary 32
  • 34.
    Optimisation tips formobile flash content Tip #5 Avoid using transparent images were possible 33
  • 35.
    Optimisation tips formobile flash content Tip #4 Watch out for gotoAndPlay() 34
  • 36.
    Optimisation tips formobile flash content Tip #3 Embedded fonts means vector and so harder on the mobile device 35
  • 37.
    Optimisation tips formobile flash content Tip #2 Don’t use images bigger then really necessary 36
  • 38.
    Optimisation tips formobile flash content Tip #1 Consider keyframe animation over timeline or scripted tweens 37
  • 39.
    Optimisation tips formobile flash content Most important Actually test on the target device and not only on the desktop 38
  • 40.
    Optimisation tips formobile flash content Thanks to Thomas Joos and Mark Doherty 39
  • 41.
    Optimisation tips formobile flash content Book Raffle 40
  • 42.

Editor's Notes

  • #2 team
  • #3 team
  • #30 don’t hide elements or set the alpha to zero but actual remove them from the stage so that they wont be taken into account during the compositing/drawing cycle of the flash player
  • #31 keep your displaylist or clips flat avoid deep nested clips to avoid performance penalties -- also only show elements or load data when it’s actually necessary can help
  • #32 you can use external assets to increase performance or memory usage
  • #33 the more colours the more bits so more memory will be used by the player same for compressed pictures or using transparencies
  • #34 the use of vectors take up cpu power because of the math which requires the player do more work then instead of using bitmaps (no calculations for each curve etc.)
  • #35 the use of transparant pictures of clips makes it harded for the player to be smart and only redraw parts which are changing. because transparent have to be merged or composited with the clips behind it. especially, use as much opaque or solid bitmaps as possible
  • #36 gotoAndPlay() requires the player to render or load all assets on each frame so if you want to jump to frame 5 the frames 1-4 have been loaded and drawn already.
  • #37 similar to tip #6 fonts are embedded in the flash movie got converted to vector shapes which takes more time as discussed in tip #6
  • #38 if you use images and then scale them down or you might be better off to make the image straight away in the right size to avoid unnecessary transformations by the flash player meaning it has to do less heavy lifting
  • #39 the use of tweens requires the elements on the frames to be interpolated in between the keyframes which takes up cpu usage better to use keyframes instead easier for the flash player
  • #40 the desktop computer will always be better performing then the actual target device -- don’t forget to test on the device itself. of course, using the performance test swf file from device central and make your own custom device profile can make life easier but it’s not the real deal.
  • #43 thank you!