Assignment 2 Shoping Online
Assignment 2 Shoping Online
ASSIGNMENT
INDIVIDUAL ASSIGNMENT 2
ONLINE SHOPPING
BY :
B22110039 TUAN MUHAMMAD SHAHRUL AZLAN
BIN TUAN ABDUL RAHMAN
SUBMITTED TO :
SIR SYAHRUDDIN
Assignment 2 Instructions:
As a project manager for the online shopping system project in the previous assignment, you
have conducted the feasibilities study for the online shopping system project. Based on that
feasibility study, you are now required to specify and design an online shopping system using
the object-oriented analysis and design techniques that you learn in this course. You are free to
conceptualize and document the requirements and design for the online shopping system.
1. Construct use case diagram(s) that model the functionality of whole system.
2. Provide a complete description of each use case in the diagram produced in step
1 above.
3. Construct a class diagram that models the classes and objects that participate in
the execution of this system. Provide enough class attributes and operations in the
diagram. Write a brief textual description for each of these classes.
5. For each major use case, construct a sequence diagram that models the interaction
between objects that participate in its execution.
6. Construct a state-machine diagram for any object that has interesting dynamic
behavior.
7. Construct any other diagrams that you think are useful for the development of
the Analysis Model of the system. (Optional)
8. Write a report describing what you have achieved and produced in this assignment.
Table of Contents
1. Introduction ..................................................................................................................... 5
1.1 Scope .....................................................................................................................
1.2 Platform Specifications – Deployment ............................................................... 6
1.2.1 Hardware Specification ......................................................................................
1.2.2 Software Specification .......................................................................................
2. System Requirement Analysis ........................................................................................ 7
2.1 System Feasibility .................................................................................................
2.1.1 Economic Feasibility .........................................................................................
2.1.2 Technical Feasibility ..........................................................................................
2.1.3 Behavioral Feasibility ........................................................................................
3. System Analysis .............................................................................................................. 8
3.1 ER Diagram ..........................................................................................................
3.2 Data Flow Diagram ............................................................................................. 9
3.3 Use case Diagram ............................................................................................. 13
3.4 Class Diagram ................................................................................................... 14
4. Design ...............................................................................................................................
4.1 Design Goals .........................................................................................................
4.2Architectural Design ................................................................................................ 15
4.2.1Architectural Context Diagram .............................................................................
4.2.2 Description of Architectural Design ..................................................................
4.3 Procedural/Modular Approach.......................................................................... 16
4.3.1 Shop Products Module .......................................................................................
4.3.2 Product Description Module ..............................................................................
4.3.3 Cart Details Module ...........................................................................................
5. Implementation ............................................................................................................ 17
5.1 Database Design and Implementation ..................................................................
5.2 User Interface Design and Implementation ...................................................... 18
5.3 Technical Discussions ....................................................................................... 22
6. Testing........................................................................................................................... 22
6.1 Unit Testing ..........................................................................................................
6.2 Integration Testing ......................................................................................................
6.3 Validation Testing ............................................................................................. 24
6.4 White Box Testing ............................................................................................ 25
6.5 Performance Testing .............................................................................................
7. Results & Challenges .................................................................................................... 28
7.1 Challenges .............................................................................................................
iii
8. Conclusions .......................................................................................................................
8.1Limitations .............................................................................................................
8.2 Scope for Future Work...................................................................................... 29
9. References ..................................................................................................................... 30
iv
1. Introduction
To develop an easy to use web based interface where users can search for products,
view a complete description of the products and order the products.
A search engine that provides an easy and convenient way to search for products
specific to their needs. The search engine would list a set of products based on the
search term and the user can further filter the list based on various parameters.
An AJAX enabled website with the latest AJAX controls giving attractive and
interactive look to the web pages and prevents the annoying post backs.
Drag and Drop feature which would allow the users to add a product to or remove
a product from the shopping cart by dragging the product in to the shopping cart
or out of the shopping cart.
A user can view the complete specification of the product along with various
images and also view the customer reviews of the product. They can also write their
own reviews.
1.1 Scope
The current system can be extended to allow the users to create accounts and
save products in to wish list.
The users could subscribe for price alerts which would enable them to receive
messages when price for products fall below a particular level.
The current system is confined only to the shopping cart process. It can be
extended to have a easy to use check out process.
Users can have multiple shipping and billing information saved. During
checkout they can use the drag and drop feature to select shipping and billing
information.
5
1.2 Platform Specifications – Deployment
Hardware Specification
Processor P IV
RAM 250 MB
Software Specification
6
2. System Requirement Analysis
2.1 System Feasibility
The system feasibility can be divided into the following sections:
The project is economically feasible as the only cost involved is having a computer with
the minimum requirements mentioned earlier. For the users to access the application, the
only cost involved will be in getting access to the Internet.
To deploy the application, the only technical aspects needed are mentioned below:
For Users:
Internet Browser
Internet Connection
The application requires no special technical guidance and all the views available
in the application are self explanatory. The users are well guided with warning and failure
messages for all the actions taken.
7
3. System Analysis
After carefully analyzing the requirements and functionality of the web application,
I had two important diagrams by the end of the analysis phase. They are the ER diagram
and data flow diagram which were the basis for finding out entities and relationships
between them, the flow of information.
3.1 ER Diagram
8
3.2 Data Flow Diagram
9
Figure 3.3: A First Level Diagram
10
Figure 3.4: A Second Level Diagram
11
Figure 3.5: A Second Level Diagram
12
3.3 Use Case Diagram
13
3.4 Class Diagram
4. Design
4.1 Design Goals
The design of the web application involves the design of the forms for listing the
products, search for products, display the complete specification for the product,
and design a shopping cart that is easy to use.
Design of an interactive application that enables the user to filter the products based
on different parameters.
Design of an application that has features like drag and drop etc.
Design of application that decreases data transfers between the client and the server.
14
4.2Architectural Design
4.2.1 Architectural Context Diagram
In this context diagram, the information provided to and received from the ‘Online
Shopping’ is identified. The arrows represent the information received or generated by the
application. The closed boxes represent the set of sources and sinks of information.
15
In the system, we can observe that the user interacts with the application through
a graphical user interface. The inputs to the system are the Search and Filter criteria
provided by the user and a new review written by the user. Also, the output is in the form
of Repeater and grid views which present the users with list of Products available. The
users can view complete specification, view Images and reviews by other users.
Following are all the modules designed for the Online Shopping System.
This module starts when the user visits the home page or when a user searches for
a product by entering a search term. This part of the application includes displaying all
the products that are available or the products that match the search term entered by the
user. The user can then filter these products based on various parameters like manufacturer,
product type, operating system supported or a price range. The user browse through the
products and each product would be displayed with an image and its features like operating
system supported, number of user licenses and if it is a full version or an upgrade version.
A user can add a product to the cart either by dragging the product and dropping it in the
cart or by clicking a button. The user would be able to see the shopping cart summary.
This module starts when a user visits the product description page. A user can view
various images of the product of different sizes. The use can see an enlarged image in a
popup window. The user can view the complete specification of the product like its
features, operating system supported, system requirements etc. A user can also view the
manufacturer information and also information about rebates, exchange policies etc. A user
can also view the reviews of the product. A user can also write a review for the product.
This module starts when the user views the shopping cart. All the products that have
been added to the shopping cart by the user are listed along with their price and the quantity.
The total price of all the products added to cart is displayed. A user can edit the quantity of
each product or remove the product from the shopping cart. A user can remove the product
from the cart by clicking a button or by dragging the product and dropping it outside the
cart. The total price changes accordingly when a user edits the quantity of a product or
when a product is removed from the cart.
16
5. Implementation
These are the main tables in the application and others are lookup and query tables. The
tables were derived from the ER-Diagram.
17
5.2 User Interface Design and Implementation
The user interface of the application has been designed using Microsoft Visual
Studio 2008. The main controls used in the design are Repeaters, Ajax Update panels, Ajax
toolkit controls like modal popup, textbox watermark and Auto complete controls.
The user can see the list of products that are available. The user can search for
products by entering the search term into the search textbox provided on the top. This text
box is watermarked with the words “Search Terms” to let the user know that this is the
place to enter the search terms. The user can filter the products by using the dropdown lists.
A user can drag and drop a product in the shopping cart. This is shown in the figure
5.3. The cart is updated accordingly as shown in figure 5.4
18
Figure 5.3 Figure showing Drag and Drop a product in the cart
19
A user can view the complete description of the product by clicking on the product link.
This is shown in figure 5.5. The user can move the cursor on to the small images to view
the same image in the enlarged position. The user can click on the enlarged picture to see
a still bigger image in a pop up window as shown Figure 5.6
20
A user can also write a review by clicking on the write review tab panel as shown in figure
5.7. Similarly a user can click on the tab panel customer reviews, specifications,
manufacturer Info etc to see the respective information.
The user can click on the Go to cart button to see the Items in the cart as shown in figure
5.8. The Summary is at the bottom of the page.
21
5.3 Technical Discussions
The products can be filtered based on various parameters like Manufacturer, Product
Type, Operating System supported etc. Initially it was decided to have the various list
items predefined. But with time new manufacturers and product types could be added. So
the values for the list of manufacturers and product types are loadeddynamically by
retrieving from the database. Also it was decided initially to have a drop down list for price
range and the user could select a price range from the ranges available.But this would limit
the user’s ability to filter the products based on different price ranges. Instead providing
two text fields so that the user can enter their price range wouldgive them more flexibility.
A product could be added to a shopping cart by dragging it and dropping it in the cart
area. Items in the cart could be removed by clicking a button. To maintain symmetry and
ease of use products could be removed from the cart by dragging the product out of the
cart.
A product can be added to the cart by dragging it and dropping it in the cart. Initially
it was decided that when a product is dropped in the cart the cart summary label could be
updated on the client side without any call to the server and later the session variables
(Shopping cart) could be updated. This would result in loss of information whenthe user
loses internet connection. So when a product is dropped in the cart area a web service is
called and this service updates the session variables for the shopping cart and the cart
summary is recalculated and sent back to the client. This would improve the reliability of
the application.
6. Testing
Software testing is a process of running with intent of finding errors in software.
Software testing assures the quality of software and represents final review of other phases
of software like specification, design, code generation etc.
22
The functionality of the modules was also tested as separate units. Each of the three
modules was tested as separate units. In each module all the functionalities were tested in
isolation.
In the Shop Products Module when a product has been added to cart it has been
made sure that if the item already exists in the shopping cart then the quantity is increased
by one else a new item is created in the shopping cart. Also the state of the system after a
product has been dragged in to the shopping cart is same as the state of the system if it was
added by clicking the add to cart button. Also it has been ensured that all the images of the
products displayed in the shop products page are drag gable and have the product property
so that they can be dropped in the cart area.
In the Product Description Module it has been tested that all the images are
displayed properly. Users can add review and the as soon as a user adds a review it is
updated in the view customer review tab. It has been checked to see if the whole page
refreshes or a partial page update happens when a user writes a review.
In the Cart Details it has been tested that when a user edits a quantity or removes
a product from the cart, the total price is updated accordingly. It has been checked to see
if the whole page refreshes or a partial page update happens when a user edits the cart.
Visual Studio 2008 has in built support for testing the application. The unit testing
can be done using visual studio 2008 without the need of any external application. Various
methods have been created for the purpose of unit testing. Test cases are automatically
generated for these methods. The tests run under the ASP.NET context which means
settings from Web.config file are automatically picked up once the test case starts running.
Methods were written to retrieve all the manufacturers from the database, strings
that match a certain search term, products that match certain filter criteria, all images that
belong to a particular product etc. Unit test cases were automatically generated for these
methods and it can be seen in figure 6.1 that the tests have passed.
23
Figure 6.1 Unit Testing in Visual Studio 2008
- Validation test criteria (no. in place of no. & char in place of char)
- Alpha & Beta testing-Alpha testing is done at developer’s site i.e. at home & Beta testing
once it is deployed. Since I have not deployed my application, I could not do the Beta
testing.
Test Cases- I have used a number of test cases for testing the product. There were different
cases for which different inputs were used to check whether desired output is produced or
not.
1. Addition of a new product to the cart should create a new row in the shopping
cart.
2. Addition of an existing product to the cart has to update the quantity of the
product.
24
3. Any changes to items in the cart have to update the summary correctly.
4. Because same page is inserting data into more than one table in the database
atomicity of the transaction is tested.
5. The state of the system after a product has been dragged in to the cart should be
same as the state of the system if the same product is added to the cart by clicking
a button.
Using white-box testing software developer can derive test case that
• Guarantee that all independent paths within a module have been exercised at least once.
• Exercise all loops at their boundaries and within their operational bound.
At every stage of project development I have tested the logics of the program by supplying
the invalid inputs and generating the respective error messages. All the loops and
conditional statements are tested to the boundary conditions and validated properly.
I have done performance testing to achieve an estimate of the peak and sustained load the
application. This has done with few pages like the Shop Products (extensive Database
access, business logic Intensive and more Images) and the Cart Details (simple page). A
few sample Screenshots of test results are shown below. The tests have been conducted
by running the application (server) and JMeter on same machine. These test results do not
include factors like network bandwidth etc as the server is running on the same machine
along with JMeter.
25
Figure 6.3 Summary Reports for 100 Users and 600 Loop Count for Cart Details Page
In the following test, the number of users has been kept constant and the Loop Count has
been increased.
The above data shows high response average which increases with the loop count.
Observations
Response Time increases rapidly with number of users but not very much when the users
are kept constant and only loop-count is increased. This is because, if the number of users
is kept constant and only the loop count is increased, the number of requests handled by
the server per second remains constant for every execution of the loop count and for
every increase in the loop count. Hence the response time will not increase drastically in
this case. Whereas, if the users are increased and loop count is kept constant, the requests
handled by the server per second increases with increasing users and hence the longer
response time.
26
Comparison of Response Times of the 2 WebPages
Local Testing:
Observations:
Response Time of a complex webpage with database and business logic functions is far
more than a simple webpage.
Remote Testing:
Observations:
Response Time of a complex webpage with database and business logic functions is far
more than a simple webpage. The Response times of remote testing are better than those
of local testing when the number of users is comparatively lesser.
Better Hardware Resources (CPU, RAM, Disks) and Configuration for the
Application as it was hosted on a web server.
JMeter had better access to hardware resources as the application is not on the
same machine.
Using this above tabular data, I can say that the system is adequate to handle the normal
load and the users won’t lose their focus.
27
7. Results & Challenges
The application can be used for any Ecommerce application. It is easy to use, since it
uses the GUI provided in the user dialog. User friendly screens are provided. The
application is easy to use and interactive making online shopping a recreational activity
for users. It has been thoroughly tested and implemented.
7.1 Challenges
The overall idea of doing this project is to get a real time experience. Learn new
technologies.
8. Conclusions
The ‘Online Shopping’ is designed to provide a web based application that would make
searching, viewing and selection of a product easier. The search engine provides an easy
and convenient way to search for products where a user can Search for a product
interactively and the search engine would refine the products available based on the
user’s input. The user can then view the complete specification of each product. They can
also view the product reviews and also write their own reviews. Use of Ajax components
would make the application interactive and prevents annoying post backs. Its drag and drop
feature would make it easy to use.
8.1 Limitations
This application does not have a built in check out process. An external checkout
package has to be integrated in to this application. Also users cannot save the shopping
carts so that they can access later i.e. they cannot create wish lists which they can access
later. This application does not have features by which user can set price ranges for
products and receive alerts once the price reaches the particular range.
28
8.2 Scope for Future Work
The following things can be done in future.
The current system can be extended to allow the users to create accounts and
save products in to wish list.
The users could subscribe for price alerts which would enable them to receive
messages when price for products fall below a particular level.
The current system is confined only to the shopping cart process. It can be
extended to have an easy to use check out process.
Users can have multiple shipping and billing information saved. During
checkout they can use the drag and drop feature to select shipping and billing
information.
29
9. References
All about Microsoft controls in C#
http://www.msdn.microsoft.com/
Wikipedia for various diagrams & testing methods
http://www.wikipedia.org/
Cool text for Images and Buttons
http://cooltext.com/
K-State Research Exchange for samples in report writing
http://krex.k-state.edu/dspace/handle/2097/959
Smart Draw for drawing all the Diagrams used in this report.
http://www.smartdraw.com/
Sample Ecommerce Application
http://www.NewEgg.com
Ajax Toolkit controls
http://asp.net/ajax
30