Building Composite, Role-Based Dashboards with WebSphere Dashboard Framework
Building Beautiful Dashboards
description
Transcript of Building Beautiful Dashboards
Jenny LalikNovember 2, 2012
With Active Technologies
WebFOCUS 7.7.03
Building Beautiful Dashboards
1
Agenda
Active Technologies ReviewExamplesCharacteristicsFormattingDemonstrationWhat’s new in 8?
2
Active Technologies
3
Why Active Technologies?
Safe and secure information delivery HTML, Flex, and PDF
Interactive, graphical view of information
Disconnected analytics
Mobile ready for any device
Simple workflow
4
Multiple Output Options
5
Output Format
Recommended DeploymentBenefit
Desktop Browser Email Mobile
BrowserMobile Apps
AHTML x x x x Disconnected analytics, visualization
FLEX x x* Better visualization and animation
FUSION x Superior visualization and animation
APDF x xDisconnected analytics, visualization;
Must support Flash
Examples
6
Mobile Smart Phone Examples
Examples
Active Dashboards: built in Document Composer and InfoAssist
8
Characteristics as of 7703
9
View • Single Page
Output
• HTML• Flash• PDF
Reports • No control
Charting• Limited
control
Prompts• Coordinated• Cascading
View• Single• Multiple
Output
• HTML• Flash• PDF
Reports • Full control
Charts• Dynamic• Initial display
Prompts• Coordinated• Cascading
InfoAssist vs. Developer Studio
Formatting
10
What Control Do I Have?Active Report “Features”
Active Cache can be set for each individual report
Security must be set in the first report
Chart engine is critical for Mobile
11
What Control Do I Have?Active Report “Format”
Initial Presentation can be any chart type!
Let your “theme” take care of colors
Lines per page is critical for dashboards
Menu options can be scaled back
12
What Control Do I Have?Do your Active Charts look like this?
13
What Control Do I Have?When they could look like this?
14
What’s in a Theme?
Style sheet ActiveTabular Styles the Active ”menu”
JavaScript Active Charts Changes the colors Gradients are challenging!
Building Blocks for Formatting
15
What Control Do I Have?Utilize JavaScript files to control your Active Charts
Place the JS files in the APP you want to affect
See documentation: Active Technologies User Guide
16
Output Format Controlling JS File AHTML Standard irpcusf.js
AHTML HTML5 irpstd.js
FLEX Standard irpfsty.js
FLEX Fusion irpfstd.js
APDF irpfsty.js
Best Practices
Create a “theme”
Use “dynamic” charting engine
Determine resolution and viewing device
Create templates
Select the proper output format
17
Demonstration
18
What Changes in WF8?
Google-like paradigm
Stunning HTML5 Charts
Active Charts styled with stylesheet
More chart types and interactivity
More control in InfoAssist
19
Questions and Thank you!
20