Rick Williams
22nd 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 DRIVING
USING TELEMATIC DATA COLLECTED FROM THE CAR

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

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

A LITTLE BIT MORE DETAIL…
BUILT USING ADOBE AIR 1.1 AND FLEX

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

WHY ADOBE AIR?
CROSS PLATFORM

WHY ADOBE AIR?
CROSS PLATFORM
SMOOTH INSTALL OF THE FRAMEWORK AND APPLICATION

WHY ADOBE AIR?
CROSS PLATFORM
SMOOTH INSTALL OF THE FRAMEWORK AND APPLICATION
EASY AUTO-UPDATE FUNCTIONALITY

WHY ADOBE AIR?
CROSS PLATFORM
SMOOTH INSTALL OF THE FRAMEWORK AND APPLICATION
EASY AUTO-UPDATE FUNCTIONALITY
INTERGRATED SQLITE DB

WHAT ARE WE TALKING ABOUT
THE TEAMS AND THE WORKFLOW

WHAT ARE WE TALKING ABOUT
THE TEAMS AND THE WORKFLOW
KEEPING QUALITY HIGH

WHAT ARE WE TALKING ABOUT
THE TEAMS AND THE WORKFLOW
KEEPING QUALITY HIGH
GETTING UNDER THE COVERS OF ECO:DRIVE

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

FEATURES DEMO

WHAT DOES ECO:DRIVE
LOOK LIKE INSIDE?

THE MANDATORY BLOCK DIAGRAM

THE MANDATORY BLOCK DIAGRAM
USB KEY

THE MANDATORY BLOCK DIAGRAM
HTTP ECO:INDEX
WEB SERVICE
USB KEY HTTP COMMUNITY
WEB SERVICE
HTTP FUEL PRICE
WEB SERVICE

UPDATE DEMO

IMPORTING DATA: STEP BY STEP
EACH CAR ON THE USB KEY IS MATCHED TO A CAR IN
THE DESKTOP APPLICATION

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

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

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

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

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

IMPORTING DATA: PARSING
SEVERAL ITERATIONS OF THE PARSING CODE
FIRST WAS FUNCTIONAL, BUT SLOW
ONCE UI WAS COMPLETED, WE RUTHLESSLY OPTIMISED

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

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

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”

IMPORTING DATA: THE ASYNC CHUNKER WHAT?
USING SYNCHRONOUS “FOR” LOOP TO PROCESS
EACH ITEM IN AN ARRAY

IMPORTING DATA: THE ASYNC CHUNKER WHAT?
USING SYNCHRONOUS “FOR” LOOP TO PROCESS
EACH ITEM IN AN ARRAY
USING A TIMER

IMPORTING DATA: THE ASYNC CHUNKER WHAT?
USING SYNCHRONOUS “FOR” LOOP TO PROCESS
EACH ITEM IN AN ARRAY
USING THE ASYNC CHUNKER MONKEY

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

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

DATA VISUALISATION DEMO

VISUALISING THE DATA
JOURNEY VIEW – TREND VIEW – ECO:VILLE

GRAPHING THE DATA: JOURNEY VIEW
INDIVIDUAL
DATA
SCRUB BAR 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

...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

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

...AND KEEPING THE QUALITY HIGH

...AND KEEPING THE QUALITY HIGH
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
UNIT TESTS USING FLEXUNIT AND FLEXCOVER
PROOF OF CONCEPTS

...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
PROOF OF CONCEPTS

...AND KEEPING THE QUALITY HIGH
UNIT TESTS USING FLEXUNIT AND FLEXCOVER
PROOF OF CONCEPTS
CONTINUOUS INTEGRATION USING CRUISECONTROL.NET

...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
PROOF OF CONCEPTS

...AND KEEPING THE QUALITY HIGH
UNIT TESTS USING FLEXUNIT AND FLEXCOVER
PROOF OF CONCEPTS
CONTINUOUS INTEGRATION USING CRUISECONTROL.NET

...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

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