View
6.106
Download
1
Category
Preview:
DESCRIPTION
A look at how Fiat eco:Drive was developed by AKQA London
Citation preview
Rick Williams22nd January 2009
BEFORE WE GET DOWN TO BUSINESS…
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.
WHAT WAS OUR BRIEF FROM FIAT?
BUILD A PRODUCT THAT HELPS IMPROVE YOUR DRIVINGUSING TELEMATIC DATA COLLECTED FROM THE CAR
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
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
WHY IS ECO:DRIVE “SOPHISTICATED”?
YET THE SOLUTION HAD TO BE
INTUITIVE EASY TO USE RESPONSIVE
A LITTLE BIT MORE DETAIL…
BUILT USING ADOBE AIR 1.1 AND FLEX
BUILT IN 4 MONTHS BY A DEVELOPMENT TEAM OF 5
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
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
A LITTLE BIT MORE DETAIL…
BUILT USING ADOBE AIR 1.1 AND FLEX
WHY ADOBE AIR?
CROSS PLATFORM
WHY ADOBE AIR?
SMOOTH INSTALL OF THE FRAMEWORK AND APPLICATION
CROSS PLATFORM
WHY ADOBE AIR?
SMOOTH INSTALL OF THE FRAMEWORK AND APPLICATION
EASY AUTO-UPDATE FUNCTIONALITY
CROSS PLATFORM
SMOOTH INSTALL OF THE FRAMEWORK AND APPLICATION
EASY AUTO-UPDATE FUNCTIONALITY
INTERGRATED SQLITE DB
WHY ADOBE AIR?
CROSS PLATFORM
WHAT ARE WE TALKING ABOUT
THE TEAMS AND THE WORKFLOW
WHAT ARE WE TALKING ABOUT
KEEPING QUALITY HIGH
THE TEAMS AND THE WORKFLOW
WHAT ARE WE TALKING ABOUT
KEEPING QUALITY HIGH
GETTING UNDER THE COVERS OF ECO:DRIVE
THE TEAMS AND THE WORKFLOW
KEEPING QUALITY HIGH
GETTING UNDER THE COVERS OF ECO:DRIVE
OUR TOP TIPS AND LESSONS LEARNT
WHAT AM I GOING TO TALK ABOUT
THE TEAMS AND THE WORKFLOW
FEATURES DEMO
WHAT DOES ECO:DRIVE LOOK LIKE INSIDE?
THE MANDATORY BLOCK DIAGRAM
THE MANDATORY BLOCK DIAGRAM
USB KEY
THE MANDATORY BLOCK DIAGRAM
ECO:INDEXWEB SERVICE
HTTP
COMMUNITYWEB SERVICE
HTTP
FUEL PRICEWEB SERVICE
HTTP
USB KEY
UPDATE DEMO
IMPORTING DATA: STEP BY STEP
EACH CAR ON THE USB KEY IS MATCHED TO A CAR INTHE DESKTOP APPLICATION
IMPORTING DATA: STEP BY STEP
EACH CAR ON THE USB KEY IS MATCHED TO A CAR INTHE DESKTOP APPLICATION
FIRST 50% OF THE PROGRESS BAR: PARSING DATA INTO MEMORY
IMPORTING DATA: STEP BY STEP
EACH CAR ON THE USB KEY IS MATCHED TO A CAR INTHE DESKTOP APPLICATION
SECOND 50%: SAVING THAT DATA TO THE DATABASE
FIRST 50% OF THE PROGRESS BAR: PARSING DATA INTO MEMORY
IMPORTING DATA: STEP BY STEP
EACH CAR ON THE USB KEY IS MATCHED TO A CAR INTHE DESKTOP APPLICATION
EACH JOURNEY IS SUBMITTED TO THE ECO:INDEX WEB SERVICE
SECOND 50%: SAVING THAT DATA TO THE DATABASE
FIRST 50% OF THE PROGRESS BAR: PARSING DATA INTO MEMORY
IMPORTING DATA: STEP BY STEP
EACH CAR ON THE USB KEY IS MATCHED TO A CAR INTHE DESKTOP APPLICATION
UPDATE THE DATABASE AND THE USER INTERFACE
EACH JOURNEY IS SUBMITTED TO THE ECO:INDEX WEB SERVICE
SECOND 50%: SAVING THAT DATA TO THE DATABASE
FIRST 50% OF THE PROGRESS BAR: PARSING DATA INTO MEMORY
IMPORTING DATA: PARSING
LIMITED SPACE AVAILABLE IN BLUE & ME COMPUTER
MORE COMPUTING POWER AVAILABLE ON THE DESKTOPTHAN 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
IMPORTING DATA: PARSING
FIRST WAS FUNCTIONAL, BUT SLOW
ONCE UI WAS COMPLETED, WE RUTHLESSLY OPTIMISED
SEVERAL ITERATIONS OF THE PARSING CODE
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
IMPORTING DATA: WRITING DATA TO THE DATABASE
THERE WERE TWO MAJOR REQUIREMENTS
IMPORT HAD TO BE HIGHLYPERFORMANT
USER INTERFACE HAD TO REMAIN SMOOTH AND RESPONSIVE
THERE WERE TWO PROBLEMS
USING A TIMER WAS NOTFAST ENOUGH
USER “FOR” LOOPS MEANT AN UNRESPONSIVE APPLICATION
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 NOTFAST ENOUGH
USER “FOR” LOOPS MEANT AN UNRESPONSIVE APPLICATION
THE SOLUTION?
THE “ASYNC CHUNKER MONKEY”
IMPORTING DATA: THE ASYNC CHUNKER WHAT?
USING SYNCHRONOUS “FOR” LOOP TO PROCESSEACH ITEM IN AN ARRAY
IMPORTING DATA: THE ASYNC CHUNKER WHAT?
USING A TIMER
USING SYNCHRONOUS “FOR” LOOP TO PROCESSEACH ITEM IN AN ARRAY
IMPORTING DATA: THE ASYNC CHUNKER WHAT?
USING THE ASYNC CHUNKER MONKEY
USING SYNCHRONOUS “FOR” LOOP TO PROCESSEACH ITEM IN AN ARRAY
IMPORTING DATA: THE ASYNC CHUNKER WHAT?
USING THE ASYNC CHUNKER MONKEY
USING SYNCHRONOUS “FOR” LOOP TO PROCESSEACH ITEM IN AN ARRAY
MAX TIME FOR EXECUTION IS SET BY DEVELOPER
IMPORTING DATA: THE ASYNC CHUNKER WHAT?
USING THE ASYNC CHUNKER MONKEY
USING SYNCHRONOUS “FOR” LOOP TO PROCESSEACH ITEM IN AN ARRAY
MAX TIME FOR EXECUTION IS SET BY DEVELOPER
DATA VISUALISATION DEMO
VISUALISING THE DATA
JOURNEY VIEW – TREND VIEW – ECO:VILLE
GRAPHING THE DATA: JOURNEY VIEW
SCRUB BAR
INDIVIDUAL DATA
DYNAMIC LOADING
THE PEOPLE BEHIND THE PRODUCT…
HOW DID IT ALL WORK OUT?
HOW DID IT ALL WORK OUT?
HOW DID IT ALL WORK OUT?
HOW DID IT ALL WORK OUT?
HOW DID IT ALL WORK OUT?
HOW DID IT ALL WORK OUT?
HOW DID IT ALL WORK OUT?
HOW DID IT ALL WORK OUT?
HOW DID IT ALL WORK OUT?
HERE’S HOW WE ENDED UP SEEING IT…
THE MOST TRICKY PART…
...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
ENSURE THAT USER EXPERIENCE TALKS TO CREATIVE DEVELOPMENT
...GETTING THE DESIGN WORKFLOW RIGHT
IN AN IDEAL WORLD, USER EXPERIENCE WOULD SUPPLY DESIGNERS WITH ANIMATED WIREFRAMES
EVERYONE SHOULD SIT IN THE SAME ROOM
ENSURE THAT USER EXPERIENCE TALKS TO CREATIVE DEVELOPMENT
GETTING THE DESIGN WORKFLOW RIGHT...
...AND KEEPING THE QUALITY HIGH
...AND KEEPING THE QUALITY HIGH
UNIT TESTS USING FLEXUNIT AND FLEXCOVER
...AND KEEPING THE QUALITY HIGH
UNIT TESTS USING FLEXUNIT AND FLEXCOVER
...AND KEEPING THE QUALITY HIGH
PROOF OF CONCEPTS
UNIT TESTS USING FLEXUNIT AND FLEXCOVER
...AND KEEPING THE QUALITY HIGH
...AND KEEPING THE QUALITY HIGH
UNIT TESTS USING FLEXUNIT AND FLEXCOVER
...AND KEEPING THE QUALITY HIGH
PROOF OF CONCEPTS
UNIT TESTS USING FLEXUNIT AND FLEXCOVER
...AND KEEPING THE QUALITY HIGH
PROOF OF CONCEPTS
CONTINUOUS INTEGRATION USING CRUISECONTROL.NET
UNIT TESTS USING FLEXUNIT AND FLEXCOVER
...AND KEEPING THE QUALITY HIGH
...AND KEEPING THE QUALITY HIGH
UNIT TESTS USING FLEXUNIT AND FLEXCOVER
...AND KEEPING THE QUALITY HIGH
PROOF OF CONCEPTS
UNIT TESTS USING FLEXUNIT AND FLEXCOVER
...AND KEEPING THE QUALITY HIGH
PROOF OF CONCEPTS
CONTINUOUS INTEGRATION USING CRUISECONTROL.NET
UNIT TESTS USING FLEXUNIT AND FLEXCOVER
...AND KEEPING THE QUALITY HIGH
PROOF OF CONCEPTS
CONTINUOUS INTEGRATION USING CRUISECONTROL.NET
PEER REVIEW ON EVERY CHECK-IN
UNIT TESTS USING FLEXUNIT AND FLEXCOVER
...AND KEEPING THE QUALITY HIGH
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
Recommended