Upload
sreejith-sree
View
136
Download
1
Embed Size (px)
DESCRIPTION
Analysis of web based applications
Citation preview
1
Web Engineering
A presentation byAthul Sai(P3MCA12012)Sreejith S(P3MCA12036)
2
Web ApplicationsWeb Applications
WebApps encompass: complete Web sites
Simple information Web sites Complex e-Commerce of other sites with embedded
functionality and data retrieval Complex Web sites that are interoperable with other legacy
software and systems
specialized functionality within Web sites information processing applications that reside on the
Internet or on an intranet or ExtraNet.
WebApps encompass: complete Web sites
Simple information Web sites Complex e-Commerce of other sites with embedded
functionality and data retrieval Complex Web sites that are interoperable with other legacy
software and systems
specialized functionality within Web sites information processing applications that reside on the
Internet or on an intranet or ExtraNet.
3
WebApp Attributes—IWebApp Attributes—I Network intensiveness. A WebApp resides on a network
and must serve the needs of a diverse community of clients.
Concurrency. A large number of users may access the WebApp at one time; patterns of usage among end-users will vary greatly.
Unpredictable load. The number of users of the WebApp may vary by orders of magnitude from day to day.
Performance. If a WebApp user must wait too long (for access, for server-side processing, for client-side formatting and display), he or she may decide to go elsewhere.
Network intensiveness. A WebApp resides on a network and must serve the needs of a diverse community of clients.
Concurrency. A large number of users may access the WebApp at one time; patterns of usage among end-users will vary greatly.
Unpredictable load. The number of users of the WebApp may vary by orders of magnitude from day to day.
Performance. If a WebApp user must wait too long (for access, for server-side processing, for client-side formatting and display), he or she may decide to go elsewhere.
4
WebApp Attributes—IIWebApp Attributes—II Availability. Although expectation of 100 percent
availability is unreasonable, users of popular WebApps often demand access on a “24/7/365” basis.
Data driven. The primary function of many WebApps is to use hypermedia to present text, graphics, audio, and video content to the end-user.
Content sensitive. The quality and aesthetic nature of content remains an important determinant of the quality of a WebApp.
Continuous evolution. Unlike conventional application software that evolves over a series of planned, chronologically-spaced releases, Web applications evolve continuously.
Availability. Although expectation of 100 percent availability is unreasonable, users of popular WebApps often demand access on a “24/7/365” basis.
Data driven. The primary function of many WebApps is to use hypermedia to present text, graphics, audio, and video content to the end-user.
Content sensitive. The quality and aesthetic nature of content remains an important determinant of the quality of a WebApp.
Continuous evolution. Unlike conventional application software that evolves over a series of planned, chronologically-spaced releases, Web applications evolve continuously.
5
WebApp Attributes—IIIWebApp Attributes—III Immediacy. WebApps often exhibit a time to market that
can be a matter of a few days or weeks. With modern tools, sophisticated Web pages can be
produced in only a few hours. Security. In order to protect sensitive content and provide
secure modes of data transmission, strong security measures must be implemented throughout the infrastructure that supports a WebApp and within the application itself.
Aesthetics. When an application has been designed to market or sell products or ideas, aesthetics may have as much to do with success as technical design.
Immediacy. WebApps often exhibit a time to market that can be a matter of a few days or weeks. With modern tools, sophisticated Web pages can be
produced in only a few hours. Security. In order to protect sensitive content and provide
secure modes of data transmission, strong security measures must be implemented throughout the infrastructure that supports a WebApp and within the application itself.
Aesthetics. When an application has been designed to market or sell products or ideas, aesthetics may have as much to do with success as technical design.
6
WebApp CategoriesWebApp Categories informational—read-only content is provided with simple navigation and links download—a user downloads information from the appropriate server customizable—the user customizes content to specific needs interaction—communication among a community of users occurs via chatroom,
bulletin boards, or instant messaging user input—forms-based input is the primary mechanism for communicating
need transaction-oriented—the user makes a request (e.g., places an order) that is
fulfilled by the WebApp service-oriented—the application provides a service to the user, e.g., assists the
user in determining a mortgage payment Portal—the application channels the user to other Web content or services
outside the domain of the portal application database access—the user queries a large database and extracts information data warehousing—the user queries a collection of large databases and extracts
information
informational—read-only content is provided with simple navigation and links download—a user downloads information from the appropriate server customizable—the user customizes content to specific needs interaction—communication among a community of users occurs via chatroom,
bulletin boards, or instant messaging user input—forms-based input is the primary mechanism for communicating
need transaction-oriented—the user makes a request (e.g., places an order) that is
fulfilled by the WebApp service-oriented—the application provides a service to the user, e.g., assists the
user in determining a mortgage payment Portal—the application channels the user to other Web content or services
outside the domain of the portal application database access—the user queries a large database and extracts information data warehousing—the user queries a collection of large databases and extracts
information
WebE layersWebE layers
7
8
The WebE ProcessThe WebE Process
Must accommodate: Incremental delivery Frequent changes Short timeline
Therefore, An incremental process model should be used in
virtually all situations An agile process model is appropriate in many
situations
Must accommodate: Incremental delivery Frequent changes Short timeline
Therefore, An incremental process model should be used in
virtually all situations An agile process model is appropriate in many
situations
9
The WebE ProcessThe WebE Process
software increment
Release
refactoring
business analysis formulation
iteration plan
analysis model content iteration function configuration
design model content architecture navigation interface
coding component test
acceptance test customer use
customer evaluation
10
The WebE Process Framework—IThe WebE Process Framework—I Customer communication
Business analysis defines the business/organizational context for the WebApp.
Formulation is a requirements gathering activity involving all stakeholders. The intent is to describe the problem that the WebApp is to solve
Planning The “plan” consists of a task definition and a timeline
schedule for the time period (usually measured in weeks) projected for the development of the WebApp increment.
Customer communication Business analysis defines the business/organizational
context for the WebApp. Formulation is a requirements gathering activity involving
all stakeholders. The intent is to describe the problem that the WebApp is to solve
Planning The “plan” consists of a task definition and a timeline
schedule for the time period (usually measured in weeks) projected for the development of the WebApp increment.
11
The WebE Process Framework—IIThe WebE Process Framework—II Modeling
Analysis model—establishes a basis for design Content Analysis. Interaction Analysis. Functional Analysis. Configuration Analysis.
Design model—represents key WebApp elements Content design Aesthetic design Architectural design Interface design Navigation design Component design
Modeling Analysis model—establishes a basis for design
Content Analysis. Interaction Analysis. Functional Analysis. Configuration Analysis.
Design model—represents key WebApp elements Content design Aesthetic design Architectural design Interface design Navigation design Component design
12
The WebE Process Framework—IIIThe WebE Process Framework—III Construction
WebE tools and technology are applied to construct the WebApp that has been modeled
Testing of all design elements
Delivery and Evaluation (Deployment) configure for its operational environment deliver to end-users, and Evaluation feedback is presented to the WebE team the increment is modified as required (the beginning of the next
incremental cycle)
Construction WebE tools and technology are applied to construct the WebApp
that has been modeled Testing of all design elements
Delivery and Evaluation (Deployment) configure for its operational environment deliver to end-users, and Evaluation feedback is presented to the WebE team the increment is modified as required (the beginning of the next
incremental cycle)
13
WebE—Best PracticesWebE—Best Practices Take the time to understand the business needs and product
objectives, even if the details of the WebApp are vague. Describe how users will interact with the WebApp using a
scenario-based approach Develop a project plan, even it its very brief. Spend some time modeling what it is that you’re going to build. Review the models for consistency and quality. Use tools and technology that enable you to construct the
system with as many reusable components as possible. Don’t rely on early users to debug the WebApp—design
comprehensive tests and execute them before releasing the system.
Take the time to understand the business needs and product objectives, even if the details of the WebApp are vague.
Describe how users will interact with the WebApp using a scenario-based approach
Develop a project plan, even it its very brief. Spend some time modeling what it is that you’re going to build. Review the models for consistency and quality. Use tools and technology that enable you to construct the
system with as many reusable components as possible. Don’t rely on early users to debug the WebApp—design
comprehensive tests and execute them before releasing the system.
14
Analysis Modeling for WebApps
15
AnalysisAnalysis Content Analysis. The full spectrum of content to be provided
by the WebApp is identified, including text, graphics and images, video, and audio data. Data modeling can be used to identify and describe each of the data objects.
Interaction Analysis. The manner in which the user interacts with the WebApp is described in detail. Use-cases can be developed to provide detailed descriptions of this interaction.
Functional Analysis. The usage scenarios (use-cases) created as part of interaction analysis define the operations that will be applied to WebApp content and imply other processing functions. All operations and functions are described in detail.
Configuration Analysis. The environment and infrastructure in which the WebApp resides are described in detail.
Content Analysis. The full spectrum of content to be provided by the WebApp is identified, including text, graphics and images, video, and audio data. Data modeling can be used to identify and describe each of the data objects.
Interaction Analysis. The manner in which the user interacts with the WebApp is described in detail. Use-cases can be developed to provide detailed descriptions of this interaction.
Functional Analysis. The usage scenarios (use-cases) created as part of interaction analysis define the operations that will be applied to WebApp content and imply other processing functions. All operations and functions are described in detail.
Configuration Analysis. The environment and infrastructure in which the WebApp resides are described in detail.
16
When Do We Perform Analysis?When Do We Perform Analysis?
In some WebE situations, analysis and design merge. However, an explicit analysis activity occurs when … the WebApp to be built is large and/or complex the number of stakeholders is large the number of Web engineers and other contributors is large the goals and objectives (determined during formulation) for
the WebApp will effect the business’ bottom line the success of the WebApp will have a strong bearing on
the success of the business
In some WebE situations, analysis and design merge. However, an explicit analysis activity occurs when … the WebApp to be built is large and/or complex the number of stakeholders is large the number of Web engineers and other contributors is large the goals and objectives (determined during formulation) for
the WebApp will effect the business’ bottom line the success of the WebApp will have a strong bearing on
the success of the business
17
The User HierarchyThe User Hierarchy
SafeHomeAssured.com user
Figure 18.1 User hierarchy for SafeHomeAssured.com
guest registered user
customer service staff
exist ing customernew customer
18
Use-Case DiagramUse-Case Diagram
Figure 18.2 Use-case diagram for new-customer
new customer
log-in to SafeHomeAssured.com
customize SafeHome
describe home layout
select SafeHome
components
save configuration
purchase configuration
view shopping cart
provide purchase data
recall saved configuration
peruse descriptive content
complete SafeHome order
customization functionality
e-commerce functionality
<<include>>
<<include>>
<<include>>
<<include>>
<<include>>
<<include>>
19
The Content ModelThe Content Model Content objects are extracted from use-cases
examine the scenario description for direct and indirect references to content
Attributes of each content object are identified The relationships among content objects and/or the
hierarchy of content maintained by a WebApp Relationships—entity-relationship diagram or UML Hierarchy—data tree or UML
Content objects are extracted from use-cases examine the scenario description for direct and
indirect references to content Attributes of each content object are identified The relationships among content objects and/or the
hierarchy of content maintained by a WebApp Relationships—entity-relationship diagram or UML Hierarchy—data tree or UML
20
Data TreeData Tree
Figure 18.3 Data tree for a SafeHome component
component
partNumber
partName
partType
description
price
MarketingDescription
Photograph
TechDescription
Schematic
Video
WholesalePrice
RetailPrice
21
Analysis ClassesAnalysis Classes
Analysis classes are derived by examining each use-case
A grammatical parse is used to identify candidate classes
A UML class diagram is developed for each analysis class
Analysis classes are derived by examining each use-case
A grammatical parse is used to identify candidate classes
A UML class diagram is developed for each analysis class
22
Analysis Class ExampleAnalysis Class Example
Figure 18.4 Analysis classes for use-case: select SafeHome components
BillOfMaterials
identifier priceTotal
addEntry() deleteEntry() editEntry() name() save() computePrice()
ProductComponent
partNumber partName partType description price
createNewItem() getDescription() getTechSpec
BoMItem
quantity price
addtoList() deletefromList()
Sensor Camera ControlPanel SoftFeature
1
*
1
*
23
The Interaction ModelThe Interaction Model
Composed of four elements: use-cases sequence diagrams state diagrams a user interface prototype
Each of these is an important UML notation
Composed of four elements: use-cases sequence diagrams state diagrams a user interface prototype
Each of these is an important UML notation
24
Sequence DiagramSequence Diagram
Figure 18.5 Sequence diagram for use-case: select SafeHome components
new customer
:Room :FloorPlan
describes
room*places room in f loor plan
:Product Component
selects product component*
:Billof Materials
add to BoM
FloorPlan Repository
save f loor plan conf iguration
save bill of materials
BoM Repository
25
State DiagramState Diagram
Figure 18.6 Partial state diagram for new customer interaction
new customer
Validating user
system status=“input ready” display msg = “enter userid” display msg =“enter pswd”
entry/ log-in requested do: run user validation exit/set user access switch
select “log-in”
userid validated
password validated
Selecting user action
system status=“link ready” display: navigation choices”
entry/ validated user do: link as required exit/user action selected
select other functions
select customization functionality
select e-commerce (purchase) functionality
Customizing
system status=“input ready” display: basic instructions
entry/validated user do: process user selection exit/ customization terminated
select descriptivecontent
room being defined
Defining room
system status=“input ready” display: room def. window
entry/ room def. selected do: run room queries do: store room variables exit/room completed
select descriptivecontent
Building floor plan
system status=“input ready” display: floor plan window
entry/ floor plan selected do: insert room in place do: store floor plan variables exit/room insertion completed
select descriptivecontent
select enter room in floor plan
Saving floor plan
system status=“input ready” display: storage indicator
entry/ floor plan save selected do: store floor plan exit/save completed
select save floor plan
room insertion completed
next selection
customization complete
all roomsdefined
26
The Functional ModelThe Functional Model
The functional model addresses two processing elements of the WebApp user observable functionality that is delivered by
the WebApp to end-users the operations contained within analysis classes
that implement behaviors associated with the class.
An activity diagram can be used to represent processing flow
The functional model addresses two processing elements of the WebApp user observable functionality that is delivered by
the WebApp to end-users the operations contained within analysis classes
that implement behaviors associated with the class.
An activity diagram can be used to represent processing flow
27
Activity DiagramActivity Diagram
Figure 18.7 Activity diagram for computePrice() operation
init ialize totalCost
invokecalcShippingCost
get price and quantity
components remain on BoMList
invoke determineDiscount
discount <= 0
discount>0 totalCost= totalCost - discount
taxTotal=totalCost x taxrate
no components remain on BoMList
lineCost = price x quantity
add lineCost to totalCost
priceTotal = totalCost + taxTotal + shippingCost
returns: shippingCost
returns: discount
28
The Configuration ModelThe Configuration Model Server-side
Server hardware and operating system environment must be specified
Interoperability considerations on the server-side must be considered
Appropriate interfaces, communication protocols and related collaborative information must be specified
Client-side Browser configuration issues must be identified Testing requirements should be defined
Server-side Server hardware and operating system environment
must be specified Interoperability considerations on the server-side must
be considered Appropriate interfaces, communication protocols and
related collaborative information must be specified Client-side
Browser configuration issues must be identified Testing requirements should be defined
29
Relationship-Navigation AnalysisRelationship-Navigation Analysis Relationship-navigation analysis (RNA) identifies relationships
among the elements uncovered as part of the creation of the analysis model
Steps: Stakeholder analysis—identifies the various user categories and
establishes an appropriate stakeholder hierarchy Element analysis—identifies the content objects and functional
elements that are of interest to end users Relationship analysis—describes the relationships that exist among
the WebApp elements Navigation analysis—examines how users might access individual
elements or groups of elements Evaluation analysis—considers pragmatic issues (e.g., cost/benefit)
associated with implementing the relationships defined earlier
Relationship-navigation analysis (RNA) identifies relationships among the elements uncovered as part of the creation of the analysis model
Steps: Stakeholder analysis—identifies the various user categories and
establishes an appropriate stakeholder hierarchy Element analysis—identifies the content objects and functional
elements that are of interest to end users Relationship analysis—describes the relationships that exist among
the WebApp elements Navigation analysis—examines how users might access individual
elements or groups of elements Evaluation analysis—considers pragmatic issues (e.g., cost/benefit)
associated with implementing the relationships defined earlier
30
Navigation Analysis-INavigation Analysis-I Should certain elements be easier to reach (require fewer
navigation steps) than others? What is the priority for presentation?
Should certain elements be emphasized to force users to navigate in their direction?
How should navigation errors be handled? Should navigation to related groups of elements be given
priority over navigation to a specific element. Should navigation be accomplished via links, via search-based
access, or by some other means? Should certain elements be presented to users based on the
context of previous navigation actions? Should a navigation log be maintained for users?
Should certain elements be easier to reach (require fewer navigation steps) than others? What is the priority for presentation?
Should certain elements be emphasized to force users to navigate in their direction?
How should navigation errors be handled? Should navigation to related groups of elements be given
priority over navigation to a specific element. Should navigation be accomplished via links, via search-based
access, or by some other means? Should certain elements be presented to users based on the
context of previous navigation actions? Should a navigation log be maintained for users?
31
Navigation Analysis-IINavigation Analysis-II Should a full navigation map or menu (as opposed to a single
“back” link or directed pointer) be available at every point in a user’s interaction?
Should navigation design be driven by the most commonly expected user behaviors or by the perceived importance of the defined WebApp elements?
Can a user “store” his previous navigation through the WebApp to expedite future usage?
For which user category should optimal navigation be designed?
How should links external to the WebApp be handled? overlaying the existing browser window? as a new browser window? as a separate frame?
Should a full navigation map or menu (as opposed to a single “back” link or directed pointer) be available at every point in a user’s interaction?
Should navigation design be driven by the most commonly expected user behaviors or by the perceived importance of the defined WebApp elements?
Can a user “store” his previous navigation through the WebApp to expedite future usage?
For which user category should optimal navigation be designed?
How should links external to the WebApp be handled? overlaying the existing browser window? as a new browser window? as a separate frame?
THANK YOU THANK YOU
32