Prior to IBM Business Process Manager (BPM) 8.5.5, it was difficult to develop coaches for multiple form factors (browsers, tablets, smartphones). The stock coach views (controls like text, date and so on) were not developed to change size if the coach was rendered on different multiple-form-factor devices. Developers could develop around this, but it was costly. Sometimes it was easier to just adopt the "headless" BPM pattern and create an external user interface that interacted with the BPM engine through the BPM REST API.
Now in IBM BPM version 8.5.5, there are added features to help solve this by allowing you to design responsive coaches for use on multiple form factors. These new features allow you to:
- Play back coaches prior to deployment
- Make mobile part of coach design
- Utilize responsive coaches in any external user interfaces including IBM Worklight and custom mobile applications
In IBM BPM 8.5.5, a new type of human service was also introduced called a "client-side human service" (the other type of human service is a "heritage human service"). A client-side human service is the human service type that you need to use to develop responsive coaches.
Client-side human services also have these benefits:
- A new human services architecture that acts as a stepping stone for offline processes
- A WYSIWYG (what you see is what you get) web-based human services editor launched from IBM Process Designer (aka IBM Process Designer web editor)
- Optimized network trips to the server by caching static content, including the human services model and generated coach code (but dynamic data will not be cached for security purposes)
IBM Process Designer web editor
When you edit a coach form in a client-side human service, a browser-based editor opens.
Figure 1: Full screen view of the IBM Process Designer web editor
It looks very similar to the IBM Process Designer coach editor (when editing coach forms in a heritage human service), but there are some key changes that you will see.
First, in the upper right corner of the editor, you will see three buttons to test the coach form in three different form factors. From right to left, there are icons for small (smartphone), medium (tablet) and large (browser).
The key to enabling a coach form to adapt (be responsive) to different form factors is a new set of configuration parameters found in a new panel called Positioning.
Figure 2: IBM Process Designer web editor positioning tab
Each coach view now has these positioning parameters. You can enter, in percentages, how high or wide the coach view will be. This is enforced on all of the form factors. In addition, you can specify how overflow data will be handled in a coach view.
Figure 3: Closer look of the positioning parameters
You can see how this affects the rendering of the coach form in the screen shots that follow:
Figure 4: Large form factor
Figure 5: Medium form factor
Figure 6: Small form factor
As stated earlier, all of the stock coach views (text, date and so forth) support positioning configuration settings.
Responsive coach configuration parameters
Certain controls can be configured for each form factor. Some controls allow you to choose different configuration parameters (the Configuration panel is located under the Positioning panel) for each form factor.
For example, you can show the Date Time Picker control fully expanded (inline mode) for the large form factor:
Figure 7: Date Time Picker control on a large form factor
And, you can show the Date Time Picker control fully collapsed (on click mode) for the medium form factor:
Figure 8: Date Time Picker control on a medium form factor
The stock controls are usable only on browsers and tablets, but not on smartphones. The stock controls in version 8.5.5 are responsive and supported on desktop or notebook browsers and the iPad Safari browser, but they are not currently supported on smartphones.
A new set of coach views has been released as a technology preview. They are known as the “Lite Controls.” Eventually, they should be delivered in IBM BPM.
The key benefits are:
- Non-Dojo lightweight coach views targeted to deliver a more responsive experience on mobile devices
- Optimization to run on mobile networks (with a minimal number of network requests and minimized size of data transferred over network to optimize bandwidth usage)
- Testing and support for mobile form factors
- Accelerated development of client-ready mobile experiences
- No overhead for rarely used capabilities like non-Gregorian calendar
- Input controls that look native to the device
The lite controls toolkit can be found on the BPM wiki. Please note that this link will take you to the login screen for the IBM BPM Community wiki. If you do not have an account for the IBM BPM Community, you can sign up for one from there. Here is the mission statement for the IBM BPM Community:
Since 2006, this community site has provided a vital resource of practitioner-developed content to help organizations of all sizes make the most out of their investment in process innovation. Become a member now (it's free) and get started.
The IBM BPM Community site is by the people, for the people. The more you put in, the more you get out. Member contributions are highly valued, and we want your contributions! Watch spaces and sign up for the daily digest to follow activities.
Have you tried designing responsive coaches in IBM BPM? Share your experiences or ask a question below, or continue the conversation with me on Twitter @orcline.