{"id":1261,"date":"2014-10-05T05:40:06","date_gmt":"2014-10-05T11:40:06","guid":{"rendered":"http:\/\/garysamuelson.com\/blog\/?p=1261"},"modified":"2018-05-28T09:42:29","modified_gmt":"2018-05-28T15:42:29","slug":"single-page-and-rich-internet-applications-for-bpm-systems","status":"publish","type":"post","link":"http:\/\/garysamuelson.com\/blog\/?p=1261","title":{"rendered":"Mapping Web-UI to BPM"},"content":{"rendered":"

Forward:<\/em><\/h3>\n

Building rich internet or single page user interfaces for BPM applications isn’t trivial. Development teams representing the various domains (UI, BPM, SOA) have broadly differing needs in terms of requirements, approach, and methodology. For instance, contemporary web technologies and drivers necessitate extreme agility while, on the other hand, BPM and SOA projects enjoy the support of formalized practice.<\/p>\n

This disparity among development teams typically leads to project delays due to poor alignment between web-UI, data bindings, and service dependencies.<\/p>\n

In this article I’ll attempt an explanation and work-around for this common problem associated with BPM projects.<\/p>\n

 <\/p>\n

Relationship between Task and Form<\/h2>\n

In process-centric BPM applications the relationship between user-interface (UI or form) and process-task is simple. Each task has its own form.\u00a0 This one-to-one correspondence clears the way for a reasonable, step-wise process execution model.<\/p>\n

User-interaction is fully contained within the boundaries of BPMN’s represented process. And, human-task relationships within the process are clearly defined and aligned towards overall value as expressed within the process definition.<\/p>\n

The problem though with this approach is that a fully detailed process-centric model, having expressed all necessary user operations as tasks, contains too much information. The relevant importance of the model itself becomes obscured behind task inflation. In-other-words, we can’t see the forest for the trees.<\/p>\n

\"form_task_relationship\"<\/a><\/p>\n

 <\/p>\n

User Interaction versus Process Definition<\/h2>\n

Users want a rich internet application – the type typically represented by the new\u00a0single page application (SPA) pattern of interface design. These contemporary web applications offer both increased productivity and efficiency. However this approach leaves process design at a loss given the difficulty of relating user activity, associated with rich internet applications, to their corresponding process tasks.<\/p>\n

Two views now come into conflict. The user-centric<\/strong> approach necessitates a modern web-UI and, in the other corner, the process-centric<\/strong> view requiring correspondence between user effort and task.<\/p>\n

\"user_interface_and_process_pattern\"<\/a><\/p>\n

 <\/p>\n

Mapping User Interaction<\/h2>\n

Attempting to satisfy both end-users and process specialists requires a reasonable attempt at unification under the BPM flag. In-other-words, everything should be modeled.<\/p>\n

In keeping with the spirit of BPM being a language for business, as apposed to wholly owned by software architects, user interaction is more often captured as a BPM microflow. So we now have a new task oriented,\u00a0 human-service flow representing user effort during task execution.<\/p>\n

In my example (below), tasks 1 through 3 are migrated into a web-UI microflow. This microflow, or human service flow (depending on terminology), illustrates human interaction between Web-UI and underlying process. The process is then relegated to managing a single work item showing an abstracted representation of tasks 1 through 3.<\/p>\n

\"Mapping<\/a><\/p>\n

 <\/p>\n

An Impractical Middle-tier Control Mapping Pattern<\/h2>\n

Modeling user interaction is traditionally accomplished through UML diagrams expressing, in object-oriented terms, state transitions relating user initiated events to their corresponding system representations (with reciprocal relationships given HTML5 ‘push’ technology).<\/p>\n

The problem with detailed, web-UI interaction modeling is that it’s just not practical anymore given the rate of churn on this type of development effort.<\/p>\n

Web-UI is constantly changing. Any attempt at keeping these types of models current, past initial analysis phase, yields… at best diminishing returns. In-other-words, there is no life-cycle for user-centric microflows. Though detailed microflow analysis has its role during early UI design, it should frozen and retired after after its representing web-UI construction is well under way.<\/p>\n

\"Web-UI<\/a><\/p>\n

 <\/p>\n

Serialized Effort Isn’t Efficiency<\/h2>\n

There is no process or task flow in modern web applications. Instead, there are objectives which are loosely translated into web<\/strong><\/em>–<\/strong>application features. This being a key shift in our perspective of web-UI as it is no longer a direct extension of process<\/strong> but instead a means by which the user achieves their goals set forth by assigned process tasks.<\/p>\n

The modern web-UI now stands out on its own. And, as an application isn’t necessarily held back by process-centric design constraints. This explains the misplaced effort behind the middle-tier control mapping pattern described above. The web-UI,\u00a0given its new role as an application, and no longer relegated the sole responsibility of user-task execution, takes on greater responsibilities. Naturally extending this line of reasoning we drive scope and requirements, initially contained under single purpose user-tasks, towards those reserved for fully formed applications.<\/p>\n

\"Unconstrained<\/a><\/p>\n

 <\/p>\n

Further Study<\/h2>\n

In my next article we take a look at employing the service bus pattern as a solution for bringing Web and BPM applications together under a united event driven architecture.<\/p>\n

 <\/p>\n

 <\/p>\n","protected":false},"excerpt":{"rendered":"

Forward: Building rich internet or single page user interfaces for BPM applications isn’t trivial. Development teams representing the various domains (UI, BPM, SOA) have broadly differing needs in terms of requirements, approach, and methodology. For Read more…<\/a><\/p>\n","protected":false},"author":1,"featured_media":1301,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[16,11],"tags":[],"class_list":["post-1261","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-business-process-management-integration","category-bpm-methodology"],"_links":{"self":[{"href":"http:\/\/garysamuelson.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/1261","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/garysamuelson.com\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/garysamuelson.com\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/garysamuelson.com\/blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/garysamuelson.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1261"}],"version-history":[{"count":45,"href":"http:\/\/garysamuelson.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/1261\/revisions"}],"predecessor-version":[{"id":1321,"href":"http:\/\/garysamuelson.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/1261\/revisions\/1321"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/garysamuelson.com\/blog\/index.php?rest_route=\/wp\/v2\/media\/1301"}],"wp:attachment":[{"href":"http:\/\/garysamuelson.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1261"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/garysamuelson.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1261"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/garysamuelson.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1261"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}