WebML and WebRatio - Business process modeling (BPM) and web application modeling

WebML Designing data-, service- and process-intensive applications with WebML EMN, Nantes, May 12, 2010 Marco Brambilla Politecnico di Milano and Web Models Srl http://www.slideshare.net/mbrambil http://home.dei.polimi.it/mbrambil http://twitter.com/MarcoBrambi

Agenda  WebML models and concepts  WebML development process  Advanced topics: Web services, BPM, Ajax  WebRatio 6 BPM  Industrial cases marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 2 WebML

WebML WebML models and concepts Marco Brambilla Politecnico di Milano and Web Models Srl

Perceived Needs 1: lack of model-driven development  Data-intensive Web site design today is founded on methodologies stolen from different sectors (DB, software eng., …)  Lack of model-driven support of data-intensive Web Sites • Navigation equal to database structure • Lot of hand-written code  Big efforts are requested even for prototyping marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 4 WebML

Perceived Needs 2: increase of sites complexity  Some factors increase complexity of modern Web sites: • Multi-device output (PC, PDA, WAP phones, 3rd gen phones, Digital TV, videotext) • One-to-one delivery (myYahoo, myCDNOW,…)  These requirements impact on cost of: • site development • site evolution marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 5 WebML

Perceived Needs 3: shortage of IT & art personnel  Need to rise the level of abstraction  Available skills can address analysis and high-level design instead of huge time-wasting manual coding of ASP pages  IT technicians can focus on optimization and performance analysis  Art people can focus on “creation” marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 6 WebML

Advantages of Modeling approach A rigorous modeling approach:  Can reduce development efforts (cost and time)  Allows a more structured development process  Produces more usable and coherent final results  Design models are self-documenting and always up-to-date projects Immediate prototyping can be achieved marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 7 WebML

Requirements for Web modeling  Expressiveness • Real-life cases should be expressible • Frequently used design patterns should be captured  Ease of use • Intuitive notation • Clear semantics • Consistency checks  Implementability • Efficient mapping to physical data structures • Flexible code generation from behavioral specifications marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 8 WebML

WebML purpose  WebML aims at providing a structured approach to the design of Data-intensive Web sites  A set of integrated Models should help designers in high- quality Web sites production  All the facets of Web design should be addressed  Use of old or uncoherent methodologies becomes deprecated marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 9 WebML

Target of WebML  Target: data intensive Web sites • large amount of data • interfaces directed to general public  exploratory  browsing-oriented  personalized (1 to 1) • volatile content, structure, navigation, presentation  WebML is not the right approach for: • Small Web sites (Homepages, …) • Static Web sites marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 10 WebML

The WebML models  WebML: a conceptual language for high-level design of data- intensive web sites  Models: • Content: data organization • Derivation: redundant data definition • Composition: definition of site pages as set of subpages and elementary publishing units • Navigation: definition of links between pages and between units • Presentation: positioning of the units in the page and definition of graphical appearance marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 11 WebML

Preview of WebML concepts  Site = Content + Composition + Navigation + Presentation entities, units, pages, site views styles relationships links navigation + content composition user models presentation marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 12 WebML

Structure Model (1)  Q: what are the objects published in the site and how they are related?  A: • Entity: an object type in the application domain • Attribute: scalar property of an entity • Relationship: A connection between entities • IS-A hierarchy: classification and grouping  Compatible with Entity-Relationship and UML class diagrams marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 13 WebML

Structure Model (2)  Simplified Entity-Relationship model • Binary relationships between entities • IS-A hierarchies • Simple typed attributes in entities Author Genre • Derivation model can be applied for redundant data Book BestSeller marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 14 WebML

Relationship cardinality  Relationship Book_Review – book2review minCard: 0 maxCard: N – review2book minCard: 1 maxCard: 1 Book 0..N Review 1..1 It reads: a book may have zero or more reviews, a review deals with one and only one book marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 15 WebML

Cardinality: comment  Cardinality constraints of relationships are important, because • They make the structure schema more readable and expressive • They can influence the design of the phisical structure of the content repository (e.g., the schema of the online database of the site) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 16 WebML

Multi-valued attribute  A multi-value attribute is an attribute for which an object may have a set of values (e.g., a person may have set of addresses)  Multi-valued attributes are represented by means of an entity plus a relationship  Example: a person has a set of addresses Person 1..N Address NOTE: the “address” Value:string entity is a “weak” 1..1 entity, it cannot exist independently of the associated “person” object marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 17 WebML

MODEL Structured attributes  A structured attribute is an attribute with an internal structure (e.g., an address may consist of several fields, like civic number, street, city, province, state, etc..)  Structured attributes are represented by means of an entity plus a relationship  Example: a person has one or more addresses, each address consisting of number, street, city, province, state NOTE: the “address” Person 1..N Address entity is a “weak” 1..1 Number entity, it cannot Street exist independently City of the associated Province State “person” object marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 18 WebML

MODEL Relationship with attributes  A relationship with attributes is a description of a property that refers to a pairs (more generallly to sets) of objects (e.g., the grade taken by a student in a course)  Relationship with attributes are represented by an entity and two (more generally, several) relationships Student 0..N Grade 1..1 Course Value:integer 1..1 0..N NOTE: the “grade” entity is a “weak” entity, it cannot exist independently of the associate objects marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 19 WebML

MODEL N-ary Relationship  A N-ary relationship is a relationship involving more than two entities (N>2)  N-ary relationships are represented by an entity plus N binary relationships  Example: a supplier supplies a part to a department Part 0..N 1..1 Supplier 0..N Supply 1..1 Department 1..1 0..N marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 20 WebML

TECHNIQUES Structure patterns  Structure pattern: typical structure design solution, found very frequently in real Web sites  Patterns can be combined and used together to achieve complete information access marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 21 WebML

Structure Patterns  Network skeleton: Entity3 • Hierarchy skeleton: Entity1 Entity1 Entity2  Star skeleton: Entity2 Entity4 Entity3 Entity3 Entity1 Entity5 Entity2 marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 22 WebML

1. Hierarchy Pattern Category Entity1 SubCat Entity2 E-catalog Product Entity3  A categorization hierarchy  User can browse the hierarchy from top to bottom (and back)  Often used in e-commerce applications marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 23 WebML

2. Star Pattern Entity4 BigImg Entity3 TechData Acme case Entity1 Item Entity5 Warranty Entity2 Style  A main object can be recognized  A set of informative elements are related to the object  User can jump from main object to information pages and back marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 24 WebML

3. Network Pattern Tech-support Entity3 Product Entity1 Solution Entity2 Tech site  A set of elements to be published  All at the same level of importance  Every object has detailed description  User can browse from an object to the related ones marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 25 WebML

Pattern combination  Real web sites are much more complex  Many problems CatA1 Category CatB1 Country can be solved using patterns Hierarchy combined SubCatA1 SubCat SubCatB1 Brand pattern2 together Hierarchy pattern1 Object1 Product Network pattern Object2 Solution Object3 Tech Hierarchy Hierarchy pattern Category2 SolCat TechCat pattern Category3 marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 26 WebML

Derivation Objectives  Derivation is a modelling phase that makes it possible: • To augment the content of an entity by adding attributes, either imported or calculated from related objects. • To define the population of entities or of relationships, based on some property of the involved objects. marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 27 WebML

WebML OCL  Derivation consist of writing expressions called “derivation queries”  Queries can be expressed using WebML OCL  Derivable concepts: • Entities, relationships, attributes  Derivation queries can be automatically transformed into SQl views installed in the database marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 28 WebML

Derived entities  Sub-Entities population in ISA hierarchies can be specified by means of OQL queries  “A free slot is a slot having 0 reservations”  WebML OQL: “SuperEntity where count(reservation)=0” slot ISA freeSlot marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 29 WebML

Derived attributes  Attributes of an entity can be derived by associating to them a query.  Four types of derived attributes: • Constant attribute: affiliation: “Politecnico di Milano” • Imported attributes: maritalName: Self.husband.lastname • Aggregate attributes: reservation#: count(Self.reservation) • Calculated attributes: lastPrice: Self.price*discount  The Self keyword identifies the current entity in which the attribute is defined marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 30 WebML

Imported attribute  Import a piece of external information into an entity male female husband lastname maritalName marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 31 WebML

