Presentation Essent Client Data Visualisation

10
#oSoc13 #ABesigner #Essent

description

This is a project I made within the weeks of Summer of Code '13: http://summerofcode.be/ The project is fully open source (it's the idea behind summer of code: open data) and is available on git: https://github.com/oSoc13/Essent. Feel free to use it. The project uses the datatank framework (alsa available on git) to process client data for the Belgian energy deliverer Essent. The web app was made to run fully automatically on a tv screen p.e. on a tv screen in a lobby. It is possible to interact with it. This is the presentation I used for presenting the product.

Transcript of Presentation Essent Client Data Visualisation

Page 1: Presentation Essent Client Data Visualisation

#oSoc13 #ABesigner #Essent

Page 2: Presentation Essent Client Data Visualisation

BASTIAAN ANDRIESSEN

Student Digital Design & Media (Devine) @Howest Kortrijk Design, Back-end (resource management) and Front-end

THE OSOC’13 TEAM

Help during the developing process

Page 3: Presentation Essent Client Data Visualisation

SPONSORED BY  

ESSENT YEAH, GIVE ‘EM A BIG APPLAUSE. WITHOUT THEM, THIS AWESOME

PROJECT WOULD ‘VE NEVER BEEN POSSIBLE  

Page 4: Presentation Essent Client Data Visualisation

PROBLEM   RAW DATA  = NO INSIGHT  

Page 5: Presentation Essent Client Data Visualisation

SOLUTIONS  

STRUCTURIZE DATA  

CALCULATE DATA RELATIONS P.E. AVERAGES, PAYMENT METHODS, ENERGY SOURCES, …  

CLEAN DATA VISUALISATION  

Page 6: Presentation Essent Client Data Visualisation

GOAL  

MORE INSIGHT ON DATA P.E. AVERAGES, PAYMENT METHODS, ENERGY SOURCES, …  

AUTOMATED INTERFACE WITH POSSIBILITY TO INTERRUPT AND INTERACT  

DISPLAYED ON TV SCREEN WEBAPP WITH LARGER STANDARD: 1024x768 1900x1200  

 

Page 7: Presentation Essent Client Data Visualisation

DESIGN/UI/UX/IA  

NOT A SPECIFIC VISUAL IDENTITY NO CHARACTERISTIC SHAPES, REALLY WEIRD COLOR COMBINATIONS, …  

ATTEMPT FINDING MATCHING COLORS AND HOPEFULLY SOMEWHAT MORE BEAUTIFUL  

SKETCHING/DRAWING/FINDING VISUALISATION METHODS

MAKING DATA CONNECTIONS FINDING OUT WHAT’S POSSIBLE WITH THE AVAILABLE DATA  

Page 8: Presentation Essent Client Data Visualisation

MILESTONES   WEEK 1 SKETCHING, ICON DESIGN, GENERAL APP DESIGN, BACK-END: CONVERTING THE .CSV’S TO JSON FILES VIA THE DATATANK, FIRST DEVELOPMENT EXPERIMENTS    

WEEK 2   WEEK 3  LAST DESIGN ADJUSTMENTS, SEMANTIC PARTS, GENERATING DATA ELEMENTS, CANVAS DRAWING WITH/WITHOUT PLUGIN (JCANVAS), DATA ANIMATIONS, BUGFIXING  

CROSS-BROWSER, BUGFIXING, DOCUMENTATIONS  

Page 9: Presentation Essent Client Data Visualisation

DEMO TIME  THE MOMENT EVERYONE HAS BEEN WAITING FOR THROUGHOUT

THIS BORING PRESENTATION      

Page 10: Presentation Essent Client Data Visualisation

THANKS. ANY QUESTIONS? THANKS FOR THE ATTENTION THROUGHOUT THE PRESENTATION.

HOPE YOU ENJOYED IT. ANY QUESTIONS?