2021/2022
UNIVERSITY OF BEDFORDSHIRE
DEPARTMENT OF SCIENCE AND TECHNOLOGY
BSc (Hons) Information Technology
CIS017-3
USING ARTIFICIAL INTELLIGENCE AND
RECOMMENDER ALGORITHMS TO INCREASE
SALES IN AN ECOMMERCE SYSTEM.
ASSIGNMENT II: UNDERGRADUATE THESIS REPORT
JOHN SOO HON
STUDENT ID: 2113668
SUPERVISOR NAME: RAVI RAGOONATH
CTS COLLEGE OF BUSINESS AND COMPUTER SCIENCE LTD
Abstract
In today's world, online shopping has provided many people with the convenience of
shopping from the comfort of their own home or while on the go. Businesses and
consumers have integrated Ecommerce technologies into their daily routines to provide
a more flexible and alternative reach to the traditional brick and motor store.
Although many consumers have shifted from outdoor cinema experiences to the comfort
of a home entertainment solution, online movies have become a staple for many.
Customer service features are limited in many local business ecommerce applications.
Advanced features such as recommender systems and customer support AI technology
chatbots are not present in comparison to international well known ecommerce
applications like Amazon.com, Netflix.com and Disneyplus.com.
This report will document the development of an e-commerce web application for an
online movie store, as well as the integration of advanced features such as AI Technology
Chatbot, Online Purchases, Responsive Design, and Recommender systems to improve
the user experience and engagement, resulting in returning customer satisfaction and
increased purchases.
The background research, requirements analysis, design, implementation, testing, and
evaluation phases being utilized in the System Development Life Cycle (SDLC) will be
discussed. A conclusion that highlights and summarizes the project, design, and
functionalities implemented, as well as the experiences gained throughout the project will
be delivered in the end.
Acknowledgements
First and foremost, I want to express my gratitude to God for the opportunities and
blessings that he continues to provide for me.
I am grateful to the University of Bedfordshire for accepting me into the final year of the
BSc IT program, and to CTS College for imparting knowledge and wisdom to me. Mr Ravi
Ragoonath, Mr. Keron Ramganesh, and Mr. Marcus Alexander gave excellent learning
opportunities through their patience, motivation, enthusiasm, and vast knowledge of going
above and beyond to ensure that we all grasped what was required.
To my managers and co-workers your support and guidance is much appreciated and
noted.
Dedication
This thesis is dedicated to my parents, Augustine and Carol Soo Hon, and my siblings. It
goes without saying that I am extremely grateful to my family for their consistent support
and patience in allowing me to focus on my education. Your prayers and words of
encouragement, as well as the prayers you provided, were important in my completion of
the BSc program.
Keywords
E-Commerce, Artificial Intelligence (Chatbot), Recommender-based algorithm, System
Development Life Cycle, Project Management, User
Experience, Online Shopping.
Table of Contents
Chapter 1: Introduction .................................................................................................... 1
1.1
Introduction ........................................................................................................ 1
1.2
The Subject ........................................................................................................ 1
1.3
Project Aim ......................................................................................................... 2
1.4
Project Objectives .............................................................................................. 2
1.5
Summary of Chapters ........................................................................................ 3
Chapter 2: Project Management ..................................................................................... 5
2.1
Introduction ........................................................................................................ 5
2.2
Importance of Project Management ................................................................... 5
2.3
Work Breakdown Structure ................................................................................ 5
2.4
Gantt Chart......................................................................................................... 7
Chapter 3: Background Research ................................................................................... 9
3.1
Introduction ........................................................................................................ 9
3.2
Ecommerce Systems ......................................................................................... 9
3.3
Websites Reviewed .......................................................................................... 12
3.4
Ecommerce Functionalities .............................................................................. 12
3.4.1
Artificial Intelligence ...................................................................................... 12
3.4.2
Recommender System ................................................................................. 16
3.4.3
Online Payment Methods .............................................................................. 18
3.5
Project Related Choices ................................................................................... 19
3.5.1
Software Development Tools ........................................................................ 19
3.5.2
Software Development Methodology ............................................................ 20
3.5.3
Version Control ............................................................................................. 21
3.5.4
User Experience ........................................................................................... 22
3.6
Summary .......................................................................................................... 23
3.7
Recommendations ........................................................................................... 23
Chapter 4: Requirements Analysis ................................................................................ 24
4.1
Introduction ...................................................................................................... 24
4.2
The Process of Producing the Requirements ................................................... 24
4.3
Personas .......................................................................................................... 24
4.4
Functional Requirements (FR) ......................................................................... 26
4.5
Non-Functional Requirements (NFR) ............................................................... 27
4.5
UML Diagrams ................................................................................................. 28
4.6
Information Architecture ................................................................................... 29
4.7
Activity Diagram ............................................................................................... 30
Chapter 5: Design ......................................................................................................... 31
5.1
Introduction ...................................................................................................... 31
5.2
Database Design (Back End Design) ............................................................... 31
5.2.1
ERD .............................................................................................................. 31
5.2.2
Normalization Process .................................................................................. 32
5.2.3
Logical Model ................................................................................................ 33
5.2.4
Data Dictionary ............................................................................................. 34
5.3
Application Design (Front End Design) ............................................................ 35
5.3.1
Nielsen’s Heuristics....................................................................................... 35
5.3.2
Storyboard .................................................................................................... 36
5.3.4
Wireframes ................................................................................................... 37
5.3.4
Interactive Prototype ..................................................................................... 38
Chapter 6: Software Implementation ............................................................................. 38
6.1
Introduction ...................................................................................................... 38
6.2
The Development Environment ........................................................................ 39
6.3
Creation of Database ....................................................................................... 40
6.4
Connection between Database and Front End................................................. 40
6.5
User Interface Implementation ......................................................................... 42
6.5.1 Core Features Implemented ............................................................................. 42
6.5.2
Advanced Features Implemented ................................................................. 61
6.6
Security Consideration ..................................................................................... 67
6.8
Error Messages ................................................................................................ 67
6.9
Version Control ................................................................................................ 69
6.10
Features Not Implemented ........................................................................... 70
Chapter 7: Testing ......................................................................................................... 71
7.1
Introduction ...................................................................................................... 71
7.2
Test Plan .......................................................................................................... 71
7.3
Functionality Testing ........................................................................................ 71
7.4
Non-Functionality Testing ................................................................................ 73
7.5
Defects Log ...................................................................................................... 74
7.6
Analysis of Test Results ................................................................................... 75
Chapter 8: Software Evaluation ..................................................................................... 75
8.1
Introduction ...................................................................................................... 75
8.2
Method of Evaluation ....................................................................................... 75
8.3
The Heuristics .................................................................................................. 75
8.4
Heuristic Report ............................................................................................... 76
8.5
Analysis of Results ........................................................................................... 77
Chapter 9: Conclusion ................................................................................................... 77
9.1
Introduction ...................................................................................................... 77
9.2
Tasks Completed ............................................................................................. 77
9.3
Product Built ..................................................................................................... 77
9.4
Experiences Gained ......................................................................................... 78
References .................................................................................................................... 81
Appendices ................................................................................................................... 87
Appendix A - Requirements Analysis (Core and Advance Functionalities) ................ 87
Appendix B – Data Dictionary .................................................................................... 90
Appendix C – Story Board (Sketches) ....................................................................... 92
Appendix D - Core and Advance Functional Requirements (Testing)........................ 95
Appendix E – Non-Functional Requirements (Testing) .............................................. 99
Appendix F – Nielsen's Heuristics Ten (10) principles Review. ............................... 102
Appendix G – Screenshots of Artefact ..................................................................... 109
Chapter 1: Introduction
1.1
Introduction
The Introductory chapter highlights the project's aims, objectives, and scope, as well as
an overview of the project's background context and identified issue area. The Chapter
will also serve as a roadmap by providing a brief description of each remaining chapter
that will be included in the final report.
1.2
The Subject
In many countries around the world, competitive and convenience-focused culture of
people want to purchase from the comfort of their homes. Ecommerce has become a
flexible alternative for both business and consumer. With the integration of such
technology into everyday life, businesses are forced to adapt and adopt a transition from
the typical brick and mortar store to a more innovative service or face losing customers.
Online Movies have become the staple for many consumers with a shift from outdoor
cinema experience to the comfort of a home entertainment solution. According to Vary
(2020), a study conducted showed that 70% of respondents would rather watch movies
at home vs cinema.
The challenge, however, is that most online movie stores are limited when it comes to
customer service. Customers are unsure of what next selection of movies to choose. This
problem is typically resolved by recommender algorithms through Artificial Intelligence
feeding the consumer options based on the information provided from their last-seen
preferences and geographical location. This project seeks to build an online movie store
that focuses on the customer experience and will employ advanced features such as the
use of a chatbot to enhance user engagement.
There are a few companies in Trinidad and Tobago that offer the traditional ‘brick and
mortar' cinema experience. Movie Towne, Caribbeans Cinemas, and Imax are the
primary stakeholders. While these vendors offer an online e-commerce application, the
challenge is that they all focus on a limited number of features, mainly:
● Currently showing movies (in-person viewing)
● Upcoming movies
● Ticket sales.
These websites are devoid of any enhancements that would encourage user interaction
and repeated return engagements. This project aims to address most of these issues by
delivering an artefact that not only includes online viewing of currently showing cinema
movies but with the inclusion of artificial intelligence (AI) technology in the form of a
chatbot, as well as Recommender Algorithms that will encourage increased engagement
and purchases.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
1
Several strategies will be adopted to conduct this research. The review of existing ecommerce websites will play a primary role in assessing system needs and requirements.
Research will also be conducted through peer sources such as journals and publications
to aid in the drafting of this review.
A study by Balakrishnan et al. (2021) suggests that with the growth of technologies, such
as Artificial Intelligence, marketing and other business-related functions have increasingly
been used by global customers for several reasons. Chatbots taking many forms,
inclusive of conversational representatives/ agents have streamlined the way to assist
and improve in the user making decisions. A study on vxchnge.com by Seal (2019)
reinforces the use of such chatbots increasing by 136% by 2021.
It is expected that by the end of this project, the online Movie store will be able to resolve
issues experienced by offering customers a virtual helpdesk assistant to assist in the
decision-making process of what to watch and what next to watch. Customers may query
into the chatbot based on genre, actors, and/or similarities of previously seen movies. To
enhance user engagement and participation, AI will engage a variety of customer servicebased questionnaire approaches centred around the filtered query information provided.
1.3
Project Aim
This project aims to fill a void in the market for an online movie experience solution. It will
define the requirements, design, and implement (build) an artefact in line with the phases
of the System Development Life Cycle (SDLC) model, with the objective of enhancing
user engagement and sales via the use artificial intelligence (AI) technology and
recommender algorithms.
1.4
Project Objectives
Barber et al. (2019) state that objectives help define goals, identify conflicting activities,
guide elements of the decision-making process, and ensure accountability. Listed below
are the objectives of this project:
● Background Research
To conduct background research effectively to complete a comprehensive study.
Data from reliable sources such as published authoritative articles, books, and
reliable websites will be used to supplement this information. Achievement by
Semester 2, Week 1.
● Requirements Analysis
To finish the requirements analysis by listing and concluding the system's
functional and non-functional needs, eliminating any uncertainty about the
system's intended purpose. Achievement by Semester 2, Week 2.
● Design
To design the artefact and create a model with a substantially functional front-end
interface as well as a database entity-relationship diagram (back-end).
Achievement by Semester 2, Week 3.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
2
● Implementation
To implement the application's functions, using the appropriate programming
languages ensuring deliverables of the final design, features, and functionality are
met. Achievement by Semester 2, Week 10.
● Testing
To test the application by creating a thorough test plan that incorporates various
types of test data to ensure performance is as expected. Achievement by
Semester 2, Week 11.
● Evaluation
To evaluating and determine how well the artefact works, using heuristic evaluation
to resolve a conclusion on the level of functionality. Achievement by Semester 2,
Week 12.
● Completion of the Final Report
To create a final report that includes the previously stated objectives as individual
chapters to document the project's progress. Achievement by Semester 2, Week
13.
1.5
Summary of Chapters
Project Management
Because it is responsible for all elements of a project, project management will look at the
necessity of time management and how to utilize tools like the Gannt Chart and the Work
Breakdown Structure (WBS) to manage project deliverables efficiently and successfully.
Background Research
A project of this magnitude necessitates extensive prior investigation. Information will be
gathered through tools such as the internet, books, journals, and articles from credible
sources. To find reputable sources, Google Scholar, Emerald Insights Library, and
ResearchGate will be used. Background research will be crucial in knowing all
components of the project that will be employed, as well as informing the stages of the
project's System Development Life Cycle (SDLC).
Requirements Analysis
The Requirements Analysis is a critical stage in the project and plays a key role in the
System Development Life Cyle (SDLC). In this phase the technical design of the artefact
is developed, as it will identify the core and advance functional requirements needed for
the artefact as well as the ‘nice to have’ non-functional requirements.
Design
A well-planned and thought through design makes an artefact easier to implement and
eliminates the need for large adjustments in the future. To reduce the time required on
constructing the application, much effort was invested during the design process. This
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
3
section focuses on the database (back-end design) and application design (front end
design).
Implementation
The implementation phase focuses on developing code and producing the artefact in
accordance with the previously designed documentation and requirements. The online
movie shop comes to life at this phase, as both the database (backend) and the artefact
(frontend) are constructed and made to connect with one another.
Testing
The purpose of testing is to perform and validate work done in the implementation phase
based on the function and non-function requirements. It can be defined as the activity to
compare the specified requirements against the artefact design, verifying that they match
and ensuring that no errors occur. In this iterative process the artefact will be tested
repeatedly to ensure quality assurance. A poorly designed and tested applications can
negatively impact the service deliverables required of the artefact to its users.
A test plan will be created to identify each test to be conducted using data (normal,
extreme, and abnormal data) where possible. Testing will be done in focusing on three
areas – usability, functionality, and security. Usability testing will cover the look and feel
of the artefact ensuring a good user experience. Functionality testing will assess the
behaviour of the artefact and how it communicates with the database and performs as
expected. Security testing will look at static and dynamic analysis testing for testing of the
code, it will also include white box and black box testing for security vulnerabilities.
Results from the testing will be recorded in a document with errors being placed in a
defects log which will be used to fix any issues at the end of testing.
Evaluation
The primary objective of the evaluation phase is to gather user feedback. This phase is
different to the testing phase as it will apply the use a Heuristic evaluation to evaluate the
usability if the application. Evaluation is an essential step in software development. If an
application contains usability challenges, requests for customer support will increase
resulting in a negative user experience and impacting on overall customer satisfaction.
After the Heuristic evaluation has been completed a review of the Heuristic Report and
Analysis of Results will be conducted.
Feedback is gathered from a variety of audiences inclusive of sponsors, donors,
administrators, staff, and stakeholders. For this project, the evaluation will be provided
through the academic team at University of Bedfordshire (UoB).
Conclusion
The concluding chapter of this project will look at the work done, the experiences gained,
and the limitations / challenges experienced. It will be a critical self-reflection of the
student’s output in achieving the objective for the software artefact and technical
dissertation.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
4
Chapter 2: Project Management
2.1
Introduction
Serrador (2018) asserts that a key factor in any project success is proper project planning.
This chapter looks at the role of project management. It assesses the significance and
impact of good project and time management by utilizing tools such as the Gannt Chart
in collaboration with the Work Breakdown Structure (WBS) to manage the project’s
deliverables efficiently and effectively.
2.2
Importance of Project Management
According to the Project Management Institute (2010), the application of information,
skills, tools, and procedures to project activities to achieve a project’s requirements is
referred to as project management. A project plan will serve to guide the structure and
execution of the project. It plays a key role in the success of the project and can be
considered the most important aspect by identifying critical elements and allowing for
prioritization across tasks.
For the undergraduate project the student is given a thirteen (13) week period to complete
an individual project. It is critical that the student complete this on time as there are
penalties for late submission. The individual project includes numerous deliverables,
including a software artefact, reflective and technical report, poster, viva, and project
supervisor meetings, and will necessitate a wide variety of skills from the student,
including academic writing and programming.
A work breakdown structure showcasing the main tasks as well as the breaking down
each task into smaller tasks for a more manageable approach will be applied. A Gantt
chart will also be used to display the project activities and to control the schedule and
deliverables along the timeline. It will also help to calculate, manage, and mitigate risks
involved should any arise during the rollout of the project that may affect meeting the
ultimate deadline and quality of work.
Additionally, development plan for the artefact is crucial in ensuring that deliverables of
the Undergraduate Project module are met. A thorough plan outlining the requirements
and specifications (software and hardware) will help to guide the design, implementation,
testing, and evaluation of the artefact.
2.3
Work Breakdown Structure
The major deliverables to be achieved for this project were specified in the Project
Handbook for the Undergraduate Project and utilized to develop the Work Breakdown
Structure (WBS). This depicts the primary tasks in a graphical view, as well as the
breaking down of each activity into smaller tasks for a more manageable approach, as
indicated by Dawson (2017).
The six (6) key tasks form the headings of each milestone with their sub tasks identified
the work to be achieved.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
5
•
•
•
•
•
•
Reflective Report
o Self-Reflection
o List of Chapters of Final Report
Final Report
o Complete Writeup of Each Chapter
Software Artefact
o Develop Core Features
o Develop Advanced Features
Poster
Viva
o Prepare Presentation
o Attend Viva
Project Supervisor Meetings
Figure 1: Work Breakdown Structure
Undergraduate Project
Reflective Report
Self Reflection
List of Chapters of Final
Report
Final Report
Software Artefact
Complete Writeup of
Each Chapter
Develop Core Features
Poster
Develop Advanced
Features
Viva
Project Meetings
Prepare Presentation
Submission
Meeting Report 1
Submission
Meeting Report 2
Introduction
Product Inventory
Management
Online Payment
Review Application
Project Management
Product Filtering Tool
AI Technology (chatbot)
Attend Viva
Background Research
Cart Management
Rocommender System
Requirement Analysis
Customer Profile
Management
Colour Psychology
Design
Customer Ratings
Implementation
Search Tool
Testing
Upcoming Releases
Submission
Meeting Report 3
Submission
Meeting Report 4
Submission
Meeting Report 5
Evaluation
Conclusion
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
6
2.4
Gantt Chart
In project management several tools are used to manage tasks and events. One of the
more popular tools is the use of a Gantt chart. This displays the list of activities to be
accomplished as well as a suitable timeframe scale represented by a horizontal bar to
achieve each task. Briefly, a Gantt Chart will allow to you to see the following:
o List of various activities
o Start and end time of each activity
o The duration of each activity
o Status completed
o Resources assigned for each activity
o Milestone achievable
o Overlapping of activities
o Activity dependencies
o A complete overview of the entire project and its timeframe to completion
With proper project management, a Gantt chart must consider risk factors and include
contingencies in the event of unforeseen circumstances (Dawson, 2015). For this project
the Gantt chart was designed using the Project Handbook for the Undergraduate Project
and outlined in the work breakdown structure (WBS). The six (6) key tasks formed the
headings of each milestone while their sub tasks identified the work to be achieved.
Microsoft Excel was used to create the Gantt Chart. Deadline timeframes was set one
week prior to its due date in-order to meet the deliverables. To keep track and measure
the milestones achieved, a Success Criteria column was added outlining the deliverables
of each activity. Additionally, a percent complete column was included to keep a more
accurate account for the status of each task as seen in Figure 2.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
7
Figure 2. Gantt Chart of Undergraduate Project.
TaskID
Task
Est. Start
Date
Est. End
Date
1
1.1
1.2
1.3
2
Reflective Report
Complete Self Reflection
Develop Listing of Chapters
Discuss content of Chapter
Week 5
Week 5
Week 5.5
Week 6
Week 7
Week 5.5
Week 6
Week 7
2 weeks
0.5 week
0.5 week
Software Artefact
Week 1
Week 12
12 weeks
2.1
Requirements Analysis
Week 1
Week 2
1 week
Design
Implementation
Week 2
Week 4
Week 4
Week 10
2 weeks
6 weeks
2.1
2.2
Testing
Evaluation
User Guide
Final Report
Week 10
Week 11
Week 12
Week 7
Week 11
Week 12
Week 12
Week 12
1 week
1 week
2 days
5 weeks
2.3
2.4
2.5
Introduction Chapter
Project Management Chapter
Background Research Chapter
Week 7
Week 7
Week 8
Week 7
Week 8
0.5 week
0.5 week
3.1
Week 8
0.5 week
3.2
Requirements Analysis Chapter
Week 8
Week 9
0.5 week
3.3
2.2
2.3
2.4
2.5
2.6
3
3.1
3.2
3.3
3.4
3.5
3.6
Duration
Predecessor
Task
1.1
1.2
3.9
4
5
5.1
5.2
5.3
6
6.1
6.2
6.3
6.4
6.5
Actual Start
Date
Actual End
Date
% Complete
Week Week Week Week Week Week Week Week Week
1
2
3
4
5
6
7
8
9
Week
10
Week
11
Week
12
Week
13
Week 14
Submission of Reflective Report
Critical review of time management
All chapters included based on SDLC
Description provided for each chapter of report
Submission of Software Artefact
Detailed List of Functional and Non-Functional
Requirements
A Complete list of normalized tables for Backend; Low
Fidelity Prototype for Front End
A High Fidelity Prototype of the Ecommerce System
A complete set of test plan and test results for the entire
artefact
A heuristic evaluation of the software artefact
Develop a user guide to submit with the artefact
A completed technical report
A chapter outlining the Aims and Objectives and Project
Background
Chapter outlining the Project Management of the Project
Chapter outlining the Literature Review into eCommerce
Application
A complete list of functional and non functional
requirements and use case diagrams
A chapter outlining the work done to develop the
Database back end and the front end.
A chapter outlining the work done in implementing the
application
A chapter outlining the test scripts and the test results
showing evidence of testing along with defects log for all
program defects
A chapter discussing the work done in completing
heuristic evaluation of the system
A refection on the Project as a whole.
Design Chapter
Week 9
Week 10
1 week
3.4
Implementation Chapter
Week 10
Week 11
1 week
3.5
Testing Chapter
Week 11
Week 11
0.5 week
3.6
Evaluation Chapter
Conclusion Chapter
Week 11
Week 12
Week 12
Week 12
Week 12
0.5 week
0.5 week
1 week
3.7
3.7
Poster
Project Viva
Schedule Date for Viva
Prepare Q&A for Verbal
Presentation
Review Application in Preparation
for VIVA
Project Meetings
Project Meeting 1
Project Meeting 2
Project Meeting 3
Project Meeting 4
Project Meeting 5
Week 11
Week 13
Week 13
Week 14
Week 13
1 week
1 day
Week 13
Week 13
0.5 week
5.1
List of Q&As related to the system
Week 13
Week 1
Week 1
Week 4
Week 7
Week 10
Week 13
Week 14
Week 13
Week 1
Week 4
Week 7
Week 10
Week 13
0.5 week
13 weeks
1 day
1 day
1 day
1 day
1 day
5.2
Completion of walkthrough of the user guide.
Submission of 5 Project Progress Reports
Submission of Progress Report 1
Submission of Progress Report 2
Submission of Progress Report 3
Submission of Progress Report 4
Submission of Progress Report 5
3.7
3.8
Success Criteria
Submission of Poster
Completion of Project Viva with Examiners
Have a date and time for Viva
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
8
Chapter 3: Background Research
3.1
Introduction
According to McCombes (2021), the study of theories, methods, and gaps on a specific
topic in existing research from relevant and credible scholarly sources describes a
literature review. Critically analysing, evaluating, and explaining what has been found
from relevant publications such as books, journals and articles will define a good literature
review. Information gathered will be used to inform and guide the project and artefact
planning and execution inclusive of the design and implementation phases.
Figure 3. Steps in Literature Review
Source: University of the Bahamas (cob-bs.libguides.com)
For this project, the literature review will focus on ecommerce and the emerging
technologies such as AI Technology and Recommender Algorithms play a role in
improving online customer experience and will include software tools and development
methodology in project related choices.
3.2
Ecommerce Systems
To understand Ecommerce, we must first understand commerce. Cambridge Dictionary
(2021) defines the word Commerce as the buying and selling of goods or services.
Organizations typically function in three categories:
• Brick-and-mortar (Traditional commerce) service - the process of buying and
selling of goods face to face.
• Virtual (Ecommerce) service - the process of buying and selling of goods solely
online.
• Click-and-mortar (Hybrid of Traditional and Ecommerce) service - the process of
buying and selling of goods online, usually as a marketing channel with a physical
store.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
9
While brick and mortar, may have paved the way as the first method for selling and buying
of goods and services, the advancements in technology with the internet came the
evolution of ecommerce, whereby commerce is conducted via electronic means and
technology medium according to Whinstone et al. (1997). This brought with it significant
changes to the way in which business was transacted and highlighted limitations in brick
and mortar such as rent, specific geographic location, face-to-face operations only, and
limited business hours (typically during daytime) to name a few.
Ecommerce allowed for providers opportunities to have a global customer reach at any
given time (24/7). It enabled them to provide a store and product listing, allowing for price
and specification comparison and a faster buying process right at the consumer’s fingertip
and convenience. Additionally, ecommerce has allowed for the ability to handle
automation, multiple purchases, lower cost maintenance and personalized shopping
experience. Although these advancements have enhanced the way in which commerce
is transacted, they have come with some disadvantages such as the lack of personal
interaction/touch, inability to experience product prior to purchase, poor security, site
downtime, and late delivery Niranjanamurthy et al. (2013).
Online shopping has come a long way since its birth approximately forty (40) years ago.
Consumers has shifted from the traditional instore shopping to a more convenient online
shopping. According to Coppola (2021) ecommerce has become an integral part of the
global retail framework. Statistics show that in 2020, online transactions with sales
surpassed 4.2 trillion US Dollars and project that by the end of 2021 online transactions
would reach approximately 5 trillion USD (Statista.com). The Leading global ranking for
online retail traffic is Amazon.com which registered 5.2 billion unique visitors in June
2020. It is without a doubt that the consumer behaviour and ecommerce has been
significantly influenced by coronavirus (Covid 19) pandemic in the last two years as
billions of people have stayed home to contain the virus. In June 2020, ecommerce retail
traffic recorded 22 billion monthly visits with a high demand for technology items (laptops,
computers, and mobile devices), groceries and clothes.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
10
Figure 4. Forecast Growth Retail ecommerce sales worldwide from 2012 to 2024
Source: Statista.com
Despite its disadvantages, ecommerce has played a key role to everyday living in how
business is conducted. Many businesses have adapted to current trends of business in
having a virtual store presence to increase sales. In more recent years the revolution of
ecommerce has adopted the growth in usage of mobile devices. Coursaris et al. (2002)
proposes, m-commerce can be classified as a subset of ecommerce whereby the mobile
nature of wireless technology supports mobile electronic business transactions. The
convenience of having purchase power on the go is wildly being embraced by mobile
users.
As ecommerce continues to evolve, advancements driven by market and consumer
needs as well as innovative technological advancements has created a space for
emerging technologies to enhance user engagement and participation. Trending
technologies such as:
• Gamification to boost sales, making shopping fun and interactive by awarding
points and badges is a marketing technique used to encourage engagement.
• Augmented Reality allowing the customer to have a virtual shopping experience
and product visualisation with the help of AR and VR technology.
• Social Payments such as digital currency through the integration of brands like
PayPal, Apple pay, Google wallet and Facebook payments are filling the gaps for
the boom of social media users that want seamless security in transactions through
their applications being used.
Although these advancements do make ecommerce business more user friendly, they do
come with limitations as users tend to be hesitant when financial info needs to be
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
11
provided. While data encryption does provide some level of support, users tend to be
sceptical to the possibility of being hacked. Additionally, businesses stand the risk of
being targeted with credit card fraud.
Figure 5. Advantages and Disadvantages of Ecommerce
Source: makewebbetter.com
3.3
Websites Reviewed
Successful online movie websites including Amazon's Prime Video, Netflix, Disney Plus,
and Hulu are listed on PracticalEcommerce.com. These websites have advanced
features such as artificial intelligence (chatbot), recommender algorithms, responsive
designs, and encryption that set them apart from the competition. These characteristics
will be examined in this literature review to incorporate them into this project. There will
also be a discussion of the tools used to create the object as well as the development
methods.
3.4
Ecommerce Functionalities
3.4.1 Artificial Intelligence
According to Copeland (2021), Artificial intelligence can be defined as the functions
performed by a computer or a computer-controlled robot that can do tasks and solve
problems that are human like. It can further be identified with the ability to reason,
recognise speech, learn from its experiences, visualise perception, simplify, make
decisions, and conduct intellectual processes associated with that of human
characteristics.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
12
Unlike Human intelligence, artificial intelligence uses algorithms in its decision-making
process. These algorithms are designed by humans and while some level of adaptation
and growth can be achieved from its environment, human intelligence has a greater
capacity to multitasking, memories, social interaction and self-consciousness that come
from a level of I.Q that artificial intelligence doesn’t have as suggested by Narendran
(2021). The thought process of and decision making of the human brain cannot be
mastered by artificial intelligence no matter how smart it is. The understanding of feelings
and cognitive learning will always be different to that of machine learning which makes
human intelligence unique, though able to process quickly, be more objective and
accurate.
Advani (2020), purports that AI can be measured on human likeness through four main
elements
• Turing Test: states that the Turing test can be referred to the behavioural test of AI
and whether sufficiently meets the conditions of presence of mind, thought or
intelligence when interacting with a human. It considers the natural language
processing for successful communication, knowledge representation (memory),
automated reasoning to answer questions and conceptualise conclusions from
information stored and machine learning to adapt to circumstances based on
patterns.
• Cognitive Modelling: This element deals with the simulation of human problem
solving and mental processing used to predict the human behaviour to execute tasks
similar that of a human. It considers introspection on building a model based on study
of human thought, psychological testing based on the behaviour of humans and brain
imaging to monitor the functionality of the brain based on scenarios and coding the
information to be replicated.
• The Law of Thought: this can be defined as the decision-making process based
on a list of logical statements that govern how the mind operates. Although these
can be applied to AI algorithms the issue may arise where actions of a human
may not always be certain of the outcome whereas an algorithm would not be able
to compute if there are too many parameters.
• Rational Approach: this can be applied to the best possible approach/choice
based on the circumstances where logical statements of the right thing does not
exist. IT applies a much more dynamic and adaptable approach then applying to
the decision making.
With the combination if stored data information and intelligent algorithms capable of
performing fast iterative processes, AI can learn from patterns and features within its data.
SAS (2021), highlights its AI theories, methods, and technologies into the following:
• Machine Learning – This method uses statistics, operation research, physics, and
neural networks to create hidden linkages within the data without directly being
programmed as to where to look or conclude. AI increases its intelligence based
on what it learns over time.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
13
•
•
•
Deep Learning – Utilising huge neural networks, this method uses to its
advantage its computing power to process through many layers of data to learn
intricate patterns.
Computer Vision – the understanding an image or video through pattern
recognition and deep learning allowing the machine to interpret its surroundings
through imagery in real time.
Cognitive Computing or Natural Language Processing – can be defines as the
human like interaction from a machine. AI will be able to analyse and understand
human language and behaviour and respond as a human would.
AI can further be classified into two types or categories according to Saleh (2019). They
are the following:
Type1. Based on its capabilities
• Weak or Narrow AI – designed to perform a limited defined set of tasks and lacks
the ability to think and make decisions like humans.
• General or Strong AI – Although not fully there yet, the objective is to create AI
with the ability to apply intelligence in thinking and making decisions like humans.
• Super AI – a hypothetical concept but defined as machines that surpass human
intelligence by being able to perform tasks better than the cognitive characteristics
of human beings.
Type2. Based on its Functionality
• Reactive Machines – responds and reacts only to its current situation with the
best possible action and does not store memory or use past experiences for future
actions.
• Limited Memory – Data can be stored for short periods of time to be allowed in
future decision making by using its experience. It isn’t added to their library of
experiences and is therefore specific to a period.
• Theory of the Mind – In its simplest term, this AI will be capable of understanding
and relating to human emotion and beliefs. While this concept has not yet been
built, the aim is to imitate human mental to drive its behaviour.
• Self-Awareness – this form of AI is still far reached but its objective is to be
extremely intelligent with its ability to become truly self-aware and conscious on its
own.
AI has become part of everyday living and exists in hundreds of ways to assist in making
life easier. It has been used through various types of programming, most commonly in
• Chatbots to strength its customer service relations by allowing generic or
frequently asked questions to be answered without the need of a human.
Responses can be triggered by a word of phrase being used to define the response
given. The objective is to give human level interaction to its customers.
• Voice Recognition to help learn about our preferences and to assist in helping
you. AI uses the questions or commands asked to answer or perform tasks through
devices like Apple’s Siri, Amazon’s Alexa, and Google’s Play.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
14
•
•
•
Self-Driving Cars though still new, machine learning and visual recognition are
used synchronously to help cars understand its environment. Autonomous
vehicles can react and adapt to traffic patterns and signs and can use facial
recognition to recognise and keep people safe.
Streaming Services using algorithms based on the content watched or listened
to and makes suggestions based on a pattern for example Netflix, YouTube, Apple
Music, Tidal.
Online Shopping, like streaming services, utilizes algorithms based on shopping
preference to predict what u make like to shop for next. Systems such as Amazon
and eBay can quickly place recommended items to the forefront to insight your
buying need.
At present AI technology is currently being used to help fight against Covid-19. Machines
being used in thermal imaging at airports, computerised tomography lung scans to
recognise infection and data analysis to track the spread are just a few of the ways being
used.
Figure 6. Timeline of AI Technology
Source: connectjaya.com
The are many benefits to using AI technology with automation of processes, smart
decision making, enhances customer experiences, complex problem solving, Research
and Data analysis, minimizing error, and increased business efficiency through 24/7
operation. But while all these benefits do exist with AI it does come with some
disadvantages such as lack of creativity, high possible start-up cost, reduced human
labour/ unemployment.
Chatbots are becoming the latest channel for businesses to be able to connect with their
customers. According to Intercom (2019), Chatbots account for 41% of sales, 37% of
customer support and 17% of marketing. Many brands such as Domino’s Pizza that uses
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
15
its chatbot to place an order and track the delivery with a simple to use process and in
February of 2017 integrated Facebook Messenger, Peloton that uses their chatbot to
advertise and direct to sales based on a query, Starbucks that uses their chatbot similarly
to Dominos, learns preferences and notifies when order is ready, and AmTrak uses its
chatbot assist in purchase of tickets, have seen growth in their business significantly.
AmTrak reported an increase by 50% in user engagement.
For this project the chatbot will be implemented to assist users in login in issues, movie
recommendations and purchase support. It will act as the first line of support for the most
frequent questions being asked and assist users to meet their goals.
3.4.2 Recommender System
With the growth of many ecommerce business, choices have become overwhelming to
the consumer. This has sparked some level need for a filtration and prioritization system
to effectively provide the most relevant content. From this need, a recommender system
can be considered a filtration system that anticipates user choices by searching possible
suggested items and outputting to the user based on their previous viewed, purchased or
preference items making the decision-making process easier. To achieve this,
recommender systems use a combination of algorithms, data mining analysis and AI as
indicated by Burke (2011).
Furthermore, Schafer (1999) suggests that there are three ways recommender systems
enhance ecommerce sales - Browsers into buyers, Cross-sell, and Loyalty. Browsers into
buyers can be identified as the visitors of websites that have no intention of purchase but
are drawn into a product by the recommendations being made. Cross-sell can be defined
as the additional/supporting products that are recommended based on the purchase
being made. Through recommender systems users have increased their loyalty to by
creating value added relationships. In doing this site have invested into getting to know
its user based on purchases, item visits, and preferences allowing for them to match the
needs and wants of the customer. This in turn drives customer loyalty up with return visits
and more user engagement.
Recommender systems can be differentiated into three types of techniques, as specified
by Doshi (2019). They are Content-based filtering, collaborative filtering, and a hybrid
system.
Content Based filtration system – recommendations are based on user interest and
matches similar products from the content of the product for example price, location, size,
features. This system relies on the item or products the user interacts with or views and
builds a profile based on its content then it builds based on the user profile based on
preferences and connects the two and recommends new items with similar features.
Collaborative Filtering – does not consider user preferences, instead, it considers the
interactions of other customers and items, by analysing customers with similar tastes on
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
16
a selected item and then rating their similarity to the user to decide what to recommend.
The higher the similarity between customers the higher the recommendation.
Hybrid System – uses both content and collaborative filtering. This is done by
understanding the user preference and item features and matching it against other user
preferences to find a similarity rating. By doing this the recommender system finds the
best possible match item to suggest to the user based on all factors.
Figure 7. Recommender Techniques
Source: towardsdatascience.com
While Recommender systems provided users with content they may not have known
existed, there are additional benefits to its implementation of such a system. Dey (2021)
highlights engaged user activity, drive traffic, convert browsers to customers, increase
sale and deliver relevant content as a few advantages. As with all systems there are some
limitations that come with such a system for example the need for a large database of
user preferences to make a recommendation, data manipulation of preferences,
recommendations based on user non-preference items (geo-location of a user), to much
data to make a proper recommendation.
Several businesses have adopted the recommender system and proved to be a
successful tool in driving customer experience. Amazon.com uses the Customer who
bought feature recommending products like that of user preference and purchase.
Additionally, the implementation of email notifications when new products are added
based on the user preference feature and customer comments allowing for text
recommendations have all been features of amazon.com. Levis added its recommender
system to suggest articles of clothing based on gender, category and fit with a rating
score. Netflix added its recommender system based on similarity of watched movies,
similarity of other users that watch the same movies and geo-location of the user. Over
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
17
80% of what people watch comes from recommendations according to Medium.com. For
this project a recommender system will be implemented like that of Netflix, with features
based on user preference and previously clicked on/viewed movies.
3.4.3 Online Payment Methods
Online payments can be defined as the purchasing transaction conducted on an
ecommerce platform between customers and the seller. On a similar note, Dennis (2004)
suggests that this type of system as a type of financial commitment between the customer
and vendor that operates on electronic infrastructures. Oh (2006) purports this process
to involves four major stakeholders - Cardholder (owner of the credit card), Merchant
(Business/Seller), Infrastructure Provider (the facility that manages the credit card
payments for the Merchant routing the transaction credit card networks) and the Finance
Institution (the institution that offers the credit to the cardholder on behalf of the card
networks).
The process by which online payment functions can be simplified into the following stepsCardholder selects item to be purchased online and is then prompted to insert payment
details. The merchant then submits this transaction through the payment gateway which
encrypts the transaction and securely forwards it to the processor for verification also
known as tokenization (the process by which the generation of a random secure code
that carries the data safely via SSL). Once approved, the customer’s financial institution
then forwards the money to the processor which in turn forward to the merchant’s account.
The approved or denied status is then sent to the gateway which in-turn the merchant
receives, together with the money for item is sold. This process happens autonomously
and in a matter of seconds.
Figure 8. Online Payment Method
Source: oroinc.com
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
18
Fatonah et al. (2008) purports, with the evolution of ecommerce, online payment
methods/systems have become a one of the more practical monetary tools being used to
transact business. Most popular online payment methods use credit and debit cards,
however with advancements in technology, alternative methods such as bank transfers,
e-wallets, e-cash payments, smart cards, and crypto-currency have emerged.
Credit and Debit Cards – This is by far the most popular of all online payment methods.
Payments via cards are simple to use and have become more secure as technology
advances. Customers enter at a minimum a card number, expiry date and CVV number.
Examples of which include Visa, Mastercard, American Express, Discover to name a few.
Debit Cards are considered a preferred option for customers who shop within their
financial limits. The main difference between the two cards is with a debit card being a
pre-pard/loaded credit card from the customers bank account.
Digital Wallets and Cardless Payment – This payment method has become widely
adopted and provides for customers who want a faster smoother transaction at the touch
of a button. It is mainly used on mobile devices, apps, or online services that allow for
financial transactions to take place without the need to carry a credit card cash or physical
wallet. Credit Card information is encrypted and stored on the device and only accessed
when the transaction payment is required. Examples of Digital Wallets include PayPal,
Apply Pay, Google Pay, Samsung Wallet, and Amazon Pay.
Within recent times crypto currency has been gaining popularity as a new method of
payment. This type of currency uses blockchain technology and does not have a central
monetary authority such as banks or government. Although considered secure, crypto
currency is still young and investing in it may be considered risky as its value fluctuates
due to no fixed regulations.
Online payments have many benefits to its usage. Increased speed and convenience
compared to traditional cash for payments online, secure payments using encryption
technology, multiple payment methods, more appealing to impulse buyers and recurring
payment capabilities to name a few, have increased the growth in online payment
technologies. There are however limitations such as technical downtime, fraud and cost
associated with fraud, and transactional costs.
For this project the online payment method being used will be credit card payments as it
is the most used option for customers.
3.5
Project Related Choices
3.5.1 Software Development Tools
A project of this nature requires a high level of background research. Tools such as the
internet, books, journals, and articles from reputable sources will be used to acquire
information. Google Scholar, Emerald Insights Library and ResearchGate, just to name a
few will be used to obtain credible sources. No cost factor will be incurred.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
19
The significance of referencing and citing thorough-out the completion of this project was
highlighted. Harvard referencing framework is the recommended style to be used. Once
credible and relevant sources are identified, citation needs to be included in the main
body of the report and a reference and bibliography list at the end of the report. Reference
management applications such as EndNote and RefWorks have been reviewed to assist
in maintaining and organizing bibliographical references and add in-text citations.
RefWorks was selected due to ease of use.
Software tools in the development of the software artefact would be required. Applications
such as XAMPP bring together tools in a single framework package (Integrated
Development Environment). Included in the XXAMP application is a MYSQL database
used for data storage. PHP, JavaScript, CSS, and HTML will be primarily used to design
and style each webpage.
The design of both frontend (application) and backend (database) requires tools to design
the artefact. To build such a design, several programs may be considered, including
Microsoft Visio, Smart Draw, Google Drawings, ER Diagram, and Pencil Project, to
mention a few. Microsoft Visio/ER Diagram (backend) and Balsamiq (frontend) will be
utilized to perform the activities necessary based on experience and simplicity of usage.
Given the nature of this project, Version Control will play a key role in the development
process. Version control systems (VCS) enable an individual/group to track changes
being made throughout a project. It allows for collaboration (groups to work
simultaneously on the same project), backups of changes made by everyone, reviews
and documentation of the progress made. Though several options of VCS are available
for free use GitHub was ideally selected based on familiarity and ease of use/integration
with the Visual Studio Code application.
Project Management is critical in tracking the progress of a project to minimize risk,
monitor progress, and provide deliverables on schedule. Microsoft Excel and Microsoft
Project may be used to arrange work in a timetable and improve planning efficiency to
fulfil these deliverables. Microsoft Excel is chosen to be utilized for this project due of
familiarity. Because the program is already owned, there will be no further costs.
3.5.2 Software Development Methodology
According to McCombes (2020), methodology can be defined as the study of the methods
used and the theories or principles that govern them, in the development of an approach
to match the overall objective. The use of a methodology will allow for this project to easier
manage the implementation stage by separating each phase of the artefact development.
Dawson (2015) indicates, the agile methodology is best suited for student projects and
given the time constraints of this project, the use of the Waterfall methodology which
requires an extensive analysis phase and a defined outlined detailed document before
initiating development activities cannot be used. As such Agile Method is best suited to
achieve the desired project outcome.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
20
The Agile methodology is an adaptable method that employs the use of iterative and
progressive approaches, allowing for modifications to be made at any moment. This is in
comparison to methodologies such as Waterfall which uses a fixed step-by-step approach
to project development.
Agile Methodology encourages best practices such as:
● Advocating for small team functionality (project supervisor and myself)
● Frequent collaboration and communication
● Ability to manage project deliverables that are unclear or require continuous
changes
● Project risk reduction by short iterations
● Product road mapping of every step in the system development life cycle including:
o Background Research
o Requirement Analysis
o Design of Artefact
o Implementation of Artefact
o Testing
o Evaluation
Figure 9: Stages of Artefact Planning (Agile Methodology)
3.5.3 Version Control
Version Control systems allow for the tracking of fundamental changes made during the
process of software development (Spinellis, 2005). By doing this it allows for the team to
view the progress of work being done on project. VCS keeps a master copy of the project
in its repository, then keeps a history of the changes in development as the project
continues enabling for reviewing or roll backs to previous versions if necessary. The use
of version control can also act as a backup to of the project as it stores the data on an
external server.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
21
There is several different software that assist with version control such as Azure DevOps,
Revision Control System, Mercurial and Git. Artefact development code editor software
such as Visual Studio code supports VCS like Git. While A fully functional version will be
stored locally, for this project the use of GitHub is chosen as it will allow for Visual Studio
Code to connect to its online repository via the GitHub extension which can be integrated
seamlessly. Additionally, GitHub makes available through personal accounts a free to use
version.
3.5.4 User Experience
Gualtieri (2009) asserts, to separate a company from its competitors, one must provide
an improved user experience. When this is achieved the business will reap three benefits
– customer recommendation, continued customer loyalty and increased consumer
purchases.
To create a design that factors in the user experience, the design must consider the entire
process of branding, design, usability, and functionality. It anticipates the end user in
mind and looks at the process of consideration, acquisition and even troubleshooting
ensuring that it delivers on the expectations of the user needs. By doing this the design
team ensures a successful product.
According to the Morville (2010), there are 7 factors that influence the User Experience.
• Useful – can a user achieve their purpose for the visit of the website? If the website
has no purpose, it will not achieve in holding the customers attention against its
competitors. It is worth noting that useful can only be measured in the eye of the
beholder.
• Usable – How easy it for a user to achieve their desired task with as little effort as
possible. The easier it is for a user to achieve their objective the greater chance of
having a competitive advantage in addition to giving the user a comfort of usage
and security.
• Findable – this relates to how easy is the desired product to find. The design must
be easy for a user to navigate and find the content needed.
• Credible – Credibility relates to the trust relationship of the user in the product
being offered. It considers not just that it delivers but that it provides a level of
accuracy in the information provided and fits its purpose.
• Desirable – This covers branding, identity, and image. It looks at the complete
aesthetics of the product being offered. The more desirable a product is the more
a user will return and recommend the product.
• Accessible – ensures the user can access by the full range of abilities inclusive of
all devices (desktop and mobile) and able to be accessible by users with
disabilities.
• Valuable – Value is two-fold in its consideration. It must deliver to value to the
business and to the consumer for whom it was created for.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
22
Gualtieri (2009) outlines that to design with the best user experience in mind you must
first apply four best practices: Simulate becoming your user to understand how to
design for them, Design the prototype first to avoid putting the user experience to risk,
Test to verify users will be satisfied, include User Experience design into the SDLC
process of the project.
For this project the Heuristic Evaluation principles will be used in evaluating the
artefact ensuring that all factors of user experience are met and in the SDLC and are
in line with the standard set by the academic team at University of Bedfordshire (UoB).
3.6
Summary
With the use of Emerging Technologies, many ecommerce applications have adapted to
using some features as discussed in Section 2.2. These features have proven to benefit
most while some emerging technologies may not have proven as successful.
• Artificial Intelligence – More and more globally AI technology is being integrated
into everyday life. By utilizing these capabilities AI can assist in automating and
performing tasks associated with human intelligence.
• Recommender System – By making recommendations of liked or similar products
that the consumer may have viewed or purchased, the shopping experience for
user becomes more personalised and directed. This in term generates a better
user experience and generates sales.
• Responsive Design – By allowing for a seamless smooth design to be integrated
across multiple devices, user engagement will increase as the customer
experience isn’t frustrated by the unnecessary scrolling of left to right or having to
zoom in and out.
3.7
Recommendations
The Aim of this project is to deliver an ecommerce online movie store that overall
enhances the user experience. With the implementation of the following
recommendations being made based on the literature review, it is intended that these
features will enhance the user experience.
• Chatbot: the implementation of an Artificial Intelligence feature such as the chatbot
will assist in 24/7 customer service improving on the customer experience for
frequently asked questions.
• The Recommender system will suggest movies for its users based on previously
seen/viewed content allowing for the customer to have a more personalized
experience while generating increased sales based on preferences.
• A Responsive Design will allow for ease of use with customers to view and make
purchases on the go using their mobile devices without the frustration of having to
scroll or zoom in and out.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
23
Chapter 4: Requirements Analysis
4.1
Introduction
One of the crucial phases in the System Development Life Cycle (SDLC) is the
Requirement Analysis. Hay (2003) describes this as a comprehensive study in a specific
area of business as it covers the fundamentals, underlying structures, roles of each
function, including the constraints and gaps, to be developed to achieve the goal.
The requirements analysis will cover the methods used to meet the requirements, it will
define the functional and non-functional requirements of the system, prioritize
requirements, as well as cover the document set that establish and qualify the scope of
the project such as use case diagrams and activity diagrams. Functional requirements
refer to the activities or processes that the system must perform while, non-functional
requirements refer to the operational characteristics related to the system.
4.2
The Process of Producing the Requirements
In this phase an examination was done on existing ecommerce applications. It considered
their functionalities in addition to the look and feel of the design while recognizing areas
for development. Reviewing of documentation on ecommerce applications in addition to
their advanced features was done from credible sources, influencing the requirements
that would be established for the project.
Work done in the Background Research chapter of the Contextual Report had an impact
on the list of Functional and Non-Functional requirements for this Project. Ecommerce
websites such as Netflix.com (2022), Amazon.com (2022), CaribbeanCinemas.com
(2022), MovieTowne.com (2022) was reviewed to determine the core and advanced
functionalities that were utilized and should be included in the artefact, to ensure optimum
user experience and usability. On ecommerce websites, core requirements such as
Registration/Login, Product Listing, and Cart Management are common, whereas
features such as Responsive Design, recommender systems, and AI Chatbot were
incorporated based on background research.
4.3
Personas
Personas, according to Nielsen (2010), are used to build accurate and realistic
representations of your target consumer groups for as a method to communicate data
about the users. They are critical to a product's success because it drives the design
decisions by bringing user needs to the forefront of planning stages before the design
phase begins. Personas help to understand users' requirements, habits, likes, dislikes,
preferences, objectives, and experiences. The following are examples of personas
created to provide a full understanding of a typical customer of the online movie shop
ecommerce application (Figures 10 and 11).
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
24
Figure 10: Persona 1 - Student (Margaret)
Figure 11: Persona 2 – Working Professional (Lulu)
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
25
4.4
Functional Requirements (FR)
Functional requirements are divided in to two categories - The core features are the
fundamental characteristics necessary to have a functioning artefact, however the
advanced features are deemed desirable to have more complex features such as a
recommender system, AI Technology in the form of a chatbot, Gamification, and
Responsive Design. Listed below in Table 1 is a comprehensive listing table with the
functional requirements of both the core and advance features inclusive of the user
access level.
Table 1. List of Functional Requirements
ID NUMBER
FR-1
FR-2
FR-3
FR-4
FR-5
FR-6
FR-7
FR-8
FR-9
FR-10
FR-11
FR-12
FR-13
FR-14
FR-15
REQUIREMENT
CORE
Register / Create an
Account
Login / Log out
Products category list
Product Search
Product Description
Product Inventory
Management
Cart Management
Customer Profile
Management
Upcoming Releases
ADVANCED
Recommender Systems
Responsive Design
Customer Ratings
AI Technology - Chatbot
feature
Online payment methods
Passwrod encryption
USER LEVEL ACCESS
Public
Public
Public
Public
Public
Admin
Registered User
Registered User
Public
Public / Registered User
Public
Registered User
Public
Registered User
Registered User
Furthermore, from the table above, each requirement was then expanded to include a
detailed description of how the requirement works as well as a rationale for the
requirement. This would subsequently be used to guide the database as well as user
interface designs. Table 2 shows the requirement FR-2 that has been generated, and
Appendix A shows the full requirements analysis that has been completed to date.
Table 2. Details of Functional Requirements FR2 (Login/ Logout)
REQUIREMENT
ID NUMBER
Login / Log out (Core)
FR-2
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
26
DESCRIPTION
RATIONALE
4.5
Before any transaction on the ecommerce application can take
place, the user must first log into the account that was created. The
registered email address and password used during registration
must be entered by the user. The application then confirms that the
email address and password entered match those in the
application's database. After being confirmed and validated against
the database's 'users' table, the user is sent to the site and notified
that they have successfully signed in.
Once logged in, a user may make secure purchases, review order
history, track order status, and change profile information such as
address, passwords, and credit card information.
Non-Functional Requirements (NFR)
Non-functional requirements are those components of an application that are equally as
significant as its functional requirements but are less visible. It places a greater emphasis
on user expectations, which include Application Security, Database Security, Browser
Compatibility, Maintainability, Consistency, Usability, Availability, and Scalability. The
non-functional requirements for the application are shown in Table 3 below.
Table 3. Details of Non-Functional Requirements
NONREQUIREMENT
RATIONALE
FUNCTIONAL
ID
NFR-1
Application
To secure the privacy of information from other
Security
users and hackers, sensitive data such as credit
card information should be encrypted in the
database. Access restrictions must be set to
guarantee that users only have access to their own
information and not that of other users.
NFR-2
Database
Users should not be allowed to have access to the
Security
database. Only the database administrators should
have access to it. The application interface should
be the sole way for the user to access the
database.
NFR-3
Browser
Browser compatibility with Google Chrome,
Compatibility
Microsoft Edge, Apple Safari, Mozilla Firefox, and
Microsoft Edge should be available on a wide range
of mobile and desktop devices.
NFR-4
Maintainability The design of the application should be simple
enough that the adding of new product items and
updates to product information can be done quickly
and easily.
NFR-5
Consistency
Consistency focuses on the aesthetic of the user
interface and how people interact with it, delivering
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
27
4.5
NFR-6
Usability
NFR-7
Availability
a uniformed appearance throughout the
application. These include the layout, colour
scheme, fonts, buttons, and any key elements, all
of which must be consistent throughout all pages to
reduce the learning curve.
According to Nielsen's heuristics of system
visibility, consistency, and standards, the
application's interface should be user-friendly
(Nielsen, 1994). Aspects, such as navigation links,
login, registration, the products page, and the
search page, will be comparable to those seen on
other e-commerce sites. To reflect their function,
elements will be given meaningful names.
It is advised that the application be hosted on a
platform that is stable, secure, reputable, and
satisfies industry regulatory requirements with
redundancy to ensure minimal downtime.
UML Diagrams
A use case, according to Larson and Larson (2004), is the manner a possible end user
intends to utilize or interact with a system. Use cases provide a framework for gathering
user requirements/needs and enable for the project's scope to be defined. It is
also valuable in having the actor (end user) test the system throughout the
implementation phase, which results in faster creation of a more usable system.
UML use-case diagrams depict a system's high-level functionality and scope,
representing a system's behavior and assisting in the capture of the system's
requirements. These diagrams also depict how the system and its actors (end users)
interact (IBM, 2017). Below in Figure 12 depicts a high-level use case scenario between
the actor (end user) and their interaction with the system.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
28
Figure 12. Top-Level Use Case Diagram Example
Source: (uml-diagrams.org)
4.6
Information Architecture
Belinda (2017) expresses that the structural design of information or content (including
text, images, and videos) within a digital product is known as information architecture.
This significantly assists a user, as it focuses on the structuring and identifying webpages
so that the users can quickly access the information needed while providing a smooth
flow. A sitemap was constructed to highlight the link between the various site content and
to test for website flow to corroborate these results. The site map for the online movie
store application is shown in Figure 13 below.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
29
Figure 13. Site Map
4.7
Activity Diagram
According to Walker (2019) an activity diagram can be described as a flowchart that
depicts the flow from one activity (a system action) to another activity carried out by the
user until it is completed. The primary goal of activity diagrams is to represent a system's
dynamic behavior, with an emphasis on the execution and flow of that behavior rather
than implementation. Below, in Figure 14, shows the activity diagram for the online movie
store application.
Figure 14. Activity Diagram for Ecommerce Purchase
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
30
Chapter 5: Design
5.1
Introduction
The design of a website can impact on the success of any business in a competitive
industry. Poorly designed sites can have many negative reactions resulting in less
customer visits and usage, while a professionally designed can encourage user
engagement as well as increase visitor frequency.
The next stage of System Development Life Cycle (SDLC) is the Design phase. This
phase consists of identifying the specification required and the creation of the application.
It will capture the structure and behaviour of the software artefact based on the approved
functional and non-functional requirements.
The design phase will look at both Back-End and Front-End designs. The Back end will
cover the design of database required to store the data, its Entity Relationship Diagram
(ERD), Normalization, Logical Schema and Data Dictionary. The Front-End design will
cover the application’s design looking at Nielsen’s Heuristics for usability, its wireframes,
sketches, and interactive prototype.
5.2
Database Design (Back End Design)
The initial stage in developing the software artefact is critical in database design.
According to Watt (2014), when unstructured data is stored in a database, issues such
as data repetition and wastage of storage space might arise. To avoid such issues, tables
were normalized to at least the third normal form, which eliminated insert, update, and
delete faults. In comparison to the bottom-up approach, which is primarily used when
existing databases are available from an existing system, the top-down approach was
used for this project because it eliminates the confusion of attempting to design the
system all at once given that the system is a concept being brought to life.
The design of the database can be broken down into three parts:
•
•
•
•
The design of the Conceptual ER Diagram
The normalisation of the ERD
Using the logical ERD to create a logical model
Creation of a Data Dictionary
5.2.1 ERD
The initial phase in the design process was to determine the entities and the data that
would need to be stored. Because functional requirements constituted the basis of the
data necessary, the requirements analysis provided most of the information for this
phase of the development process.
Below in Table 4 is a list of the entities gathered:
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
31
Table 4. Entities and it’s Characteristics
ENTITY
Cart
User
Items
Reviews
Purchases
Receipts
Upcoming Items
CHARACTERISTICS
Items, Quantity, Status
First Name, Last Name, Email, Password,
Registration Date
Item, Description, Price, Image, Quantity
Item, Subject, Ratings, Message, Date
Price, Quantity, Date
Receipt Code, Date, Subtotal, Total
Item, Description, Price, Image, Quantity
5.2.2 Normalization Process
Following the establishment of the entities and their respective characteristics, the
relationship between these entities, as well as the cardinality of these relationships, was
determined. A Purchase, for example, can be made for several Items, and an Item can
have multiple Purchases. This was then used to build the conceptual ER Diagram.
The conceptual ER diagram was converted to a logical ER diagram using a top-down
normalization procedure, removing any many: many links in the conceptual ER diagram.
The many: many relationship in the ecommerce ER diagram was the one between the
ITEM and the RECEIPT, which went as follows:
• An ITEM can be included in many RECEIPTS
• A RECEIPT can consist of many ITEMS
This was fixed by establishing a link entity table named PURCHASES, which holds the
ITEMs included in the PURCHASE, converting the many: many relationship into a one:
many relationship.
•
•
A RECEIPT consists of many PURCHASEs, but each PURCHASE is for one
ITEM.
An ITEM can be in many PURCHASEs, but each PURCHASE is for one
RECEIPT.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
32
Figure 15. ER Diagram
5.2.3 Logical Model
A logical database model was built when the normalization procedure was completed,
which comprised all tables and attributes as well as integrity requirements (primary and
foreign keys). Table 5 shows the Logical Schema from the ERD.
Table 5. Logical Schema from the ERD
ENTITY
Cart
User
Items
ATTRIBUTES
Primary Key: cart_id
user_id, item_id, cart_item_added, cart_item_quantity,
cart_item_status
Primary Key: user_id
first_name, last_name, email, password, registration_date,
user_type
Primary Key: item id
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
33
Reviews
Purchases
Receipts
Upcoming Items
Avatar
item_title, item_description, item_price, item_image,
item_quantity, item_category, item_category2, item_youtube
Primary Key: review_id,
user_id, item_id, review_rating, review_subject, review_message,
review_date
Primary Key: purchase id
item_id, purchase_item_price, purchase_item_quantity,
purchase_date, receipt_id
primary key: receipt id
user_id, receipt_code, receipt_date, receipt_subtotal, receipt_total
Primary Key: upcomingitem id
upcomingitem_title, upcomingitem_description,
upcomingitem_price, upcomingitem_image,
upcomingitem_quantity, upcomingitem_category,
upcomingitem_category2, upcomingitem_youtube
Primary Key: avatar id
Avatar
5.2.4 Data Dictionary
A Data Dictionary can be defined as a tabular format listing of names, description and
attributes and constraints for the data components produced from the logical schema.
The Table 6 below depicts the data dictionary for the items.
Table 6. Data Dictionary for The Items Table
Table
Field name
items
item_id
Item_title
Data
Type
int
varchar
Field
Length
11
100
Item_description text
Constraint
Description
Primary Key
None
Auto Increment
Name of the Item
Description of the
item
Price of the item
Item Image
Item amount
Item Category
Item Category 2
Youtube trailer
link
None
Item_price
Item_image
Item_quantity
Item_category
Item_category2
double
varchar
int
varchar
varchar
6,2
200
11
100
100
Item_youtube
varchar
300
None
None
None
None
None
None
Appendix B shows the full Data Dictionary from the database.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
34
5.3
Application Design (Front End Design)
5.3.1 Nielsen’s Heuristics
The purpose of a well-designed UI for front-end development cannot be emphasized.
Design principles were used in combination with Nielsen's 10 Usability Heuristics to
ensure the best user experience in compliance with appropriate design criteria such as
efficiency, speed, and smooth functionality (Nielsen, 1995). There are several benefits
to using a heuristic, namely:
•
•
•
It's a thorough, technically sound procedure that evaluates the product against a
set of specific criteria.
You have a higher chance of having a broader picture and discovering more
possible issue areas since several individuals are participating.
Because it concentrates on fewer, more relevant areas, the issues uncovered are
more likely to be significant.
Table 7. Nielsen's 10 Usability Heuristics
(https://www.heurio.co/nielsens-10-usability-heuristics, 2022)
PRINCIPLES
Visibility of system status
DESCRIPTION
The system should always keep users informed
about what is going on, through appropriate
feedback within reasonable time.
Match between system and the The system should speak the users’ language, with
real world
words, phrases, and concepts familiar to the user,
rather than system-oriented terms. Follow real-world
conventions, making information appear in a natural
and logical order.
User control and freedom
Users often choose system functions by mistake and
will need a clearly marked “emergency exit” to leave
the unwanted state without having to go through an
extended dialogue. Support undo and redo.
Consistency and standards
Users should not have to wonder whether different
words, situations, or actions mean the same thing.
Follow platform conventions.
Error prevention
Even better than good error messages are a careful
design which prevents a problem from occurring in
the first place. Either eliminate error-prone conditions
or check for them and present users with a
confirmation option before they commit to the action.
Recognition rather than recall
Minimize the user's memory load by making objects,
actions, and options visible. The user should not
have to remember information from one part of the
dialogue to another. Instructions for use of the
system should be visible or easily retrievable
whenever appropriate.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
35
Accelerators — unseen by the novice user — may
often speed up the interaction for the expert user
such that the system can cater to both inexperienced
and experienced users. Allow users to tailor frequent
actions.
Aesthetic and minimalist design Dialogues should not contain information which is
irrelevant or rarely needed. Every extra unit of
information in a dialogue competes with the relevant
units of information and diminishes their relative
visibility.
Help users recognize, diagnose, Error messages should be expressed in plain
and recover from errors
language (no codes), precisely indicate the problem,
and constructively suggest a solution.
Help and documentation
Even though it is better if the system can be used
without documentation, it may be necessary to
provide help and documentation. Any such
information should be easy to search, focused on the
user’s task, list concrete steps to be carried out, and
not be too large.
Flexibility and efficiency of use
Illustrated below in Table 8 is an example of how this has been applied to the artefact:
Table 8. Example of use - Nielsen's 10 Usability Heuristics
PRINCIPLES
User control and freedom
HOW IT WILL BE APPLIED
Features such as the ability to add/remove things
from their Carts, as well as Log In/Log Out of the
ecommerce application will be clearly visible to
customers. Navigation between screens can be
achieved easily through the header tabs.
5.3.2 Storyboard
Sketches are created to give a visual representation of the artefact's potential screen
layouts. Once a sketch has received a high degree of approval, it will be utilized to create
a higher quality design, such as wireframes and low fidelity prototypes. The plan for the
login screen is depicted in the drawing (Figure 16) below. APPENDIX C will have more
screens
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
36
Figure 16. Sketch of the Login Screen
5.3.4 Wireframes
A wireframe is a two-dimensional representation of a page's appearance and feel, with
an emphasis on space allocation and prioritizing content, accessible features, and
expected actions. As a result, wireframes often lack any styles, colours, or images and
aid in the establishment of linkages between various web page designs. The wireframes
were then created and tested to verify that they adhered to Nielsen's Heuristics, with all
screens having a title identifying the screen's function and buttons being consistently
positioned on each screen with recognizable icons across the program.
The following Table 17 is a wireframe example of a login page:
Figure 17. Login page wireframe (http://mockupbuilder.com, 2022)
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
37
5.3.4 Interactive Prototype
The design's style, colour, logo, and substance are established via interactive prototypes,
which might be of low or high quality. It is also interactive, so something happens when
the user clicks on the item. This explains how the design works and gives a better
understanding of the built-in capabilities. As a result, when you click or tap on a design
element, something happens: a menu will appear or a link to a new page will appear.
Less time was spent learning how to create an Interactive Prototype, which may take long
and be challenging. Because the academic nature of the project's constrained the
development timeframe, extra effort was spent on developing the actual artefact. Below
in Figure 18 depicts the Prototype of the homepage.
Figure 18. Homepage Prototype Concept
Chapter 6: Software Implementation
6.1
Introduction
It is in this phase that the project begins to take shape. The Implementation phase is the
shifting from ideas of the project plan on paper into action. The development of the
artefact for the online movie store initiates at this phase. The gathering of equipment for
the development environment, installation and configuration of software, the creation of
the database tables and ensuring that the database (backend) and the application (front
end) can communicate with each other are the first steps.
User interface advance feature implementations such as a responsive design, AI
Technology and a recommender system are then created in this phase. The handling of
error messages and modifications to the origin design if needed are corrected.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
38
Additionally, security features and version control are implemented to minimize loss of
data and monitor/control the progress.
6.2
The Development Environment
In software and web development, a development environment gives developers an
interface and a convenient overview of the development process, which includes
developing code, testing, debugging, and maintaining without altering anything in a live
environment. Below in Table 9 shows the tools used in the Development environment
and explains their purpose of use.
Table 9. Software Used and Purpose
SOFTWARE
Microsoft Windows 10
Microsoft Office 365
XAMMP
GitHub
Visual Studio Code
PHP Intelephense (VS Code extension)
Highlight Matching Tag (VS Code
extension)
Bracket Pair Colorizer 2 (VS Code
extension)
Auto Complete Tag (VS Code extension)
PURPOSE
Operating system used on laptop
The use of Microsoft Word the
development of the technical reports
while, Excel was used for the development
of the Gannt Chart
Abbreviated for cross-platform, Apache,
MySQL, PHP, and Perl, was used to
house, manage, build, and test the
application and its database offline on a
local device (Laptop)
Used to manage version control
Used as a simplified code editor that
supports version control and development
tasks
–
Integrated
Development
Environmnt (IDE)
To assist with PHP development
Highlights matching open and close tags
Customised colouring matching brackets
Automatically adds the close code and
renames paired tags
Auto Close Tag (VS Code extension)
Automatically adds the close code
Error Lens (VS Code extension)
Identifies and Highlights errors in the code
PHP, HTML, CSS jQuery
Chosen programming languages to build
the application
MySQL
Used with PhpMyAdmin, for the database
tables creation and management
Google Chrome, Microsoft Edge, Opera, Multiple browsers used to test the artefact
Mozilla Firefox
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
39
The installation of the software tools was simple and did not need any extra configuration.
If any issues arise, webpages and YouTube videos give sufficient assistance.
6.3
Creation of Database
To make application administration easier, a project folder named 'ECOMMPROJECT'
was established on the Local disk XAMPP/htdocs to house all project-related application
files and images with 'ecommerce project' established in PhpMyAdmin to administer the
database. In addition to the database being created manually, the primary and foreign
keys were created in alignment with the design phrase of the project. To verify that the
datatypes were correct and that all entity integrity and referential integrity criteria were
followed, the tables were filled with data. Figure 19 shows the creation of the MySQL
database in phpMyAdmin.
Figure19. Snippet of ecommerce_project SQL Database (PhpMyAdmin)
6.4
Connection between Database and Front End
To establish communication between the database (backend) and the application
(frontend), a connection string was created, allowing the websites to send and receive
data from the MySQL database.
A connection.php file was constructed in Visual Studio Code and stored the following
components to guarantee proper communication.
Server Name: "localhost"
Username: "root"
Password:”"
Database name: "ecommerce_project"
Below in Figure 20, shows the snippet of connection string codes used in the
connection.php file
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
40
Figure20. Connection.php - Database Connection String
In doing this, the "include connection.php" string was then used to create the connection,
eliminating the duplication of scripts on each source-code page. The snippet of code that
includes the connection string used in the login.php file is seen below in Figure 21.
Figure21. Connection string used in Login.php
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
41
6.5
User Interface Implementation
To date, the following Table 10 shows the progress made on the list of requirements:
Table 10. Requirements Analysis Status Completed
ID NUMBER
REQUIREMENT
STATUS COMPLETED
CORE
FR-1
Register / Create an
100%
Account
FR-2
Login / Log out
100%
FR-3
Products category list
100%
FR-4
Product Search
100%
FR-5
Product Description
100%
FR-6
Product Inventory
100%
Management
FR-7
Cart Management
100%
FR-8
Customer Profile
50%
Management
FR-9
Upcoming Releases
100%
ADVANCED
FR-10
Recommender Systems
100%
FR-11
Responsive Design
100%
FR-12
Customer Ratings
100%
FR-13
AI Technology - Chatbot
100%
feature
FR-14
Online payment methods
100%
FR-15
Passwrod encryption
100%
Based on the table above 95%of the application has been completed to date and focused
on the core functionalities.
6.5.1 Core Features Implemented
This section will go through the core features that have been implemented this far in the
artefact and will include snippets of code used in the creation process as well as the
frontend display.
FR-1 Register / Create an Account
A user must first be registered before they may login. The Registration/Create an Account
function allows users to create an account that allows them to access capabilities that an
unregistered user would not be able to access, such as making a purchase. The user
must provide a first name, last name, email address, password, and verify the password
once again on the registration page. The email address used must be distinct from any
other email address in the database. Below in Figures 22-24 highlights the code used in
developing the registration, creating the input fields, and ensuring that the email is unique.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
42
Figure22. Registration.php code
Figure23. Registration.php code (Forms input fields)
Figure24. Registration.php code (if Email is unique check)
For the Frontend view, the page was designed using a bootstrap template and
customized to match the artefact's theme as seen in Figure 25 below.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
43
Figure25. Registration (Frontend)
Once the user clicks the 'Register Now' button and the information is validated, the record
is saved in the database. The user is then notified that the account has been successfully
created. Figure 26 shows the MySQL Database record for a new user created.
Figure26. MySQL Database (New user created)
To ensure security measures are in place to restrict persons from seeing the password
being type a password hash was inserted. The snippet of the string used to disguise the
password being entered, can be seen below in Figure 27.
Figure27. Registration.php code (Password Mask)
A check box was also implemented as a requirement before completing their registration
to certify that the user agrees to the terms and conditions for the artefact. Figure 28 shows
the code used in implementing the acceptance.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
44
Figure28. Registration.php code (Accept terms and conditions)
After successfully registering, the user is sent to the login page. The code for the redirect
is shown below in Figure 29.
Figure29. Registration.php code
(Redirect to login page after successful completion)
FR-2 Login / Log out
The user can log in using the login page after successfully registering. User login gives
users access to functions like add to cart, view cart, and checkout, as well as profile
management. A user can only log in if the information given (email address and password)
matches the information recorded in the 'users' table of the database (Figure 30).
Figure30. User Table (MySQL Database)
Like the registration page, code was inserted to mask the password field on the frontend.
The login.php file was configured to start a session with the database and included the
connection.php to communicate with the database as seen in Figure 31 below.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
45
Figure31. Login.php (Start Session to connect to database)
The login.php utilized the sql SELECT command to check the database for the user’s
email address and then checks to verify that the password used matches. The structure
of the navigation bar changes to indicate that a user has successfully signed in and
includes extra links such as cart, account, sign out, and admin (for the admin user). The
header.php file controls the navigation bar and is included on all pages. Figures 32-35
shows the code used to include the header.php in addition to the script used to check the
database and the difference between headers once a user signs in successfully.
Figure32. Login.php (Include Header.php – navigation bar)
Figure33. Login.php (Check for user in database)
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
46
Figure34. Login Page (Frontend design)
Figure35. Login Page (Frontend design after user logs in)
The design template used for the registration page was utilized and customized for the
login page as can be seen in Figure 36.
Figure36. Login.php (Form snippet for user input of login page)
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
47
An error notice will appear if a user has forgotten to enter their email address or password
or has entered inaccurate information that does not match the database as seen in Figure
37.
Figure37. Login.php (Error Message)
A link to the registration page was also included on the login page in case someone who
isn’t a registered user accidentally lands on the login page.
Figure38. Login.php (user direct to registration page if no account)
Once a user has successfully completed all transactions on the artefact, they can logout
using the Logout button. The Logout.php file was created to end the session of the logged
in user, disconnecting them from the database. Below Figure 39 depicts the code used
for Logout file
Figure39. Logout.php (Disconnect Session)
FR-3 Products Category List
The movies (products) mentioned on the store page offer visitors an idea of what's
available to buy. It has ‘quick-view’ and ‘view movie’ information buttons, as well as a list
of all items with their individual titles, costs, and images as seen in Figure 40 below. Items
can be seen by both registered and non-registered visitors, but only registered users can
purchase them.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
48
Figure40. Store Page (frontend)
To avoid hardcoding each item into the storepage, a design was developed to connect to
the database using include connection.php and then pull data contained in the 'items'
table from the database as can be seen in Figure 41.
Figure 41. Item Table in the MySQL Database
This method of programming assisted in mitigating long codes and cutter in the store.php
file. To achieve this a loop function was created that utilized referenced columns in the
database to input the data. Below Figures 41 and 42 show the sql SELECT command to
pull the data from the items table as well the code use to display on the then items.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
49
Figure41. Store.php
(Connection string and SQL to call items from the database)
Figure 42. Store.php
(Code to display info of each item from the database)
A modal is a pop-up feature that appears when a button is pressed. On the store page, a
modal was created to provide users a ‘quick-view’ short brief description of an item that
included the title, description, price, and add to cart features. Figure 43 shows JavaScript
was used to call the quickview.php file that holds the contents to be displayed when the
modal button is clicked.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
50
Figure43. Store.php
(JavaScript code that calls the quickview.php for the modal)
A bootstrap template was used to and configured to match the theme of the artefact.
FR-4 Product Search
On frontend of all pages displays a search bar that allows users (both registered and unregistered) to search for an item or word within the item.
Figure 44. Search bar (Frontend)
To achieve this the search button was given an action to call the search.php file as can
be seen in the snippet of code below in Figure 45.
Figure45. Search Button
(Code used for Search button)
The search.php contains all the information like that of the store.php with the inclusion of
string that calls on an ‘id’ to query the info inputted in the search bar and pull from the
database. Items are then displayed only in relation to the exact work searched. Figure 46
shows the GET variable used to retrieve a query.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
51
Figurev46. Search.php
(Code used to query the database)
Below in Figure47 displays the result of a search for the word ‘Venom’.
Figure47. Search Results (Frontend)
FR-5 Product Description
It is important that a user be well informed of a product before purchasing. For this project
two versions of product descriptions were created, a modal ‘quick view’ and a view movie
full detail. Both a registered and unregistered has access to view the product description.
The quick view was designed as a pop-up modal to provide the user with a summary of
the movie they are going to purchase before clicking the add to cart button. The modal
displays the image, title, description, and price of the movie to be watched. When the user
clicks the 'quickview' button, the code in the quickview.php file is read. Figure 48 and 49
shows the code used for the modal and the frontend user display.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
52
Figure48. Quickview.php (Modal display code)
Figure49. Quickview (Frontend)
It connects to the database and then obtains the needed information from the items table
using the item id. The data is then stored in variables and displayed to the user in the
pop-up. Only a logged in user can add the item being viewed to cart. If the user is not
logged in, they are re-routed to the login.php screen. Below in Figures 50 and 51 show
snippets show the connection string, the sql SELECT command that pulls the items from
the item table in the database in addition to the GET variable that checks and selects the
item id.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
53
Figure50. Quickview.php and details.php
(Connection string and MYSQL command to the items table)
Figure51. Quickview.php and details.php
(MYSQL command to get item_id)
Like the quick view, the details.php displays the image, title, description, and pricing of
the movie, with additional features such as YouTube movie trailers, movie reviews and
ratings, and suggested similar movies the user may enjoy. When the review button is
selected a modal popup comes up with allowing the user to input a subject comment and
rate the movie out of five stars. Figures 52 and 53 show the code used in addition to the
front-end view.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
54
Figure52. Details.php (coding and variables)
Figure53. Details page (Frontend)
FR-6 Product Inventory Management
Product inventory is important to all administrators. The ability to perform Inventory
Management without relying on visiting the PhpMyAdmin SQL database can be useful to
the administrator. The admin page allows the administrator to upload a new movie to the
database through the artefact’s interface which is then displayed on the store page
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
55
automatically. On the navigation bar the admin tab only appears after the header.php has
checked to see if the user is an administrator. See Figure 54 below.
To upload a file to the ‘items’ table, an admin-add-item.php file was created. The file first
checks to see if the user is an administrator. If not, the user is prompted with a restricted
error message and then redirected to the login.php file to sign in as administrator.
Figure54. Code used to Check to see if user is Admin
Once successfully confirmed to be an administrator the user is then allowed to input data
into the relevant fields. The admin-add-item.php file utilizes the POST variable and
includes the connection.php to ensure connectivity to the database.
A sql command to insert the info is then performed to add the item after the include
upload.php file checks and verifies that no fields are missing. If the user erroneously left
out a field a prompt indicating the missing item is shown as an error message.
Figure55.
Command to inlude upload.php file and SQL statement to INSERT into Items table
Figure56.
Upload.php – snippet that checks size and format of image
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
56
Figure57.
Upload.php – Front end of the admin-add-item.php
FR-7 Cart Management
Only registered users can add an item and access the cart by clicking on the ‘add to cart’
button on the ‘quickview’ or ‘details’ pages. When selected the movie is then added to the
cart and user re-directed to the cart.
This process takes place by the details page calling the code.AddtoCart.php file. It first
verifies that the user is logged in, then checks for the item id in the database through he
connection.php., then executes an SQL command that inserts the item into the Cart.
Figure 58. Cart.php
(Includes for code.isLoggedIn.php and code.viewCart.php)
The Cart.php checks to see if the user is logged in and includes the code.ViewCart.php
file, as seen in Figure 58 above, which provides a subtotal of the items in the cart. The
Cart displays each item added to it and includes the item title, image, description, price,
a remove from cart button, subtotal, coupon discount and checkout button. Below in
Figures 59 and 60 shows snippet of code used in the cart.php and the code.ViewCart.php.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
57
Figure 59. Cart.php
Figure 60. code.viewCart.php (SQL command to calculate Subtotal)
The remove from cart button is linked to the code.removeFromCart.php file that ensures
the item id for product being deleted is present, then includes the connection to the
database and executes an SQL command to delete the item from the cart as seen in
Figure 61.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
58
Figure61. code.removeFromCart.php
(SQL command to delete item from cart)
The checkout button is linked to the checkout.php file which navigates the user to a
payment process.
If the Cart is empty, a message indicating the cart is empty is displayed with a button
prompting the user to continue shopping, displayed in Figure 62 below.
Figure 62. code.removeFromCart.php
(SQL command to delete item from cart)
FR-9 Upcoming Releases
Upcoming events informs users of what coming attractions will soon be released. The
code used to retrieve information from the database is comparable to that used on the
store page, except it retrieves information from the 'upcoming items' table rather than the
'items' table as can be seen in Figure 63 below.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
59
Figure 63. UpcomingItems.php
sql command to SELECT data from the upcomingitems table
The data is then presented in a carousel slider fashion, cognate to the recommender
system as seen in Figure 64. For the carousel slider, a bootstrap template was adapted
to meet the theme of the artefact.
Figure 64. Upcoming Releases on the Homepage.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
60
6.5.2 Advanced Features Implemented
FR-10 Recommender Systems
Users are engaged by recommender systems based on a range of characteristics such
as previous search or purchase history, similar item browsing, or geographical zoning.
This project's recommender system was built on the category of the item being viewed.
When a user selects a movie with a category (for example, Animation), the recommender
displays all movies in that category to the user. In the recommender.php file, the PHP
code employs the GET variable to collect the data retrieved from the SQL Select
command by the categories relevant to the movie being shown from the database. The
code used to obtain the information from the database is shown below in Figure 65.
Figure 65. Recommender.php snippet of code.
When the data is acquired, it is shown on the movie's details page. containing the item's
image, title, and price in the form of a carousel slider. Below Figure 66 and 67 shows the
include recommender.php on the details page as well the frontend view of the
recommender system.
Figure 66. Include recommender.php on details.php file
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
61
Figure 67. Recommender System (Frontend view.)
FR-11 Responsive Design
Responsive designs assist a user to manage the way a web page is viewed by resizing
the contents based on the screen size. In doing this the artefact becomes adaptable to
desktop, mobile or tablet mood with no extra effort from the user. Responsive designs
make usability seamless and smooth while increasing user engagement with the potential
to have returning customers based on the ease of use.
The online movie store incorporated several responsive elements through coding in
Visual Studio Code to achieve the seamless design look. Figures 68-70 shows the
responsive design of the details page and navigation bar.
Figure68. Navigation Bar – Collapse function
Figure69. Responsive code on Store page
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
62
Figure70. Responsive Store page (Mobile and tablet mode)
FR-12 Customer Ratings
One way to know if an item is of any value to customers is to read reviews and check
customer ratings. The reviews and ratings and tell a customer what other customers think
about the product for the purpose of make a better-informed decision before making the
purchase. For this project the customer review and ratings were developed on the
details.php file.
A reviews table was created in the database stores data based on user first name, last
name, rating, subject message, and date. The details page was configured to establish a
connection to the database and then execute a sql command that pulls the data from the
database.
Figure71. Snippet of Code used to SELECT data from the Reviews table
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
63
The design was done with a modal pop up that allows for a customer to insert the relevant
review and select a star rating from 1-5 (5 being the highest) shown in Figure 72 and 73.
Figure72. Star ratings code to select 1-5 stars
Figure73. Review and ratings Modal pop up (frontend)
When the user selects the submit button, the latest review is placed to the top of the
reviews inclusive of the star rating. A template design was used from bootsnipp.com and
modified to match the theme of this project.
Figure74. Review posted (frontend)
FR-13 AI Technology - Chatbot feature
Chat bot integration allows for a user to have 24-hour customer support should they need
it. Due to the complexity of designing a chatbot from ground up, a custom-built adaptation
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
64
built by IntelleTicks was chosen to be used in this application. This JavaScript based
application comes customizable with welcome messages and allows the administrator to
insert predefined questions and responses that a customer may use. If the query by the
user does not return a favorable response the chatbot then prompts the user, they will
refer them to the next available customer service representative.
Because a user may have a query at any point in time during the use of the artefact, the
chatbot was placed on all key pages. Figures 75-76 shows the JavaScript used for the
chatbot in addition to the frontend interface the customer interacts with.
Figure75. Chatbot (Javascript code)
Figure76. Chatbot (Frontend)
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
65
FR-14 Online Payment Methods
For the Online movie store to be a functional ecommerce application, it needs to have an
online payment feature. A transaction cannot be completed unless it has some form of
payment method for the movie.
For this project a Stripe account was created and integration of the Stripe’s payment
method using a test stripe credit card was used for the artefact. The checkout,php file
first ensures that the user in signed in, then calls on the code.stripe1.php file. This file
handles the communication between Stripe server and the database and the total price
in the cart is passed to the Stripe for payment. Figure 77 and 78 shows the codes used
and the Stripe dashboard successful transaction.
Figure77. code.stripe1.php
Figure78. Stipe Payment dashboard
FR-15 Payment Encryption
Payment encryption is a security feature that reduces the likelihood of payment
information being stolen. Without the associated encryption key, which permits
transactions between the merchant and financial institution to be conducted, information
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
66
from customer credit cards becomes difficult to utilize. Card issuers encrypt credit cards
using a variety of methods such as magnetic strips, PIN numbers, electronic chips, and,
in the case of online transactions, a CVV.
For this Project, only registered users can checkout items in a cart. The payment
functionality was passed to Stripe to conducted using a Stripe gateway algorithm with
encryption. Figure 79 below, shows the image of encryption being used for payment on
the Stripe dashboard.
Figure79. Stripe Dashboard Payment Encryption
6.6
Security Consideration
Information Security is critical today with Internet-enabled technologies increasingly
becoming vulnerable to security breaches. If software artefacts are to have a chance of
reducing harmful assaults that might lead to phishing and private data loss, they must
apply some level of protection.
For this project, authentication mechanisms based on email addresses and passwords
were used to allow users to gain access and complete activities such as adding an item
to a shopping cart or making a payment. A password hash encryption functionality was
built using PHP to hide/mask the passwords being used from any potential threat of being
easily viewed or recorded. Authentication codes were previously shown at Figure 80 in
the Login in functionality. Below shows the password encryption snippet in the database.
Figure 80. Password in the MySQL Database
6.8
Error Messages
Error messages appear to help a user recognize when an action fails unexpectedly. This
commonly occurs when:
• The artefact does not understand the user input
• The info to be inserted was omitted.
• Or the action a user intends to run is incompatible with the operation of the artefact.
For this project error messages are displayed to the top of the page or in line with the
missing or erroneous inputted data. Source Code data was used to validate and
confirmed info such as email address and password. Once the data could not be validated
an error message would be displayed asking the user to try again. Alerts that give
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
67
instructive error messages were built using Nielson's Heuristics principle 9. Below in
Figures 81-85 shows alerts used to notify users:
Figure 81. Successful Rgistration
Figure 82. Incorrect password
Figure 83. Cart is empty
Figure 84. Search error.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
68
Figure 85. Payment successful. Thank you
6.9
Version Control
Version control is a technique used in software development to track and manage
changes to source code. Because it manages code updates and versions, it can resolve
merge conflicts and other anomalies, safeguarding the source code from irreparable harm
and allowing for experimentation without worry of inflicting mistakes or introducing code
conflicts.
According to Chacon and Straub (2014), a Version Control System (VCS) can achieve
serval key functions:
• It allows you to restore chosen files to a prior saved state
• Revert the entire project to a previous saved state
• It can compare the changes made over a period
• See who last edited anything that may be creating a problem
• The origination of issue, who created it, and when.
Version control assists in saving time, reduction in clutter from several files carrying the
same name with add-ons to indicate the version change, as well as note a specific area
of modification can be utilized in future work.
The frequency of creating back-up sources codes to GitHub’s online repository was made
simple using Visual Studio Code’s built in GIT version control. Figure 86 shows the logs
from GitHub online repository.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
69
Figure 86. Ecommerce Project GitHub repository
6.10 Features Not Implemented
FR-8 Customer Profile Management
User Profiles allows users to easily manage their username, password, profile picture,
and purchase history. To access the customer profile management, the user must first be
a registered user and logged into the system. Once this is accomplished, the user can
select 'My Account' and be redirected to their profile. After confirming that the user is
logged in, profile.php connects to the database and retrieves the preset avatar
information, allowing the user to select an avatar, update their name, bio, and password.
Even though this system was only 50% implemented, the design layout was completed,
with the functionality aspect still awaiting integration. Below shows the sql command to
SELECT a preset avatar from the database.
Figure 86. profile.php sql SELECT from avatar table
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
70
Appendix G shows full screenshots of the artefact and database along with coding used
in the development and implementation stage.
Chapter 7: Testing
7.1
Introduction
According to Study.com (2022), the developer concentrates on research and discovery
during the testing phase to see if the code and programming satisfy the requirements of
the customer. While it is possible that not all flaws will be detected and resolved during
the testing phase, the results of this phase may be utilized to restrict the number of defects
contained inside the software artefact. In doing this confidence is gained with the
customer in the quality of work in the artefact.
This chapter describes and illustrates the testing method for both functional and nonfunctional criteria. Testing plans were created, and each test result was documented, with
defects documented in a separate log. The findings of the issues will be used to correct
any errors in the code at the end of testing.
7.2
Test Plan
The test approach for this project will be the design of a collection of tests that will be
executed on the artefact. The test plan for functional and non-functional requirements
outlines the sorts of testing that will be performed, how the software will be tested, who
should be the testers throughout each step, and the expected and actual test results.
A combination of unit and integration tests will be used to test the functional requirements.
Using data such as intended, boundary, and negative cases, unit tests will guarantee that
the system's smallest components handle known input and outputs effectively.
Any fault/errors will be documented in the Defects Log when a test fails. All items in the
defect log will be attempted to be rectified at the end of testing.
7.3
Functionality Testing
Functional Requirements are checked using data as needed, in addition to processes
being conducted with each outcome documented in the test plan. The results of those
tests are listed in the table below.
Table 11. FR1 (Register/Create an Account)
TEST
NUMBER
FR1.1
TEST
No info placed in fields
for registration
EXEPECTED
ACTUAL
OUTCOME
OUTCOME
Error message Error message
indicating
indicating which
which fields
RESULT
Successful
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
71
FR1.2
FR1.3
FR1.4
FR1.5
FR1.6
are missing
information
Register customer
The customer
John Soo Hon
successfully
with email address:
registered. In
johnsoohon@mail.com the users
and
database, a
password: Password1 record for
customer has
been inserted.
Register another
Error message
customer John Soo
indicting email
Hon
address
with email address:
already exists.
johnsoohon@mail.com Please try
and
again.
password: Password1
Register customer
Error Message
John Soo Hon
indicating
with email address:
passwords
johnsoohon@mail.com don’t match.
and
Please try
password: Password1 again
confirmed password:
password1
User clicks on link
User re‘Already have an
directed to
account? please sign
login page
in’ redirects user to
login screen
User able to use a
User prompted
weak password
to create a
strong
password
fields are missing
information
The customer
Successful
successfully
registered. In the
users database,
a record for
customer has
been inserted.
Error message
indicting email
address already
exists. Please try
again.
Successful
Error Message
Successful
indicating
passwords don’t
match. Please try
again
User re-directed
to login page
Successful
User was not
promoted to
create a strong
password
failed
Table 12. FR2 (Login/Log Out)
TEST
NUMBER
FR2.1
TEST
No info placed in fields
for Login
EXEPECTED
OUTCOME
Error message
indicating
which fields
are missing
information
ACTUAL
OUTCOME
Error message
indicating which
fields are
missing
information
RESULT
Successful
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
72
FR1.2
FR1.3
FR1.4
FR1.5
Register customer
John Soo Hon
with email address:
johnsoohon@mail.com
and
password: Password1
The customer
successfully
Logged in. Redirected to
home screen.
Navigation bar
change to
reflect user
logged in with
log out tab.
Register customer
Error message
John Soo Hon
indicting
with email address:
wrong into
johnsoohon@mail.com inserted.
and
Please try
password: password1 again.
User clicks on link
User re‘Don’t have an
directed to
account? please
registration
register’ redirects user page
to registration screen
When a user is signed When a user
in, the link to "Sign Up" is logged in,
should not be
the link is
available.
hidden.
The customer
successfully
Logged in. Redirected to home
screen.
Navigation bar
change to reflect
user logged in
with log out tab.
Successful
Error message
indicting wrong
into inserted.
Please try again.
Successful
User re-directed
to registration
page
Successful
When a user is
logged in, the
link is hidden.
Successful
See Appendix D for full list of all Functional Requirements Testing.
7.4
Non-Functionality Testing
A series of tests were performed to test the non-functional requirements in the same way
that the functional requirements were tested. Comparable to the functional requirements
testing, these findings were documented and exhibited. Any failed tests were kept track
of in the defects log. Table 11 presents the results of the NFR1 Application Security
testing.
Table 13. NFR1 (Application Security)
TEST
NUMBER
NFR1.1
TEST
The store, details,
chatbot, contact,
registration, and login
EXEPECTED
OUTCOME
A public user
can only
access the
ACTUAL
RESULT
OUTCOME
A public user can Successful
only access the
webpages
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
73
NFR1.2
webpages are all
accessible to the
public.
The store, details,
chatbot, contact, cart,
checkout, registration,
and login webpages
are all accessible to a
registered user.
The store, details,
chatbot, contact, cart,
checkout, registration,
login, and admin
webpages are all
accessible to an
administrator user.
webpages
described in
the test.
A registered
user can
access the
webpages
described in
the test.
The admin can
access the
webpages
described in
the test.
described in the
test.
A registered user
can access the
webpages
described in the
test.
Successful
The admin can
access the
webpages
described in the
test.
Successful
See Appendix E for full list of all Non-Functional Requirements Testing.
7.5
Defects Log
Any mistakes discovered during the testing process of the functional and nonfunctional
requirements were noted in the Defects Log. This generates a list of issues to investigate
and remedy in an effort enhance the artefact. The severity levels assigned to the log
entries indicate the possible impact on the overall performance of the software product.
Table 12 lists the errors discovered during testing and recorded in the Defects Log.
Ratings of severity are as follows:
• 0 - Not a problem at all.
• 1 - Cosmetic issue: Only requires attention if time permits.
• 2 - Minor problem: Low priority attention.
• 3 - Major problem: High priority attention needed.
Table 14. Defects Log
ENTRY
TEST #
REQUIREMENT
PROBLEM
SEVERITY
1
FR-1
Password
Complexity
This feature
was not fully
configured
2
2
FR-8
Customer
Profile
Management
User profile
management
not enabled
2
COMMENT
Due to the
difficulties of
troubleshooting,
this functionality
was not
implemented.
This
functionality
was not
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
74
completed due
to time
constraints.
7.6
Analysis of Test Results
Two difficulties with the functional requirements were detected during testing. Despite
efforts to fulfill the features, the complexity password was not implemented owing to time
limits and difficulties in troubleshooting, in addition to one functional requirement (user
profile management) that was not implemented. No Major problems were detected.
Chapter 8: Software Evaluation
8.1
Introduction
The Evaluation Stage is an essential phase in the System Development life Cycle since
releasing an application with flaws and usability concerns can have a negative impact
and be detrimental to the artefact. Without properly assessing, this may lead to
disgruntled users, continuous demands for help, and the loss of new and returning
prospective customers. The evaluation phase's main objective is to offer "valuable
feedback" to its target audience inclusive of investors/sponsors, stakeholders, or team
members such as the UoB.
As the testing of functional and non-functional requirements was addressed in the
previous chapter, this chapter concentrates on assessing the application's usability using
a heuristic evaluation.
8.2
Method of Evaluation
Although there are the numerous techniques of assessing a software artefact, the
heuristic evaluation was selected for this project. This approach was chosen since it is a
quick and inexpensive way of finding usability issues with an interface. The heuristic
evaluation is guided by the ten (10) Nielsen's heuristics principles, which have been
demonstrated to provide a solid foundation for effective and successful evaluations.
8.3
The Heuristics
Neilsen's 10 Heuristics were considered at the SDLC Design Stage. The examination of
these ten principles will take the shape of a checklist, with multiple tests to certify
application of each notion. Each item will be assigned a value that shows whether the
heuristic was applied correctly, partially, or not throughout the software artefact. The
ranking guide that was employed is as follows:
•
•
•
0 - the heuristic not implemented
1 - the heuristic partially implemented
2 - the heuristic fully implemented
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
75
Table 15. Neilsen Heuristics
1. VISIBILITY OF SYSTEM STATUS
REVIEW CHECKLIST
#
1.1
1.2
Does every display begin with a title or header that
describes screen contents?
RATING
2 - the heuristic
fully
implemented
2 - the heuristic
Is a single, selected icon clearly visible when surrounded by fully
unselected icons?
implemented
1.3
Is there feedback when function keys are pressed?
1.4
If users must navigate between multiple screens, does the
system use context labels,
menu maps, and place markers as navigational aids?
1.5
Is the menu-naming terminology consistent with the user's
task domain?
1.6
High levels of concentration aren't necessary and
remembering information is
not required: two to fifteen seconds.
1.7
Are response times appropriate to the task?
1.8
If multiple options can be selected in a menu or dialog box,
is there visual feedback
about which options are already selected?
2 - the heuristic
fully
implemented
2 - the heuristic
fully
implemented
2 - the heuristic
fully
implemented
2 - the heuristic
fully
implemented
2 - the heuristic
fully
implemented
2 - the heuristic
fully
implemented
Appendix F contains the complete review of Nielsen's ten principles.
8.4
Heuristic Report
The heuristic report is designed to record each test that resulted in the partial or
not implemented Nielsen principle. Since all the evaluation criteria that were targeted for
the Nielsen’s Heuristics were completely implemented, there was no need for a failure
record.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
76
8.5
Analysis of Results
All review checks were thoroughly applied, according to the findings of studying each
heuristic principle. There were no elements in the Heuristic Report that did not fit the fully
implemented requirement, hence no record was identified.
Chapter 9: Conclusion
9.1
Introduction
The undergraduate project requires the student to utilize the skillsets and knowledge
gained in undertaking an individual project by creating a complex practical, functional
artefact, inclusive of a technical dissertation. It is expected that during the project the
student may experience challenges in achieving their objective.
The Final Report aims to define the Undergraduate project experience in the development
of the artefact. It examines the completed work, as well as project management and
project lessons learned. It emphasizes the significance of project planning as well as the
need to develop/acquire new skill sets throughout the project:
• Program Development
• Self-Management
• Self-Reflection
• Time Management
• Professional Technical Writing
• Communication
The project's background research and requirements analysis have been critical
components. This chapter highlights the achievements, acquired competence,
knowledge, and experience, as well as aspects which could have been done differently.
This chapter also conducts a critical examination of the software artefact.
9.2
Tasks Completed
Following the requirements analysis, fifteen core and advanced functions were selected.
The project is currently fully functional and around 90% complete, with fifteen (15) core
and advanced features developed and one (1) functionality, customer profile
management, that is 50% complete. In addition to all the functionalities listed in the
implementation stage, advanced features such as reviews and ratings, AI technology
chatbot, responsive design with the ability for the page to scale and the menu to be hidden
depending on the device being used, and a Recommender system based on item,
category, and release date are all worth mentioning. The 10 principles of Neilsen
Heuristics were applied throughout the artefact to ensure that the design was userfriendly, and that the user experience was worthwhile.
9.3
Product Built
Although lacking the extent of functionalities and capacities of well-known websites like
Netflix.com, Amazon.com, and Disneyplus.com, the artefact does have certain advanced
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
77
functionality features. It can be assumed that there will be some drawbacks in completing
a functional artefact and ensuring the defined deliverables from the requirements analysis
are met within the stipulated twelve (12) week period. The artefact was designed and
created with fifteen (15) capabilities, including AI Technology Chatbot, recommender
system, responsive design, online payment options, and security considerations, to name
a few. If this had been a larger team project, the functionalities, design, implementation,
and testing capabilities may have been considerably greater in the time provided.
Notwithstanding the anomalies, the artefact stands up nicely for a student with limited
programming expertise, with the database being constructed in a top-down normalization
way, removing any many: many relationships, as one of the key strengths. The
ecommerce application is fully functional with advanced capabilities and has been
developed with aesthetics and color psychology in mind to ensure that it is user-friendly,
and that the user experience will improve user engagement.
If the artefact were to be utilized in a public forum, it would be subject to several
limitations, including the usage of advanced online payment systems such as PayPal and
cryptocurrencies. The program is not recommended for public usage in its current state
since it has not been adequately stress tested to ensure that it can withstand security
assaults or high traffic loads. Furthermore, more advanced 'nice to have' functionalities
like gamification methods may have been developed to allow the artefact to be
benchmarked against industry leaders.
9.4
Experiences Gained
Over the course of this project, I have gained knowledge in several aspects. The
requirement of having to submit multiple documents such as Project Proposal, Contextual
Report, Reflective Report, and the Final Report has helped me in my technical writing
skills. Doing research through relevant sources such as Google Scholar and Research
Gate gives me a better appreciation for the work done by my peers in doing literature
reviews. Furthermore, understanding the reason for and how to cite using Harvard
referencing has allowed me to avoid plagiarism in the future as this was not something I
use to do.
Although having been on project teams before, the Undergraduate project has enhanced
my skillset in managing my personal time more effectively while balancing multiple
commitments with project related deadlines. I have gained a better appreciation for
project management, the use of Project Plan, Gantt Charts, work breakdown structures
(WBS), submission of progress reports and managing risk. Having started at final year of
the BSc program and not knowing what to expect made me feel anxious and worried
wondering if I would achieve the tasks set out before me. I however was up for the
challenge, given my work ethic in going above and beyond in meeting my deadlines. A
conscious decision was made to dedicate my evenings and any down time I had to
achieving such with my biggest fear being the competing/conflicting assignments,
projects and meetings of both work and school.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
78
A Project Plan played a key role and was an instrumental tool used in the planning,
delivery, and execution of this project. By dividing the project into smaller tasks,
deliverables made it more easily be managed. In doing this I was able to determine what
tasks to work on based on a specific timeframe to ensure the success of the project meets
its deadlines. This granular approach makes it easier to focus on smaller activities every
day that, when achieved, contribute to the success of the entire project.
The deliverables for this project came from the university’s project handbook and was
informed in the project proposal and contextual report (semester 1). A work breakdown
structure and Gannt Chart was created and identified each deliverable, their due date,
status, allotted timeframes, task dependencies and milestones. Although having some
level of experience when project planning, I have learnt to consider and manage the
risk/unknown factors that can influence the outcome of the deliverables. While project
plans are not exact, fixed or cast in stone, they do sometimes evolve as the project
progresses. Even though the delivery date for the overall project is fixed, the items which
I completed ahead of the scheduled time allowed for me to focus on other tasks more in
depth.
Understanding the System Development Life Cycle and the role of each phase was new
to me and gave me new insight on how proper structured projects should be approached
while finding the right methodology to be used. As in this instance the Agile Method was
best suited for me given the time constraints of this project.
While the project plan certainly helped me in focusing on my deliverables and my
milestones to be achieved, I quickly realized that I would have to consider more allotted
time towards the artefact having not factored the challenges of steep learning curve with
PHP programming language and my skillset being at a beginner’s level. Given my
technical background, the installation and configuration of the required applications to
design and build the artefact did not pose a challenge in contrast to the actual building of
the artefact.
Prior to joining the BSc program at the final year, I had basic knowledge of web
development with HTML and CSS however, none experience using PHP and SQL.
Learning to do PHP programming with the use of tools such as Visual Studio Code and
Xampp/phpMyAdmin for SQL database contributed to my appreciation for web
development. I quickly realised that I would have to spend more time doing background
research in understanding the language, its coding, and functions. Using websites such
as phptutorial.net, w3schools and YouTube quickly became a go to for information. It
should be noted though that my lecturers and project supervisor possessed extensive
knowledge and patience to assist with the many questions being asked in development.
Additionally, the understanding of building ER diagrams and how to normalize the
relationships of entities by my supervisor was hugely beneficial.
Having my lecturer and my supervisor explain top-down approach in database
development, the concept of normalization and how tables are joined in a database
allowed for me develop an ER Diagram and normalize my database to a third form
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
79
eliminating any anomalies. The understanding of SQL queries did pose a challenge for
me in the beginning but after doing some additional research and spending some time
understanding how it functions, I was able grasp the concept.
The progress report focuses on where I am at (the status of work completed), what I need
to work on (the challenges encountered), and what I should be attending to next (the
future plans). My assumption in the beginning, based on my own self-reflection is that I
am ahead of schedule since I dedicated time as often as I could to my project. However,
in having meetings with my project supervisor and receiving feedback and
recommendations, it allowed for me to plan for other smaller deliverables that I may not
have considered. The critical analysing by my project supervisor, allowed for me to any
shortcomings and his recommendation to review samples of other projects that made
high scores impacted on my vision for the future work I needed to get done. Given that
this project relies heavily on self-management and the ability to work independently it was
refreshing to know that I could fall back on useful feedback from my supervisor to provide
the guidance, reassurance, and motivation that I needed. Through the use Project
Progress Reports, it has allowed for me to have better time management by seeing status
updates and more reliable, realistic deliverables to meet deadlines and to and stay on
track with the project plan.
As with all projects, communication during the lifespan project plays a vital role to the
deliverance of a successful outcome. I am profoundly grateful to have a supervisor that
is motivational, knowledgeable in the field and keeps in constant communication
throughout, giving the best advice where he sees fit. I will use this experience in
communication for future projects I may be a part of or managing.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
80
References
a. Advani, V. (2020). What is Artificial Intelligence? How does AI work and future of
it. [online] Great Learning. Available at:
https://www.mygreatlearning.com/blog/what-is-artificial-intelligence/ [Accessed
18 Dec. 2022].
b. Assistant Secretary for Public Affairs (2009). Personas | Usability.gov. [online]
Usability.gov. Available at: https://www.usability.gov/how-to-andtools/methods/personas.html.
c. Balakrishnan, J. and Dwivedi, Y.K. (2021). Role of Cognitive Absorption in
Building User Trust and Experience. Psychology & Marketing.
doi:10.1002/mar.21462.
d. Baturay, M.H. and Birtane, M. (2013). Responsive Web Design: A New Type of
Design for Web-based Instructional Content. Procedia - Social and Behavioral
Sciences, 106, pp.2275–2279. doi: 10.1016/j.sbspro.2013.12.259.
e. Belinda (2017). Information Architecture: What Is It and Where Did It Come
From? [online] Medium. Available at: https://medium.theuxblog.com/informationarchitecture-what-is-it-and-where-did-it-come-from-5ba3105fe6b4.
f. Britton, C. and Doake, J. (2005). Activity Diagram - an Overview | ScienceDirect
Topics. [online] www.sciencedirect.com. Available at:
https://www.sciencedirect.com/topics/computer-science/activity-diagram.
g. Burke, R., Felfernig, A. and Göker, M.H. (2011). Recommender Systems: An
Overview. AI Magazine, 32(3), p.13. doi:10.1609/aimag. v32i3.2361.
h. Cambridge Dictionary (2021). Commerce. [online] Cambridge Words. Available
at: https://dictionary.cambridge.org/dictionary/english/commerce [Accessed 17
Dec. 2021].
i.
Chacon, S. and Straub, B. (2014). Pro Git. Berkeley, Ca Apress.
j.
Chevalier, S. (2020). Global Retail E-Commerce Market Size 2014-2021. [online]
Statista. Available at: https://www.statista.com/statistics/379046/worldwide-retaile-commerce-sales/ [Accessed 22 Dec. 2021].
k. Clement, J. (2020). Mobile Percentage of Website Traffic 2019 | Statista. [online]
Statista. Available at: https://www.statista.com/statistics/277125/share-ofwebsite-traffic-coming-from-mobile-devices/ [Accessed 23 Dec. 2021].
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
81
l.
Cohen, E. (2018). A Beginner-Friendly Guide to Work Breakdown Structures
(WBS). [online] www.workamajig.com. Available at:
https://www.workamajig.com/blog/guide-to-work-breakdown-structureswbs#section-1 [Accessed 18 Dec. 2021].
m. Copeland, B.J. (2021). Artificial Intelligence | Definition, Examples, and
Applications. In: Encyclopedia Britannica. [online] pp.247–272. Available at:
https://www.britannica.com/technology/artificial-intelligence [Accessed 22 Dec.
2021].
n. Coppola, D. (2021). Topic: E-commerce worldwide. [online] Statista. Available at:
https://www.statista.com/topics/871/online-shopping/#dossier-chapter1
[Accessed 21 Dec. 2021].
o. Corman, M. (2020). Responsive Web Design. [online] Medium. Available at:
https://medium.com/@madelinecorman/responsive-web-design-1748f1e6d781
[Accessed 6 Jan. 2022].
p. Dawson, C.W. (2015). Projects in computing and information systems: a
student’s guide. Harlow: Pearson Education.
q. Dey, V. (2021). Collaborative Filtering Vs Content-Based Filtering for
Recommender Systems. [online] Analytics India Magazine. Available at:
https://analyticsindiamag.com/collaborative-filtering-vs-content-based-filtering-forrecommender-systems/ [Accessed 12 Jan. 2022].
r. Doshi, S. (2019). Brief on Recommender Systems. [online] Medium. Available at:
https://towardsdatascience.com/brief-on-recommender-systems-b86a1068a4dd
[Accessed 12 Jan. 2022].
s. Fatonah, S., Yulandari, A. and Wibowo, F.W. (2018). A Review of E-Payment
System in E-Commerce. Journal of Physics: Conference Series, [online] 1140,
p.012033. doi:10.1088/1742-6596/1140/1/012033.
t. Fielding, J. (2014). Introduction to Responsive Design. Beginning Responsive
Web Design with HTML5 and CSS3, pp.1–33. doi:10.1007/978-1-4302-66952_1.
u. Gualtieri, M. (2009). Making Leaders Successful Every Day Best Practices in
User Experience (UX) Design by Mike Gualtieri for Application Development &
Program Management Professionals. [online] Available at:
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
82
http://web.uchile.cl/DctosIntranet/05UsabilidadExperienciaUsuario/BuenasPractic
as/BestPracticesUserExperience.pdf [Accessed 23 Dec. 2021].
v. Haggerty, M. (2018). E-Commerce Has Changed the Way We Shop. Here Are 3
Reasons Why Your Online Business Isn’t Growing. [online] Inc.com. Available at:
https://www.inc.com/maria-haggerty/ecommerce-has-changed-way-we-shopheres-why-your-online-business-needs-to-adapt-now.html [Accessed 21 Dec.
2021].
w. IBM (2017). Use-case Diagrams. [online] www.ibm.com. Available at:
https://www.ibm.com/docs/en/rational-soft-arch/9.6.1?topic=diagrams-use-case.
x. Kavyashree, N., Jagannath, S., Chahar, D. and Niranjanamurthy, M. (2013).
Analysis of E-Commerce and M-Commerce: Advantages, Limitations and
Security Issues. International Journal of Advanced Research in Computer and
Communication Engineering, [online] 2(6), pp.2360–2370. Available at:
https://www.ijarcce.com/upload/2013/june/7-NiranjanamurthyAnalysis%20of%20E-Commerce%20and%20M-Commerce%20Advantages.pdf
[Accessed 21 Dec. 2021].
y. Larson, R. and Larson, E. (2004). Use Cases - What Every Project Manager
Should Know. [online] www.pmi.org. Available at:
https://www.pmi.org/learning/library/use-cases-project-manager-know-8262.
z. Leslie, S. (2021). UB LibGuides: Conducting a Literature Review: Introduction.
[online] cob-bs.libguides.com. Available at: https://cobbs.libguides.com/literaturereview [Accessed 12 Jan. 2022].
aa. Machine Learning | AI | Data Science. (2021). AI Timeline. [online] Available at:
https://connectjaya.com/ai-timeline/ [Accessed 12 Jan. 2022].
bb. McCombes, S. (2019). How to Write a Literature Review | A Step-by-Step Guide.
[online] Scribbr. Available at: https://www.scribbr.com/dissertation/literaturereview/ [Accessed 19 Dec. 2021].
cc. McCombes, S. (2021). How to Write Methodology. [online] Scribbr. Available at:
https://www.scribbr.co.uk/thesisdissertation/methodology/#:~:text=Methodology%20refers%20to%20the%20over
arching. [Accessed 19 Dec. 2021].
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
83
dd. Mishra, S. (2020). Ecommerce Vs Retail: Why Should You Move Your Business
Online? [online] Make Web Better. Available at:
https://makewebbetter.com/blog/ecommerce-vs-retail/?a=&utm_source=MWBNemat-image&utm_medium=MWB-Pinterest&utm_campaign=Pinterest
[Accessed 12 Jan. 2022].
ee. Morville, P. and Sullenger, P. (2010). Ambient Findability: Libraries, Serials, and
the Internet of Things. The Serials Librarian, 58(1-4), pp.33–38.
doi:10.1080/03615261003622999.
ff. Munns, A. and Bjeirmi, B. (1996). The Role of Project Management in Achieving
Project Success. International Journal of Project Management, 14(2), pp.81–87.
doi:10.1016/0263-7863(95)00057-7.
gg. Narendran, K. (2021). Artificial intelligence v/s Human Intelligence. EJ
Publications International Journal Research in Applied Engineering, Science and
Technology (IJRAEST) Impact, [online] 3(3). Available at:
https://www.ijraest.com/Files/pdf/v3i3/2.IJRAEST-Kizhakkekalapurakal(2126).pdf [Accessed 12 Jan. 2022].
hh. Nazre, A. (2015). ‘a Deep Dive in the Venture Landscape of AI’ — Ajit Nazre &
Rahul Garg. [online] Medium. Available at:
https://medium.com/@aniruddhanazrelive/a-deep-dive-in-the-venture-landscapeof-ai-ajit-nazre-rahul-garg-de0543231eb2 [Accessed 12 Jan. 2022].
ii. Nielsen, L. (2010). (PDF) Personas. [online] ResearchGate. Available at:
https://www.researchgate.net/publication/235624780_Personas.
jj. Oh, S. (2006). A Stakeholder Perspective on Successful Electronic Payment
Systems Diffusion. pp.186b186b. doi:10.1109/HICSS.2006.31.
kk. Oppy, G. and Dowe, D. (2003). The Turing Test (Stanford Encyclopedia of
Philosophy). [online] Stanford.edu. Available at:
https://plato.stanford.edu/entries/turing-test/ [Accessed 23 Dec. 2021].
ll. Parlakkiliç, A. (2021). Evaluating the Effects of Responsive Design on the
Usability of Academic Websites in the Pandemic. Education and Information
Technologies. doi:10.1007/s10639-021-10650-9.
mm.
Project Management Institute (2010). The Value of Project Management.
[online] Available at: https://www.pmi.org//media/pmi/documents/public/pdf/white-papers/value-of-project-management.pdf.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
84
nn. Reference. (2020). Why Is Database Design So Important? [online] Available at:
https://www.reference.com/world-view/database-design-important42dda832528ce266.
oo. Schafer, J.B., Konstan, J. and Riedi, J. (1999). Recommender Systems in ecommerce. Proceedings of the 1st ACM Conference on Electronic Commerce EC ’99. [online] doi:10.1145/336992.337035.
pp. Seal, A. (2019). The Most Interesting AI Statistics of 2019. [online] Vxchnge.com.
Available at: https://www.vxchnge.com/blog/ai-statistics [Accessed 27 Dec.
2021].
qq. Serrador, P. (2018). The Importance of the Planning Phase to Project Success.
[online] Pmi.org. Available at: https://www.pmi.org/learning/library/importanceplanning-phase-project-success-6021.
rr. Spinellis, D. (2005). Version Control Systems. IEEE Software, [online] 22(5),
pp.108–109. doi:10.1109/ms.2005.140.
ss. Study.com. (2022). Testing Phase in SDLC. [online] Available at:
https://study.com/academy/lesson/testing-phase-insdlc.html#:~:text=Testing%20Phase%20of%20SDLC.
tt. Walker, A. (2019). UML Activity Diagram: What is, Components, Symbol,
EXAMPLE. [online] Guru99.com. Available at: https://www.guru99.com/umlactivity-diagram.html.
uu. Wangchuk, K. (2017). IMPORTANCE OF PROJECT MANAGEMENT IN
PROJECT.pdf. Importance of Project Management in Climate Change: Report on
Climate Change in Bhutan. [online] Available at:
https://www.academia.edu/38586657/IMPORTANCE_OF_PROJECT_MANAGE
MENT_IN_PROJECT_pdf.
vv. Watt, A. (2014). Chapter 13 Database Development Process – Database Design
– 2nd Edition. [online] Opentextbc.ca. Available at:
https://opentextbc.ca/dbdesign01/chapter/chapter-13-database-developmentprocess/.
ww.
Western Governors University. (2020). What Is AI Technology and How Is
It Used? [online] Available at: https://www.wgu.edu/blog/what-ai-technology-howused2003.html#close [Accessed 22 Dec. 2021].
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
85
xx. Whinston, A., Stahl, D. and Choi, S. (1997). Economics of Electronic Commerce.
[online] Seattle: Que Publishing. Available at:
https://www.pearson.com/us/higher-education/program/Whinston-Economics-ofElectronic-Commerce/PGM2819044.html?tab=overview [Accessed 18 Dec.
2021].
yy. www.sas.com. (2021). Artificial Intelligence – What It Is and Why It Matters.
[online] Available at: https://www.sas.com/en_in/insights/analytics/what-isartificial-intelligence.html [Accessed 21 Dec. 2021].
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
86
Appendices
Appendix A - Requirements Analysis (Core and Advance Functionalities)
CORE
Table 16. Core Functionalities
REQUIREMENT
Register / Create an Account
ID NUMBER
FR-1
DESCRIPTION Users must initially register to make purchases or save a list of their
"favourites" on the ecommerce program. To do so, the user needs
first and last name, as well as their email address and password.
The application then checks to see if the email address and
password are both legitimate (eight or more characters inclusive of
lowercase, uppercase, numbers, and special characters). Once the
information has been validated as a new/unique user, the record is
saved in the database user table. The user is subsequently given
with a message confirming that they have been successfully
registered.
RATIONALE
Registration is essential to enable users to access specific features
such as making a purchase, storing their favourites from previously
viewed movies, and allowing for suggestions based on purchases.
REQUIREMENT
Products Category List
ID NUMBER
FR-3
DESCRIPTION As with all ecommerce, the main feature provides a listing of all the
products carried by the online movie store. Users can access
information such as movie names, prices, descriptions, poster
images that are being offered.
RATIONALE
Displays items for sale that can assist users in making purchases
based on options.
REQUIREMENT
Product Search Bar
ID NUMBER
FR-4
DESCRIPTION A search bar allows for users to find a specific item or range of
specific items
RATIONALE
Searching for objects in an extensive list of categorized items may
be exceedingly frustrating, time consuming, and tedious. To address
this, a search bar will provide a better user experience by quickly
locating the user's need/want.
REQUIREMENT
Product Description
ID NUMBER
FR-5
DESCRIPTION Product description provides users with more details on a specified
product and includes info not usually seen in a title.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
87
RATIONALE
REQUIREMENT
ID NUMBER
DESCRIPTION
RATIONALE
REQUIREMENT
ID NUMBER
DESCRIPTION
RATIONALE
REQUIREMENT
ID NUMBER
DESCRIPTION
RATIONALE
REQUIREMENT
ID NUMBER
DESCRIPTION
RATIONALE
This feature will allow for users to see a brief overview of the movie
including its genre, length, actors.
Product Inventory Management
FR-6
Administrators should be able to easily add, update, and delete
products from the database using a product inventory management
system.
The database must be kept up to date since false advertising might
cost the movie shop customers if things are not priced correctly or
are no longer available.
Cart Management
FR-7
Cart management is a feature of the shopping cart. It allows for
registered users to be able to add, remove or confirm products they
wish to purchase.
By allowing users to remove movies they no longer wish to see will
give the user a better experience in trusting that they can manage
their purchases. movies that remain in the cart can be purchased
when the user is ready to do so.
Customer Profile Management
FR-8
Registered users can access features such as viewpoints, view
purchase history, edit profile or change payment information.
A user may have information that they need to maintain their account
up to date, such as credit card information that has changed. A user
may also wish to know what movies they have already purchased.
Upcoming Releases
FR-9
Upcoming Releases allows for users to plan on purchases and keep
user engagement
By having upcoming releases, users can anticipate what next movie
they want to see. This will keep users engaged and returning to the
website.
ADVANCED
Table 17. Advanced Functionalities
REQUIREMENT
Recommender Systems
ID NUMBER
FR-10
DESCRIPTION Recommender systems suggests products based on purchase
history, geographical location, similar viewed items, other users
viewed history.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
88
RATIONALE
REQUIREMENT
ID NUMBER
DESCRIPTION
RATIONALE
REQUIREMENT
ID NUMBER
DESCRIPTION
RATIONALE
REQUIREMENT
ID NUMBER
DESCRIPTION
RATIONALE
REQUIREMENT
ID NUMBER
DESCRIPTION
RATIONALE
REQUIREMENT
ID NUMBER
DESCRIPTION
RATIONALE
Recommender Systems will provide users with info on what to watch
next, based on purchase history, geographical location, similar
viewed items, other users viewed history keeping users engaged
and returning to the website.
Responsive Design
FR-11
The Ecommerce program instantly resizes and adjusts to fit any
device screen, including laptops, mobile phones, tablets, and
desktop computers.
By having responsive design, users can comfortably view the
ecommerce on any platform/device.
Customer Ratings
FR-12
Users may utilize customer ratings to determine how "excellent" a
product is depending on its quality.
This function will tell the customer if the movie is worth seeing based
on the reactions of other customers.
AI Technology - Chatbot feature
FR-13
Customers benefit from AI technology in the form of a Chatbot since
it provides FAQs to frequent questions, reducing the time it takes for
a human person to respond. If the customer is not satisfied, they are
referred to an agent if the Chatbot is unable to answer a query.
Improving customer service is essential in any business. AI Chatbot
is a direct connect for a user to find out any queries on movies or
use of website. This also frees up any demand for physical one on
one service.
Online Payment Methods
FR-14
The Online Payment option allows for registered customers to
securely enter their credit card information utilized to pay for their
purchases at checkout from their cart.
Customers need a form of payment to buy movies online
Password Encryption
FR-15
Password Encryption safeguards the user by encrypting their
password and storing it as an unreadable string of characters in the
database.
This feature adds an additional layer of security. It also gives comfort
to a user in securing their information.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
89
Appendix B – Data Dictionary
Table 16. Data Dictionary - Users
Table
users
Field name
Data Type
user_id
first_name
last_name
email
password
int
varchar
varchar
varchar
varchar
reg_date
datetime
user_type
varchar
Field
Length
11
100
100
100
200
10
Constraint
Description
primary key
none
none
none
none
current_timestamp
()
none
primary key
user firstname
user lastname
email
password
current date
added
user level
Table 17. Data Dictionary - Cart
Table Field name
cart
Data Type
cart_id
user_id
item_id
int
int
int
cart_item_added
datetime
Field
Length
11
11
11
Constraint
Description
primary key
foreign key
foreign key
current_timestamp
()
primary key
user id
item id
current date
added
quantity
amount
status of
cart
cart_item_quantity int
11
none
cart_item_status
200
none
varchar
Table 18. Data Dictionary - Purchases
Table
purchase
s
Field name
Data
Type
Field
Lengt
h
Constraint
purchase_id
int
11
primary key
item_id
int
11
foreign key
purchase_item_price
double
5,2
none
11
none
purchase_item_quanti
int
ty
purchase_date
datetim
e
receipt_id
int
current_timesta
mp ()
11
foreign key
Descriptio
n
primary
key
item id
purchase
prices
item
quantity
current
purchase
date
receipt id
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
90
Table 19. Data Dictionary - Reviews
Table
reviews
review_id
user_id
item_id
Data
Type
int
int
int
review_rating
int
review_subject
varchar
100
none
review_message
varchar
300
none
review_date
datetime
Field name
Field
Length
11
11
11
11
Constraint
Description
primary key
foreign key
foreign key
primary key
user id
item id
review
rating
review
subject
review
message
current
review date
none
current_timestamp
()
Table 20. Data Dictionary – Receipts
Table
receipts
receipt_id
user_id
Data
Type
int
int
receipt_date
datetime
receipt_code
varchar
10
primary key
foreign key
current_timestamp
()
none
receipt_subject
double
5,2
none
receipt_total
double
5,2
none
Field name
Field
Length
11
11
Constraint
Description
primary key
user id
current date
receipt code
receipt
subject
receipt total
Table 21. Data Dictionary - avatars
Table
Field name
Data Type
avatars
avatar_id
avatar
int
varchar
Field
Length
11
50
Constraint
Description
Primary Key
None
Primary key
Avatar image
Table 22. Data Dictionary – upcomingitems
Table
Field name
upcomingitem
upcomingitem_id
s
Data
Type
Field
Lengt
h
Constrain Descriptio
t
n
int
11
primary
key
auto
increment
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
91
upcomingitem_title
varcha
r
upcomingitem_descripti
on
text
upcomingitem_price
double
6,2
none
upcomingitem_image
varcha
r
200
none
upcomingitem_quantity
int
11
none
upcomingitem_category
upcomingitem_category
2
upcomingitem_youtube
varcha
r
varcha
r
varcha
r
100
none
none
100
100
300
none
none
none
name of
the item
description
of the item
price of the
item
item image
item
amount
item
category
item
category 2
YouTube
trailer link
Appendix C – Story Board (Sketches)
Figure 87. Homepage Sketch
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
92
Figure 88. Checkout Sketch
Figure 89. Cart Sketch
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
93
Figure 90. Details page Sketch
Figure 91. Store page Sketch
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
94
Appendix D - Core and Advance Functional Requirements (Testing)
Table 23. FR3 (Products Category List)
TEST
NUMBER
FR3.1
FR1.2
FR3.3
TEST
Listing of various
products in a
catalogue format
Movie Image, title,
price, are all viewable
Quick view button and
View movie buttons
are functional
(clickable)
EXEPECTED
OUTCOME
Users can see
all movies
listed
All items
retrieved from
database
viewable
Buttons
selected
display the
relevant
content
associated
with it
ACTUAL
RESULT
OUTCOME
Users can see all Successful
movies listed
All items
retrieved from
database
viewable
Buttons selected
display the
relevant content
associated with it
Successful
Successful
Table 24. FR4 (Product Search)
TEST
NUMBER
FR4.1
FR4.2
TEST
Query placed for item
in store in search bar
on the navigation bar
Query placed for item
in not store in search
bar on the navigation
bar
EXEPECTED
OUTCOME
User
redirected with
filtered items
based on
searched item
User
redirected to
error message
no results
found
ACTUAL
RESULT
OUTCOME
User redirected
Successful
with filtered items
based on
searched item
User redirected
to error message
no results found
Successful
Table 25. FR5 (Product Description)
TEST
NUMBER
FR5.1
TEST
Navigate to details
from ‘View Move’ on
Store Page
EXEPECTED
OUTCOME
Full Movie
description
displayed
ACTUAL
OUTCOME
Full Movie
description
displayed
RESULT
Successful
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
95
FR5.2
Navigate to details
from ‘Quick View’ on
Store Page
Preview of
movie
description
displayed
All items
retrieved from
database
viewable
Preview of movie
description
displayed
Successful
FR5.3
Movie Image, title,
price, description,
trailer, Add to Cart,
reviews,
recommended
products are all
viewable on details
page
All items
retrieved from
database
viewable
Successful
FR5.4
Movie Image, title,
price, description,
trailer, Add to Cart, are
all viewable on quick
view page
All items
retrieved from
database
viewable
All items
retrieved from
database
viewable
Successful
FR5.5
Add to Cart button
clickable
Only Registered
user able to click
button, add item
and navigates to
Cart
Successful
FR5.6
Trailer loads and plays
when selected
Only
Registered
user able to
button, adds
item and
navigates to
Cart
Trailer plays
as intended
Trailer plays as
intended
Successful
FR5.7
Review Button
clickable
Only Registered Successful
user able to input
a review
FR5.8
Recommend products
clickable
Only
Registered
user able to
input a review
When selected
item image
user is
redirected to
details page
When selected
item image user
is redirected to
details page
Successful
Table 26. FR6 (Product Inventory Management)
TEST
NUMBER
FR6.1
FR6.2
TEST
EXEPECTED
OUTCOME
ACTUAL
OUTCOME
RESULT
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
96
FR6.3
Table 27. FR7 (Cart Management)
TEST
NUMBER
FR7.1
TEST
Add items and view
the cart
FR7.2
Items can be removed
from cart
FR7.3
Items can be checked
out of cart
FR7.4
Price of Items in cart
are added together
FR7.5
User can add more
items to cart via
Continue Shopping
button
EXEPECTED
OUTCOME
Only a
registered
user can add
items and view
the cart
Remove items
button
removes the
items from cart
Check Out
button
redirects user
to checkout
page
Subtotal
shows value of
all items in
cart
Continue
shopping
button
redirects user
to store page
ACTUAL
OUTCOME
Only a registered
user can add
items and view
the cart
RESULT
Successful
Remove items
button removes
the items from
cart
Check Out
button redirects
user to checkout
page
Successful
Subtotal shows
value of all items
in cart
Successful
Continue
shopping button
redirects user to
store page
Successful
Successful
Table 28. FR8 (Customer Profile Management)
TEST
NUMBER
FR8.1
FR8.2
FR8.3
TEST
EXEPECTED
OUTCOME
ACTUAL
OUTCOME
RESULT
Table 29. FR9 (Upcoming Releases)
TEST
NUMBER
FR9.1
FR9.2
FR9.3
TEST
EXEPECTED
OUTCOME
ACTUAL
OUTCOME
RESULT
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
97
Table 30. FR10 (Recommender System)
TEST
NUMBER
FR10.1
TEST
viewed Item detail
page feeds
recommender with
items of similar
categories
EXEPECTED
OUTCOME
Items shown
in
recommender
are of
categories like
the item being
viewed
ACTUAL
OUTCOME
Items shown in
recommender
are categories
like the item
being viewed
RESULT
Successful
Table 31. FR11 (Responsive Design)
TEST
NUMBER
FR11.1
TEST
Pages can size to fit
cleanly and be seen
on multiple devices
EXEPECTED
OUTCOME
Artefact
resizes
automatically
to fit the
window being
displayed in
ACTUAL
OUTCOME
Artefact resizes
automatically to
fit the window
being displayed
in
RESULT
Successful
Table 32. FR12 (Customer Ratings)
TEST
NUMBER
FR12.1
FR12.2
TEST
Ratings and reviews
can be seen by users
post a review and give
a rating
EXEPECTED
OUTCOME
Details page
allows for all
users to see
ratings and
reviews
Registered
Users can
post reviews
and give a
rating
ACTUAL
RESULT
OUTCOME
Details page
Successful
allows for all
users to see
ratings and
reviews
Registered Users Successful
can post reviews
and give a rating
Table 33. FR13 (AI Technology - Chatbot feature)
TEST
NUMBER
TEST
EXEPECTED
OUTCOME
ACTUAL
OUTCOME
RESULT
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
98
FR13.1
Chatbot accessed on
all pages
FR13.2
Chatbot functional on
a conversation level
Chatbot can
be interacted it
with on all
pages
Chatbot
responds
based on key
words used
Chatbot can be
interacted it with
on all pages
Successful
Chatbot
responds based
on key words
used
Successful
Table 34. FR14 (Online payment methods)
TEST
NUMBER
FR14.1
TEST
User can enter credit
card info to pay for
item
EXEPECTED
OUTCOME
Transaction
successful,
removes item
from cart and
redirected to
thank you
page.
ACTUAL
OUTCOME
Transaction
successful,
removes item
from cart and
redirected to
thank you page.
RESULT
Successful
Table 35. FR15 (Payment encryption)
TEST
NUMBER
FR15.1
TEST
Payment entered
Stripe database is
encrypted
EXEPECTED
OUTCOME
Payment
entered
Database is
encrypted and
not legible
ACTUAL
OUTCOME
Payment entered
Database is
encrypted and
not legible
RESULT
Successful
Appendix E – Non-Functional Requirements (Testing)
Table 36. NFR2 (Database Security)
TEST
NUMBER
NFR2.1
TEST
Access to database
should only be used
through the artefact’s
interface. Both
registered and
unregistered users
must not be to access
EXEPECTED
OUTCOME
Information
from the
database
ONLY be
accessed by
artefact
interface
ACTUAL
OUTCOME
Information from
the database
ONLY be
accessed by
artefact interface
RESULT
Successful
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
99
NFR2.2
the database or to
view/query data.
Administrators access
and edit information in
the database
Administrators
can access
and edit
information in
the database
as required
Administrators
can access and
edit information
in the database
as required
Table 37. NFR3 (Browser Compatibility)
TEST
NUMBER
NFR3.1
NFR3.2
TEST
Artefact displayed
across all common
browsers – Safari,
Opera, Microsoft
Edge, Mozilla Firefox,
and Google Chrome.
Artefact can scale to
size based on device
on each browser
EXEPECTED
OUTCOME
Microsoft
Edge, Safari,
Mozilla
Firefox, Opera
and Google
Chrome are all
capable of
displaying the
artefact.
Artefact can
scale to size
for mobile,
tablet and
desktop based
on device on
each browser
ACTUAL
OUTCOME
Microsoft Edge,
Safari, Mozilla
Firefox, Opera
and Google
Chrome are all
capable of
displaying the
artefact.
Artefact can
scale to size for
mobile, tablet
and desktop
based on device
on each browser
RESULT
Successful
Successful
Table 38. NFR4 (Maintainability)
TEST
NUMBER
NFR4.1
TEST
User modifies
information on the
artefact
EXEPECTED
OUTCOME
User cannot
modify any
information on
the artefact.
Only
administrators
have access
to edit and/or
enhance
content.
ACTUAL
RESULT
OUTCOME
User cannot
Successful
modify any
information on
the artefact. Only
administrators
have access to
edit and/or
enhance content.
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
100
Table 39. NFR5 (Consistency)
TEST
NUMBER
NFR5.1
EXEPECTED
OUTCOME
All pages are designed Layouts,
to be in harmony with
buttons, and
each other. Layouts,
key elements
buttons, and key
have a
elements should have consistency
a consistency
throughout the
throughout the
artefact with
artefact.
Neilsen’s
Heuristics
factored in
TEST
ACTUAL
OUTCOME
Layouts, buttons,
and key
elements have a
consistency
throughout the
artefact with
Neilsen’s
Heuristics
factored in
RESULT
Successful
Table 40. NFR6 (Usability)
TEST
NUMBER
NFR6.1
TEST
The application's
interface should be
user-friendly, with
system visibility,
consistency, and
standards.
EXEPECTED
OUTCOME
Neilsen’s
Heuristics
factored in to
ensure the
artefact is
user-friendly,
with system
visibility,
consistency,
and standards.
ACTUAL
OUTCOME
Neilsen’s
Heuristics
factored in to
ensure the
artefact is userfriendly, with
system visibility,
consistency, and
standards.
RESULT
Successful
Table 41. NFR7 (Availability)
TEST
NUMBER
NFR7.1
TEST
artefact hosted on a
platform that is stable,
secure, reputable, and
satisfies industry
regulatory
requirements with
redundancy to ensure
minimal downtime
EXEPECTED
OUTCOME
Because
artefact is not
in production
environment
and stored
locally, the
platform
hosting is
ACTUAL
OUTCOME
Artefact is not in
production
environment and
stored locally,
the platform
hosting is stable,
secure,
reputable.
RESULT
Successful
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
101
stable, secure,
reputable.
Appendix F – Nielsen's Heuristics Ten (10) principles Review.
Table 42. Neilsen Heuristics
#
2.1
2. Match Between System and the Real World
REVIEW CHECKLIST
RATING
2 - the heuristic
Are icons concrete and familiar?
fully implemented
2.2
Are menu choices ordered in the most logical way,
given the user, the item names,
and the task variables?
2.3
If there is a natural sequence to menu choices, has it
been used?
2.4
Do the selected colors correspond to common
expectations about color codes?
2.5
When prompts imply a necessary action, are the words
in the message consistent with
that action?
2.6
On data entry screens, are tasks described in
terminology familiar to users?
2.7
Are menu titles parallel grammatically?
2 - the heuristic
fully implemented
2.8
Are command names specific rather than general?
2 - the heuristic
fully implemented
2.9
Does the system automatically enter leading or trailing
spaces to align decimal points?
2.10
Does the system automatically enter a dollar sign and
decimal for monetary entries?
2.11
#
Are function keys labeled clearly and distinctively, even
if this means breaking
consistency rules?
3. User Control and Freedom
REVIEW CHECKLIST
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
RATING
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
102
3.1
In systems that use overlapping windows, is it easy for
users to switch between
windows?
3.2
Can users reduce data entry time by copying and
modifying existing data?
3.3
Are character edits allowed in data entry fields?
3.4
If users can go back to a previous menu, can they
change their earlier menu choice?
3.5
Can users move forward and backward between fields
or dialog box options?
3.6
Can users cancel out of operations in progress?
2.7
If the system uses a pointing device, do users have the
option of either clicking on menu items or using a
keyboard shortcut?
2.8
Are users prompted to confirm commands that has
drastic, destructive consequences?
#
4.1
4.2
4. Consistency and Standards
REVIEW CHECKLIST
Have industry or company formatting standards been
followed consistently in all
screens within a system?
Has a heavy use of all uppercase letters on a screen
been avoided?
4.3
Are icons labeled?
4.4
Are there salient visual cues to identify the active
window?
4.5
Does each window have a title?
4.6
Are vertical and horizontal scrolling possible in each
window?
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
RATING
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
103
4.7
Does the menu structure match the task structure?
2 - the heuristic
fully implemented
4.8
Are menu titles either centered or left-justified?
2 - the heuristic
fully implemented
4.9
Are menu items left-justified, with the item number or
mnemonic preceding the
name?
4.10
Are field labels and fields distinguished typographically?
4.11
4.12
4.13
4.14
4.15
4.16
#
5.1
5.2
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
Are field labels consistent from one data entry screen to
another?
Are there no more than four to seven colors, and are
they far apart along the visible
spectrum?
Are system objects named consistently across all
2 - the heuristic
prompts in the system?
fully implemented
Are menu choice names consistent, both within each
2 - the heuristic
menu and across the system, in
fully implemented
grammatical style and terminology?
Does the structure of menu choice names match their
2 - the heuristic
corresponding menu titles?
fully implemented
Are commands used the same way, and do they mean
2 - the heuristic
the same thing, in all parts of
fully implemented
the system?
5. Help Users Recognize, Diagnose, and Recover from Errors
REVIEW CHECKLIST
RATING
2 - the heuristic
Is sound used to signal an error?
fully implemented
Are prompts stated constructively, without overt or
implied criticism of the user?
2 - the heuristic
fully implemented
5.3
Do prompts imply that the user is in control?
2 - the heuristic
fully implemented
5.4
Are prompts brief and unambiguous.
2 - the heuristic
fully implemented
5.5
Are error messages worded so that the system, not the
user, takes the blame?
5.6
If humorous error messages are used, are they
appropriate and inoffensive to the
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
104
user population?
2 - the heuristic
fully implemented
5.7
Are error messages grammatically, correct?
5.8
2 - the heuristic
Do error messages avoid the use of exclamation points? fully implemented
5.9
5.10
5.11
5.12
5.13
5.14
#
Do error messages avoid the use of violent or hostile
words?
If an error is detected in a data entry field, does the
system place the cursor in that
field or highlight the error?
Do error messages inform the user of the error's
severity?
Do error messages suggest the cause of the problem?
Do error messages provide appropriate semantic
information?
Do error messages indicate what action the user needs
to take to correct the error?
6. Error Prevention
REVIEW CHECKLIST
6.1
Are menu choices logical, distinctive, and mutually
exclusive?
6.2
Are the function keys that can cause the most serious
consequences in hard-to-reach
positions?
6.3
If the system uses qualifier keys, are they used
consistently throughout the system?
6.4
Does the system prevent users from making errors
whenever possible?
6.5
Does the system warn users if they are about to make a
potentially serious error?
6.6
Does the system intelligently interpret variations in user
commands?
6.7
6.8
Do data entry screens and dialog boxes indicate the
number of character spaces
available in a field?
Do fields in data entry screens and dialog boxes contain
default values when
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
RATING
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
105
appropriate?
#
7.1
7.2
7. Recognition Rather Than Recall
REVIEW CHECKLIST
RATING
For question-and-answer interfaces, are visual cues and 2 - the heuristic
white space used to distinguish questions, prompts,
fully implemented
instructions, and user input?
2 - the heuristic
Does the data display start in the upper-left corner of the
fully implemented
screen?
7.3
Have prompts been formatted using white space,
justification, and visual cues for easy scanning?
7.4
Are field labels close to fields, but separated by at least
one space?
7.5
Are size, boldface, underlining, color, shading, or
typography used to show relative
quantity or importance of different screen items?
7.6
Are borders used to identify meaningful groups?
7.7
Has the same color been used to group related
elements?
7.8
Is color coding consistent throughout the system?
7.9
Is there good color and brightness contrast between
image and background colors?
7.10
#
8.1
8.2
8.3
Are function keys arranged in logical groups?
8. Flexibility and Minimalist Design
REVIEW CHECKLIST
In dialog boxes, do users have the option of either
clicking directly on a dialog box
option or using a keyboard shortcut?
On menus, do users have the option of either clicking
directly on a menu item or
using a keyboard shortcut?
On data entry screens, do users have the option of
either clicking directly on a field or
using a keyboard shortcut?
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
RATING
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
106
8.4
8.5
#
If the system uses a pointing device, do users have the
option of either clicking on
fields or using a keyboard shortcut?
If menu lists are short (seven items or fewer), can users
select an item by moving the
cursor?
9. Aesthetic and Minimalist Design
REVIEW CHECKLIST
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
RATING
2 - the heuristic
fully implemented
9.1
Is only (and all) information essential to decision making
displayed on the screen?
9.2
Are all icons in a set visually and conceptually distinct?
2 - the heuristic
fully implemented
9.3
Does each icon stand out from its background?
2 - the heuristic
fully implemented
9.4
Does each data entry screen have a short, simple,
clear, distinctive title?
9.5
Are field labels brief, familiar, and descriptive?
9.6
Are prompts expressed in the affirmative, and do they
use the active voice?
9.7
Are menu titles brief, yet long enough to communicate?
#
10.1
10. Help and Documentation
REVIEW CHECKLIST
Is the help system interface (navigation, presentation,
and conversation) consistent with the navigation,
presentation, and conversation interfaces of the
application it supports?
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
RATING
2 - the heuristic
fully implemented
10.2
Navigation: Is information easy to find?
2 - the heuristic
fully implemented
10.3
Presentation: Is the visual layout well designed?
2 - the heuristic
fully implemented
10.4
Conversation: Is the information accurate, complete,
and understandable?
10.5
Is it easy to access and return from the help system?
2 - the heuristic
fully implemented
2 - the heuristic
fully implemented
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
107
10.6
Can users resume work where they left off after
accessing help?
2 - the heuristic
fully implemented
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
108
Appendix G – Screenshots of Artefact
Figure 92. Homepage (Frontend)
Figure 93. Login page (Frontend)
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
109
Figure 94. Register page (Frontend)
Figure 95. Store page (Frontend)
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
110
Figure 96. Quick View (Frontend)
Figure 97. Checkout page (Frontend)
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
111
Figure 98. Details page (Frontend)
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
112
Figure 99. Contact page (Frontend)
Figure 100. Cart page (Frontend)
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
113
Figure 101. Admin page (Frontend)
JOHN SOO HON | CTS-2113668 | UNDERGRADUATE THESIS REPORT
114