Calculated attributes  Total price of order as sum of price of order lines OL Order OL2Order price, qty  Derivation rules: OL.TotalPrice = Self.Price * Self.Quantity Order.TotalPrice = Sum (Self.Order2OL.TotalPrice) Order.NumLines = Count (Self.Order2OL) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 32 WebML

Derived relationships  Relationships can be derived by a WebOQL query in two ways: • by subsetting and/or concatenating existing relationships • by matching pairs of objects by means of a condition  Variable Self denotes the instance of the source entity of the relationship marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 33 WebML

Derived relationships: subsetting  Subsetting existing relationships: Artist2RecentAlbum Artist Album Artist2Album marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 34 WebML

Derived relationships: concatenation  Concatenating existing relationship: Album Artist CompilationArtist SongAlbum Song SongArtist marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 35 WebML

Derived relationships: matching pairs  User2Favorites relates User to all the Articles whose category appears in the set of the preferred categories in the user profile. User2Favorites User Article User2Article User2Preference Category marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 36 WebML

Hypertext Model • Q1: what information is published in the hypertext nodes? • Q2: how are the hypertext nodes connected? • Q3: how is the hypertext divided into pages served to the user? • A1: content units (Composition) • A2: links (Navigation) • A3: pages (Composition) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 37 WebML

Composition: examples of Content Units DATAUNIT To publish information about A SINGLE object (e.g. AuthorDetail) content INDEXUNIT To publish a list of objects (e.g. IndexOfAuthors) content marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 38 WebML

Composition: examples of Unit rendering DATAUNIT Author first name:XXX last name:YYY photo: Author INDEXUNIT Index of Authors •S. Ceri •P. Fraternali •O.Versand Author marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 39 WebML

Hypertext Model: questions •Q1: what is the experience of the site that the user can achieve? •Q2: how is the hypertext divided into pages served to users? •Q3: what information is published in the hypertext nodes? •Q4: how are the hypertext nodes connected? •A1: siteviews •A2: pages •A3: content units •A4: links marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 40 WebML

Basic Content Units DATAUNIT INDEXUNIT MULTIDATAUNIT Content: • instances of an entity Selector: • set of conditions entity entity entity [Selector] [Selector] [Selector] ENTRYUNIT SCROLLERUNIT MULTICHOICE HIERARCHICAL entity entity entity [Selector] [Selector] [Selector] marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 41 WebML

Meaning of Content Units DATAUNIT INDEXUNIT MULTIDATAUNIT Author Index of Authors All Authors first name:XXX last name:YYY •S. Ceri photo: •P. Fraternali •O.Versand ENTRYUNIT SCROLLERUNIT MULTICHOICE HIERARCHICAL Insert Your Data Browse Authors Choose Authors Books&Authors 1. Web Applicat. •Fname 5/12: go to 1/12 Ceri Ceri •Lname Fraternali Fraternali    Versand 2. Systems Tannenbaum marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 42 WebML

Content Units  A WebML unit is the atomic information publishing element unitX container  It is a “view” defined upon a container of objects: • All the instances of an entity • Instances of an Entity that meet a selection condition called selector marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 43 WebML

Unit input and output IN unitX OUT entity [selector (par 1, .., parN)]  A unit may need some “context” to be computed  Each unit exposes input and output parameters  Input is required to compute the unit itself • Parameters pre-defined for the unit + • Other parameters required by the selector of the unit  Output can be used to compute other unit(s) depending on the current unit marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 44 WebML

Navigation: contextual links source unit target unit Author Author • A contextual link is an oriented connection between two units (source unit and target unit), normally rendered by means of anchors or submit buttons • Purpose of a contextual link: • Allowing the user to move from one place to another • Transporting information from one place to another • Activating a computation (side effect) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 45 WebML

Example of links Which author’s books? Which book? p1 p2 p3 Author Book Book [OID=p1] [author2book(p2)] [OID=p3] Author Books of YYY Book first name:James Title:Ulysses last name:Joyce •Ulysses Price:23$ photo: •The Dubliners Cover: •Portrait... marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 46 WebML

Link Parameters param Book Author [Author2Book(param)] • Context is transported through links using link parameters • A link parameter is defined by: • Name • Source: one of the output parameters of the source unit • Target: one of the input parameters of the target unit marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 47 WebML

Default Link Parameters • Whenever possible, link parameters are inferred from the diagram and need not be explicitly specified • Diagrams become simpler and more readable •Example: Book Author [Author2Book] marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 48 WebML

Defaults for selectors • Whenever possible, selectors and their parameters are inferred from the diagram and need not be explicitly specified • Example: Author Book Book [author2book] marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 49 WebML

Automatic Links source unit A target unit Author Author • An automatic link passes some default context to the destination unit immediately after the display of the source unit, without the user intervention • Subsequently, the user can change the passed context by choosing a different object, using the anchor(s) representing the link marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 50 WebML

Transport Links source unit target unit Book Author [Author2Book] • A transport link has a default context that is passed to the target unit immediately after the display of the source unit, without the user intervention • The user cannot change the default context and therefore the link is not rendered with an anchor marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 51 WebML

Examples  No input links and no selector: wrong unit! p1 EntityB Input parameter: OID A.oid B.oid of a connected object: the related object is shown EntityB [Relationship(A2B)] Input parameter: param1 B.oid value to be used in the selector: the matching object is EntityB [B.attr = param1] shown marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 52 WebML

Examples  No input links: all objects selOID shown (B) EntityB Input parameter: OID of the source object of sourceOID selOID the relationship role, (A) (B) all related object are EntityB shown [Relationship(A2B)] Input parameter: Param1 selOID value to be compared (B) with the attribute, matching objects EntityB marco.brambilla@polimi.it shown [B.attr = Param1] http://home.dei.polimi.it/mbrambil 53 WebML

MultiDataUnit params {OIDs} Entity [Selector(params)] • Multidata units • Present multiple instances of an entity (SET OF OBJECTS) • The container is an entity with (optional) selector • Input parameters requested for the computation of the selector: • Values for attribute comparisons • OID of participants to relationships • Output parameter: • The set of OIDs of the published objects marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 54 WebML

MultiData vs. Index  MultiData or Indexes? • Indexes can be used as access mechanism to shown detailed information about one object • Multidata Units publish information about many objects at time  The difference is in the output parameter: • Indexes output the OID of one selected object • Multidata units output the OIDs of all the displayed objects marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 55 WebML

Entry Unit  Unit for describing input forms that allow information submission by the user  Content is shipped to other units via outgoing links (normally one), using link parameters  Typically translated into HTML using the <form> tag and the associated submit button params marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 56 WebML

Entry Fields and Selection Fields  Entry units contains two types of widgets for data entry: • Fields to insert new value • Selection fields to select a value from a list  Fields have properties: • Preloading (of an existing value in the field) • Modifiability (Y/N) • Visibility (hidden/shown) • Data type (string, integer, text, etc..) • Input validation rules marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 57 WebML

Preloaded Fields  A field can be preloaded with value(s) • Field slots allow the concatenation of multiple values in the same field • Slots can contain dynamic values taken from the database or static values defined in the model FirstName PF.S1 LastName PF.S2 EntryUnit NickName PF.S3 PersonField S1 S2 S3 AddrField Artist  Selection fields need to be preloaded with a set of instances (possibly with multiple slots per instance) Resulting field anPersonField them Springsteen “the boss”  The user chooses instance among Bruce marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 58 WebML

Multichoice Unit  Multichoice units: • Publish indexes of elements (SET OF OBJECTS) among which the user to select one or more elements (with checkboxes)  The container is an Entity (with optional selector & pre-selector) • Input parameters:  Those requested for the computation of the selectors (values for attribute comparisons and OID of participants to relationships) • Output parameters:  OIDs of the objects checked by the user  Preselector: allows one to define a sub-set of elements as pre-checked (before any user interaction) params {selOIDs} Entity [Selector(params)] [Preselector(params)] marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 59 WebML

Examples  No input links: all objects shown, no pre-checked elements {selOIDs} Atzeni (B) Ceri Fraternali Versand EntityB sourceOID Atzeni {selOIDs} Pre-selector: all objects (A) Ceri (B) shown, pre-checked Fraternali Versand elements related to A EntityB [PRE:Relationship(A2B)] sourceOID Ceri Selector: only elements (A) {selOIDs} (B) Fraternali related to A shown, no pre-checked elements EntityB marco.brambilla@polimi.it [Relationship(A2B)] http://home.dei.polimi.it/mbrambil 60 WebML

