This is the fourth blog in a sequence of several about the Composite Application Framework (CAF). Please also take a look into the first What is the Composite Application Framework?, second CAF II - Which Tools Does SAP Provide? and third blog mario.herger/blog/2004/01/26/caf-iii--business-object-modeler-agrave-la-carte.
Let's start working - but do we have to spend thoughts on how to change the data or create a new record? Does somebody have to tell us how we add line-items? Probably not, because we used the same type of screen-patterns already with other data.
This screenshot shows 2 different objects: Idea and Concept (which are used for the xApp xPD - Product Definition, where ideas for new products or improvements are collected and merged into concepts). Both objects need editing-functionality, although slightly different, as they have different attributes and properties. In the screenshot we do not only see different attributes and a differing number of fields, but also has Concept 4 tabstrips in comparison to 2 for Idea. So with a flexible pattern also additional patterns, frestyle WebDynpros and applications can be added.
Before starting to create two distinct freestyle-WebDynpros, probably by two different developers and, even worse, with 2 different types of navigational behaviour and usability, use a configurable ObjectEditor pattern. The configuration of this pattern requires the object, attributes to display, additional patterns or applications to integrate, navigation-definition and the order and arrangement of all those elements on the screen. The configuration itself is done through one or more configuration screens and no coding is necessary. Any number of configuration can be stored and used. Reusing patterns accelerates development.
The following screenshot shows the configuration screen (in the bottom right corner) and the display screen for the Object Selector pattern. The configuration can be stored and the pattern can be launched with it:
Those patterns already cover a huge percentage of typical screens. One advantage of reusing them is that users will get a similar look & feel for similar activities throughout an application. If they know one editor-screen, they know all. And this reduces training costs. Patterns of course can also be created by partners and customers, WebDynpro contains all tools to enable developers to do that.
Interested in more stuff about user interface design? Then visit the a little bit outdated but not less interesting and valid Interface Hall of Shame and enjoy (working with that kind of software is sad enough).
Introduction
Work on the presentation layer is probably the part with the highest fun-factor for a developer. Unfortunately it's also the layer which brings the most pain for a user, being the layer which he interacts with. And also the layer where everybody thinks of exactly knowing how the UI shall look like, or better: shall not look like.The Dishes - from a hungry Client's Perspective
After we (the hungry guest) ordered our menu, we are waiting keenly for what is going to come and how it will taste. And while waiting we enjoy nice china and silverware, the decoration on the table and glasses and the overall atmosphere of this nice restaurant. The entrée (we remember: filet mignon) then positively surprises us with being served not just being "a steak on the plate", but being decorated with herb-butter formed as little flower on the tasty-looking filet mignon, the red wine sauce not drowning the filet but nicely forming a little lake with herbs in it and the rice in form of a star. If it tastes as good as it looks, what else can we wish for? Let's start eating - but do we have to spend thoughts of how to use the fork and knife (or chopsticks, if you are from Asia) ? Does somebody have to tell us how we drink the wine out of the glass (let's assume that nobody starts suggesting to drink wine with a straw) ? Probably not, because we know how to use those tools, we used them already on many other occasions, even if our dishes were different.The Dishes - from a computer User's Perspective
Let's translate the example above with our already familiar translation tool "xApp-fish" from restaurant-speak to user-interface-layer-speak: After we (the user hungry for more work) clicked the button to change some data in an editor-application, we are waiting keenly for what is going to come. We don't have to wait long with the NetWeaver and WebDynpro, the screen builds up very fast (yes: it's *SAP*-software). What we see is a very tidy screen with the elements and controls on easy to find places. The data itself is presented clearly and not just "plain", but enriched with usefull functionality like navigational links, editing and filtering.Let's start working - but do we have to spend thoughts on how to change the data or create a new record? Does somebody have to tell us how we add line-items? Probably not, because we used the same type of screen-patterns already with other data.
The Technology
The User Interface technology that the Composite Application Framework (CAF) is using is WebDynpro. WebDynpro is, like the other layers of CAF, model-driven and metadata-based. The clear separation between model, view and controller simplifies changes. Furthermore WebDynpro allows to build freestyle screens and patterns. Freestyle on the one hand allows to build any screen as you like it or your specific application require. Patterns on the other hand are recommend, if for different objects similar activities have to be performed. Editing data of an object, searching for data, adding attachments to an object and so on, are such activites, which the majority of objects might require. Take a look at the animated screenshot:This screenshot shows 2 different objects: Idea and Concept (which are used for the xApp xPD - Product Definition, where ideas for new products or improvements are collected and merged into concepts). Both objects need editing-functionality, although slightly different, as they have different attributes and properties. In the screenshot we do not only see different attributes and a differing number of fields, but also has Concept 4 tabstrips in comparison to 2 for Idea. So with a flexible pattern also additional patterns, frestyle WebDynpros and applications can be added.
Before starting to create two distinct freestyle-WebDynpros, probably by two different developers and, even worse, with 2 different types of navigational behaviour and usability, use a configurable ObjectEditor pattern. The configuration of this pattern requires the object, attributes to display, additional patterns or applications to integrate, navigation-definition and the order and arrangement of all those elements on the screen. The configuration itself is done through one or more configuration screens and no coding is necessary. Any number of configuration can be stored and used. Reusing patterns accelerates development.
The Patterns
SAP will deliver with the CAF a set of predefined patterns. Some of them are Attachments (for adding attachments to an object and storing it in Knowledge Management), KM File Select (for selecting a file from KM), Classification (for classifying records of an object), DashBoard (for displaying data in a table-control in different ways), ObjectEditor (for editing the records), Object Selector (for displaying and selecting records), SearchBar (for entering the selection criteria), User Assignment (for assigning users) and more and more patterns will be added.The following screenshot shows the configuration screen (in the bottom right corner) and the display screen for the Object Selector pattern. The configuration can be stored and the pattern can be launched with it:
Those patterns already cover a huge percentage of typical screens. One advantage of reusing them is that users will get a similar look & feel for similar activities throughout an application. If they know one editor-screen, they know all. And this reduces training costs. Patterns of course can also be created by partners and customers, WebDynpro contains all tools to enable developers to do that.
Conclusion
See using patterns as a developers responsibility to let a user feel comfortable with using your software and making appetite for more. The software might be as advanced and ground-breaking, but showing this complexity to the user and letting them feel "stupid", doesn't make them your advocates. Or would you eat something really disgustingly looking, although the chef tells you how fine the ingredients were and how much time was spent on preparing it right to the point?Interested in more stuff about user interface design? Then visit the a little bit outdated but not less interesting and valid Interface Hall of Shame and enjoy (working with that kind of software is sad enough).