uml-based web engineering
TRANSCRIPT
1
UML-Based Web EngineeringNora Koch
joint work with Gefei Zhang, Martin Wirsing, Andreas Kraus, Alexander Knapp, Rolf Hennicker and Hubert Baumeister
Web Engineering GroupLudwig-Maximilians-Universität München (LMU)
Sevilla, 21.4.2005
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 2
Web Projects
main problemsbusiness goals are not fulfilled
delays in relation to project plan
project exceeds budget
system delivered does not have required functionality
deliverables are of poor quality
current situation (similar to software development around 1960) individual, quick & dirty implementations
reuse based on copy & paste
missing documentation
incremental complexity of web applications and web services
2
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 3
Methodologies for Web Development
HDM1993
1994
1995
1996
1997
1998
1999
2000
2001
2002
RMM
EORM
OOHDM
WSDM
SOHDM RNA HFPM
WAE
WebML UWEW2000
2003 OOH
OO-Method
OOWS
Web Composition
NDT
Data-oriented
Process-orientedOO-oriented Implementation-
orientedHypertext-oriented
HDM-Lite
2004 WebSA
eW3DT
Hera
M. J. Escalona,2004
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 4
Methodologies for Web Development
EORM Enhanced Object Relationship ModeleW3DT Extended World Wide Web Design TechniqueHDM Hypertext Design ModelHeraHFPM Hypertext Flexible Process ModelingNDT Navigational Development Technique
OO-H Object-Oriented Hypermedia MethodOO-Method Object-Oriented MethodOOHDM Object-Oriented Hypermedia Design MethodOOWS Object-Oriented Web Solution
RMM Relationship Management MethodologyRNA Relationship-Navigation AnalysisSOHDM Scenario-based Hypermedia Design MethodUWE UML-based Web Engineering
W2000 WAE Web Application ExtensionWeb CompositionWebML Web Modeling LanguageWebSA Web Software ArchitectureWSDM Web Site Design Method
3
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 5
Contents
UWE: A Web Engineering ApproachModelling with UML and UWE (Notation)Modelling supported by UWE MethodMetamodel for UWETool support with ArgoUWEUWE Development ProcessFuture Work and Trends in Web Engineering
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 6
What is UWE?
UWE is a an engineering approach for the development of web applicationsmain characteristic is the use of UML for all modelsfocuses on systematisation and automatic generationUWE comprises
a notation for the graphical representation of the model elementsa method (technique) supporting semi-automatic generation a metamodel for UWE modelling elementsa process supporting the development life-cycle of web applications
a case-tool ArgoUWE supporting the design of web applications
(UWE is also a German male name)
4
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 7
Web-based Systems / Web Applications
characteristicsbased on the hypermedia paradigm
nodes & linkstext & multimedia
omnipresent due to the nature of the webglobal and permanent availabilitycomfortable and unified accessdistributed information / servicesproducible by “everybody“
dynamic developmentincremental number of web pages continuous improvement of existing web applications (content, links, layout)offer of new services
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 8
Categories of Web Applications
informative
com
plex
ity
time
interactive
transactional
workflow-based
collaborative
semantic web
personalized
Source: Web Engineering, Kappel et al. d-punkt Verlag (October 2003)
portal-oriented *
5
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 9
Why UML?
UML is a graphical language for specifying, constructing and documenting software artifactsUML is a de facto industry and a OMG standardUML includes
notationdiagram typesmetamodelObject Constraints Language (OCL) for invariants, pre- and post-conditionwell-formedness rules
UML is neither a method nor a process
How expressive is UML for the development of web applications?UML does not include specific web modelling elementsUML defines extension mechanisms UML profiles
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 10
UML Profiles
UML extension is a UML profile if it only uses the extension mechanisms provided by the UML
stereotypes
tagged values
OCL constraints UML profile = light weight extension
heavy weight extensionuses other diagram types not defined in the UMLuses different notation
easestool support
article.date> user.lastVisitNewArticles
«index»
{adaptation=annotated}
6
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 11
Contents
Web Engineering ApproachModelling with UML and UWE Notation
Requirement of Web ApplicationsContent, Hypertext Structure and PresentationWorkflow-based Web ApplicationsAdaptivity with AspectsWeb Architecture
Modelling supported by UWE MethodMetamodel for UWETool support with ArgoUWEUWE Development ProcessFuture Work and Trends in Web Engineering
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 12
Dimensions of Web Modelling
aspects
structure
behaviour
phases
levels
content
presentation
analysis
adaptivity
implementationdesign
hypertext
modelling process information-driven ("content first") presentation-driven ("layout first")functionality-driven ("test first") agile process
Source: Kappel et al. Web Engineering, d-punkt (2003)
requirements analysis
7
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 13
Modelling Requirements of Web ApplicationsCase Study: e-Shop
distinction between “normal”/standard use cases and navigation use casesUWE Stereotype <<navigation>>
W2000 makes the distinction at diagram level: two use case diagrams
UML use case diagrams are used to describe web application functionalityUWE extension
<<include>>
Customer
SelectProductItems
<<navigation>>
<<extend>>
<<navigation>>
<<extend>>
NonRegisteredUser
AddToShoppingCart
Checkout PrintInvoice
LogIn
ViewCartSearchProductItems
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 14
Refining the Requirements SpecificationCase Study: e-Shop – checkout process
use cases complemented with
textual specificationactivity diagrams
UML activity diagrams for visual representation of workflows
[ error ]
AddNewCustomer
LogIn
[ error ] [ newCustomer ]
SetOptions
[ returningCustomer ]
PlaceOrderexit/ delete Items ShoppingCart
PrintInvoice
newCustomer : Customer
newOrder : Order
[ change ]to model the business logic of the applicationUML call states and sub-activitiessub-activities can further be refined
8
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 15
goalto model problem domainto separate content from hypertext / navigation structure and presentation
Content Modelling in UWE
UML class diagrams for the structure UML sequence diagrams or UML state charts for the behaviour
sequence diagrams are used to visualize messages between objects showing how they collaborate (messages between user and web application)state diagrams capture states of objects and show actions that lead to state transitions
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 16
Content Modelling: StructureCase Study: e-Shop
DVD
Book
CDOrderItemquantity
CustomernamecreditCard
ShoppingCartadd()checkout() 0..11..*
Addressstreetzip-codecountry1
+deliveryAddress
0..1
**
ShoppingCartItem
quantity
1*
OrderorderIDinvoiceNumbersendInvoice()
1+invoiceAddress
1
Productnameprice *1
*
*
*
UML class diagrams at analysis-level and design-levelclasses to represent
units of textual informationmultimedia elements
associations, aggregations to show relationships between classesinheritance to show hierarchies between classes
9
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 17
goalsto represent nodes and links of the hypertext structureto design of navigation paths to avoid disorientation and cognitive overload
result: navigation structure modelUML class diagramspecific modelling elements
other methodologiesown notation for hypertext elementsdifferent diagrammatic representation of hypertext models
Navigation Modelling in UWE
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 18
stereotypes for basic navigation elements«navigation class»
«navigation link»
basic navigation elementsnavigation class specifies the hypertext nodes is visited by a user through browsing (a navigation class will be given the same name of the domain class which it maps)
navigation link specifies that the target navigation object is accessed by navigation from the source navigation object
Navigation Modelling Elements (1)
«navigation link»«navigation class»
Class Nameattributesoperations
10
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 19
Navigation Structure Model (First Step)Case Study: e-Shop
1..*
+customer1
+shoppingCartItems 0..*
0..1+shoppingCart 0..1
+orderItems 1..*
+orders 0..*
+product
+products1..*
Homepage«navigation class»
Product«navigation class»
ShoppingCart«navigation class»
ShoppingCartItem«navigation class»
OrderItem«navigation class»
Order«navigation class»
Book«navigation class»
Customer«navigation class»
+books
«navigation link»
«navigation link»
«navigation link»
«navigation link»
«navigation link»
«navigation link»
«navigation link»
«navigation link»
«navigation link»
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 20
additional navigation elements
for the selection of one navigation target from a set of navigation elements
«index»
«guidedTour»
«query»
«menu»
UWE Access Primitives
MyIndex MyGuidedTour MyQuery
?
MyMenu
11
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 21
Navigation Modelling Elements (3)
modelling element: index specifies a class of composite objects
contains an arbitrary number of index items
each index item is an object which has a name and owns a link to an instance of a navigation class
UML stereotype: «index»
«index»
MyIndex
name: String
MyIndexItem * 1 «navigation class»
MyNavigationClass
*
MyIndex
«navigation class»
MyNavigationClass
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 22
Navigation Structure Model (Second Step)Case Study: e-Shop
Book
Customer
Homepage
BookRecommendation
1..*OrderList
CustomerOrders Order
0..*
0..*
?
SearchProducts
ShoppingCartItemsOrderItems
SelectedResults
ShoppingCartItem
0..*
OrderItem
0..*
ShoppingCart
0..1
Product
1..*
Enhancement of the navigation structure model by access structures:
indexes guided tours queries
12
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 23
Navigation Structure Model (Third Step)Case Study: e-Shop
ShoppingCartItem OrderItem
BookRecommendation
1..*
AccountInfo
OrderList
CustomerOrders
0..*
0..*
MainMenu
?
SearchProducts
ShoppingCartItemsOrderItems
SelectedResults
0..* 0..*
0..11..*
Book
Customer
Homepage
Order
ShoppingCartProduct
Enhancement of the navigation structure model by menusUse of a set of diagrams (different views of the navigation space) if the number of nodes is large
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 24
Process Modelling in UWE
goalsto model the process of a workflow driven web application
result definition of process classes (for non-navigation use cases)construction of a process structure modeldescription of the behaviour through a process flow and object flow with a UML activity diagramintegration of the process classes in the navigation structure model
13
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 25
Process Modelling Elements
«process class»models a class whose instances are needed by the user during execution of a process
«process link»models the association between a «navigation class» and a «process class» indicating entry points and exit points of processes within the navigation structure
«process class»Class Name
attributesoperations
«process link»
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 26
Process Structure ModelCase Study: e-Shop
Structural view is partially derived from the content modelProcess state is defined explicitly and implicitly by associationsIncludes user input data
0..1
0..1
0..10..1
1 1
0..1
Checkout«process class»
- state:CheckoutActivityState
+ changeState()
CustomersetPaymentOptions()
«process class»ShoppingCart
+ placeOrder():Order
«process class»
Order
+ sendInvoice()
«process class»
PaymentOptions- creditCardNumber- creditCardExpire- payment :PaymentType
+ checkCreditCard() : Boolean
«process class»
CheckoutActivityState-welcome-items-shipping-….
«enumeration»
PaymentType
-moneyOrder-creditCard
«enumeration»
14
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 27
Process Flow and Object FlowCase Study: e-Shop
Refinement of the process model of the analysis phase
AddNewCustomer
SetOptions
setPaymentOptions(Customer)
placeOrder(ShoppingCart)
[ customer->notEmpty() ] [ customer->isEmpty() ]
sendInvoice(Order)
SignIn
SetPassword
[ newCustomer ]
[ returningCustomer ]«transactional»
«transactional»
«transactional»
«transactional»Distinction between subactivity state and call stateCall states used for
change operationsdata validation
: Customer«process class»
: Order«process class»
: ShoppingCart
«process class»
new : Customer«process class»
: PaymentOptions«process class»
Object flow statesof process classes used for modelling user input/output
Transactions modelled by stereotypes («transactional»)
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 28
Process Modelling (1)Case Study: e-Shop
including process classes and process links before enhancing with access structures
1..*
+customer1
+shoppingCartItems 0..*
0..1+shoppingCart 0..1
+orderItems 1..*
+orders0..*
+product
1..*+products 1..*
Homepage«navigation class»
Product«navigation class»
ShoppingCart«navigation class»
ShoppingCartItem«navigation class»
OrderItem«navigation class»
Order«navigation class»
Book«navigation class»
Customer«navigation class»
AddToCart«process class»
«process link»
«processlink»
«process link»
SignIn«process class»
«process link»
Checkout«process class»
«processlink»
15
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 29
goalrepresentation of the structure and the behaviour of the user interface
characteristics definition of pages as a hierarchical composition of presentation elementssupported by few methodsalternative: development of a prototype
resultsclass diagram for the structure of the presentation (in UML container notation)dynamic interaction diagram (sequence diagrams) for the behaviour
Presentation Modelling in UWE
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 30
UWE Modelling Elements for PresentationCase Study: e-Shop
«page»Conference
«presentation class»ConferencePaper
«text»SubmissionDate
«text»PaperTitle
«anchor»Authors
«text»Abstract
«anchor»fullPaper (Pdf)
«button»ReviewForm
«text»PaperID
«page» is a presentation group that contains all elements that will be presented together to the user as response to one request «presentation class» groups a set of user interface elements representing a logic unit of presentationuser interface elements
«anchor»«text»«image»«button»
16
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 31
Aspect Oriented Modelling (AOM) in UWE
access control modelled by aspects
pointcut
«aspect»Access Control
Checkout«process class»
ShoppingCart«navigation class»
navigation adaptivity modelled by aspects
link annotationlink orderinglink hidinglink generation
weaving the result into the web application
advice
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 32
Contents
Web Engineering ApproachModelling with UML and UWE NotationModelling supported by UWE Method
From Requirements to Analysis ModelsGeneration of Navigation ModelGeneration of Presentation ModelApplying MDA PrinciplesTransformation of Models
Metamodel for UWETool support with ArgoUWEUWE Development ProcessFuture Work and Trends in Web Engineering
17
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 33
UWE Method
guidelines for the construction of the modelsset of steps for each modelrelationship between models
model construction issystematic semi-automatictool-supported
Content Navigation Presentation
<<trace>>
RequirementsModel
<<trace>><<trace>>
<<trace>> <<trace>>
Adaptation
<<trace>>
<<trace>>
<<trace>>
<<trace>>
Process
<<trace>>
<<trace>>
<<trace>>
<<trace>>
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 34
Building Requirements Models
build the use case modelfind the relevant actors for the applicationidentify the uses cases that define the functionality of the applicationestablish which actor will be involved in which use casedefine includes and extends relationships between use casesuse inheritance for actors and use casesdistinguish between navigation use cases and “normal” use cases (stereotype)
build an activity diagram for each non-navigational and non-trivial use caseidentify activitiesdefine transitions between activitiesassign objects related to those activities
automationassignment of activity diagram to each non-navigational use case.
18
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 35
Modelling Requirements of Web ApplicationsCase Study: Online Library
UML use case diagram
UML activity diagrams
Reader
RegisteredReader
Findpublication
Look atnew articles
Findarticle
Modifypreferences
No results
Enterarticle title
[count>1]
Displayarticle
Selectarticle
[count=1] [count=0]
Producearticle list<<navigation>>
<<navigation>>
<<navigation>>
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 36
Building the Domain/Content Model
build a class diagramfind classes for the objects identified in the activity diagramsidentify attributes and operations for these classesdetermine relationships between classes (associations, aggregations. compositions)define inheritance hierarchies, if appropriatedadd constraints
mark conceptual classes that are relevant for navigation structure
automationgeneration of classes based on objects of the activity diagrams
19
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 37
Content ModelCase Study: Online Library
Publicationtitle: Stringdate: Date
Authorname: Stringe-mail: String
Library
name: String
*
* 1..*
1..*
keywords
1..*articles
articlesauthors
authors
1..*
publications
library
Article
title: Stringabstract: Stringcomplete: URL
deletePublication
Keyword
word: String
rolename
multiplicity 1..*
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 38
Building the Navigation Model (First Step)
build a class diagram1. create a navigation class for each navigation relevant content class
(navigation classes map to content classes)2. add attributes of omitted classes (if required) to navigation classes
(attributes of a navigation class maps to a attributes of other content class)
3. map navigation links of navigation model to associations of content model
4. transform aggregations and compositions into navigation links5. map attributes of navigation classes to attributes of content classes6. transfer multiplicities and role names of associations, aggregations and
compositions of content model to corresponding modelling elements of the navigation model
7. add navigation links based on the scenarios of the use case model 8. add shortcuts, i.e. additional navigation links to reduce length of
navigation pathautomation
steps 1, 3, 4, 5, 6
20
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 39
Article
Author
Library
1..*
1..*
Publication
1..*
articles
publications
articles
authors1..*
1..*Keyword
1..*
*
*
Navigation Structure Model (First Step) Case Study: Online Library
UML stereotyped classdiagrams
/keyword
define derivedattributes
select classes relevant for navigation
«navigation link»
keep associations as navigation links
inv: /keyword = self.ContentModel::publication.keyword
add constraints
1..*visitedarticles
1..*
authors
add additional associations
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 40
Building the Navigation Model (Second Step)
refine the class diagram1. add an index to all navigation links, which have multiplicity > 1 at the
directed association end (one index item for each navigation object)2. (optional) replace index by guided tour3. (optional) add a query to select a subset of navigation objects4. add an additional navigation link from access primitive to target
navigation class5. move role names from the navigation class to the access primitive6. set multiplicities to one7. add constraints for invariants and pre-/post-conditions8. ….
automationsteps 1, 5, 6
21
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 41
Navigation Structure Model (Second Step)Case Study: Online Library
Author
Publication1..*
1..*
*
Library
1..*
publications
authorsallAuthors
publications
authors
allAuthors
?query
index
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 42
Navigation Structure Model (Second Step)Case Study: Online Library
Author
Publication1..*
1..*
*
Library
1..*
publications
authorsallAuthors
?
publications
authors
allAuthors
menuLibraryM
22
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 43
Model Driven Development (MDD)
OMG Standard MDA (model driven architecture)object-oriented modelsUML as modelling languagemodel transformation to convert a model of a system to another modelOMG terminology:
CIM: computation independent model
PIM : platform independent model
PSM: platform specific model
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 44
a domain specific language to model the architectural views of a web application:
subsystem modelconfiguration model integration model
UML profile with architectural modelling elementsweb componentweb portweb connectorserver pageetc.
Web Software Architecture (WebSA)
«WebComponent»A
WebPortProvided WebInterface
Required WebInterface
«WebComponent»A
WebPortProvided WebInterface
Required WebInterface
«WebComponent»A
WebPortProvided WebInterface
Required WebInterface
«WebComponent »A
«WebComponent »
B [1{4}]
«WebComponent »A
«WebComponent »:B [4]
«WebComponent »A
«WebComponent »
B [1{4}]
«WebComponent »A
«WebComponent »:B [4]
«WebComponent »A
«WebComponent »
B [1{4}]
«WebComponent »A
«WebComponent »:B [4]
23
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 45
WebSA: MDA-based Development Process
types of modelsanalysis: functional and architectural
design
implementation
transformations for mapping & merging models
transformation language QVT-P
*Melía, University of Alicante (2004)
FunctionalModels
(OO-H,UWE)
T1
J2EE models .NET models Other models
T2'
Web Functional Viewpoint Web Architectural Viewpoint
Merge Models to ModelTransformation
SubsystemModel
ConfigurationModel
Analysis
PlatformIndependent Design
Implementation
Integration Model
T2 T2'’
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 46
Contents
Web Engineering ApproachModelling with UML and UWE NotationModelling supported by UWE MethodMetamodel for UWE
Extension of UML MetamodelUML Profile
Tool support with ArgoUWEUWE Development ProcessFuture Work and Trends in Web Engineering
24
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 47
Need of a Metamodel
to provide a formal semantic of the modelling elementsfor tool support and code generation for model checkingas instrument to compare and integrate different web methodologies
to go towards a common metamodel for web methodologies unification at high level of abstraction for each methodology
different development processesuse of subsets of modeling elements (like UML)different notations (concrete syntax)model transformation from one methodology to another
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 48
UWE Metamodel
definition of concepts and relationships among conceptscompatibility with the OMG metamodeling architecture MOF meta-metamodel
XMI interchange format → tool compatibility (theoretically)
conservative extension of the UML 1.5 metamodelstatic semantics given by OCL constraints(well-formedness rules)basis for the planned open tool suite OpenUWE
«instanceOf»
«instanceOf»
ApplicationModel
UWE
MOF
UML
M3
M2
M1
«metamodel»
«metamodel»
«metamodel»
25
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 49
Foundation
ModelManagement
BehavioralElements
UWE
Foundation
BehavioralElements
ModelManagement
Foundation
ModelManagement
BehavioralElements
Package Structure
= UML Metamodel
= UWE Metamodel
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 50
Package Structure
UWEModel
ManagementBehavioralElements
Foundation
Foundation
Behavioral Elements Model Management
Core
ContextUser Environment
PresentationNavigationConceptual
Adaptation Process
Process
26
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 51
UWE Navigation Package
Class
NavigationNode
Navigation Class ExternalNodeMenu
isLandmark: Boolean
Association
Link
ExternalLink ProcessLinkNavigationalLink
isAutomatic: Boolean
+source +outLinks
{derived}
{derived}
+inLinks+target
url: String
*
*1
1..*1..*
* *0..1
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 52
example of a well-formedness rule:
“Navigation attributes are derived from from conceptual attributes.
as OCL constraint:
context NavigationClassinv: self.feature->select( oclIsKindOf(NavigationAttribute) ).derivedFromAttributes->
forAll( f | self.derivedFrom.transitiveClosure->exists(feature=f) )
Metamodelling UWE Method
ConceptualAttribute(UWE.Foundation.Core.Conceptual)
ConceptualClass(UWE.Foundation.Core.Conceptual)
NavigationNode
Attribute(Foundation.Core)
NavigationAttribute
NavigationClass
*+derivedFromAttributes*
*+derivedFrom1
* <<implicit>>
27
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 53
classes → elements with stereotype
notation
<<navigation class>>MyNavigationClass
attributes → tagged values
<<navigation class>>MyNavigationClass
{isLandmark}
UML Profile
systematic rules for mapping a metamodel to a UML profile:
abstract syntax
NavigationClass
NavigationNodeisLandmark : Boolean
inheritance → inheritance among stereotypesrepeated mapping of attributes and associations
«navigation node»
«navigation class»
associations → tagged values or associations (for classifiers)
<<navigation class>>MyNavigationClass
{isLandmark,derivedFrom=MyCClass}
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 54
Contents
Web Engineering ApproachModelling with UML and UWE NotationModelling supported by UWE MethodMetamodel for UWETool support with ArgoUWEUWE Development ProcessFuture Work and Trends in Web Engineering
28
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 55
ArgoUWE
designed for the systematic construction of Web applicationsprovides specific notation for Web applicationsallows for separation of concerns: domain, navigation, presentation and business processessupports the UWE method performing semi-automatic model generationproduces XMI output as basis for code generationsupports model validationextends the NSUML library with the UWE metamodel
implemented as a plugin for ArgoUML
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 56
ArgoUWE*
supports notation of UWE and method of UWE
ArgoUWE extension of open source ArgoUML
model checker based on OCL constraints
generates XMI
*www.pst.ifi.lmu.de/projekte/argouwe
29
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 57
Modeling with ArgoUWE: Use Casese-shop
Checkout
SignIn
AddToShoppingCart
SelectProductItems
ViewCart
SearchProductItems
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 58
Modeling with ArgoUWE: Conceptual Model
manual marking of conceptual classes as navigation relevantautomatic generation of navigation classesdifferent navigation views for same domain model
30
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 59
Semi-automatic Navigation Model Generation
automatic generation of indexes
automatic generation of menus
manual adding of navigation classes and navigation links
manual integration of process features
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 60
Consistency Check & Design Critics
ArgoUML cognitive design critics background threadwarning mechanism for model inconsistencieswizard for design improvementuses critics pane for the critiques
displays wizards comments in detail pane
ArgoUWE design critics featuresinherits from ArgoUML (e.g. name collision)is extended by all wellformedness constraints of UWE (e.g. relationship between use case and process model)
31
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 61
Consistency Check & Design Critics
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 62
ArgoUWE: Plugin Architecture
Novosoft UML library (NSUML)
graph editingframework (GEF)
open-sourceArgoUML
Java Plugin
XML/XMI generator
ArgoUWE plugin
PropertyPanel Critic
UML / UWE model
Model Facade & Factories
ArgoUML
UWE Diagram
FigEdgeFigNode
Graph Model
32
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 63
improvement of the tool usabilitycode generationenhancement with modeling elements to build platform specific web modelsdefinition of transformations rules from PIMs to PSMs (based on the MDA principles)ArgoUWE extension for mobile and personalized web applicationsmigration to another tool supporting UML 2.0 notation?
Future Steps in the Development of ArgoUWE
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 64
Contents
Web Engineering ApproachModelling with UML and UWE NotationModelling supported by UWE MethodMetamodel for UWETool support with ArgoUWEUWE Development ProcessFuture Work and Trends in Web Engineering
33
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 65
Process Tailoring
process to domain to company to area to project
„Tailoring“ of general processesto specific development,
such as for the development of web applications
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 66
Requirements for a Web Process
short release cyclesdevelopment in 3 to 6 months on averageheterogeneous development teamstrong competitive market
separation of concernschange management
continuous update of the contentchanges in the hypertext structurefrequent improvement of the user interfaceadaptation to new technologies and standards
34
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 67
UWE Development Process
based on Unified Process (UP) was defined in 1999requires update with incorporation of elements of agile process (best practice)development is supported by a set of workflowsbased on concepts of role, activity, artifact, tool, etc. similar: Conallen's approach
WAE: Web Application ExtensionRUP-based
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 68
Visual Representation of the Process
ProjectManagement
Risk Management
Iteration Planing
Iteration Evaluation
DevelopmentProcess
RequirementsCapture
Analysis & Design
Implemen-tation
Quality Management
ValidationVerification
Testing
Iteration Workflow
35
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 69
UWE: Risk Management
ActionListfor risk strategy
EvaluateRisks
IdentifyRisks
Project Manager
AnalyseRisk Impact
Prioritise Risks
Define Actionsfor Risk Strategy
Risk List
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 70
How is the UWE process defined?
by workflows (visual representation)by guidelines/checklists for the activities
e.g. elicit user navigation needsWhat information do users want to see at first glance?What kind of searches will they perform?How can the length of navigation paths be optimised?…
by skill lists for experts (workers) needed for each activitye.g. multimedia designer
knowledge of tools for creation and manipulation of images, videos, audios, …experience in design, integration and synchronisation of multimedia elementscreativity skills…
by description of artifactse.g. templates for risk list, iteration plan, use case description,…
36
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 71
Contents
Web Engineering ApproachModelling with UML and UWE NotationModelling supported by UWE MethodMetamodel for UWETool support with ArgoUWEUWE Development ProcessFuture Work and Trends in Web Engineering
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 72
Future Work: UML-based Web Engineering
Topicscomplete migration to UML 2.0emphasis on requirements engineering tool supported MDA processextension of tool support: e.g. plug in for eclipsefocus on generation and testing analysis of the power of aspect-oriented modelling for UWE
Resourcesfunding of the DFG German Research Office for 2005 -2007 two PhD Thesis students final work (e.g. extensions to ArgoUWE, eclipse plug-in)
37
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 73
focus on requirements engineering
model driven vs. agile development
emphasis on tool support
domain specific language (DSL) based on UML
from overhelming diversity of methodologies towards a „Unified Web Modeling Language“ ?
Trends in Web Engineering
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 74
Vision for Web Application Development
HDM1993
1994
1995
1996
1997
1998
1999
2000
2001
2002
RMM
EORM
OOHDM
WSDM
SOHDM RNA HFPM
WAE
WebML UWEW2000
2003 OOH
OO-Method
OOWS
Web Composition
NDT
Data-oriented
Process-orientedOO-oriented Implementation-
orientedHypertext-oriented
HDM-Lite
2004 WebSA
eW3DT
Hera
?
38
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 75
References
UWE: http://www.pst.ifi.lmu.de/projekte/uweArgoUWE: http//www.pst.ifi.lmu.de/projekte/argouwewww.pst.informatik.uni-muenchen.de/~kochn/
OMG UML Specification v. 1.5 - OMG document formal [03-03-01]OMG UML 2.0 Superstructure RfP - OMG [ad/09-09-02]
Hypermedia & the Web – An Engineering Approach, David Lowe & Wendy Hall John Wiley & Sohn (1999)
Designing Data-Intensive Web Applications. Stefano Ceri, Piero Fraternali, Aldo Bongio, Marco Brambilla, Sara Comai, Maristella Matera. Morgan-Kaufmann (2003)
Building Web Applications with UML. Jim Conallen. Addison-Wesley (2003)
Web Engineering: Systematic Development of Web Applications. Gerti Kappel, Birgid Pröll, Siegfried Reich, Werner Retschitzeger (Eds.) dpunkt-verlag (German Version, 2003), English version to appear October 2005
UML-Based Web Engineering © Nora Koch Sevilla, 21.04.2005, 76
Muchas gracias! ☺
Nora Kochnora.koch (at) pst.ifi.lmu.dewww.pst.informatik.uni-muenchen.de/~kochn
uwe (at) pst.ifi.lmu.de