Hierarchical Unit  Hierarchical units: • Publish an index of elements, with entries organized hierarchically using entities connected by relationships • Allow the user to select one element from any level of the hierarchy  The container is a set of entities and connecting relationships (with optianl selectors at all levels) • Input param: requested for the computation of the selectors :  Values for attribute comparisons  OID of partecipants to relationships • Output parameter: OID of the object selected by the user params {selOIDs} { Entity (Relationship) [Selector]} marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 61 WebML

Hierarchical Unit outgoing links  Each link is rendered as an anchor at the proper level of the hierarchy  The level where the link is placed depends on the type of the link parameter(s) link a •Tables link a Param link b •Kitchen link b EntityA B •Korla KJD54 link c link c •Chairs link a EntityA EntityB •Stools link b Category •Roy LKR34 link c [selector1] SubCategory •OddVar JSQ87 link c EntityB (A2B) (Cat2SubCat) EntityC •Office link b [selector2] Product •Jess RLT45 link c EntityC (B2C) (SubCat2Prod) [selector3] marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 62 WebML

ScrollerUnit Scroller units:  Add browsing capabilities to a set of objects • Publish links to the first, previous, next, last object of the set • Used in conjunction with data, index and multidata units • Number of scrolled objects = block factor • Input: values for attribute comparisons, OID of participants to a relationship • Output: the set of OIDs (possibly 1) of the current block of objects  Always placed in the same page as another content unit that publish the current (block of) object(s) params {selOIDs} Entity [Selector(params)] marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 63 WebML

Scroller + data unit  The entity is the same for the scroller and the data unit  It is possible to access the data unit also from another page and the scroller is automatically syncronized Artist Artist marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 64 WebML

Scroller + index  Paging the result of a search t,y Album Album [Title contains t] [Year > y] marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 65 WebML

Pages  A page is a container of one or more pieces of information shown to the user at the same time  Nesting of pages is allowed: a page can have sub-pages  The user navigates a site made of pages Book Index Login Catalog marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 66 WebML

Non contextual links  A non contextual link is a link between pages  No context (information) is transported HomePage Book Index  The user can browse from a page to another one via an anchor (e.g., >>Books) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 67 WebML

Home Page  The Home Page is the main page of a site  It is the first page of the site that the user should see  Each siteview must contain a page marked as “Home” HomePage H Book Index marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 68 WebML

Landmark pages  Landmark pages: globally visible pages. The user can jump to them from everywhere in the site view  It is equivalent to a non contextual link implicitly defined from every other page in the site view to the landmark page Books Store Page Books Store Page L Authors Book Details Authors Book Details marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 69 WebML

Areas  An area is a set of logically homogeneous pages  Examples of areas: • Sections of a portal: Sport, Music, Technology, … • Elements of a data-management system: Products management, News management, …  Areas can be nested, so that sub-areas can be defined inside areas  Each area should have a DEFAULT PAGE or a DEFAULT SUB- AREA, to give a meaning to landmark areas and non- contextual links pointing to areas Area marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 70 WebML

Site Views  A siteview is a set of pages and/or areas forming a coherent view of the site  Multiple site views can be defined on the same data model  Different site views can be published for different types of users and for different types of output devices  Site views can be • Public: everyone can enter • Private: access control with password protection is enforced marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 71 WebML

Acme site view modeling  Two site views on the same data model • Customer: public, for customers • Admin: private, for the administrators and content managers marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 72 WebML

Acme customer site view  Purpose: define the customer experience of the site  Structure: • Two main areas: products and combinations • Other landmark pages: home, stores Customer Product area Combination area L L Home Page Store Page H,L L marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 73 WebML

ACME page modeling  Q: what “main” pages do I need in the site?  Home, Products, Combinations, Stores Product area Combination area AcmeHome H Stores Products Combinations L L L L Q: what other pages do I need? Product detail, Combination detail, ByPrice, BigImages,.. Combination By price Product Detail Page BigImages marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 74 WebML

ACME: HomePage marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 75 WebML

ACME product page marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 76 WebML

ACME combination page marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 77 WebML

Navigation Model: Links AuthorID is transported entity: Book author [ author2book ] • Semantics of a link: 1. Moving from one place to another 2. Transporting information from one place to another (navigation context) 3. Activating a computation (side effect) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 78 WebML

Composition: Pages A Page is a structured container of units and links • Possibly structured in and/or sub-pages • Abstraction of screen, frame, card, deck... • Permits one to cluster related information for more efficient communication E.g.: The index of authors and the selected author are shown together in the same page Author Author marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 79 WebML

Types of links  Contextual links • Between units • Context transported  Non-contextual links • Between pages • No context transported Voyages Books marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 80 WebML

Integrating backend business logic  Example of web sites using back-end/remote services: • Reservation Web site: create a reservation, undo a reservation, overwrite a reservation.. • Other examples: content management, e-commerce trolley management, update of personal profile ..  How can we model the invocation of back end operations, e.g., the update of content by the user?  Response: • Embedding operation calls into the hypertext marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 81 WebML

Operation Unit  Models a generic external operation, or a built-in content manipulation operation  Input from one or more incoming links (at least one is declared as normal link, the others as transport links)  Two kinds of output links • OK link if the operation completes correctly • KO link if the operation fails  The predefined WebML units can be enriched by adding custom external operations (e.g. SendMail, …) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 82 WebML

Built-in Operations  WebML predefines a set of frequently used built-in operations to manage a site’s content  They are the traditional database operations: create, delete, modify, create relationship, delete relationship  Users do not need to define the behaviour and the implementation; they are provided off-the-shelf in the model marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 83 WebML

Built-in Operations CREATE DELETE MODIFY Create Unit Delete Unit Modify Unit Entity Entity Entity CONNECT DISCONNECT Connect Unit Disconnect Unit relationship relationship marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 84 WebML

In/out flows value1 attribute1 KO Nothing Create Unit OK OID of the new object value2 attribute2 Entity Identifier(s) of the value1 attribute2 object(s) to modify Value2 attribute1 KO Modify Unit OK Identifier(s) of the modified object(s) OIDs of objects to modify Entity marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 85 WebML

In/out flow: delete KO OIDs of the object(s) to delete OIDs of the Delete Unit object(s) to delete OK Nothing Entity Albums DeletionError Example: AlbumIndex DeleteAlbum NotDeleted KO OK Album Album Album OK Albums DeletionError Albums DELETE ALBUMS NOT DELETED DELETE ALBUMS All the way All the way Let's talk... Anthology 1999 1997 Anthology KO Bridges to Babylon Born in the USA Bridges to Babylon Imagine Imagine Sing-a-long Let's talk ... 1998 Del Del Sing-a-long marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 86 WebML

In/out flow: connect  Note: if the any of the input parameters is a set of OIDs, the operation is applied to each element of the set  The disconnect operation is similar OIDs of Identifiers of the source object(s) objects to connect KO to connect Connect Unit OK Identifiers of the OIDs of connected objects destination object(s) relationship to connect role marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 87 WebML

Example ReviewPage Result Rev : Rev iew.OID ArtistDetails NewReview KO OK Rev : OID AssignReview Art: Artist.OID Artist Rev iew Rev : Rev iew.OID [OID = Art] Art:OID AllArtists ReviewDetails ArtistToRev iew [Artist.OID = Art ] [Rev iew.OID = Rev ] Artist Rev iew [OID=Rev ] KO Rev iew Page Result NEW REVIEW ARTISTS ARTIST REVIEW One of the most Select an artist to romantic and assign the review: First name: Review : expressive artists Celine One of the m ost ° Beatles OK rom antic and of the nineties. Last name: expressive artists * Dion Dion of the nineties. ° Prince marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 88 WebML

Example/2 Artist&AlbumsPage ArtistDetails KO OK Album Disconnect Artist PublishedAlbums AlbumDetails AlbumToArtist Album Album [ArtistToAlbum] KO Artist&Albums Artist&Albums Artist&Albums Celine Dion Celine Dion Celine Dion ALBUMS ALBUMS DETAILS ALBUMS Sing-a-long ° All the way ° All the way OK ° All the way 1999 ° Let's talk... ° Let's talk... ° Let's talk... ° Sing-a-long * Sing-a-long ° These are... ° These are... ° These are... Press OK OK to remove marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 89 WebML

Siteviews  A Siteview is a set of pages that the user can experience as a whole Web site  Different site views can be defined for different devices and different groups of users  Thus, access control and multi-devices delivery is achieved marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 90 WebML

