e mobile revolution
      Serge Jespers - EMEA Platform Evangelist - serge@adobe.com - @sjespers




© 2010 Adobe Systems ...
In this session:
                                                                            Introduction to Flash Player...
Flash & AIR

©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.   3
Flash vs AIR




       Web content & applications                                            Standalone applications
    ...
Flash Player 10.1

            e only consistent browser-based runtime for connected devices
     Targeting desktops, mo...
Flash Player 10.1

     Brings full Flash Player feature set to devices
     New Features:
           Multi-touch & ges...
Automatic Memory Reduction


                                                                                      40MB
  ...
Ba ery usage




                Active State                                                  Active State      Low Power...
Flash Player 10.1
             Showcase




© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Complementary deployment mechanisms for mobile




         Bundled with System                                           ...
Adobe AIR for smartphones (and tablets)


        Adobe AIR allows developers to build standalone applications using Flas...
AIR Packaging & Distribution Work ow



                                                                             .air
...
AIR Showcase




© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Design

©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.     14
Context




©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.   15
®




Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con dential.   #adobeAUG XL351
®




Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con dential.   #adobeAUG XL351
FlashWrap
by Ted Patrick
                                                                                     ®




 Copyr...
Built with
                                                                    Xcode
                                     ...
Screens

                     800px




                                          480px                                   ...
Finger




                                                 7mm

                                         44px
           ...
Usually, a nger comes with a hand




©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.           ...
Native keyboard




©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.   23
Optimize your code!




                     http://adobe.com/go/optimize



©2010 Adobe Systems Incorporated. All Rights ...
New APIs

©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.   25
Multi-touch

                                                                                    ®




Copyright 2010 Adob...
Multi-touch
           •              Similar to multiple mouse events

           •              Both multi-touch events ...
