Search

Flash, Flex & Air A Brief Survey

Loading...

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

1 comments

Comments 1 - 1 of 1 previous next Post a comment

  • + davidmach14 davidmach14 5 months ago
    This presentation help me a lot with my decision! Thanx!
Post a comment
Embed Video
Edit your comment Cancel

Notes on slide 1

1 Favorite

Flash, Flex & Air A Brief Survey - Presentation Transcript

  1. Rich Internet Applications: v3 Adobe Flex & AIR Sun Java FX Firefox 3 Microsoft Siverlight Flash & Flex
  2. Brower-based Player-based Client-based Thin Flash, Flex, AIR, Windows, Rich HTML AJAX Client Siverlight JavaFX Mac Client XUL XUL (+XULRunner) Java/Swing or SWT XForms OpenLazlo Reduced maintenance Combined benefits Intuitive UI Location independence of thin and rich clients Immediate response
  3. FLEX “Adobe® Flex™ 2 is a complete, powerful application development solution for creating and delivering cross- platform rich Internet applications (RIAs) within the enterprise and across the web. It enables the creation of expressive and interactive web applications that can reach virtually anyone on any platform. ” 3 Travis Isaacs | travisisaacs.com
  4. More succinctly: “Flex is a way to develop Flash applications by programming” http://www.artima.com/weblogs/viewpost.jsp?thread=193593 4 Travis Isaacs | travisisaacs.com
  5. How is Flex different from Flash? Flash Flex ActionScript Yes Yes MXML No Yes HTML/CSS Yes Yes Javascript Limited Yes Drawing Tools Yes No Library Yes No Layout Engine Yes Yes Animation Timeline Yes No Layers Yes No 5 Travis Isaacs | travisisaacs.com
  6. How is Flex different from Flash? EMCA standardized, like Javascript, yet object- oriented like java Flash Flex ActionScript Yes Yes MXML No Yes HTML/CSS Yes Yes Javascript Limited Yes Drawing Tools Yes No Library Yes No Layout Engine Yes Yes Animation Timeline Yes No Layers Yes No 5 Travis Isaacs | travisisaacs.com
  7. How is Flex different from Flash? EMCA standardized, like Javascript, yet object- oriented like java Flash Flex ActionScript Yes Yes MXML No Yes Declaritive XML - HTML/CSS Yes Yes LIke XUL Javascript Limited Yes Drawing Tools Yes No Library Yes No Layout Engine Yes Yes Animation Timeline Yes No Layers Yes No 5 Travis Isaacs | travisisaacs.com
  8. How is Flex different from Flash? Flash Flex ActionScript Yes Yes MXML No Yes HTML/CSS Yes Yes Javascript Limited Yes Drawing Tools Yes No Library Yes No Layout Engine Yes Yes Animation Timeline Yes No Layers Yes No 5 Travis Isaacs | travisisaacs.com
  9. ActionScript Timeline Layers Canvas Movie clips Stage 6 Travis Isaacs | travisisaacs.com http://kanuwadhwa.wordpress.com/2007/10/03/flash-and-flex-can-hold-hands/
  10. ActionScript Timeline Layers Flash documents (.FLA) are binary files created in the Adobe Flash authoring environment. Canvas Interface elements are “drawn”Movie and manipulated over a timeline using tweens,clips keyframes, and Stage layers (or programmatically). A .FLA file is compiled into a .SWF file and embedded into an HTML page. 7 Travis Isaacs | travisisaacs.com http://kanuwadhwa.wordpress.com/2007/10/03/flash-and-flex-can-hold-hands/
  11. 8 Travis Isaacs | travisisaacs.com
  12. Drawing tools 9 Travis Isaacs | travisisaacs.com
  13. Timeline 10 Travis Isaacs | travisisaacs.com
  14. Stage 11 Travis Isaacs | travisisaacs.com
  15. Library & components 12 Travis Isaacs | travisisaacs.com
  16. Actionscript editor 13 Travis Isaacs | travisisaacs.com
  17. ActionScript Data Tags services Source MXML View Html & Css Perspectives 14 Travis Isaacs | travisisaacs.com http://kanuwadhwa.wordpress.com/2007/10/03/flash-and-flex-can-hold-hands/
  18. ActionScript Data Tags services Source MXML View Flex documents (.MXML) are text files authored in Adobe FlexBuilder (based on Eclipse). Alternatively, & Html Eclipse RCP can be used with a free FlexBuilder plug-in. Css Perspectives In Flex, interface elements and components are created using declaritive XML-like tags. 15 Travis Isaacs | travisisaacs.com http://kanuwadhwa.wordpress.com/2007/10/03/flash-and-flex-can-hold-hands/
  19. private function requestPhotos():void{ photoService.cancel(); var params:Object = new Object(); params.format = 'rss_200_enc'; params.tags = searchTerms.text; photoService.send(params); } private function photoHandler(event:ResultEvent):void{ photoFeed = event.result.rss.channel.item as ArrayCollection; } ]]> </mx:Script> <mx:HTTPService id=\"photoService\" url=\"http://api.flickr.com/services/feeds/photos_public.gne\" result=\"photoHandler(event)\"/> <mx:HBox width=\"391\"> <mx:TextInput id=\"searchTerms\" /> <mx:Button label=\"Button\" click=\"requestPhotos()\"/> </mx:HBox> <mx:TileList width=\"100%\" height=\"100%\" dataProvider=\"{photoFeed}\"> <mx:itemRenderer> <mx:Component> <mx:VBox width=\"125\" height=\"125\" paddingBottom=\"5\" paddingLeft=\"5\" paddingTop=\"5\" paddingRight=\"5\"> <mx:Image width=\"75\" height=\"75\" source=\"{data.thumbnail.url}\"/> <mx:Text text=\"{data.credit}\"/> </mx:VBox> </mx:Component> </mx:itemRenderer> </mx:TileList> </mx:WindowedApplication> 16 Travis Isaacs | travisisaacs.com
  20. FLEXBUILDER 17 Travis Isaacs | travisisaacs.com
  21. ECLIPSE PLUGIN 18 Travis Isaacs | travisisaacs.com
  22. Can Flex can be a companion to Q your existing technology stack? 19 Travis Isaacs | travisisaacs.com
  23. Probably. 20 Travis Isaacs | travisisaacs.com
  24. EXAMPLE External CLASS FILE Data Source SWF Agent Web Server FlexBuilder IDE Eclipse IDE Java Developer 21 Travis Isaacs | travisisaacs.com
  25. EXAMPLE Client Side Server Side Integration/ Integration/ Presentation Layer Presentation Layer Service Layer Service Layer HTTP Service Struts, Tapestry, DAOs Browser (HTML) Locator Velocity, ETC Spring, HiveMind, EJB, or Hibernate, Entity other integration/ Beans, etc. Flex AMF Delegate service layer Flex (Flash Player) Gateway Layer REMOTE OBJECT http://www.onjava.com/pub/a/onjava/2004/12/01/flexjava.html 22 Travis Isaacs | travisisaacs.com
  26. application es for consumption by a Flex be used to create web servic Server-side Java can 23 Travis Isaacs | travisisaacs.com
  27. Flex will work with nearly any HTTP or socket based server: • ASCII text (POST,GET,REST Headers Supported) • XML (POST,GET,REST Headers Supported) • Server side languages: .NET, RUBY, PYTHON, JAVA, PHP, PERL, XML, etc • SOAP direct to the server • Binary AMF (Optimized data serialization format for remoting, paging) • Real-time exchange using 2 way push over XML Socket and Binary Socket http://www.onflex.org/ted/2006/12/top-10-myths-about-adobe-flex-20.php 24 Travis Isaacs | travisisaacs.com
  28. “Flex supports a compact binary object serialization protocol, called AMF3, which is extremely fast. There are numerous Open Source implementations using various backend technologies for AMF3, as well as a commercial / supported Adobe product, called Flex Data Services.” “If you control both sides of the wire in your application, then there is rarely a good reason to serialize and deserialize text. Objects are blazing fast as you can tell by this benchmark. AMF3 is also typically much more efficient across the wire (even without compression) and consumes much less client side memory. JIT compilation and binary object serialization are the primary reasons why Flex AMF3 is so fast, even in the test with the full 20,000 rows. And, it’s not just faster for loading - it also speeds client side sorting and filtering.” http://www.jamesward.org/census/ http://www.jamesward.org/census/
  29. Do we you any special technology Q to run and deploy Flex apps? 27 Travis Isaacs | travisisaacs.com
  30. Sorta. 28 Travis Isaacs | travisisaacs.com
  31. Flex Data Services 2 “A powerful solution for creating data-intensive rich applications” • Deployed as standard J2EE application • Real-time data push and pub/sub messaging • Allows for occasionally connected applications $15,000/CPU Read More: http://www.adobe.com/products/flex/dataservices/
  32. WebORB for Java “WebORB for Java is server-side technology enabling connectivity between Flash Remoting and AJAX clients and Java applications.” $900/CPU
  33. Do users need anything special to Q run Flex applications? 32 Travis Isaacs | travisisaacs.com
  34. Yes. 33 Travis Isaacs | travisisaacs.com
  35. 96% of PC’s have what they need to run a Flex application. 34 Travis Isaacs | travisisaacs.com
  36. EASY INSTALL 35 Travis Isaacs | travisisaacs.com
  37. 36 Travis Isaacs | travisisaacs.com
  38. 37 Travis Isaacs | travisisaacs.com
  39. 38 Travis Isaacs | travisisaacs.com
  40. 39 Travis Isaacs | travisisaacs.com
  41. ActionScript Data Tags services <mx:SWFLoader> Source MXML View Html & Because they are both compiled into a common format Css (.swf), Flash movies can be used in Flex applications. Perspectives 40 Travis Isaacs | travisisaacs.com http://kanuwadhwa.wordpress.com/2007/10/03/flash-and-flex-can-hold-hands/
  42. stylingn’ existing UI elements) (ability to ‘ski al c ntrol graphicarency, oadows, rounded corners) precise sh sp ng, alpha tran (font anti-aliasi widgets w’ creation ofru‘ne UI Aesthetic . mb) Considerations.. breadc (slider, tabbed atterns el interaction p nov seatmap)D (radial menu, 3- creation of ‘new’ w idgets ion data visartsalizat) u , mapping (bar graphs, ch cs 3-D effeges,trotating objects) (perspective pa basic styling (ability to ‘skin’ existing UI elements)
  43. OPEN SOURCE
  44. Source to ActionScript components Flex SDK and components Java source code for compilers, debugger, and core
  45. Mozilla Public License (MPL)
  46. So What? ‣ Extremely rich UI potential via Flash and scripting ‣ Client-side business logic (medium client) ‣ High penetration of runtime (96% on Windows PC’s) ‣ Complimentary to most technology stacks ‣ Leverage talents of existing developers and designers ‣ Free/cheap IDE tools ‣ Open Source What else? ‣ Flex inherits existing challenges of using Flash in the enterprise (gathering analytics, accessibility limitations) 46 Travis Isaacs | travisisaacs.com
  47. AIR “Adobe® AIR™ lets developers use their existing web development skills in HTML, AJAX, Flash and Flex to build and deploy rich Internet applications to the desktop.” 47 Travis Isaacs | travisisaacs.com
  48. ? Application.air Java Applet Flash Content Web Content Flex Content AIR RUNTIME WebKit Flash SQLite PDF Browser Player Database Support OS integration via: Windows 2000 System Drag & Drop File System I/O Native Menu API Windows XP Online/Offline Right-click support Full Network Stack Mac OSX Windowing Clipboard Sync Linux BETA 48 Travis Isaacs | travisisaacs.com
  49. Finetune Deskop } Music streaming from Internet source + } Music from my local iTunes library 49 Travis Isaacs | travisisaacs.com
  50. Pownce
  51. Adobe Kuler
  52. ebay Desktop 53 Travis Isaacs | travisisaacs.com
  53. OS window Custom window chrome controls with alpha transparency } } 54 Travis Isaacs | travisisaacs.com
  54. Multiple window support 55 Travis Isaacs | travisisaacs.com
  55. Live updating 56 Travis Isaacs | travisisaacs.com
  56. orce SalesBuilder SalesF
  57. So What? ‣ Easy application delivery to the desktop with a lightweight runtime. ‣ Hybrid of thin & fat client model ‣ Online/offline capabilities via network API and local storage ‣ Integrates into the OS like a “real” application ‣ Rich windowing capabilities What else? ‣ Unproven in the enterprise ‣ Still in BETA 62 Travis Isaacs | travisisaacs.com

+ Minh Chuc HoMinh Chuc Ho, 9 months ago

custom

756 views, 1 favs, 0 embeds more stats

More info about this document

© All Rights Reserved

Go to text version

  • Total Views 756
    • 756 on SlideShare
    • 0 from embeds
  • Comments 1
  • Favorites 1
  • Downloads 26
Most viewed embeds

more

All embeds

less

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate. If needed, use the feedback form to let us know more details.

Cancel
File a copyright complaint
Having problems? Go to our helpdesk?

Categories

Tags

-->
Search
RSS Feed
What's new?

© 2009 SlideShare Inc. All Rights Reserved