Using global information  It is often necessary to: • Set a parameter value (e.g. the country or language preferred by a user) • Use this value globally in all the pages the site view, without carrying it explicitly along links  Solution • Use global parameters stored in the session • Provide means for setting/getting their value marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 91 WebML

Context Parameters  WebML Context Parameters allow to achieve this goal in a simple way  Designer defines one or more Context parameters.  A context parameter is defined by: • Name • ID • Duration (User session or Application) • Value type: can be either:  A Printable value (integer, string, …)  An Entity (thus, the parameter can assume an OID value of that entity) • Starting value [optional] marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 92 WebML

Set unit  Unit that allows to SET the value of a parameter Value/OID ParamName  It is always placed outside a Page  It has only an incoming link (carrying the value to be assigned to the parameter)  It has not outgoing links marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 93 WebML

Get unit  Unit that allows to RETRIEVE the value of a parameter Value/OID ParamName  It is always placed inside a Page  It has only an outgoing link (carrying the value retrieved from the parameter)  It has not incoming links  The retrieved value can be used in any compatible unit marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 94 WebML

Example SetCountry GetCountry NewsPage[L] CountryData CurrCountry CurrCountry CountrySelectionPage [L] ProductPage [L] CountryIndex CountryData CountryData Country LocalNews Country Country Country LocalProducts News [Country2News] Product [Country2Product] marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 95 WebML

Personalization and access control  In reserved Web sites commitment wants: • One or more public pages readable from anyone • A set of private page accessed only after login, which contains personal content and personal services • Personalization in terms of delivered pages (which pages user can access) and delivered content (which content user needs/can see) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 96 WebML

Personalization  Personalization has three facets: • Access control: login/logout operations for user recognition • Site view assignement: based on the group a user belong, some site views are accessible (1 or more site view per Group) • Page personalization: user or group dependent content marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 97 WebML

User / Group metaphor  Each User can belong to one or more Groups (predefined entities in the structural model)  Each user has one default Group  Each Group can contain one or more User and can be the default Group for many Users User 1:N 1:N Group user2group 1:1 1:N user2defaultGroup marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 98 WebML

User / Group model  Each User can belong to one or more Groups (predefined entities in the structural model)  Each user has one default Group  Each group has one associated Siteview User 1:N 1:N Group user2group 1:1 1:N 1:1 user2defaultGroup 1:N Module marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 99 WebML

Anonymous access  One group is predefined (everyone)  Users belonging to this group need not login, but access only unprotected site views, which has unprotected content (the “everyone” site views)  Other site views can be accessed only after login (secured site views) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 100 WebML

Login/ Logout  A site-view may contain a page allowing users to login Entry Unit Login  Each secured site-view should allow users to logout Logout  Dynamic Role Changing (i.e. group) allowed ChangeGroup marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 101 WebML

Login for multi-role users  If a user belongs to more than one group, at login time he is considered as member of his defaultGroup Username johnlee Password *********** User: johnlee Group: johnleeDefaultGroup Login  Thus, once the user is logged, the current values of User and Group are always identified marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 102 WebML

CurrentUser and CurrentGroup Each WebML project has two predefined global parameters: • CurrentUser: the OID of the currently logged User • CurrentGroup: the OID of the Group of the currently logged user Login and Logout operations automatically set / unset these two parameters marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 103 WebML

Page personalization (user-level) Personalization can be achieved with appropriate data design articles user preference •Hypertext can reflect structure, and thus provide personalization After login CurrentUser is Recommendations identified, thus the index shows user’s preferred CurrentUser user article articles [preference] marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 104 WebML

Trolley management TrolleyPage GetUser CurrentUser TrolleyData OK CurrentUser User Trolley [UserToTrolley] DeleteOrderLine OrderLines to Artist Page Artist:Artist.OID Album:Album.OID to Album Page KO OrderLine OrderLine [TrolleyToOrderLine] NEST Support [OrderLineToSupport] NEST Album [SupportToAlbum] NESTArtist [AlbumToArtist] L marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 105 WebML

Page personalization (User)  Personalization can be achieved as a result of appropriate structure design slot user reservation •Hypertext can reflect structure, and thus provide personalization After login Personal Reservations UserCtxParam is bound to “my” identity, thus the index shows “my” UserCtxParam entity:user rel:reservation reservations marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 106 WebML

Page personalization (Group)  Personalization can be achieved also at group level (because a siteview can serve more groups) Book Author User Group Category interesting Preferred categories Authors GroupCtxPar Group relation:g2c Category relation:c2a marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 107 WebML

Presentation  Presentation dealt with along two lines: • Gallery of default presentation styles applicable to site views or single pages (with elementary unit positioning on a grid)  each presentation style is an XSL stylesheet • Compatibility with best selling tools for presentation editing, for advanced page design marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 108 WebML

WebML WebML development process Marco Brambilla Politecnico di Milano and Web Models Srl

Development process Business Requirements REQUIREMENTS SPECIFICATION DATA DESIGN HYPERTEXT DESIGN ARCHITECTURE DESIGN TESTING & EVALUATION IMPLEMENTATION MAINTAINANCE & EVOLUTION marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 110 WebML

1. Requirements specifications  IN: business requirements  OUT: user-oriented, easy-to-understand, precise specification  Two main sucb-activities: • 1. Requirements collection: general picture of the application domain and of the solution, by interviewing players and reviewing existing documentation • 2. Requirements analysis: revision and formalization of the collected requirements  Output is useful for • Designers: understand what the application must do • Stakeholders: validate the adherence of the specifications to the business requirements marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 111 WebML

1.1. Requirements collection Unstructured activity of information gathering:  Users identification: clustering of users in groups  Functional requirements: identification of the processes that are supported by the application (through use-cases or scenarios)  Data req.: identification of the data that should be managed by the application (core concepts)  Personalization req.: formalization of need of different content and services to different individuals, based on preferences and access rights  Device-specific req.: for multi-device applications  Non-functional req.: usability, performance, availability, scalability, security, mantainability marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 112 WebML

1.1. Non-functional requirements  Usability: ease of use of the application  Performance: efficiency with which the application exploits the available resources, in terms of throughput (the number of requests that can be served per unit of time) and response time  Availability: tolerated frequency of errors and failures  Scalability: ability of increasing the performance of the application in response to the increase of the volume of requests  Security: protection of integrity, confidentiality and privacy of information, authentication of the users, protection of the information flowing between the users and the application  Mantainability: ease of repairing application errors and adapting the Web application to changed or new requirements marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 113 WebML

1.2 Requirement analysis  Revision and formalization of the collected requirements, producing in output a set of semi-formal specifications, typically in terms of: a. Group specification b. Use-case specification c. Data dictionary specification d. Site view specification e. Style guidelines specification f. Acceptance tests specification marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 114 WebML

1.2.a Group specification Clustering of users into groups (formally described) Group Group name: Mar-Com Manager Description: Description: marketing and communication personnel inserting, modifying, and deleting mkt materials. Groups Profile data: First name, last name, email, office address. Hierarchy: Profile data are provided explicitly by the user. Super-group: Corporate. Corporate Sub-groups: None. Relevant use “Login”, “Add a news item”, “Modify a news item”, cases: “Delete a news item”, “Add a news category”, “Modify a news category”, “Delete a news category”, Mar-Com Supervisor "Modify profile data". manager Objects - read Product and Product News. mode: Objects - content Product News. mgmt mode: Admin marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 115 WebML

1.2.b Use-case specification Formal description of units of interaction with the application by users of a given group (e.g., thru tables or UML diagrams) 1. Use cases list for a user (use case diagram) Add a news Login Add a news item category Modify a news Modify a news item category Remove a Remove a news item news category Mar-Com Manager marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 116 WebML

1.2.b Use-case specification 2. Single use case specification (table or activity diagram) Title Login of user belonging to multiple groups User Application Server Database Purpose To express how users with more than one role access the functions of the applications. Initial Request Send Form Pre- A user that belongs to multiple groups is registered. For condition each group, the site view serving the requirements of the group members is defined. Input Credentials Accept Credentials Verify Credentials Post- The user successfully logs into the application and condition accesses the site view corresponding to one of his groups. Select Home Page Elaborate Page Workflow The following steps must be performed: Default Home Page List 1.The user receives an input form asking for username Pages Index of Home and password; 2.The user inputs his credentials; 3.If the credentials are correct, the user is Serve Request authenticated, the list of groups the user belongs to is determined, and the list of names and URLs of the home pages of the Receive Homeof such groups is site view Page displayed to user; marco.brambilla@polimi.it chooses one entry from the list, and enters 4.The user http://home.dei.polimi.it/mbrambil view. into the selected site 117 WebML

