This document discusses building interactive dashboards with Java and Flex. It provides an overview of the Flex framework, data connectivity and visualization capabilities in Flex, and ways to learn Flex such as free online tutorials and videos. The document is presented by Michaël Chaize, a Flash Platform Evangelist at Adobe.

1. Build your rst interactive dashboard with Java and Flex
Michaël Chaize | Flash Platform Evangelist
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.

2. Feel free to contact me
Michaël Chaize
Flash Platform Evangelist
My blog: www.RIAgora.com
@mchaize
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 2

3. Menu du jour
RIA and decision making
The Adobe Flash platform
Flash and interactive dashboards
What is Flex 4 ?
The classic charting components
The advanced data visualization
How to learn Flex ?
Q&A
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 3

4. What Are Intuitive User Experiences?
! E ective, E cient, Engaging, Easy to learn, Error free
! Personalized, responsive experiences across devices and channels
! Communication & collaboration in context
! Harmonization of backend processes and services
®
Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con dential. 4

5. Why Do Intuitive User Experiences Ma er?
Forrester
August 7, 2009
e State Of Enterprise IT Budgets: 2009
by Heidi Lo and Andrew Bartels
®
Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con dential. 5

6. Rich User Experiences: Opportunities for internal users
“A problem can’t be solved with
the same thinking
that created it”
®
Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con dential. 6

7. Rich User Experiences: Opportunities for internal users
5 mins 20 secs
Increase productivity & improve decision making
®
Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con dential. 7

8. NATO
®
Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con dential. 8

9. NATO
®
Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con dential. 9

10. NATO
From a system-centric view (database), to a user-centric application.
®
Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con dential. 10

11. Productivity by Design
Productivity by design
Productive users Productive developers
®
Copyright 2009 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.

12. Flash Platform - A complete system for web innovation
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.

13. - 98% on Pc/Mac/Linux
- Graphic API
- E ects and Transitions
- JIT compiler of AVM2
- Real-Time Messaging
- P2P
- 3D API
- Soon on multiple screens

14. Live Collaborative dashboard
LiveCycle Data Services or BlazeDS
!Client A
Message
Endpoint
Service
!Client B
!RTMP
!Client C
!AMF Publisher
!HTTP Subscriber
®
44
Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con dential.

15. Real-time data transmi ed to dashboards
LiveCycle Data Services or BlazeDS
Messaging
Adapter X
System X
Message JMS
Endpoint JMS Adapter
Services Provider
Messaging
Adapter Y
System Y
!RTMP
!AMF Publisher
!HTTP Subscriber
®
45
Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con dential.

16. Flash and real-time dashboards
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 16

17. ADOBE FLEX 4

18. Productive developers
Open source framework Agile Development
Backend solutions
Large WW community Unit testing, Quality
Handle large datasets
IT approved control, Stressing
Real-time applications
IDE based on Eclipse framework, Model-driven
Live Collaboration
Rich UI components development
®
Copyright 2009 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.

19. What is Flex and how it works
Flex Builder IDE Browser
Flex SDK Flash Player
MXML ActionScript
Flex Class Library SOAP HTTP/S AMF/S RTMP/S
Web Server
Compile
XML/HTTP LC Data Services
REST
SOAP Web Services J2EE Application Server
Existing Applications & Infrastructure
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.

20. IDE based on Eclipse

21. DATA CONNECTIVITY
DATA SERVICES WIZARD

22. DATA CONNECTIVITY
DATA SERVICES PANEL

23. DATA CONNECTIVITY
TEST OPERATION PANEL

24. DATA CONNECTIVITY
CODE GENERATION

25. DATA CONNECTIVITY
AUTOMATIC DATA PAGING

26. DATA CONNECTIVITY
NETWORK MONITOR

27. UI DEVELOPMENT
CHART GENERATION

28. Show me the code
My first interactive dashboard
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 28

29. Area
Bar
Bubble
CandleStick
Column
HLOC
ADOBE FLEX
Charting Components Line
Pie
Plot

30. IBM ILOG ELIXIR
- 3D charts
- Scheduling
- Project Management
- Calendar
- Timelines
- Gauges and dials
- Maps
- Heat maps
- Pivot charts
- Organization charts
- Treemap charts
- Radar charts
ADOBE FLEX
Advanced Data Visualization
components

31. KAP IT lab
- Diagrammer
- Visualizer
- Treemap
- Elastic search
- Ring chart
- Radar chart
ADOBE FLEX
Advanced Data Visualization
components

32. Axiis
Open source framework
ADOBE FLEX
Advanced Data Visualization
components

33. Develop your own
components with Flex 4

34. FLEX FRAMEWORK 4
OLD COMPONENT MODEL
Component / Skin
Graphics
Layout
Animation
Parts
States
Behavior
Logic
Data

35. FLEX FRAMEWORK 4
SPARK COMPONENT MODEL
ActionScript MXML
Component Skin
Graphics
Behavior Layout
Logic Animation
CSS properties Parts
Data States

36. Circular Slider
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 36

37. Flex.org
The Flex SDK is free and open source
Free trial of Flash Builder (IDE)
Tour de Flex
Free application, samples, live updates
http://developer.adobe.com :
Flex in a week
Free online video training, samples
How to learn Flex ? Flex Test drive
Build a flex application in an hour
Adobe TV
Video tutorials

38. Flash Platform - A complete system for web innovation
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.

39. Feel free to contact me
Michaël Chaize
Flash Platform Evangelist
My blog: www.RIAgora.com
@mchaize
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 39