The Anatomy of a Seriously Sophisticated AIR Application

2,159 views
2,085 views

Published on

The Anatomy of a Seriously Sophisticated AIR Application, as presented by Rick Williams and Adam Creeger at Adobe MAX Milan 2008

Published in: Technology

The Anatomy of a Seriously Sophisticated AIR Application

  1. 1. THE ANATOMY OF A SERIOUSLY SOPHISTICATED AIR APPLICATION
  2. 2. BEFORE WE GET DOWN TO BUSINESS…
  3. 3. WHAT WAS OUR BRIEF FROM FIAT? BUILD A PRODUCT THAT HELPS IMPROVE YOUR DRIVING USING TELEMATIC DATA COLLECTED FROM THE CAR
  4. 4. WHY IS ECO:DRIVE “SOPHISTICATED”? THE CHALLENGES CONNECTING YOUR CAR TO YOUR COMPUTER IS A NEW CONCEPT TO MOST DRIVING DATA CAN BE CONFUSING LARGE AMOUNTS OF DATA, ONCE PER SECOND OF EVERY JOURNEY
  5. 5. WHY IS ECO:DRIVE “SOPHISTICATED”? THE CHALLENGES CONNECTING YOUR CAR TO YOUR COMPUTER IS A NEW CONCEPT TO MOST DRIVING DATA CAN BE CONFUSING LARGE AMOUNTS OF DATA, ONCE PER SECOND OF EVERY JOURNEY YET THE SOLUTION HAD TO BE INTUITIVE EASY TO USE RESPONSIVE
  6. 6. A LITTLE BIT MORE DETAIL… BUILT USING ADOBE AIR 1.1 AND FLEX
  7. 7. A LITTLE BIT MORE DETAIL… BUILT IN 4 MONTHS BY A DEVELOPMENT TEAM OF 5 BUILT USING ADOBE AIR 1.1 AND FLEX
  8. 8. A LITTLE BIT MORE DETAIL… BUILT IN 4 MONTHS BY A DEVELOPMENT TEAM OF 5 CREATED USING FLEXBUILDER 3 PROFESSIONAL EDITION BUILT USING ADOBE AIR 1.1 AND FLEX
  9. 9. A LITTLE BIT MORE DETAIL… BUILT IN 4 MONTHS BY A DEVELOPMENT TEAM OF 5 CREATED USING FLEXBUILDER 3 PROFESSIONAL EDITION LAUNCHED IN 3 LANGUAGES, SOON TO BE 5 BUILT USING ADOBE AIR 1.1 AND FLEX
  10. 10. WHY ADOBE AIR? CROSS PLATFORM
  11. 11. WHY ADOBE AIR? SMOOTH INSTALL OF THE FRAMEWORK AND APPLICATION CROSS PLATFORM
  12. 12. WHY ADOBE AIR? SMOOTH INSTALL OF THE FRAMEWORK AND APPLICATION EASY AUTO-UPDATE FUNCTIONALITY CROSS PLATFORM
  13. 13. WHY ADOBE AIR? SMOOTH INSTALL OF THE FRAMEWORK AND APPLICATION EASY AUTO-UPDATE FUNCTIONALITY INTERGRATED SQLITE DB CROSS PLATFORM
  14. 14. WHAT DOES ECO:DRIVE LOOK LIKE INSIDE?
  15. 15. THE MANDATORY BLOCK DIAGRAM
  16. 16. THE MANDATORY BLOCK DIAGRAM USB KEY
  17. 17. THE MANDATORY BLOCK DIAGRAM USB KEY ECO:INDEX WEB SERVICE HTTP COMMUNITY WEB SERVICE HTTP FUEL PRICE WEB SERVICE HTTP
  18. 18. DELVING DEEPER IMPORTING DATA GRAPHING THE DATA CONTEXTUALISING THE DATA
  19. 19. IMPORTING DATA: PARSING LIMITED SPACE AVAILABLE IN BLUE & ME COMPUTER MORE COMPUTING POWER AVAILABLE ON THE DESKTOP THAN IN THE CAR EASE OF PARSING WAS NOT THE FIRST PRIORITY NO BITARRAY IN ACTIONSCRIPT 3 DATA IS STORED IN A TIGHTLY PACKED BIT ARRAY
  20. 20. IMPORTING DATA: WRITING DATA TO THE DATABASE THERE WERE TWO MAJOR REQUIREMENTS IMPORT HAD TO BE HIGHLY PERFORMANT USER INTERFACE HAD TO REMAIN SMOOTH AND RESPONSIVE
  21. 21. IMPORTING DATA: WRITING DATA TO THE DATABASE THERE WERE TWO MAJOR REQUIREMENTS IMPORT HAD TO BE HIGHLY PERFORMANT USER INTERFACE HAD TO REMAIN SMOOTH AND RESPONSIVE THERE WERE TWO PROBLEMS USING A TIMER WAS NOT FAST ENOUGH USING “FOR” LOOPS MEANT AN UNRESPONSIVE APPLICATION
  22. 22. IMPORTING DATA: WRITING DATA TO THE DATABASE THERE WERE TWO MAJOR REQUIREMENTS IMPORT HAD TO BE HIGHLY PERFORMANT USER INTERFACE HAD TO REMAIN SMOOTH AND RESPONSIVE THERE WERE TWO PROBLEMS USING A TIMER WAS NOT FAST ENOUGH USING “FOR” LOOPS MEANT AN UNRESPONSIVE APPLICATION THE SOLUTION? THE “ASYNC CHUNKER MONKEY”
  23. 23. IMPORTING DATA: THE ASYNC CHUNKER WHAT? USING SYNCHRONOUS “FOR” LOOP TO PROCESS EACH ITEM IN AN ARRAY
  24. 24. IMPORTING DATA: THE ASYNC CHUNKER WHAT? USING A TIMER USING SYNCHRONOUS “FOR” LOOP TO PROCESS EACH ITEM IN AN ARRAY
  25. 25. IMPORTING DATA: THE ASYNC CHUNKER WHAT? USING THE ASYNC CHUNKER MONKEY USING SYNCHRONOUS “FOR” LOOP TO PROCESS EACH ITEM IN AN ARRAY
  26. 26. IMPORTING DATA: THE ASYNC CHUNKER WHAT? MAX TIME FOR EXECUITION IS SET BY DEVELOPER USING THE ASYNC CHUNKER MONKEY USING SYNCHRONOUS “FOR” LOOP TO PROCESS EACH ITEM IN AN ARRAY
  27. 27. IMPORTING DATA: THE ASYNC CHUNKER WHAT? MAX TIME FOR EXECUITION IS SET BY DEVELOPER USING THE ASYNC CHUNKER MONKEY USING SYNCHRONOUS “FOR” LOOP TO PROCESS EACH ITEM IN AN ARRAY
  28. 28. THE PEOPLE BEHIND THE PRODUCT…
  29. 29. HERE’S HOW YOU MIGHT THINK IT WORKED
  30. 30. HERE’S HOW YOU MIGHT THINK IT WORKED
  31. 31. HERE’S HOW YOU MIGHT THINK IT WORKED
  32. 32. HERE’S HOW YOU MIGHT THINK IT WORKED
  33. 33. HERE’S HOW YOU MIGHT THINK IT WORKED
  34. 34. HERE’S HOW YOU MIGHT THINK IT WORKED
  35. 35. HERE’S HOW YOU MIGHT THINK IT WORKED
  36. 36. HERE’S HOW YOU MIGHT THINK IT WORKED
  37. 37. HOW DID IT ALL WORK OUT? HERE’S HOW YOU MIGHT THINK IT WORKED
  38. 38. HERE’S HOW WE ENDED UP SEEING IT…
  39. 39. THE MOST TRICKY PART…
  40. 40. KEEPING QUALITY HIGH
  41. 41. KEEPING QUALITY HIGH PROOF OF CONCEPTS CONTINUOUS INTEGRATION USING CRUISECONTROL.NET PEER REVIEW ON EVERY CHECK-IN UNIT TESTS USING FLEXUNIT AND FLEXCOVER
  42. 42. TOP TIPS AND LESSONS LEARNED
  43. 43. TOP TIPS AND LESSONS LEARNED FILE.GETROOTDIRECTORIES ISN’T AS GREAT AS YOU MIGHT THINK NEVER WRITE DATA TO THE APPLICATION DIRECTORY MULTI-LINGUAL? ALWAYS GET THE USER TO CHOOSE THEIR OWN LANGUAGE USE THE VIEWSTACK CLASS CAREFULLY KEEP YOUR DATABASE ACCESS STRATEGY CONSISTENT
  44. 44. CLOSING WORDS
  45. 45. CLOSING WORDS… DO PROOF OF CONCEPTS FOR ANY RISKY AND ESSENTIAL FUNCTIONALITY UNIT TEST YOUR CODE. IT HELPS PREVENT BUGS AND IMPROVES THE APPLICATION ARCHITECTURE. THINK ABOUT PERFORMANCE – ESPECIALLY IF YOU ARE PROCESSING LARGE AMOUNTS OF DATA ADOBE AIR IS A GREAT PLATFORM FOR INNOVATIVE DESKTOP APPLICATIONS.
  46. 46. LINKS AND Q&A http://www.fiat.co.uk/ecoDrive - eco:Drive home page http://code.google.com/p/as3localelib/ - Locale Library http://thanksmister.com/?p=92 – Detecting Local Drives with Adobe AIR http://is.gd/7RcW - Article about Usability, Interactivity in Agile Processes Rick’s blog: http://www.pixelpod.co.uk Adam’s blog: http://blog.adamcreeger.com

×