1.2.c Data dictionary specification  List of the main information objects identified during data requirements collection  Each entry can be specified by: • Name NewsItem • Synonyms Piece of news • Description A corporate or product piece of news • Sample instances TravelMate 610 launched, 20th June 01 • Properties Title, Body, Image, Date, … • Relationships NewsToProduct • Components None • Super-concept None • Sub-concepts Highlighted news marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 118 WebML

1.2.d Site view specification (site map)  IN: list of user groups, list of use cases, data dictionary  OUT: list of needed site views, specified by: • Name • Description • Target User Groups • Implemented use cases • Site view map: a table illustrating the different areas that compose the site view. Each area is specified by:  Area Name  Area Description  Accessed/Managed Objects  Priority level marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 119 WebML

Site View News Content Management Description 1.2.d Site view inserting or updating contentexample content management functions, for specification about news categories and Includes the pages through which the Mar-Com Managers will access news items. User Groups Mar-Com Managers Use Cases “Login”, “Add a news category”, “Edit a news category”, “Remove a news category”, “Add a news item”, “Edit a news item”, “Remove a news item”. Site View Map Area Name Area Description Objects Priority News Content In the default page, the user accesses the list of NewsCategory High Management countries for which he is content manager and selects NewsItem a country to administer. In the News Category page, the user accesses the list of news categories for the selected country. Here, the user can perform content management functions over news categories, according to the use cases “Add a news category”, “Edit a news category”, “Remove a news category”. Otherwise, he can select one category, and access the list of the available news items in the selected category. In the News page, the user can perform content management functions over a selected news item according to the use cases “Add a news item”, “Edit a marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil “Remove a news item”. news item”, 120 WebML

1.2.e Style guidelines specification Rules for the presentation of pages:  Specification of standard page grids: rows, columns and cells arrangement  Content positioning specification: banners, logo, menus positioning  Graphical guidelines: rules for graphic items like fonts, colors, borders and margins  Device-specific and browser-specific guidelines  Example: Mock-ups: sample representations of a few typical application pages (for a specific device and rendition language) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 121 WebML

1.2.e Style guidelines specification Page grid: Content positioning: Graphical guidelines: marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 122 WebML

1.2.e Acceptance tests specification Formalization into a plan of acceptance tests of non-functional requirements about: performance availability scalability security maintainability marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 123 WebML

2. Data design  2.1. Core subschema  2.2. Access subschema  2.3. Interconnection subschema  2.4. Personalization subschema marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 124 WebML

2. Data Design  IN: data dictionary, site map, functional requirements, user requirements  OUT: formal Data model (E-R schema)  Data design: • clarifies application requirements • feedbacks hypertext design • can be influenced by pre-existing data schemas (possibly not designed for hypertextual applications)  Two different situations can be faced: • data store does not exist and must be designed together with the Web application • content managed by the Web application already exists (totally or in part) and is managed by some data repository marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 125 WebML

2. Data Design: entities classification (1)  Core objects: • the essential assets managed by the application • form the backbone of the Entity-Relationships schema • may require more than a single entity to be represented (due to complex properties and components) • core sub-schemas are sets of entities correlated by relationships, collectively representing one core concept  Interconnection objects: • the semantic associations between core concepts • are used to construct links and indexes for navigation • consist of E-R relationships marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 126 WebML

2. Data Design: entities classification (2)  Access objects: • are auxiliary objects used to classify or specialize the core objects, with the purpose of facilitating access by means of:  categorization over the core objects  more precise keyword-based search mechanisms  collections of most representative objects • are mapped into entities, connected to the core entities. • access sub-schemas: the same core object may be categorized or specialized in different ways  Personalization objects: • the properties of the user, needed for personalization • entities may be used to model user profile data and the groups in which users are clustered • relationships (ownership, preference,…) may connect user and group to the applicative entities marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 127 WebML

2. Data Design: entities classification (3) User Group CoreEntity1 CoreEntity2 Personalization sub-schema Core sub-schema Connection sub-schema Access sub-schema marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 128 WebML

2.1. Core subschema  Core entity identification: from data dictionary and the other requirements NewsItem Product  Detailed design of core subschema: attributes, components and relationships NewsItem Logo Product TechSpecItem Headline Name 0:N Name 1:1 Description SubHeadline Image DescriptionShort Highlighted Date DescriptionLong TextDate 0:N ImageSmall 0:N Place ImageNormal Award OnlineDate ImageLarge 0:N Product CutoffDate Name PDFBrochure Date 1:1 0:N FlashPresentation Configuration PDF PDFName Logo PDFCertificate ModelName Body 0:N Notes 1:1 PartNumber Image GIFTechSpecs Description Highlighted Benefit BrochureThumbnail Price Summary Description 1:1 Availability DescriptionLong marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 129 WebML

2.2. Access subschema  From use cases and usability issues, different access mechanisms can be designed Country Name EnglishName Isocode Charset 0:N 0:N 1:1 ProductGroup 1:1 NewsCategory Name Name PriceList 0:N 0:N 1:1 1:1 ProductBrand NewsItem Name Description 0:N 1:1 HighlightedNewsItem Product marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 130 WebML

2.3. Interconnection subschema  Semantic connections between core subschema objects are defined 0:N NewsItem Headline 0:N SubHeadline Logo Product TechSpecItem Date TextDate Name 0:N Name 1:1 Description Place Image DescriptionShort Highlighted OnlineDate DescriptionLong CutoffDate 0:N ImageSmall 0:N PDF ImageNormal PDFName Benefit ImageLarge PDFBrochure 0:N Body Description ProductConfiguration Image 1:1 0:N FlashPresentation DescriptionLong Highlighted PDFCertificate ModelName 1:1 PartNumber Summary 0:N Notes Award GIFTechSpecs Description 0:N BrochureThumbnail Price 0:N Name 1:1 Availability Date HighlightedNewsItem Logo marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 131 WebML

2.4. Personalization subschema  Registered users profile and access management information DefaultGroup Country User Group 1:1 1:N Name Username GroupName EnglishName Password Groups Isocode Email 1:N 1:N 1:1 Charset 0:N 0:N FirstName AbsoluteURL LastName Keywords Phone Address 0:N 0:N 1:N 1:1 1:1 SiteView ProductGroup NewsCategory SiteViewName Name Name PriceList marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 132 WebML

3. Hypertext design  3.1. Coarse design  3.2. Detailed design marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 133 WebML

3. Hypertext Design  IN: data schema, site map, functional requirements, user requirements  OUT: WebML hypertext schema  Two design steps: 1. Coarse design 2. Detailed design marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 134 WebML

3.1. Coarse Design (1) a) Identification of areas, by re-examining the functional requirements and the site map (division of the application into modules) b) Area visibility definition: • default area, if it is accessed by default when its enclosing site view is accessed. • landmark area, when it is globally accessible from any other area within the Web site. • internal area, when it is visible only by means of explicit links marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 135 WebML

3.1. Coarse Design (2) c) Specification of content: • Core hypertexts Core(CoreEntity,Component1,…,ComponentN) • Access hypertexts Access(CoreEntity,AccessEntity1,…,AccessEntityN) • Interconnection hypertexts Interconnection(Role1,…,RoleN) • Personalization hypertexts • Content management hypertexts Create&Connect(Entity1,Role1, .., RoleN) Modify(Entity1) Delete(Entity1) Connect(Role1), Disconnect(Role1) Set(ContextInformation) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 136 WebML

3.1. Coarse Design (3) • Site view definition example: News_ContentManagement Area L Access (News, NewsCategory) Delete (News) Modify (News) Create&Connect (News,NewsToNewsCategory) Set (NewsCategory) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 137 WebML

3.2. Detailed Design (1) a) Page identification: • Division of an area into pages • Each page is assigned a portion of the content and functions of the enclosing area b) Page visibility: • Home page: presented by default when the user accesses the site view • Default page: presented by default when the area is accessed • Landmark page: globally reachable from all the other pages in the same enclosing module (site view or area) • Internal page: implement subordinate content marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 138 WebML

