Fiat eco:Drive

5,323 views

Published on

A look at how Fiat eco:Drive was developed by AKQA London

Published in: Automotive, Technology

Fiat eco:Drive

  1. 1. Rick Williams 22nd January 2009
  2. 2. BEFORE WE GET DOWN TO BUSINESS…
  3. 3. WHO IS AKQA? GLOBAL ADVERTISING AGENCY. OFFICES IN LONDON, SAN FRANCISCO, WASHINGTON DC, NEW YORK, AMSTERDAM AND SHANGHAI. LONDON OFFICE HAS 250 PEOPLE. AKQA HAS 800 EMPLOYEES WORLDWIDE. AKQA AMSTERDAM IS LOOKING FOR FLASH DEVELOPERS.
  4. 4. WHAT WAS OUR BRIEF FROM FIAT? BUILD A PRODUCT THAT HELPS IMPROVE YOUR DRIVING USING TELEMATIC DATA COLLECTED FROM THE CAR
  5. 5. WHY IS ECO:DRIVE “SOPHISTICATED”? THE CHALLENGES CONNECTING YOUR DRIVING DATA CAN BE LARGE AMOUNTS OF CAR TO YOUR CONFUSING DATA, ONCE PER COMPUTER IS A NEW SECOND OF EVERY CONCEPT TO MOST JOURNEY
  6. 6. WHY IS ECO:DRIVE “SOPHISTICATED”? THE CHALLENGES CONNECTING YOUR DRIVING DATA CAN BE LARGE AMOUNTS OF CAR TO YOUR CONFUSING DATA, ONCE PER COMPUTER IS A NEW SECOND OF EVERY CONCEPT TO MOST JOURNEY YET THE SOLUTION HAD TO BE INTUITIVE EASY TO USE RESPONSIVE
  7. 7. A LITTLE BIT MORE DETAIL… BUILT USING ADOBE AIR 1.1 AND FLEX
  8. 8. A LITTLE BIT MORE DETAIL… BUILT USING ADOBE AIR 1.1 AND FLEX BUILT IN 4 MONTHS BY A DEVELOPMENT TEAM OF 5
  9. 9. A LITTLE BIT MORE DETAIL… BUILT USING ADOBE AIR 1.1 AND FLEX BUILT IN 4 MONTHS BY A DEVELOPMENT TEAM OF 5 CREATED USING FLEXBUILDER 3 PROFESSIONAL EDITION
  10. 10. A LITTLE BIT MORE DETAIL… BUILT USING ADOBE AIR 1.1 AND FLEX BUILT IN 4 MONTHS BY A DEVELOPMENT TEAM OF 5 CREATED USING FLEXBUILDER 3 PROFESSIONAL EDITION LAUNCHED IN 3 LANGUAGES, SOON TO BE 5
  11. 11. WHY ADOBE AIR? CROSS PLATFORM
  12. 12. WHY ADOBE AIR? CROSS PLATFORM SMOOTH INSTALL OF THE FRAMEWORK AND APPLICATION
  13. 13. WHY ADOBE AIR? CROSS PLATFORM SMOOTH INSTALL OF THE FRAMEWORK AND APPLICATION EASY AUTO-UPDATE FUNCTIONALITY
  14. 14. WHY ADOBE AIR? CROSS PLATFORM SMOOTH INSTALL OF THE FRAMEWORK AND APPLICATION EASY AUTO-UPDATE FUNCTIONALITY INTERGRATED SQLITE DB
  15. 15. WHAT ARE WE TALKING ABOUT THE TEAMS AND THE WORKFLOW
  16. 16. WHAT ARE WE TALKING ABOUT THE TEAMS AND THE WORKFLOW KEEPING QUALITY HIGH
  17. 17. WHAT ARE WE TALKING ABOUT THE TEAMS AND THE WORKFLOW KEEPING QUALITY HIGH GETTING UNDER THE COVERS OF ECO:DRIVE
  18. 18. WHAT AM I GOING TO TALK ABOUT THE TEAMS AND THE WORKFLOW KEEPING QUALITY HIGH GETTING UNDER THE COVERS OF ECO:DRIVE OUR TOP TIPS AND LESSONS LEARNT
  19. 19. FEATURES DEMO
  20. 20. WHAT DOES ECO:DRIVE LOOK LIKE INSIDE?
  21. 21. THE MANDATORY BLOCK DIAGRAM
  22. 22. THE MANDATORY BLOCK DIAGRAM USB KEY
  23. 23. THE MANDATORY BLOCK DIAGRAM HTTP ECO:INDEX WEB SERVICE USB KEY HTTP COMMUNITY WEB SERVICE HTTP FUEL PRICE WEB SERVICE
  24. 24. UPDATE DEMO
  25. 25. IMPORTING DATA: STEP BY STEP EACH CAR ON THE USB KEY IS MATCHED TO A CAR IN THE DESKTOP APPLICATION
  26. 26. IMPORTING DATA: STEP BY STEP EACH CAR ON THE USB KEY IS MATCHED TO A CAR IN THE DESKTOP APPLICATION FIRST 50% OF THE PROGRESS BAR: PARSING DATA INTO MEMORY
  27. 27. IMPORTING DATA: STEP BY STEP EACH CAR ON THE USB KEY IS MATCHED TO A CAR IN THE DESKTOP APPLICATION FIRST 50% OF THE PROGRESS BAR: PARSING DATA INTO MEMORY SECOND 50%: SAVING THAT DATA TO THE DATABASE
  28. 28. IMPORTING DATA: STEP BY STEP EACH CAR ON THE USB KEY IS MATCHED TO A CAR IN THE DESKTOP APPLICATION FIRST 50% OF THE PROGRESS BAR: PARSING DATA INTO MEMORY SECOND 50%: SAVING THAT DATA TO THE DATABASE EACH JOURNEY IS SUBMITTED TO THE ECO:INDEX WEB SERVICE
  29. 29. IMPORTING DATA: STEP BY STEP EACH CAR ON THE USB KEY IS MATCHED TO A CAR IN THE DESKTOP APPLICATION FIRST 50% OF THE PROGRESS BAR: PARSING DATA INTO MEMORY SECOND 50%: SAVING THAT DATA TO THE DATABASE EACH JOURNEY IS SUBMITTED TO THE ECO:INDEX WEB SERVICE UPDATE THE DATABASE AND THE USER INTERFACE
  30. 30. IMPORTING DATA: PARSING EASE OF PARSING WAS NOT THE FIRST PRIORITY LIMITED SPACE AVAILABLE IN BLUE & ME COMPUTER MORE COMPUTING POWER AVAILABLE ON THE DESKTOP THAN IN THE CAR DATA IS STORED IN A TIGHTLY PACKED BIT ARRAY NO BITARRAY IN ACTIONSCRIPT 3
  31. 31. IMPORTING DATA: PARSING SEVERAL ITERATIONS OF THE PARSING CODE FIRST WAS FUNCTIONAL, BUT SLOW ONCE UI WAS COMPLETED, WE RUTHLESSLY OPTIMISED
  32. 32. IMPORTING DATA: WRITING DATA TO THE DATABASE THERE WERE TWO MAJOR REQUIREMENTS IMPORT HAD TO BE HIGHLY USER INTERFACE HAD TO REMAIN PERFORMANT SMOOTH AND RESPONSIVE
  33. 33. IMPORTING DATA: WRITING DATA TO THE DATABASE THERE WERE TWO MAJOR REQUIREMENTS IMPORT HAD TO BE HIGHLY USER INTERFACE HAD TO REMAIN PERFORMANT SMOOTH AND RESPONSIVE THERE WERE TWO PROBLEMS USING A TIMER WAS NOT USER “FOR” LOOPS MEANT AN FAST ENOUGH UNRESPONSIVE APPLICATION
  34. 34. IMPORTING DATA: WRITING DATA TO THE DATABASE THERE WERE TWO MAJOR REQUIREMENTS IMPORT HAD TO BE HIGHLY USER INTERFACE HAD TO REMAIN PERFORMANT SMOOTH AND RESPONSIVE THERE WERE TWO PROBLEMS USING A TIMER WAS NOT USER “FOR” LOOPS MEANT AN FAST ENOUGH UNRESPONSIVE APPLICATION THE SOLUTION? THE “ASYNC CHUNKER MONKEY”
  35. 35. IMPORTING DATA: THE ASYNC CHUNKER WHAT? USING SYNCHRONOUS “FOR” LOOP TO PROCESS EACH ITEM IN AN ARRAY
  36. 36. IMPORTING DATA: THE ASYNC CHUNKER WHAT? USING SYNCHRONOUS “FOR” LOOP TO PROCESS EACH ITEM IN AN ARRAY USING A TIMER
  37. 37. IMPORTING DATA: THE ASYNC CHUNKER WHAT? USING SYNCHRONOUS “FOR” LOOP TO PROCESS EACH ITEM IN AN ARRAY USING THE ASYNC CHUNKER MONKEY
  38. 38. IMPORTING DATA: THE ASYNC CHUNKER WHAT? USING SYNCHRONOUS “FOR” LOOP TO PROCESS EACH ITEM IN AN ARRAY USING THE ASYNC CHUNKER MONKEY MAX TIME FOR EXECUTION IS SET BY DEVELOPER
  39. 39. IMPORTING DATA: THE ASYNC CHUNKER WHAT? USING SYNCHRONOUS “FOR” LOOP TO PROCESS EACH ITEM IN AN ARRAY USING THE ASYNC CHUNKER MONKEY MAX TIME FOR EXECUTION IS SET BY DEVELOPER
  40. 40. DATA VISUALISATION DEMO
  41. 41. VISUALISING THE DATA JOURNEY VIEW – TREND VIEW – ECO:VILLE
  42. 42. GRAPHING THE DATA: JOURNEY VIEW INDIVIDUAL DATA SCRUB BAR DYNAMIC LOADING
  43. 43. THE PEOPLE BEHIND THE PRODUCT…
  44. 44. HOW DID IT ALL WORK OUT?
  45. 45. HOW DID IT ALL WORK OUT?
  46. 46. HOW DID IT ALL WORK OUT?
  47. 47. HOW DID IT ALL WORK OUT?
  48. 48. HOW DID IT ALL WORK OUT?
  49. 49. HOW DID IT ALL WORK OUT?
  50. 50. HOW DID IT ALL WORK OUT?
  51. 51. HOW DID IT ALL WORK OUT?
  52. 52. HOW DID IT ALL WORK OUT?
  53. 53. HERE’S HOW WE ENDED UP SEEING IT…
  54. 54. THE MOST TRICKY PART…
  55. 55. ...GETTING THE DESIGN WORKFLOW RIGHT ENSURE THAT USER EXPERIENCE TALKS TO CREATIVE DEVELOPMENT
  56. 56. ...GETTING THE DESIGN WORKFLOW RIGHT ENSURE THAT USER EXPERIENCE TALKS TO CREATIVE DEVELOPMENT IN AN IDEAL WORLD, USER EXPERIENCE WOULD SUPPLY DESIGNERS WITH ANIMATED WIREFRAMES
  57. 57. GETTING THE DESIGN WORKFLOW RIGHT... ENSURE THAT USER EXPERIENCE TALKS TO CREATIVE DEVELOPMENT IN AN IDEAL WORLD, USER EXPERIENCE WOULD SUPPLY DESIGNERS WITH ANIMATED WIREFRAMES EVERYONE SHOULD SIT IN THE SAME ROOM
  58. 58. ...AND KEEPING THE QUALITY HIGH
  59. 59. ...AND KEEPING THE QUALITY HIGH UNIT TESTS USING FLEXUNIT AND FLEXCOVER
  60. 60. ...AND KEEPING THE QUALITY HIGH
  61. 61. ...AND KEEPING THE QUALITY HIGH UNIT TESTS USING FLEXUNIT AND FLEXCOVER
  62. 62. ...AND KEEPING THE QUALITY HIGH UNIT TESTS USING FLEXUNIT AND FLEXCOVER PROOF OF CONCEPTS
  63. 63. ...AND KEEPING THE QUALITY HIGH
  64. 64. ...AND KEEPING THE QUALITY HIGH UNIT TESTS USING FLEXUNIT AND FLEXCOVER
  65. 65. ...AND KEEPING THE QUALITY HIGH UNIT TESTS USING FLEXUNIT AND FLEXCOVER PROOF OF CONCEPTS
  66. 66. ...AND KEEPING THE QUALITY HIGH UNIT TESTS USING FLEXUNIT AND FLEXCOVER PROOF OF CONCEPTS CONTINUOUS INTEGRATION USING CRUISECONTROL.NET
  67. 67. ...AND KEEPING THE QUALITY HIGH
  68. 68. ...AND KEEPING THE QUALITY HIGH UNIT TESTS USING FLEXUNIT AND FLEXCOVER
  69. 69. ...AND KEEPING THE QUALITY HIGH UNIT TESTS USING FLEXUNIT AND FLEXCOVER PROOF OF CONCEPTS
  70. 70. ...AND KEEPING THE QUALITY HIGH UNIT TESTS USING FLEXUNIT AND FLEXCOVER PROOF OF CONCEPTS CONTINUOUS INTEGRATION USING CRUISECONTROL.NET
  71. 71. ...AND KEEPING THE QUALITY HIGH UNIT TESTS USING FLEXUNIT AND FLEXCOVER PROOF OF CONCEPTS CONTINUOUS INTEGRATION USING CRUISECONTROL.NET PEER REVIEW ON EVERY CHECK-IN
  72. 72. 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 My blog: http://www.pixelpod.co.uk THANK YOU

×