1. EnergyIP 8.0 UI
Lijun Chen & Ravi Kanagala, eMeter
May 2012
Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

2. Today’s agenda
VEE operations user profile case study to illustrate UI design
principal
• EIP Application Dashboard
• VEE Exception Handling
• SDP Management
• Business Data Administration
Slide 1 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

3. Existing EnergyIP UI
Refreshing your memory …

4. Siebel UI
Lots of functionality, usage design principals not quite aligned
Slide 3 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

5. EIP 8.0 UI design principals
• “No more than 3-clicks” rule
• One glance view of critical related data
• One click access to commonly used
functions
• Widgets & Personalization
If you have ideas of how we could continue
to improve the UI, we’d love to hear them!

6. High Level UI Architecture
• Build on top of EnergyIP 8.0 Platform
• RESTful UI services
• EIP UI Framework for localization, flow
navigation, MVC, screen templates…
• Sencha extJS4 Javascript libraries
Slide 5 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

7. Today’s agenda
VEE operations user profile case study to illustrate UI design
principal
• EIP Application Dashboard
• VEE Exception Handling
• SDP Management
• Business Data Administration
Slide 6 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

8. Your Whole New EIP Dashboard
• Summary view of daily essentials
• Personalized view of user-chosen
functionality
• Functionality widgets
• Custom widgets can be easily integrated
.
Slide 7 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

9. Today’s agenda
VEE operations user profile case study to illustrate UI design
principal
• EIP Application Dashboard
• VEE Exception Handling
• SDP Management
• Business Data Administration
Slide 8 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

10. VEE Graphical Editor
It’s all about how to use the options!
• Usability Pattern:
• Full real estate usage
• Graph and tabular data working together
• Information overlays
• Transparency usage for semi-critical data
• Minimize information overload
• Inline editing
• Bulk save changes
Slide 9 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

11. Service Request/Activity
Workflows & views to boost operation efficiency
• Usability pattern:
• Comprehensive, unified data presentation
• Ownership driven workflow management
• Business sensitive flow routing
• Critical related data in one view or one click
• Anchored view of related SDP/Meter/Acct
• Critical elements like activities and Event log
available in first view
• Expand-collapse grids for optimized and
personalized look
Slide 10 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

12. Today’s agenda
VEE operations user profile case study to illustrate UI design
principal
• EIP Application Dashboard
• VEE Exception Handling
• SDP Management
• Business Data Administration
Slide 11 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

13. SDP Management
Usability pattern:
• One look summary view with all marquee elements of SDP
• Panoramic view for all major relations of SDP with one-
click selection for details
• Simple navigation to various related entities to SDP
• One click edit with linking and searching for related
entities
• Vertical split for relations and attributes
• Column browser attribute view
12 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

14. Today’s agenda
VEE operations user profile case study to illustrate UI design
principal
• EIP Application Dashboard
• VEE Exception Handling
• SDP Management
• Business Data Administration
Slide 13 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

15. Business Data Administration
• Usability pattern:
• Grouped navigation for related
entities
• Consistency of administration
experience irrespective of entity
• Vertical split for attributes and related
data
Slide 14 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

16. VEE Service Configuration
One example of business data admin
• Column browsers
• Uniformed UI paradigm
• Split view of Related Objects, Detail and
attributes
• Special system-assisted navigation of
service configuration
Slide 15 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

17. Now
It’s a good time to wake up,
for the next session can be interesting =)

18. eMeter Visual Admin

19. Introduction
VisualAdmin is the new System Admin tool from
EIP
Dashboard
• Quick view of the system-at-a-glance
Configuration
• Application setup and configuration
• Import/Export of Application configuration for environment
migrations (dev, test, prod)
Control
• Sending control commands to apps – e.g.
Start/Stop/Pend/CollectDetailStats…
Slide 18 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

20. Introduction
System Health
• Monitoring system and application health –
performance, memory, processing time, throughput
Alerts
• Alerts and Notifications based on expected response and
throughput
• APIs to raise alerts and notifications from applications
Business Metrics
• Detailed metrics on the processing within EIP applications
Slide 19 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

21. Dashboard
• System performance and critical resource
consumption at a glance
• Aggregated CPU and memory usage of various
apps with drill down
• System summary – running fast/normal or slow
• Customizable and gadget-pluggable
Slide 20 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

22. Application Configuration
• Simple, customizable UI to configure deployed
applications
• Wizard widget – group subsystem configuration
• Trace configuration to artifact that delivered the
configuration
• Personalization – grouping most commonly used
configurations for easy usage
• CLI provides the same functionality as UI for sys
admin buffs
• Export/Import capabilities to support migration
of configuration between environments
Slide 21 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

23. Application Control
Visual Admin provides
• Start, stop of processes
• Status check of the applications
• Checking log files
• Hot change of log levels on apps
• Managing system resources like EIDG,
Sessions, BOContexts to adjust for
performance
• API’s to hook up custom JMX controls.
Slide 22 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

24. Types of Stats
Response times
• Business services, like VEE, Billing – aggregates over time
AND granular data
• DB operations like inserts, loads, queries
• Comparisons against preset expected values
Snapshot data
• Current active DB connections
• Current thread count
• Current Session count
Memory usage of applications
• Used Memory
• Maximum Memory
• Usage alerts on comparison against preset max values
Slide 23 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

25. Alerts and Notifications
Alerts can be set based on comparisons to preset
critical levels e.g.
• VEE response times beyond expected values
• Application memory usage cross a preset limit
• Exception rate in processes signaling high rate of
failure
Various Notifications can be set up for alerts, by
default the alerts are displayed in Visual Admin UI.
Slide 24 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.

26. Business metrics
• Data collected from predominantly from business
stats database
• Various aggregations for applications available
• By Time
• By Org
• By App and app instance
• Stats such as # of intervals processed, # of
Register Reads processed, # of SDPs or Meters
synch’ed
Slide 25 Copyright © 2012 eMeter, A Siemens Business. All rights reserved.