3.2. Detailed Design (2)  Example: News_ContentManagement Area NewsAccess&DeletionPage D Access (News, NewsCategory) Set (NewsCategory) Delete (News) L News_Modification Page Modify (News) News_Create Page Create&Connect (News, NewsToNewsCategory) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 139 WebML

3.2. Detailed Design (3) c) Page specification: • Detailed specification of units and links necessary to deliver the content and services established in the coarse hypertext design • Exploit some typical hypertext sub-schemas, which are hypertext design patterns  A core sub-schema  An interconnection sub-schema  An access sub-schema  The personalization sub-schema marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 140 WebML

BrandsPage ChangeCountry GetCountry CurrentCountr to Home Page y SetGroup access sub- CountryParam Country Country schema ProductGroups ProductGroup example GroupParam from GroupsPage ProductGroup ProductGroup [CountryToProductGroup] ProductsFull ProductsShort to ProductPage to ProductPage Product.OID Product.OID ProductBrand ProductBrand [ProductGroupToProductBrand] [ProductGroupToProductBrand] NEST Product NEST Product [ProductBrandToProduct] [ProductBrandToProduct] marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 141 WebML

ProductPage ChangeCountry Awards Configurations to Home Page GetCountry core subschema Country Award ProductConfiguration CountryParam [ProductToAward] [ProductToProductConfiguration] example CurrentCountr y Logos ProductGroups to BrandsPage Product Country Logo ProductGroup [ProductToLogo] [CountryToProductGroup] Benefits from ProductsFull Product index in [ProductBrandToProduct] BrandsPage from Products ProductsShort Benefit index in GetGroup [ProductToBenefit] BrandsPage Product.OID ProductBrand marco.brambilla@polimi.it [ProductGroupToProductBrand] GroupParam http://home.dei.polimi.it/mbrambil 142 NEST Product toWebML TechSpecs Page [ProductBrandToProduct]

WebML Advanced topics: Web Services Marco Brambilla Politecnico di Milano and Web Models Srl

Web services architecture BPEL4WS IBM Microsoft & BEA , WCSI Sun BPML BPMI.org WSFL IBM Service Integration XLANG Microsoft UDDI UDDI.org Service Discovery UDDI UDDI.org Service Publication WSDL W3C Service Description SOAP W3C XML -based Messaging XML W3C Transport HTTP W3C marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 144 WebML

Service integration layer  Choreography or collaboration layer  Describes the interaction of services within a process  Business processes are essential to build complex applications over the message-based paradigm.  Example: BPEL4WS  An implementation language: it allows to define new Web services as composition of existing ones  The composed service is described by means of WSDL, just as any other Web service  The process specification describes how the composed service plugs into the global process marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 145 WebML

Application scenario  Ski Portal stores touristic info on resorts and slopes plus name/address of hotels • Reservations are done through the HMS web services • Payment is done through the PS web services • The HMS also delivers auxiliary services usable by the Ski Portal (e.g., hotel news, event notifications, user comment management) Hotel management Ski portal system (HMS) HTTP Web appl. Web service operations •Resorts HTTP •Ski slopes •Hotels •Clients •Reservations Payment system (PS) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 146 WebML

Types of interactions (as from WSDL)  Central component of a web service: operation = 1 or 2 msg • Request-response • Solicit-response • Notification • One-way Ski portal Web application HMS One-way subscription to hotel news Hotel news notification Get room offers request Room offer response Concert tickets solicit Concert tickets response marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 147 WebML

Synchronous vs. asynchronous  Two-message operations may be used • Synchronously: no action is taken between 1st and 2nd messg and the sender waits • Asynchronously: action is performed between the messages, the sender does not wait Ski portal HMS Get room offer request Room offer response Make comment request Comment response Solicit number of users connected Number of users. response Concert tickets solicit Concert tickets response marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 148 WebML

Conversations  A Web service conversation is a set of correlated messages involving one or more Web services (and Web applications)  Conversations entail additional semantics • Messages belonging to the same conversation must be recognized and traced • Timeouts or error conditions can be specified for the messages of a conversation • Exceptions should be handled marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 149 WebML

WebML support for web services  Goal: modeling the interaction between the Web application, the human users, and the remote systems  New modeling primitives are required: • Data model: specific entities modeling the interaction history with Web services • Hypertext model: primitives for handling the various classes of service operations  Run-time support for Web services • Ability of exchanging messages • Integration of application data and Web services XML messages • Support for conversations marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 150 WebML

Meta-data model for Web services OperationType OpName ConvType MessageType In PartOf PortName 1:1 0:1 Binding 1:1 1:N Name Name Timeout Format Out ServiceName 1:1 0:1 NetworkAddress 0:N 0:N Timeout 0:N 1:1 1:1 1:1 Message In Operation PartOf Conversation 1:1 0:1 Instance Instance 1:1 1:N Instance Content Out TimeStamp TimeStamp 1:1 0:1 Status marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 151 WebML

WebML for supporting Web services  One WebML operation for each class of Web service operations ReqRsp SolRsp AsReqRsp AsSolRsp OneW Notif ConvName ConvName ConvName ConvName ConvName ConvName • Marks for operations that start, resp. end conversations ReqRsp ReqRsp ConvName ConvName marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 152 WebML

WebML service operations are macros 1. Create a new Conversation Instance getOffer 2. Create a new Operation Instance • Name=“getOffer", … 3. Connect the Operation Instance to the ReservConv Conversation Instance 4. Compose parameters of the incoming links into an XML message 5. Send XML message; block waiting for answer 6. Decompose XML answer • may involve populating the entities of the underlying data schema 7. Export selected element from the answer as parameters of the outgoing links marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 153 WebML

Hypertext with service calls Confirmation Confirmed Room search getOffer Reservation RoomCrit User data From Reservation To ReservConv User Offers [OID=CurrentUser] Confirm Book New RoomOffer ReservConv ReservConv Reservation Pay CreditInfo CCNo Exp. ReservConv marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 154 WebML

Hypertext with async messaging Added new entity Comment(OID,subject, text, answer) + Relationship Comment_User Connect Answers to my comments User data Create Send comment Comment2User User data Comment Comment User Subj Comment [OID=currentUser] Text MyComm User [OID=currentUser] CommConv A: text Update Comment C:Comment.OID [Comment2User] [answer!=null] Answered Comment <answer:=A> marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 155 Comment WebML

WebML data transformation  Web services communicate through XML messages (SOAP)  Marshalling and transformation between messages and from/into structured data is required  XML-in & XML-out: marshalling XML documents  ER instance  Adapter unit: XML XML transformations from XML document to another XML document (through user-defined XSL stylesheet) Adapter marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 156 WebML

Examples Book New Book Adapt Store New XML ReservConv Reservation ReservConv Reservation Pay Confirm Pay Adapt Confirm ReservConv ReservConv ReservConv ReservConv marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 157 WebML

Actual implementation within the tool  Web Service invocations  Web service publishing marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 158 WebML

DEMO: the mediator at work  Receive PO  Obtain CustomerId  Create Order  Send Lines  Close Order marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 159 WebML

WebML Advanced topics: BPM Marco Brambilla Politecnico di Milano and Web Models Srl

Introduction  Web services and BPM are the de facto standard of modern enterprise integration • Web services enable system-to-system interaction; • business process specification languages ease the definition of the business constraints, by orchestrating service execution  Enterprise workflows are rarely constituted only by orchestrations of Web Services • Human interaction is often involved • (e.g., BPEL4People initiative)  We propose MDE approach for multiparty business processes, based on Web Service orchestration and Web user interface design. • BPMN • WebML marco.brambilla@polimi.it 161 http://home.dei.polimi.it/mbrambil 161 WebML

Model-driven Development Process  Manual specification of (extended) BPMN process model  Automatic transformation of BPMN to WebML  Possible manual refinement of WebML models  Automatic running code generation on J2EE platform marco.brambilla@polimi.it 162 http://home.dei.polimi.it/mbrambil 162 WebML

What is BPM?  Business Process Modeling aims at defining enterprise businesses in a (semi)formal way • More to come in future courses  BPMN is flow-chart based notation for defining Business Processes  The current version is 1.2, with a major revision process for 2.0 in progress  Covers three different levels of process modeling: • Process Maps – simple flow charts of the activities • Process Descriptions – flow charts extended with additional information, but not enough to fully define actual performance • Process Models – flow charts extended with enough information so that the process can be analyzed, simulated, and/or executed marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 163 WebML