Multi-touch / Gestures
                 public function init():void
   {
   	 Multitouch.inputMode = MultitouchInputMode.G...
Screen
                                           orientation
                                                            ...
Screen orientation
           •              Tells you if your app is viewed in landscape or portrait mode

           •  ...
Screen orientation
   import flash.events.StageOrientationEvent;

   stage.addEventListener("orientationChange", orientati...
Accelerometer

                                                                                    ®




Copyright 2010 Ad...
Accelerometer
           •              Different from screen rotation

           •              Converts movement in to t...
Accelerometer
   var accelerometer = new Accelerometer();

   accelerometer.addEventListener(AccelerometerEvent.UPDATE, on...
Geo location

                                                                                    ®




Copyright 2010 Ado...
Geo location
           •              Get the device location coordinates

           •              Latitude, longitude,...
Geo location
   import flash.sensors.Geolocation;
   import flash.events.GeolocationEvent;

   var geo = new Geolocation()...
Tools

©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.     38
Flash Builder & Flash Professional CS5




© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Adobe Device Central CS5




© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Adobe Device Central CS5



          •All Major Device Platforms

          •680 Pro les, all Flash versions

          •...
Questions?

©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.   42
Thank you!

                                    serge@adobe.com
                           http://www.webkitchen.be
      ...
Upcoming SlideShare
Loading in …5
×

Mobile revolution

3,039 views

Published on

As presented at SOTR 2010

Published in: Technology, Business
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,039
On SlideShare
0
From Embeds
0
Number of Embeds
190
Actions
Shares
0
Downloads
92
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Mobile revolution

  1. 1. e mobile revolution Serge Jespers - EMEA Platform Evangelist - serge@adobe.com - @sjespers © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
  2. 2. In this session:  Introduction to Flash Player 10.1 and AIR 2  Design considerations  New APIs in Flash Player 10.1 and AIR 2  Tools  Q & hopefully A © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 2
  3. 3. Flash & AIR ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 3
  4. 4. Flash vs AIR Web content & applications Standalone applications (Inside the browser) (Outside the browser) © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
  5. 5. 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 © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
  6. 6. Flash Player 10.1  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 © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
  7. 7. Automatic Memory Reduction 40MB Gamma Bros 0 15MB 47MB Wall-E 0 26MB 57MB FP10 Demo 0 23MB 69MB Flex Photo Album 0 25MB 13MB Yahoo Ad 0 4MB 32MB Flex Data Grid 0 17MB Flash Player 10 Flash Player 10.1 © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
  8. 8. Ba ery usage Active State Active State Low Power with Video with Animation with Animation 4 hours 6.5 hours 14.5 hours © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 8
  9. 9. Flash Player 10.1 Showcase © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
  10. 10. Complementary deployment mechanisms for mobile Bundled with System Downloaded through Browser Download So ware Updates on-device catalog © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
  11. 11. Adobe AIR for smartphones (and tablets)  Adobe AIR allows developers to build standalone applications using Flash technology  Public support from Google, RIM and Motorola  First mobile operating system to be supported is Android  Provides Flash developers access to app stores © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 11
  12. 12. AIR Packaging & Distribution Work ow .air .exe .air (swf, jpg, mp3) .dmg .apk © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
  13. 13. AIR Showcase © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
  14. 14. Design ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 14
  15. 15. Context ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 15
  16. 16. ® Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con dential. #adobeAUG XL351
  17. 17. ® Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con dential. #adobeAUG XL351
  18. 18. FlashWrap by Ted Patrick ® Copyright 2009 Adobe Systems Incorporated. All rights reserved. #adobeAUG XL351
  19. 19. Built with Xcode $12 99 TripLog/1040 ® Copyright 2009 Adobe Systems Incorporated. All rights reserved. #adobeAUG XL351
  20. 20. Screens 800px 480px 800px 480px ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 20
  21. 21. Finger 7mm 44px ≠ ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 21
  22. 22. Usually, a nger comes with a hand ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 22 Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con dential.
  23. 23. Native keyboard ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 23
  24. 24. Optimize your code! http://adobe.com/go/optimize ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 24
  25. 25. New APIs ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 25
  26. 26. Multi-touch ® Copyright 2010 Adobe Systems Incorporated. All rights reserved. #adobeAUG XL351
  27. 27. Multi-touch • Similar to multiple mouse events • Both multi-touch events and gesture events • Requires multi-touch hardware (Pre y obvious) • Amount of touch points only limited by the hardware • Supported in AIR 2 and FP10.1 (if the browser supports multi- touch) ® Copyright 2010 Adobe Systems Incorporated. All rights reserved. #adobeAUG XL351
  28. 28. Multi-touch / Gestures public function init():void { Multitouch.inputMode = MultitouchInputMode.GESTURE; logo.addEventListener(TransformGestureEvent.GESTURE_ROTATE, onRotate ); logo.addEventListener(TransformGestureEvent.GESTURE_ZOOM, onZoom ); } private function onRotate(evt:TransformGestureEvent):void { // pssst... you should try rotationX or Y logo.rotation += evt.rotation; } private function onZoom(evt:TransformGestureEvent):void { logo.scaleX *= evt.scaleX; logo.scaleY *= evt.scaleY; } ® Copyright 2010 Adobe Systems Incorporated. All rights reserved. #adobeAUG XL351
  29. 29. Screen orientation ® Copyright 2010 Adobe Systems Incorporated. All rights reserved. #adobeAUG XL351
  30. 30. Screen orientation • Tells you if your app is viewed in landscape or portrait mode • Reformat your application based on the orientation ® Copyright 2010 Adobe Systems Incorporated. All rights reserved. #adobeAUG XL351
  31. 31. Screen orientation import flash.events.StageOrientationEvent; stage.addEventListener("orientationChange", orientationChangedHandler); function orientationChangedHandler(event:StageOrientationEvent) { dummy.width = stage.stageWidth - 20; dummy.height = stage.stageHeight - 20; } ® Copyright 2010 Adobe Systems Incorporated. All rights reserved. #adobeAUG XL351
  32. 32. Accelerometer ® Copyright 2010 Adobe Systems Incorporated. All rights reserved. #adobeAUG XL351
  33. 33. Accelerometer • Different from screen rotation • Converts movement in to three dimensional coordinates • X, Y and Z acceleration ® Copyright 2010 Adobe Systems Incorporated. All rights reserved. #adobeAUG XL351
  34. 34. Accelerometer var accelerometer = new Accelerometer(); accelerometer.addEventListener(AccelerometerEvent.UPDATE, onMove); accelerometer.setRequestedUpdateInterval(40); function onMove(event:AccelerometerEvent):void { var ax = event.accelerationX*20; var ay = (event.accelerationY*20)*-1; var az = event.accelerationZ; football.x += ax; football.y += ay; football.scaleX = football.scaleY = az; } ® Copyright 2010 Adobe Systems Incorporated. All rights reserved. #adobeAUG XL351
  35. 35. Geo location ® Copyright 2010 Adobe Systems Incorporated. All rights reserved. #adobeAUG XL351
  36. 36. Geo location • Get the device location coordinates • Latitude, longitude, altitude, speed and heading • Build your own Tom Tom ;-) ® Copyright 2010 Adobe Systems Incorporated. All rights reserved. #adobeAUG XL351
  37. 37. Geo location import flash.sensors.Geolocation; import flash.events.GeolocationEvent; var geo = new Geolocation(); geo.setRequestedUpdateInterval(1000); geo.addEventListener(GeolocationEvent.UPDATE, onTravel); function onTravel(event:GeolocationEvent):void { long.text = event.latitude.toString(); lat.text = event.longitude.toString(); heading.text = event.heading.toString(); speed.text = event.speed.toString(); hacc.text = event.horizontalAccuracy.toString(); vacc.text = event.verticalAccuracy.toString(); } ® Copyright 2010 Adobe Systems Incorporated. All rights reserved. #adobeAUG XL351
  38. 38. Tools ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 38
  39. 39. Flash Builder & Flash Professional CS5 © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
  40. 40. Adobe Device Central CS5 © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
  41. 41. Adobe Device Central CS5 •All Major Device Platforms •680 Pro les, all Flash versions •Custom Pro les •Location API support (KML, GPX) •Accelerometer Emulation •Improved Search Filters •HTML5 Webkit Integration © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
  42. 42. Questions? ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 42
  43. 43. Thank you! serge@adobe.com http://www.webkitchen.be http://twitter.com/sjespers © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.

×