O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Deliver Modern UI for IBM BPM with the Coach Framework and Other Approaches

Book Description

IBM® Coach Framework is a key component of the IBM Business Process Manager (BPM) platform that enables custom user interfaces to be easily embedded within business process solutions. Developer tools enable process authors to rapidly create a compelling user experience (UI) that can be delivered to desktop and mobile devices. IBM Process Portal, used by business operations to access, execute, and manage tasks, is entirely coach-based and can easily be configured and styled. A corporate look and feel can be defined using a graphical theme editor and applied consistently across all process applications. The process federation capability enables business users to access and execute all their tasks using a single UI without being aware of the implementation or origin. Using Coach Framework, you can embed coach-based UI in other web applications, develop BPM UI using alternative UI technology, and create mobile applications for off-line working.

This IBM Redbooks® publication explains how to fully benefit from the power of the Coach Framework. It focuses on the capabilities that Coach Framework delivers with IBM BPM version 8.5.7. The content of this document, though, is also pertinent to future versions of the application.

Table of Contents

  1. Front cover
  2. Notices
    1. Trademarks
  3. IBM Redbooks promotions
  4. Preface
    1. Authors
    2. Now you can become a published author, too!
    3. Comments welcome
    4. Stay connected to IBM Redbooks
  5. Chapter 1. Delivering modern UI for IBM BPM using the Coach Framework and other approaches
    1. 1.1 User interactions with business processes
    2. 1.2 Coaches: Custom user interfaces for business processes
    3. 1.3 Coach views: Custom user interface components
      1. 1.3.1 Controls: Atomic coach views
      2. 1.3.2 Reusable coach elements: Composite coach views
      3. 1.3.3 Dynamic coach view interaction
    4. 1.4 Human services
      1. 1.4.1 Task completion coaches
      2. 1.4.2 Dashboards
      3. 1.4.3 Client-side human services
    5. 1.5 Using coaches outside IBM BPM
      1. 1.5.1 Launching coaches using a URL
      2. 1.5.2 Coaches within JSR 286 portlets
    6. 1.6 How coaches can benefit your organization
      1. 1.6.1 Seamless integration of UIs and process logic
      2. 1.6.2 Tailored UI components for your business
    7. 1.7 Conclusion
  6. Chapter 2. Creating user interfaces with coaches
    1. 2.1 Getting started with client-side human services
      1. 2.1.1 Creating a simple process flow
      2. 2.1.2 Creating a client-side human service
      3. 2.1.3 Running a client-side human service
    2. 2.2 Building a simple coach
      1. 2.2.1 The coach editor
      2. 2.2.2 What you see is what you get (WYSIWYG)
      3. 2.2.3 Using variables to add controls to a coach
      4. 2.2.4 Moving and deleting controls
    3. 2.3 Configuring controls
      1. 2.3.1 Setting the control binding variable
      2. 2.3.2 Using pseudo variables
      3. 2.3.3 Setting control configuration options
      4. 2.3.4 Defining control visibility
      5. 2.3.5 Changing the positions of controls
    4. 2.4 Control toolkits
    5. 2.5 Working with documents
      1. 2.5.1 Document List control
      2. 2.5.2 Document Viewer control
      3. 2.5.3 Document Explorer control
    6. 2.6 Creating a reusable group of controls (using a composite coach view)
    7. 2.7 Adding validation to a coach
      1. 2.7.1 Required visibility
      2. 2.7.2 Control configuration options
      3. 2.7.3 Data Change event handler
      4. 2.7.4 Client-side script
      5. 2.7.5 Server-side service
      6. 2.7.6 When to use each validation technique
    8. 2.8 Deriving data from other fields
    9. 2.9 Making a coach responsive
      1. 2.9.1 Multiple form factors
      2. 2.9.2 Controls’ responsive properties
      3. 2.9.3 Testing a responsive UI
      4. 2.9.4 Responsive design considerations
    10. 2.10 Designing a coach using the grid layout
      1. 2.10.1 The Grid and Content views
      2. 2.10.2 Grid templates
      3. 2.10.3 Grid cell properties
      4. 2.10.4 Adding content to the grid
      5. 2.10.5 Using sections with a grid layout
      6. 2.10.6 Using a grid layout within a coach view
      7. 2.10.7 Grid view visual tools
      8. 2.10.8 Hiding grid cells
      9. 2.10.9 Reusing a grid layout
    11. 2.11 Using nested client-side human services
    12. 2.12 Styling coaches using themes
      1. 2.12.1 Defining a custom theme
      2. 2.12.2 The Graphical Theme Editor
      3. 2.12.3 The Source Editor
      4. 2.12.4 Fine-grained and broad-brush styling
      5. 2.12.5 Style configuration options
      6. 2.12.6 Applying a theme at run time
      7. 2.12.7 Styling IBM Process Portal
    13. 2.13 Displaying coaches in different languages (using localization)
      1. 2.13.1 Defining a localization resource
      2. 2.13.2 Localizing user interfaces
    14. 2.14 Performance considerations
      1. 2.14.1 Consider the expected browser version when designing coaches
      2. 2.14.2 Avoid building large coaches with too many controls
      3. 2.14.3 Minimize the number of server-side calls
      4. 2.14.4 Use client-side human services instead of heritage human services
      5. 2.14.5 Minimize the size of business objects in the UI
      6. 2.14.6 Judiciously use the Table control
      7. 2.14.7 Pick an appropriate delay time for auto-complete fields
    15. 2.15 Conclusion
  7. Chapter 3. Building controls using coach views
    1. 3.1 Overview of a coach view structure
    2. 3.2 Developing coach view basic functions
      1. 3.2.1 Defining and accessing data in the coach view
      2. 3.2.2 Constructing the view of a coach view
      3. 3.2.3 Programming the coach view event handler to control behavior
      4. 3.2.4 Test coach view in a human service
    3. 3.3 Developing advanced functions of a coach view
      1. 3.3.1 Communicating with backend data
      2. 3.3.2 Additional view layout attributes of the coach view
      3. 3.3.3 Better support for the coach author in design time
      4. 3.3.4 Developing coach views with existing UI libraries
    4. 3.4 Patterns of coach view development
      1. 3.4.1 Configuration option with drop-down selection
      2. 3.4.2 Use LESS for theme participation
      3. 3.4.3 Loading curtain
      4. 3.4.4 Publishing and subscribing an event through a controller coach view
    5. 3.5 Performance considerations
      1. 3.5.1 Ensuring the browser cache works
      2. 3.5.2 Using Prototype to reduce the memory footprint
      3. 3.5.3 Using lazy loading
      4. 3.5.4 Reducing service calls
      5. 3.5.5 Balancing UI design simplicity and usability
      6. 3.5.6 Do not mix controls written with different JavaScript libraries
      7. 3.5.7 Avoiding unnecessary change-events processing
      8. 3.5.8 Using custom Dojo build layer
      9. 3.5.9 Handling editable and read-only modes differently
    6. 3.6 Checklist for developing a custom coach view
    7. 3.7 Conclusion
  8. Chapter 4. SPARK UI Toolkit
    1. 4.1 Introduction
      1. 4.1.1 Understanding the value of the SPARK UI Toolkits
      2. 4.1.2 Developer experience
      3. 4.1.3 Underlying patterns and principles
      4. 4.1.4 Modern, lightweight, consistent across BPM versions
    2. 4.2 Understanding the IBM and Salient Process partnership
    3. 4.3 Basic BPM UI concepts with SPARK
      1. 4.3.1 Controls and configuration properties
      2. 4.3.2 Methods, events, and addressing
      3. 4.3.3 Optional data binding
      4. 4.3.4 Validation
    4. 4.4 UI layout
      1. 4.4.1 Horizontal and vertical layouts
      2. 4.4.2 Tabbing or stacking UI content
      3. 4.4.3 Displaying modal content
      4. 4.4.4 Wells
    5. 4.5 Calling AJAX services
      1. 4.5.1 Service Call control
    6. 4.6 Responsiveness
      1. 4.6.1 Classic responsiveness
      2. 4.6.2 Enhanced Web Component-based responsiveness
      3. 4.6.3 Coach view responsiveness
    7. 4.7 Working tabular and repeating data
      1. 4.7.1 Table and Service Data Table controls
    8. 4.8 Searching content
      1. 4.8.1 Layouts and repeating data
    9. 4.9 Formulas
      1. 4.9.1 Syntax for control references
      2. 4.9.2 Formulas referencing specific controls
      3. 4.9.3 Formulas for control aggregates
      4. 4.9.4 Working with data directly
      5. 4.9.5 Formulas for non-numerical computations
      6. 4.9.6 Formulas for control-value initialization
    10. 4.10 Reporting and analytics
      1. 4.10.1 Charts
      2. 4.10.2 Working with tables and charts
    11. 4.11 Solutions for common patterns and requirements
      1. 4.11.1 Working with large forms
      2. 4.11.2 Server-side paging
    12. 4.12 More on the SPARK UI Toolkit
    13. 4.13 Conclusion
  9. Chapter 5. IBM Process Portal
    1. 5.1 Process Portal features
      1. 5.1.1 Mobile enablement
      2. 5.1.2 Process Portal layout
      3. 5.1.3 Discovering tasks with the Work dashboard
      4. 5.1.4 Locating tasks using filters and saved searches
      5. 5.1.5 Executing tasks
      6. 5.1.6 Working with processes and cases
      7. 5.1.7 Performance dashboards
      8. 5.1.8 Custom dashboards
      9. 5.1.9 Social features
    2. 5.2 Modifying the Process Portal user experience
      1. 5.2.1 Personalize the user experience
      2. 5.2.2 Configure Process Portal
      3. 5.2.3 Style Process Portal
      4. 5.2.4 Extend Process Portal with custom dashboards
      5. 5.2.5 Define a Process Instance Launch UI
      6. 5.2.6 Define a custom Process Instance Details UI
      7. 5.2.7 Clone Process Portal
      8. 5.2.8 Customize Process Portal
      9. 5.2.9 SPARK Portal Builder toolkit
    3. 5.3 Securely accessing IBM Process Portal from a mobile device
    4. 5.4 Process Federation Server
      1. 5.4.1 Process Federation Server Deployment
      2. 5.4.2 More on Process Federation Server
    5. 5.5 Conclusion
  10. Chapter 6. Combining the Coach Framework with other approaches
    1. 6.1 Decoupling the BPM UI: “Headless” BPM
      1. 6.1.1 How are business processes represented in the SOA reference architecture?
      2. 6.1.2 Business process orchestration and BPM UI
      3. 6.1.3 Accessing tasks externally
      4. 6.1.4 Exposing a process via a business service
      5. 6.1.5 IBM BPM REST APIs
      6. 6.1.6 Pros and Cons of a formal service exposure layer for BPM APIs
      7. 6.1.7 Design points relating to an independent BPM UI
      8. 6.1.8 Pros and cons of an external BPM UI
      9. 6.1.9 External UI integration: anti-patterns
    2. 6.2 BPM UI design patterns
    3. 6.3 Exposed pattern
      1. 6.3.1 Expose human services indirectly through the EPS toolkit
      2. 6.3.2 Summary of the Exposed pattern implementation options
    4. 6.4 Embedded pattern
      1. 6.4.1 Embed a human service as an iframe in an alternative task portal
      2. 6.4.2 Embed a human service in the IBM BPM iOS mobile app
      3. 6.4.3 Embed a human service in IBM WebSphere Portal
    5. 6.5 Integrated pattern
    6. 6.6 Decoupled pattern
      1. 6.6.1 Use an external UI implementation within a BPM process
      2. 6.6.2 Use IBM MobileFirst to implement the Decoupled pattern
    7. 6.7 Independent pattern
    8. 6.8 Hybrid pattern
      1. 6.8.1 Launch external activity from IBM Process Portal
    9. 6.9 Combining and extending the BPM UI design patterns
      1. 6.9.1 Take advantage of IBM Process Portal
      2. 6.9.2 Embed iframes in coaches
    10. 6.10 Conclusion
  11. Appendix A. Additional material
    1. Locating the Web material
    2. Using the Web material
    3. Downloading and extracting the Web material
  12. Related publications
    1. Online resources
    2. Help from IBM
  13. Back cover