Basic concepts  Small set of graphical elements to make it easy for business users as well as developers to understand the flow and the process.  Four basic categories of elements compose a business process diagram (BPD): • Flow Objects  Events, Activities, Gateways • Connecting Objects  Sequence Flow, Message Flow, Association • Swimlanes  Pool, Lane • Artifacts (Artefacts)  Data Object, Group, Annotation • It is also allowed to make a custom type of a Flow Object or an Artifact to make the diagram more understandable. marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 164 WebML

Pool and lanes  A Pool: • represents a Participant in the Process. A Participant can be a specific business entity (e.g., a company) or can be a more general business role (e.g., a buyer, seller, or manufacturer)  A Lane: • Is a sub-partition within a Pool • Is used to organize and categorize activities within a Pool. • Is often used for such things as internal roles (e.g., Manager, Associate), systems (e.g., an enterprise application), an internal department (e.g., shipping, finance) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 165 WebML

Sequence flow  A Sequence Flow is used to show the order that activities will be performed in a Process  The source and target must be one of the following objects: • Events • Activities • Gateways  A Sequence Flow cannot cross a Sub-Process boundary or a Pool boundary marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 166 WebML

How to read diagrams  A useful concept that helps the action of reading of a diagram is the Token • The start of a process generates a Token that must eventually be consumed at the conclusion of the process • A Token will traverse the Sequence Flow and pass through the Flow Objects in the Process • The behavior of the Process can be described by tracking the path(s) of the Token through the Process • Multiple Tokens may exist because of concurrent Process instances or the dividing of the Token for parallel processing within a single Process instance marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 167 WebML

Activities  An activity: • is work that is performed within a business process • Can be a: Task   Sub-Process • Can be performed once or can have internally defined loops marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 168 WebML

Task  Is an atomic activity that is included within a process  Can be executed: • Manual: outside the process (i.e. the customer accepts an offer) • Service: automatically as some sort of service, which could be a Web service or an automated application • User: by a human performer with the assistance of a software application and is scheduled through a task list manager of some sort  Has its own state: • Ready: waiting to be worked • Active: someone is working on it • Completed: someone has finished working on it • Aborted: someone has cancelled it  Defines the parameters to show and to edit marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 169 WebML

Parameters  A parameter is: • A simple property that stores an information managed by the process • Used when there is the need to take a decision, sending a message and so on • Defined by:  Name  Type: simple (string, integer, etc.) or complex (Business object)  Available values  Selection policy (single or multiple) • Defined at pool level • Replied for each process instance marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 170 WebML

Business objects  A business object is: • A complex object that stores an entity managed by the process (i.e. an order, an invoice etc.) • Useful when:  the information is a structured object  you have to use two or more properties to define an object • Defined by properties • A property is a simple object defined by:  Name  Type (string, integer, etc.)  Available values  Selection policy (single or multiple) • Defined at project level marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 171 WebML

Gateways  A gateway: • Is used to control how sequence flows interact as they converge and diverge within a process • Can be executed:  User: manually by a user choosing the gate using a set of parameters to show or edit like an activity  Service: automatically as a service with a set of condition parameters to test • Is divided into types:  Exclusive  Inclusive  Parallel marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 172 WebML

Exclusive Data-based gateway marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 173 WebML

Inclusive Gateway marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 174 WebML

Parallel Gateway marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 175 WebML

Events  An event: • Is something that happens during the course of a business process. • Affects the flow of the process and often have a cause (trigger) or an impact (result). • Can:  start a flow. Is drawn as a circle with a single thin line  interrupt/resume a flow. Is drawn as a circle with a double thin black line  end a flow. Is drawn as a circle with a single thick black line • Can be one of these types:  None, Message, Timer, Signal, Conditional, Link, Error, Cancel, Terminate, Compensation • Can be used to catch or throw the event • Can be defined as standalone or on the boundary of an activity as intermediate event marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 176 WebML

Message Start and Intermediate Event ,5 marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 177 WebML

Signal Event  A Signal is for general communication within and across Process Levels, across Pools, and between Business Process Diagrams  A signal is not a message, which has a specific target, but is a broadcast  A signal is defined by: • Name • A set of parameters to show or edit  Multiple processes can have events that are triggered from the same broadcasted signal marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 178 WebML

Signal Start and End Event marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 179 WebML

Link Event  A Link is a mechanism for connecting two sections of a Process.  Link Events can be used to create looping situations or to avoid long Sequence Flow lines.  Link Event uses are limited to a single Process level  Paired Intermediate Events can also be used as “Off-Page Connectors” for printing a Process across multiple pages.  Can also be used as generic “Go To” objects within the Process level. There can be multiple Source Link Events, but there can only be one Target Link Event. Catching Thowing marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 180 WebML

Compensation  Compensation is concerned with undoing steps that were already successfully completed, because their results and possibly side effects are no longer desired and need to be reversed.  If an Activity is still active, it cannot be compensated, but rather needs to be canceled.  Compensation is triggered using a compensation throw Event, which can either be an Intermediate or an End Event.  The Activity which needs to be compensated is referenced. If the Activity is clear from the context, it doesn’t have to be specified and defaults to the current Activity.  If no Activity is specified in a “global” context, all completed Activities in the Process are compensated. marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 181 WebML

Sub-Process  Is a compound activity in that it has detail that is defined as a flow of other activities  Enables hierarchical process development  Points directly to a separately defined process  Defines its own input/output parameters and exposes them when called/executed  Is started from a None Start Event, if more than once one will be chosen  Can be multi instanced in: • Loop: defined by a while condition • Parallel: defined by a count parameter passed as input • Serial: defined by a count parameter passed as input marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 182 WebML

Sub-Process marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 183 WebML

BPMN*  WebML transformation (5) (4) (3) Orchestration per lane: user pool: WS Choreography the activities (1) One control siteviewaperper navigationinteraction and gateways (2) site view view: controller component invokes serviceview pool: Human of activities business logics  Transformation rules • finer-grained Application Model, needing few refinements by the designer  typed activities enables reusable application models  data dependencies are specified at a higher level • less errors in Application Model design • Faster development marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 184 184 WebML

Data Model Process Metadata Actors Run-Time Log marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 185 WebML

The NEXT unit • The Next unit encapsulates the process control logic • It exploits the information stored in the Process Metadata • It calculates the current process status and the enabled state transitions • It needs the following input parameters: – caseID (the currently executed process instance ID) – activityInstanceID (the current activity instance ID) – conditionParameters (the values to evaluate the conditions) NEXT marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 186 186 WebML

The NEXT unit (cont.d) 4 execution modes: • Process start. Instantiates and starts a case for the given ProcessID. • Process end. Given the activityInstanceID of the last activity, sets the Case to “Ended”. • Calculate and execute. Given the actInstID of the last concluded activity, enables the execution of the subsequent activities. • Execute. Given an actInstID, sets its status to “Active” and launches its execution. NEXT marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 187 187 WebML

Next Unit marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 188 WebML

Next Unit marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 189 WebML

Design process marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 190 WebML

WebML Advanced topics: AJAX Marco Brambilla Politecnico di Milano and Web Models Srl

Conceptual modeling of AJAX features  WebML currently covers a limited set of AJAX features • Major revision foreseen  Partial page refresh  Popup windows marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 192 WebML

Conceptual modeling of AJAX features  Dynamic tooltips  Drag and drop marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 193 WebML

AJAX event management  onChange event: the typical application is the refresh of the contents of a drop down list depending on the changed value of another field  onFocus event: this may be useful for showing some instructions or hints when the user enters a field  onBlur event: allowing one to execute some action when the cursor leaves a field marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 194 WebML

Other AJAX features  Content autocompletion for fields  Background file uploads marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 195 WebML

Generated code and descriptors For each page:  1 main JSP page  1 backoffice page for the chunks used by AJAX  A set of unit descriptors Page1 (jsp) Page2 (jsp) ... PageN (jsp) Page1 Page2 PageN Chunks for Chunks for Chunks for AJAX (jsp) AJAX (jsp) AJAX (jsp) Index Unit Data unit component component (java) (java) ... Runtime Runtime descriptor Runtime descriptor Runtime IndexUnit3 descriptor DataUnit3 descriptor Runtime Runtime IndexUnit2 descriptor DataUnit2 descriptor IndexUnit1 DataUnit1 data access layer marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 196 WebML

AJAX pages behaviour User Front-end JSP Back-end JSP chunks Page request AJAX request in the page Selection of the proper backend chunks Chunks rendering in the page ... Page request marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 197 WebML

WebML WebRatio 6 BPM Marco Brambilla Politecnico di Milano and Web Models Srl

WebRatio 6 BPM  WebRatio 6 BPM permits you to: • Model and Document your processes • Execute and Validate your processes by instantly prototyping • Developing, Improving and Refining your processes and create a complete Web application marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 199 WebML

WebRatio functionalities  Content model design  Business proces model design  Data derivation (Derivation Wizard)  Hypertext model design (siteviews)  Consistency checks (warnings)  Mapping onto a datasource  Units positioning in the pages  Automatic web site generation  Integration of advanced features (BPM, Web services, AJAX) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 200 WebML

Architecture marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 201 WebML

Model transformations marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 202 WebML

References and useful links  WebRatio Official Wiki (http://wiki.webratio.com) - “WebRatio 6 - Getting started” - “WebRatio 6 - Tutorial - Vacation Request” • BPMN Official Site (http://www.bpmn.org/)  Bruce Silver - “BPMN Method & Style” (http://www.bpmnstyle.com/) Bruce Silver is a well-known BPM industry analyst and consultant, the founder and principal at BPMessentials, the leading provider of BPMN training, and a participant in the BPMN 2.0 development team in OMG. marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 203 WebML

WebML Industrial cases Marco Brambilla Politecnico di Milano and Web Models Srl

Context and motivations  Acer Inc: • the 3rd* branded PC vendor worldwide • US$11.32 B consolidated revenues in 2006, operations in more than 100 countries, 5300 employees  Situation in year 2000 • A manufacturing-oriented company, with increasing market shares and brand value, but: • Regionalized structure with continental HQs and highly independent national subsidiaries • Countries with very variable market approach, customer service levels, and even visual identity and local branding • Low perceived value by customers as a knowledge and business partner * Source Gartner marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 205 WebML

Technical Goals  Launched in EMEA in Dec 2000 as a worldwide pilot  Business Goals: • Supporting the new corporate strategy: “from manufacturing to Total Brand Company”, the so called “New Acer” • Improving the customer-perceived value by:  Centralizing the conception and realization of eBusiness solutions for the (initially 14, now 34) EMEA & PA countries  Deploying innovative B2C & B2B services effectively on the Web  Homogenizing marketing and communication, technical support, and customer service across national subsidiaries  Building an added-value online community, serving channel operators (dealers, VARs, distributors) and end-users in a one-to-one, yet resource- effective, way marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 206 WebML

Technical Goals  Division of competences between IT & MarCom in the development of customer solutions • The MarCom business unit is responsible of the project, from business requirement analysis, to early prototyping, development, and verification • The IT unit sets technical standards, manages infrastructure and runs the developed solutions  Methodology for “lossless” transition from business requirements to technical requirements  Inject Customers’ and MarCom managers’ feedback into the projects as early as possible  Time to market of services and solutions & effort consumption  Long-term sustainability w.r.t. business strategy and ICT infrastructure evolution marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 207 WebML

Methodology  Integrated approach to Business Process Reengineering, through Model Driven Development • Visual Language: WebML  Extensive use of automatic code generation from application models • IDE and Code Generator: WebRatio marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 208 WebML

7 years experience: B2C+B2B porfolio marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 209 WebML

Case History 1: Acer Euro CMS  B2C + CMS Web applications initially for 14 EU countries (year 2000)  Corporate news, Product technical & commercial data, Service & Partner area, Where to Buy…  Multilingual, multi-actor, distributed workflows for local and central PMs, local and central MarCom managers  ... and a: very limited Time to Market (7 weeks!!) marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 210 WebML

Size & effort Class Dimension Value Size Number of localized B2C web sites 14 Number of main CMS applications 4 (Admin, News, Product, Other content) Number of supported languages 12 for B2C Web sites, 1 for CMS Number of data entry masks 39 Number of automatically generated database tables 46 Number of automatically generated database views 82 Number of automatically generated database 279 for data extraction, 89 for queries data update Number of automatically generated JSP page 48 templates Number of automatically generated or reused Java 250 classes Number of automatically generated Java lines of 12500 Non commented lines of code code Time & Number of elapsed workdays 49 effort Number of development staff-months (analysts and 6 staff-months (6 weeks x 4 developers) persons) Total number of prototypes 9 Average elapsed man days between consecutive 5,4 prototypes Average number of development man days per 15,5 prototype marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 211 WebML

Size & effort DEGREE OF AUTOMATION Number of manually written SQL statements 17(SQL constraints) Percentage of automatically generated SQL code 96% Number of manually written/adapted Java classes /JSP templates 10% JSP templates manually adapted Percentage of automatically generated Java and JSP code 90% JSP templates, 100% Java classes COST AND ROI Total cost of software development of first version 75.000 € HW, SW licenses, and connectivity cost of first version 70.000 € (db server license) Return on investment of first version 12-15 months Average effort of extension to one additional country 0,5 staff-months Average cost of extension to one additional country 7.500 € Average ROI of extension to one additional country 2 months PRODUCTIVITY Number of function points 177 (B2C web site) + 612 (CMS) = 789 Average number of function points delivered per staff-month 131,5 marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 212 WebML

Critical Considerations  On the positive side: • Almost 80% of the delivery effort concentrates in the phases of data design, hypertext design and prototyping:  more development time is spent with the application stakeholders  MDD allows a more flexible distribution of responsibilities between the IT department and the business units  The peak productivity rates has reached five times the number of delivered function points per staff-month of a traditional programming language like Java marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 213 WebML

Critical Considerations (continued)  On the negative side.. • Acer estimates that it took from 4 to 6 months to have fully productive developers with MDD, WebML, and WebRatio.  ..but.. • The initial investment in human capital required by MDD pays off in the mid term  MDD benefits testing, maintenance, and evolution (which account for over 60% of the total lifecycle cost)  reasoning on the system is far more effective at the conceptual level Served Contries and Applications 60 56 50 Number of developers 40 41 Units 30 32 31 28 Number of 24 24 20 21 maintained 17 applications 10 4 4 4 5 5 Number of served 0 countries 2001 2002 2003 2004 2005 marco.brambilla@polimi.it Year http://home.dei.polimi.it/mbrambil 214 WebML

Major European bank – large BPM case  The pilot application for the first country (planned to be extended to 10 more) covers • 52 business processes • 1,100 activities • 30 user roles. • Application load of 300 registered users, with 100,000 cases / 2 MLN activities per month  The development team comprised • 14 staff members from three organizations • total effort amounting to 2551 man days, spent in 375 elapsed days marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 215 WebML

Major European bank – large BPM case  Distribution of effort: • 12% for business process analysis and re-engineering, • 6% for BP modeling according to BPMN, • 12% for wrapping existing legacy procedures as services accessible through SOA and BP orchestration, • 5% for designing the support interfaces for the BPM • 55% for the design and refinement of the application models that implement the logic of the activities • 10% for the design of collateral application for increasing usability and employee productivity (data look-ups, etc).  Central role played by the detailed application design  Main benefits were • Rapid prototyping, thanks to which 4 major prototypes and 35 minor releases • Support of teamwork, which allowed 14 contributors from 3 different organization to work together marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 216 WebML

Thanks  For comments or questions: Marco Brambilla Politecnico di Milano Dipartimento di Elettronica e Informazione mbrambil@elet.polimi.it Resources: http://home.dei.polimi.it/mbrambil http://marcobrambi.blogspot.com http://twitter.com/MarcoBrambi http://www.slideshare.net/mbrambil http://home.dei.polimi.it/mbrambil http://twitter.com/MarcoBrambi marco.brambilla@polimi.it http://home.dei.polimi.it/mbrambil 217 WebML

http://dbgroup.como.polimi.it	2356
http://www.webml.org	117
http://learnmde.org	64
http://translate.googleusercontent.com	46
http://www.learnmde.org	10
http://webml.org	6
http://www.slideshare.net	5
http://marcobrambi.blogspot.com	4
http://www.modeldrivenstar.org	3

WebML and WebRatio - Business process modeling (BPM) and web application modeling

by Marco Brambilla on Jun 11, 2010

Accessibility

Categories

Tags

Upload Details

Usage Rights

9 Embeds 2,611

Statistics

WebML and WebRatio - Business process modeling (BPM) and web application modeling — Presentation Transcript