AlterTech Final1.2

WEB-BASED WATER BILLING AND E-PAYMENT SYSTEM WITH DATA
ANALYTICS FOR BARANGAY SAN JOAQUIN CITY OF STO. TOMAS,
BATANGAS PUROK TINDALO WATER DISTRICT
A Capstone Project
Presented to the Faculty of
College of Computer Studies and Technology
Pamantasan ng Lungsod ng San Pablo
San Pablo City, Laguna
In Partial Fulfillment of the Requirements for the Degree
BACHELOR OF SCIENCE IN INFORMATION TECHNOLOGY
by:
John Lloyd N. Abergas
Jane Irish M. Bautista
Joshua Miguel R. Demesa
Van Buren B. Magadia
Kurt Warren R. Manzanero
January 2023
PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE ii
Page APPROVAL SHEET
The Capstone Project is entitled WEB-BASED WATER BILLING AND E-
PAYMENT SYSTEM WITH DATA ANALYTICS FOR BARANGAY SAN
JOAQUIN CITY OF STO. TOMAS, BATANGAS PUROK TINDALO WATER
DISTRICT prepared and submitted by John Lloyd N. Abergas, Jane Irish M.
Bautista, Joshua Miguel R. De Mesa, Van Buren B. Magadia, and Kurt Warren
R. Manzanero in partial fulfillment of the requirements for the degree of
BACHELOR OF SCIENCE IN INFORMATION TECHNOLOGY has been
examined and is recommended for acceptance and approval.

PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE iii
Page DEDICATION
The capstone project entitled Web-Based Water Billing and E-Payment
System with Data Analytics for the Barangay San Joaquin City of Sto. Tomas,
Batangas Purok Tindalo Water District is wholeheartedly dedicated to beloved
parents, who have been the source of inspiration and gave strength when thought
of giving up, who continually provide their moral, spiritual, emotional, and financial
support.
They also dedicated this capstone project to Almighty God, for the
guidance, strength, power of the mind, protection, skills, and gave a healthy life to
finish the Capstone Project
To Pamantasan ng Lungsod ng San Pablo serves as their second home
and for serving as the foundation for developing skills and expertise.
To Mr. Sherwin D. Quizon, Dean of the College of Computer Studies and
Technology, for his continuous encouragement.
To Mrs. Eden Jinky Manila, secretary of Purok Tindalo Water District, and
staff who accept the offer to be their client
To Mr. Apolo Joseph D. Capuno, Capstone Project Adviser for always
being there to encourage and advise them, for continually telling each group that
all of the trials and struggles involved in completing this capstone project are
worthwhile, and for always encouraging them to continue this capstone project.
PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE iv
PageTo their brothers, sisters, relatives, friends, and classmates who gave
encouragement and moral and intellectual support with some ideas that helped
them finish this project
J.L.N.A.
J.I.M.B.
J.M.R.D.
V.B.B.M.
K.W.R.M.
PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE v
Page ACKNOWLEDGEMENT
The proponents are grateful to God for providing them with the strength,
wisdom, and unending blessings that they needed to finish the project. They
would like to take this chance to thank everyone who has helped with the work
described in this capstone project in some form.
First and foremost, they would want to express their thanks to Mr. Apolo
Joseph D. Capuno, their capstone project adviser, whose encouragement, and
support from the beginning to the end enabled them to design and understand
their capstone project.
Secondly, the developers are really grateful to Mrs. Eden Jinky Manila for
giving their clients the chance and supplying them with all the data they required
during data collection to create this capstone project.
Thirdly the proponent’s sincere thank also goes to Mr. Sherwin D. Quizon,
Dean of the College of Computer Studies and Technology, for his continuous
encouragement.
Fourthly the institution, Pamantasan ng Lungsod ng San Pablo where
the developers are honed as vital individuals and trained as Bachelor of Science
in Information Technology students under the mentorship of their knowledgeable
teachers.
PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE vi
PageLastly, they would like to thank their parents for their never-ending support,
love, and financial support for the material needed in this capstone project.
J.L.N.A.
J.I.M.B.
J.M.R.D.
V.B.B.M.
K.W.R.M.
PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE vii
Page EXECUTIVE SUMMARY
One of the most essential requirements of humanity is water. Water districts
often manually process and manage their customers' water bills. Customers are
provided house-to-house with printed copies of the water bill rates and the due
date. This strategy is out-of-date and will impede the administration of the water
district due to the rapid advancement of technology. It takes a lot of time, requires
a ton of paperwork, and is prone to mistakes and physical obstacles. This led to
the researcher’s main objective which is to develop a Web-based Water Billing and
E-payment System with Data Analytics for the Barangay San Joaquin City of Sto.
Tomas, Batangas Purok Tindalo Water District will serve as an automated system
that can be managed by the water district to generate water bills and support e-
payment for the convenience of both customers and the administrators and lessen
the manual process and support innovation of technology.
The website consists of features that are separated for both the customer
and the administrator. For the customer of the water suppliers, they will have
access to the website with their registered credentials, customer dashboard of their
complete generated water bills, and billing page wherein it displays the total bill
and its information that is automatically computed on the present month and the
payment page, where the user handles the payment through cash, Gcash, and
Paymaya. And for the administrator, will have full access to the system such as an
admin account, admin dashboard, customer lists, access to the billing of all
PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE viii
Page
customers which can be modified, customer payment page wherein the admin will
handle all of the payments made by the customer.
The researchers cited relevant related literature and systems that support
the study. That relevant literature and systems served as a guide in the
development of this project.
The project development model that the researchers used is the waterfall
model. The researchers used this development model in order to develop a simple
and convenient water billing system due to a given time constraint. This model is
also essential for development because the researcher first identified all of the
requirements and the problems in place to provide a solution and to proceed to the
next step which is the system design and development. The researchers benefit
from the waterfall model, which leads to a well-developed project.
The system was evaluated by five (5) IT Practitioners, five (5) officials in
Purok Tindalo, and ten (10) residents in barangay San Joaquin city of Sto. Tomas,
Batangas. The developed system received an overall mean of 4.07 with an
interpretation of Very Acceptable using the ISO 9126 Quality Model Evaluation
instrument, which includes Functionality, Reliability, Usability, Efficiency,
Maintainability, and Portability. This means that the system met all of the software
quality standards and required functions. The outcomes demonstrate that the
created system complied with both the client's objectives and the ISO 9126 Quality
Model.
PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE ix
PageThe researchers also came up with three (3) recommendations such as (1)
The researchers suggest to future researchers to improve the recovery plan of the
system. (2) The researchers suggest to the re researchers expand the range of
payment methods. (3) The last suggestion of the researchers to future researchers
develops a mobile app version of the system.

PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE x
Page TABLE OF CONTENTS
PRELIMINARIES PAGE
Title Page ............................................................................................... i
Approval Sheet …................................................................................... ii
Dedication …........................................................................................... iii
Acknowledgment …................................................................................ v
Executive Summary …........................................................................... vii
Table of Contents …............................................................................... x
List of Figures …..................................................................................... xiii
List of Tables …...................................................................................... xv
CHAPTER I – THE PROBLEM AND ITS BACKGROUND
Introduction .................................................................................. 1
Background of the Study .............................................................. 2
Objectives of the Study ................................................................ 4
Purpose and Description ............................................................. 5
Theoretical Framework ................................................................ 6
Conceptual Framework ............................................................... 9
Scope and Limitation of the Study................................................ 10
Significance of the Study ............................................................. 12
Definition of Terms ....................................................................... 13

PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE xi
Page
CHAPTER II REVIEW OF LITERATURE AND STUDIES
Technical Background.................................................................. 16
Review of Literatures.................................................................... 19
Related Systems.......................................................................... 27
Project Synthesis.......................................................................... 33
CHAPTER III DESIGN AND METHODOLOGY
Research Design.......................................................................... 35
Requirement Analysis.................................................................. 36
Current Technical Situation.......................................................... 37
New Technical Situation............................................................... 38
Flowchart Diagram....................................................................... 39
Requirement Documentation........................................................ 42
System Requirements.................................................................. 45
Software Requirements................................................................ 45
Hardware Requirements.............................................................. 47
Design of Software, Systems, Products, and/or Process..………. 50
Development and Testing............................................................. 56
Data Analysis Plan....................................................................... 58
Testing Plan………………............................................................ 61
Test Plan...................................................................................... 62
Implementation Plan..................................................................... 72
PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE xii
Page
CHAPTER IV RESULT AND DISCUSSION
Discussion of the Interface........................................................... 74
Project Evaluation........................................................................ 90
Conclusion…………………………………………………………… 110
Recommendations...................................................................... 110
BIBLIOGRAPHY…………………………………………………………….. 112
APPENDICES
A. Recomlist of Appendices in Capstone Manuscriptmendation
Letter of Adviser to the Client
B. Informed Consent Form from the RDC
C. Project Team Assignment
D. Gantt Chart
E. Project Proposal and Project
F. Software Quality Evaluation Instrument
G. Filled Up Software Quality Evaluation Instrument
H. User Manual
I. Pictures Taken
J. Grammarian’s Certificate
K. Research Profile
PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE xiii
Page LIST OF FIGURES
Figure No. Title Page

1.1 Conceptual Framework of the System 9
2.1 WaterBills – Water Bill Maintenance System 27
2.2 JK Water Billing App 28
2.3 Smart Water Billing 29
2.4 Manila Water App 30
2.5 Muni Link Software 32
3.1 Current Technical Situation 37
3.2 New Technical Situation 38
3.3 Login Flowchart Diagram 39
3.4 Admin Flowchart Diagram 40
3.5 Customer Flowchart Diagram 41
3.6 XAMPP 45
3.7 Sublime Text 46
3.8 Google Chrome 47
3.9 System Unit 47
3.10 Printer 48
3.11 Monitor 48
3.12 Input Device 49
3.13 System Architecture 50
3.14 Conceptual Design 51
3.15 Data Models 53
3.16 Block Diagram 54
3.17 Use Case Diagram 55
3.18 Waterfall Model 56
4.1 Login Module 74
4.2 Admin Dashboard Module 75
4.3 List of Customers Module 77
4.4 Add Customer Module 78
PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE xiv
Page
4.5 Add Billing Module 79
4.6 Admin Billing History Module 80
4.7 Payment Approval Module 81
4.8 Cash Payment Module 82
4.9 Admin Payment History Module 83
4.10 User Profile Module 84
4.11 User Menu Module 85
4.12 Customer’s Dashboard Module 86
4.13 Customer Billing History Module 87
4.14 Customer Create Payment Module 88
4.15 Customer Payment History Module 90
PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE xv
Page LIST OF TABLES
Table No. Title Page

3.1 System Requirement 45
3.2 ISO 9126 Quality Mode 59
3.3 Rating Scale Criteria 60
3.4 Test Plan Login 61
3.5 Test Plan Add Customer 63
3.6 Test Plan Search Customer 64
3.7 Test Plan Update Customer 65
3.8 Test Plan Add Billing 66
3.9 Test Plan Search Billing History 66
3.10 Test Plan Payment Approval 67
3.11 Test Plan Cash Approval 67
3.12 Test Plan Search Payment History 68
3.13 Test Plan Edit Profile 68
3.14 Test Plan Change Password 69
3.15 Test Plan Statement of Account 69
3.16 Test Plan Search Billing History 70
3.17 Test Plan Create Payment 70
3.18 Test Plan History Payment 71
3.19 Test Plan Edit Profile 72
3.20 Test Plan Change Password 72
3.21 Implementation Plan 73
4.1 IT Practitioner’s Evaluation Based on Functionality 91
4.2 IT Practitioner’s Evaluation Based on Reliability 92
4.3 IT Practitioner’s Evaluation Based on Usability 92
4.4 IT Practitioner’s Evaluation Based on Efficiency 93
4.5 IT Practitioner’s Evaluation Based on Maintainability 94
4.6 IT Practitioner’s Evaluation Based on Portability 94
4.7 Summary of IT Practitioner’s Evaluation 95
PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE xvi
Page
4.8 Client’s Evaluation Based on Functionality 97
4.9 Client’s Evaluation Based on Reliability 98
4.10 Client’s Evaluation Based on Usability 98
4.11 Client’s Evaluation Based on Efficiency 98
4.12 Client’s Evaluation Based on Maintainability 100
4.13 Client’s Evaluation Based on Portability 101
4.14 Summary of Client’s Evaluation 101
4.15 User’s Evaluation Based on Functionality 103
4.16 User’s Evaluation Based on Reliability 104
4.17 User’s Evaluation Based on Usability 104
4.18 User’s Evaluation Based on Efficiency 105
4.19 User’s Evaluation Based on Maintainability 106
4.20 User’s Evaluation Based on Portability 106
4.21 Summary of User’s Evaluation 107
4.22 Overall Evaluation 109
PAMANTASAN NG LUNGSOD NG SAN PABLO
Page CHAPTER I
THE PROBLEM AND ITS BACKGROUND
This chapter includes an Introduction, Background of the Study, Objectives
of the study (General and Specific), Significance of the Study, Purpose and
Description, Scope and Limitation of the Study, Theoretical Framework,
Conceptual Framework, and Definition of Terms.
Introduction
Water is one of the most important resources for human survival and a vital
link between society and the environment. It is essential for socio-economic
development, energy and food production, healthy ecosystems, and human
survival. People in this era are highly exposed to technology and skilled in using
technology. Technology is essential for running a business today. It is used in
business to study and solve daily problems. Employees nowadays spend
excessive amounts of time manually recording consumer information. It is obvious
that without technology there is no modernization, and modernization, in turn,
brings about improvement in the quality of human lives. The invention of the
computer and some other related devices has no doubt brought improvement in
the quality of life. With the introduction of the computer, much software was
invented and has made those things, which seem not to be possible a reality.
E-payments enable users to make payments online at any time and from
any location in the world. Faster electronic payments, such as virtual cards, enable
PAMANTASAN NG LUNGSOD NG SAN PABLO PAGE 2
Page
businesses to improve security, visibility, and efficiency while lowering costs and
reducing time spent on manual processes. Water Billing System is an automated
system for paying customers' water bills. Web-based servers outperform desktop
or local servers in terms of performance, making them safer when multiple users
access them at the same time. Data analytics can assist a business in optimizing
its performance, performing more efficiently, maximizing profit, or making more
strategic decisions. Data analytics were used in the developed system, as well as
SMS notifications. SMS alerts, also known as SMS notifications or text alerts, are
messages that are sent automatically to subscribers who have indicated that they
want to receive text messages from a company.
Web-Based Water Billing and E-Payment System with Data Analytics is an
automated system that is based on delivering the water bills to the consumer and
transaction of payment of the bills. Companies across the world employ tactics to
keep their flexibility and profitability. They frequently offer services that are
advantageous to both their customers and the business overall. The business
needs to retain profitable relationships with its customers while also safeguarding
its financial well-being. To ensure revenue, the billing and collection system must
be reliable and accurate.
Background of the Study
The Barangay San Joaquin City of Sto. Tomas, Batangas Purok Tindalo
Water District started in 1980’s. In 2021 the management was transferred to them
and the current presidents: Donato Austria Jr. and Celso Malabuyoc are
Page
treasurers, collectors, and secretary Eden Jinky Manila, the reader messenger is
Oyet Cambronero. There are 210 members of the Purok Tindalo Water District.
The study is conducted to help the said establishment to make their billing
process easier, modernistic yet user-friendly, and reliable. Managing a hundred
peoples are not easy for Purok Tindalo Water District to monitor their usage. The
problems contributing to issues in the Purok Tindalo Water District system are
predominantly attributed to mistakes made by individuals wherein the water bill is
not delivered to the correct homeowner resulting in delays in payments, fills and
records of water bills are not properly organized, and kept, the information on water
consumption per consumer is not documented properly and the files of the water
station are not secured and mostly stored in envelopes and folders, the payments
and transactions are recorded manually on the record book. Manual data entered
is taking up a lot of time which leads to delays in the availability of data resulting in
slow processing of information and the important data being manually entered
resulting in inconsistencies in the records.
This Web-Based Water Billing and E-Payment System with Data Analytics
for the Barangay San Joaquin City of Sto. Tomas, Batangas Purok Tindalo Water
District. A billing system includes procedures and processes that help create bills
and invoices for customers. Nowadays, billing systems include software that allows
transmitting bills and invoices to customers online. Water Billing System is an
automated system that is based on paying water bills. This system can have
managed transactions such as paying customers' bills and it will track all the
Page
records of the customer if they have paid on the due date or not. This system is a
digital transaction between two parties, which is the admin of Purok Tindalo and
the consumers, with e-payment types including Gcash and Paymaya. This Web-
Based Water Billing and E-Payment System can manage a hundred consumers in
Purok Tindalo. It can be accessed through the Internet; end-users and water
consumers could connect and perform transactions can, enabling them to become
efficient in their daily tasks, whether in the office or at home. The head of the unit
can make an overall view of the status of daily transactions and it can be viewed
using the desktop, laptop, and android mobile devices connected to the internet.
The water consumers may receive an email and short messaging system showing
their current water consumption and water bill. Added/unique features such as
graphical charts showing regular water consumption on the end-users and
consumers’ dashboards as well as on their billing statements are provided.
Objectives of the Study
The general objective of the study is to create a Web-based Water Billing and
E-Payment System with Data Analytics for the Barangay San Joaquin City of Sto.
Tomas Batangas Purok Tindalo Water District.
The following are the specific objectives of the study:
1. To provide a website that generates water bill information, which is very
convenient for Purok Tindalo Water District, to help the water supplier manage
the numerous folds of water bills and to help customers get paid easily and
without hassle.
Page
2. To provide a website platform with an electronic billing statement feature
wherein a statement of accounts will be sent directly to the registered
homeowner. This will help eliminate the possibility of the incorrect delivery of
water bills.
3. To create a website that will serve as a tool for Purok Tindalo Water District
and that will accommodate transactions in the form of cash and electronic
payment methods like Gcash and PayMaya for the convenience of customers.
4. To develop a tool that will generate monthly and yearly crystal reports of water
consumption, sales reports, payment methods, and tracking of paid and
unpaid customers.
5. To assess whether the web-based water billing and e-payment system with
data analytics for the Barangay San Joaquin City of Sto. Tomas Batangas
Purok Tindalo Water District complies with the ISO 9126 quality metrics.
6. To prepare an implementation plan for the deployment of the web-based
water billing and e-payment system with data analytics for Barangay San
Joaquin City and Sto. Tomas Batangas Purok Tindalo Water District.
Purpose and Description
In the developed system the proponents mainly focused on the
development of a Web-Based Water Billing and E-Payment System with Data
Analytics for the Barangay San Joaquin City of Sto. Tomas Batangas Purok
Tindalo Water District will provide an alternative way for efficiency to give their
customers a fast, secure, and reliable service. Web-Based Water Billing and E-
Page
Payment System with Data Analytics for the Barangay San Joaquin City of Sto.
Tomas Batangas Purok Tindalo Water District is a web-based platform for
managing water bills and transaction payments of consumers.
The system process bill payments or the statement of the account, generate
billing reports and issues an official receipt. The system also has a feature that
notifies registered consumers about the due date of payment via SMS message
and email. Along with availing of water supply from the water district is paying for
water bills every month. Due to the increased number of water consumers, water
districts find it hard to manage a pile of water bills. The manual way of managing
water bills is prone to human errors. Conventionally, they deliver water bills
personally which sometimes are delivered to the wrong homeowner, and this
causes delays in payments. Managing water bill information in the manual process
also consumes a lot of time and effort because the data are entered manually and
may produce an inconsistent record. The system generates reports of
consumption monthly and yearly and can also see who paid cash and Gcash or
Payaya. The system generates a sales report monthly and yearly and will have a
transparency report of data computation. The paid and not paid report will be
displayed in the system.
Theoretical Framework
The study developed a concept based on various theories. Certain theories
best explain the role of water service providers in water management. For
instance, the Agency theory contents of two participants: the agent, and the
Page
stakeholders. According to Bhimani (2008), the theory requires a separation of
ownership and control, where the stakeholder command the ownership as the
agent ensures control. This way, the stakeholders expect the agents to act and
make financial decisions in the interest of the stakeholders. The agent will work
as per the expectations of the stakeholders to maximize their value of the
stakeholders. Concerning water resource management, the WSPs are expected
to pay for the water used to satisfy the demands of WRMA and maximize the
value of WSBs. They are to ensure that WRMA and WSBs successfully sustained
financial factors. This would only be made possible by ensuring that all the
payments for water consumed are prompt. The WSPs should show their agency
proficiency by collecting all the payments for water supplied to consumers at the
appropriate time and efficiently.
For the current study, this framework relates to how the system will
efficiently distribute water bills and collect payments per specific water consumers
on a specified time and date without the use of the manual method and providing
an automated and paperless transaction.
Another theory, the Stewardship Theory, suggests the agents protect and
make surpluses for the owners (Abdullah & Valentine 2009). It stresses that the
agents must ensure that they operate the services to optimize financial
performance, as they retain sufficient surpluses. The 18th theory demands the
existence of a structure, which empowers the agents and allows for their
autonomy, built on trust. The WSPs are agents, who provide service on behalf of
Page
WSBs. According to this theory, WSPs must ensure that the WRMA collects
enough money to sustain the water management system in Kenya. The
operations in these WSPs must ensure that there is an optimization of their
financial performance.
For the current study, this framework relates to how the system will
promote innovation by implementing a cashless transaction, especially
nowadays, the end users are leaning towards E-Payment. This specific method
will eliminate the process of the consumers by avoiding traveling to pay bills and
encouraging them to pay online anytime.
The pricing theory shows that a surplus can obviously be obtained when
one buys an asset at a lower price and then sells the same asset at a higher price.
According to the theory, the price of the assets changes up to equilibrium, when
there are no more positive returns between the same assets and the possibility
of profiting from arbitrage is gone, (Rorden and Kristofer, 2010). This theory was
found very useful in explaining the cost recovery, which must ensure that there is
a sufficient surplus after recovering the cost of water.
For the current study, this framework relates to how the system can provide
a feature wherein the administrator can change and modify the pricing of the water
bill and it depends on the supply and demand of water supply in that certain area
with this, it creates flexibility from the water district regarding the water bill.
Page
Conceptual Framework
Input Process Output
Knowledge • Login System Web-Based Water Billing

Requirements • Dashboard and E-Payment System
Admin/Customer with Data Analytics for
• Login • Billing Barangay San Joaquin
- Email • Payment City of Sto. Tomas,
- Password • SMS and email Batangas, Purok Tindalo
• Add Client function of the Water District
- Name system
- Email • Data Analytic into • System Output
- Contact Number databaase - Login System
- Password - The dashboard
• Add Billing of system shows
- Customer Name the data analytic
- Meter Reading - Issue a receipt
- Consumption - SMS and email
• Data Analytic notification to
customer
System Requirement
- Web Browser
- MySQL
- Sublime Text
- GCash
- PayMaya
Hardware Requirement
- Processor: Intel
Core i5 or higher.
- Memory: 8 GB
RAM or higher.
- Storage: 500 GB
hard disk or
higher.
- Input Devices:
Keyboard and
Mouse.
- Printer
Figure 1.1: Conceptual Framework of the System
Figure 1.1 shows the interaction of the Input – Process – Output (IPO)
variables that were used in the development of the Web-Based Water Billing and
E-Payment System with Data Analytics for Barangay San Joaquin City of Sto.
Tomas Batangas Purok Tindalo Water District. The first frame which is input
consists of knowledge requirements including login (email and password), add

Page
client (name, email, contact number, and password), adding billing (customer
name, meter reading, and consumption), and data analytics. The system and
hardware requirements are already stated in the input which has under variables
also stated. The second frame which is the process consists of planning. Here you
can see the process after conducting the login system, dashboard
admin/customer, billing, payment, SMS, and email function of the system, and data
analytics into the database. In the third frame which is the output. Is stated that the
result of everything stated in the input and process is a Web-Based Water Billing
and E-Payment System with Data Analytics for the Barangay San Joaquin City of
Sto. Tomas Batangas Purok Tindalo Water District including the system output
admin and user logging in successfully, the dashboard of the system shows the
data analytic, issues a receipt, and SMS and email notification to the customer.
Scope & Limitation of the Study
This study focuses on how the Web-Based Water Billing and E-Payment
System with Data Analytics for the Barangay San Joaquin City of Sto. Tomas
Batangas Purok Tindalo Water District will improve its billing system. The clients
are Purok Tindalo Water District of Barangay San Joaquin City of Sto. Tomas
Batangas. The users are Purok Tindalo Water District and the residents of the
Barangay San Joaquin City of Sto. Tomas Batangas. The admin will register the
residents of the Barangay San Joaquin City of Sto. Tomas Batangas to the system
so they will have an account.

PageThe system generates process payments, generates billing reports, and
issues an official receipt. The customers will receive their consumption and water
bill computation via web-based sending via email and SMS message with an
efficient working environment and user-friendly interface resulting in fast
processing of data of the customers, water district employees will no longer print
paper bill statements and manual deliver them to the homeowners. All of the bills
will be saved in the billing history of the admin’s account and the customers will
also have a billing history and it will be saved in their respective accounts. The
customers will pay online using Gcash or Paymaya and after paying, the
customers will have to wait for the admin’s approval. The customers will receive
an email and SMS after the admin approved the payment. The customers can
also pay a cash payment and if the customer is paid the generated bill in their
account will automatically remove. All of the payments will be saved in the
payment history of the admin’s account and the customers will also have a
payment history and it will be saved in their respective accounts. The admin can
change the information and password of the customers and the customer can
also change their information and password.
The limitation of the study does not cover the other Barangay of the City of
Sto. Tomas, Batangas. The project will focus only on the water district and the
residents of Barangay San Joaquin Sto. Tomas, Batangas Purok Tindalo Water
District.
Page
Significance of the Study
The major beneficiaries of the system are the following:
Purok Tindalo Water District. The implementation of the developed
system will enhance company transactions. The system will secure all the records
of the Water District, they’ll have accurately detailed, and timely reports of the
transactions. The system will help them manage water bills. This will improve their
business growth and customer service.
The Residents of San Joaquin City of Sto. Tomas, Batangas. The
customer will also benefit because they will not need to wait for the water bill from
the bill delivery and the customer will not experience a long time waiting because
the customer will receive automatically the water bill via mobile phone by using the
water billing and e-payment system.
Researchers. Through the study, the proponents will enhance their skills in
system analysis, design, and development of a website which is vital for future IT
professionals, and take a suitable system for the company that they have chosen.
Future Researchers. The Study will serve as a guide for the student or
other researchers who are also conducting a similar study on Web-based Water
Billing and E-Payment Systems with Data Analytics
The results of this study could help them to realize that the Web-based
Water billing and e-payment system with Data Analytics is much better because
from time to time the technology is changing.

Page
Definition of Terms
Conceptual Terms
Bill - The meaning of bill, in the context of finance and accounting, is a formal
written or printed document that itemizes and records a financial transaction, such
as the sale of goods or services (Investopedia, 2022).
Billing System - A system to collate billing information, n and prepare invoices
relating to charges payable by each party under this agreement (Jalil, H., 2018).
E-payment - An alternative to cash and trade barter and can be understood as a
payment mechanism using electronic media that does not involve cash (Fatonah,
S., 2018).
GCash - GCash is a mobile wallet and online payment platform in the Philippines
that allows users to perform various financial transactions through their mobile
devices. It enables users to pay bills, buy load credits, purchase goods and
services, transfer funds, and even invest in financial products. GCash is also
widely used for cashless transactions in physical stores and online shops, as well
as for person-to-person (P2P) transfers (GCash, 2022).
PayMaya - PayMaya is a mobile wallet and online payment platform in the
Philippines that allows users to perform various financial transactions through their
mobile devices. It enables users to pay bills, send money, buy load credits, and
even shop online without the need for a credit card. PayMaya is widely accepted
Page
in physical stores and online shops as a form of cashless payment (PayMaya,
2022)
SMS - A text messaging service component of most telephone, internet, and
mobile device systems. It uses standardized communication protocols that let
mobile devices exchange short text messages (Kelly Heather, 2012)
System - Defined as a set of interacting or interdependent components forming
an integrated whole (Backlund, 2000)
Transaction - An event or business activity that involves an exchange of money
or money's worth between parties (Sahil Roy, 2018)
Website - A collection of web pages and related content that is identified by a
common domain name and published on at least one web server (Tim Berners-
Lee, 2021)
Water District - A local corporate entity that operates and maintains a water
supply system in one or more provincial cities or municipalities (Christine Weber,
2015)
Operational Terms
Customers – They are the residents of the San Joaquin City of Sto. Tomas and
the consumer of water.
Data Gathering – The proponents gathered all the information in order to develop
a water billing system.

Page
Invoice – The document sent to a buyer that specifies the amount and the cost of
a product or services that have been provided by a seller.
Input – The Information that is put into a computer.
Output – The outcome or the result of the process information.
Purok – A Filipino term that means division within a barangay in the Philippines.
Sales Report – The Record of all calls made and products sold during a particular
time frame by a salesperson or the management.
Software – The Programs and other operating information used by a computer.

Page CHAPTER II
REVIEW OF LITERATURE AND STUDIES
This chapter includes the ideas, accomplished manuscripts, generalizations
or conclusions, methodologies, foreign and local sources. Those included in this
chapter help in familiarizing relevant and similar information to the present study.
Technical Background
The existing manual method is currently in use in Purok Tindalo Water
District and Services unit. They do not have an existing technology that is essential
and necessary for fast, paperless, and easy transactions in terms of distributing
water bills, recording and storing the history of payments made by the consumers
of barangay, and generations of reports.
For implementation of the proposed system, Purok Tindalo Water District
needs to acquire a computer unit/s, printer for printing bills, reports generated and
such and set-up Local Area Network Connectivity on the office.
Using the Web-Based Water Billing for Purok Tindalo Water District and
Services unit the meter reading will be paperless and can be accessed by the
administrator and consumers through the internet, water consumers can perform
transactions and payments online, records such as payment history peruses will
be stored in the database, bills can be managed and tracked easily and it will
provide an effective means of the processing of transactions for the water station.
The developed system is installed on the main computer that is dedicated to Purok
Page
Tindalo Water District and it also has a backup server/ files in case the system
malfunctions. Windows 10 will be used as an operating system for running the web
application. In the development of the system, the researcher will utilize the
waterfall model.
Personal Home Page (Hypertext Preprocessor)
Personal Home Page (hypertext preprocessor) is a popular open-source
general-purpose programming language that can be inserted into HTML. Instead
of a long list of commands to build HTML (like in C or Perl), PHP pages feature
embedded code that does "something" (in this case, output "Hi, I'm a PHP script!").
PHP code is wrapped in the particular start and finish processing instructions that
allow you to switch between "PHP mode" and "normal mode." What distinguishes
PHP from client-side JavaScript is that it is run on the server, generating HTML
that is then delivered to the client. The client would receive the results of the script's
execution but would be unaware of the underlying code. You may even set up your
web server to use PHP to execute all your HTML files, making it virtually impossible
for users to access them (Welling, L., & Thomson, L., 2016).
HTML (HyperText Markup Language)
HTML stands for HyperText Markup Language. It is a markup language
used to create and structure content for the World Wide Web. HTML uses markup
tags to define elements such as headings, paragraphs, images, and links, among
others, and is interpreted by web browsers to render web pages (W3C, 2017).
Page
CSS (Cascading Style Sheets)
CSS stands for Cascading Style Sheets, which is a style sheet language
used for describing the presentation of a document written in a markup language,
such as HTML. CSS allows web designers to control the visual style and layout of
multiple web pages at once, making it faster and easier to develop and maintain
websites (W3C, 2017).
Bootstrap
Bootstrap is a free, open-source front-end development framework for the
creation of websites and web apps. Designed to enable responsive development
of mobile-first websites, Bootstrap provides a collection of syntax for template
designs. As a framework, Bootstrap includes the basics for responsive web
development, so developers only need to insert the code into a pre-defined grid
system. The Bootstrap framework is built on Hypertext Markup Language (HTML),
cascading style sheets (CSS), and JavaScript. Web developers using Bootstrap
can build websites much faster without spending time worrying about basic
commands and functions (Bootstrap, 2022)
Java
Java is an object-oriented programming language designed to run on a wide
range of platforms, including Windows, Mac, and Linux. It was created in the mid-
1990s by James Gosling, Mike Sheridan, and Patrick Naughton at Sun
Microsystems. Java code is compiled into bytecode, which can be executed by a
Java Virtual Machine (JVM) on any platform that has one installed. One of the key
advantages of Java is its "write once, run anywhere" philosophy, which allows
Page
developers to write code once and run it on multiple platforms without modification
(Oracle, 2022).
Review of Literatures
As stated by Ado and Pelandiana (2017), the Web-Based Billing and
Collection System for a Municipal Water and Services Unit was designed to
address a municipal water unit's problem. It might be accessed over the internet,
allowing end-users and water customers to connect and conduct transactions,
allowing them to be more productive in their daily chores, whether at work or home.
The status of daily transactions can be viewed by the unit's head using a desktop,
laptop, computer, and android mobile devices that are connected to the internet.
Water customers may receive an email or text message with their current water
consumption and bill. Unique features include a graphical chart depicting normal
water usage.
Based on this project, there are features that are similar to the developed
system such as it is developed as a web application for administrator and end-
users, and transactions can be made online, they also have an email and SMS
feature but the difference is that it included a graphical chart for normal water
usage and it is also developed on android mobile devices for the consumers of the
water bill.
Corresponding to Ambre, J. A. (2016), the water billing system is critical for
providing clients and service receivers with consistent and accurate billing
information. The research at the Abra State Institute of Sciences and Technology
Page
in Lagangilang, Abra, is working on an automated water billing system. The
Philippines, as well as to assess its usefulness in areas of efficiency, affect,
helpfulness, control, and learnability. In this study, descriptive and applied
research methods were used. An interview and a feedback form were used to
collect data. The responses were drawn from the accounting and cashier officer
employees. The system was developed using the rapid application development
model, and its usability was tested using the software usability measurement
inventory questionnaire. Frequency count and mean we’re used to evaluating and
interpreting the data finding the study revealed that they need an automated billing
system to improve their billing procedures since it is done manually. Using the
rapid application development model, a reliable and feasible automated billing
system from development until implementation was achieved. The developed
system was found usable because it was designed to fit the needs of ASIST.
The study proposed the same technicalities as the proposed system. They
also created an idea of developing an automated water billing system and
innovating the manual method of water billing by studying what is needed in their
local area. The system is also developed using a rapid application development
model for measuring its usability and other factors. It is mostly similar to the
developed system in terms of providing consistent and accurate water billing
information online.
Claridad, N. et al., (2018), a water billing system is an automated system
that makes the complex task of billing easy, fast, and accurate. This article details
Page
the creation of an Automated Water Billing System for the hinunangan local
government unit in the Philippines' province of Southern Leyte. Desktop and
Mobile Reader are the two applications that make up the system. The Waterfall
Model was used to implement the System Development Life Cycle (SDLC)
framework in the development process. As a supplement to the fact-finding
technique, surveys and interviews were conducted. The respondents were chosen
using the purposive sample method, and the systems evolve evaluation of the
systems questionnaire created by the researcher. The developed system gives a
bigger benefit in supplying and delivering superior operation, reporting, and
services to the clientele, according to the study's findings.
The research’s similarities to the developed system is the development an
automated water billing for fast and accurate billing for the customers but it is made
on a web and mobile platform and it also handles the logistics of their water
supplies and management operations for every client since this was made for the
local government unit.
As determined by Magalo J.R. (2019), a web-based water billing system is
a computerized technique for providing water invoices to customers. This system
can handle billing by providing it straight to the customer through a mobile app or
the web. To aid the company's expansion, the proponents offered web-based
water billing with a mobile application. The system will generate invoices, process
payments, compute penalties, generate billing reports, and issue formal receipts.
This will also function as a repository for billing data on a centralized database so
Page
that if the accounting department requests billing reports regularly billing and
collection will be able to deliver them instantly. The system is precise enough to
fulfill the needs of the client.
The research is being undertaken to assist the aforementioned
establishment in making the billing process more efficient, modernized, user-
friendly, and reliable. The proponents will provide a "Web-Based Water Billing
System with Mobile Application" for the San Jose Del Monte Water District to
automate their current system. The proposed system is a software and hardware
combination that receives detailed and service usage information, groups it for
specific accounts or customers, generate management reports, records payments
made to customers, and monitors and supervises ongoing activities to ensure they
are on track-on-track schedule to meet the objectives and performance targets.
According to the study by Abeje, M. et al., (2016), Wolkite's water billing and
customer administration system are reliant on manual labor. This has a restriction
because customers must spend a significant amount of time in front of the office
to register and obtain resource services. To add services issue, we propose a new
system enabling Wolkite Water Supply Service Office clients to check their
payments online, saving time and allowing them to check their payments before
going to the office to pay the bill without knowing the exact amount. This system
was created using a three-tier strategy, which included planning, analysis, design,
and implementation. The use case, activity diagram, and sequence diagram are
Page
all drawn using the Unified Modeling Language (UML). PHP, JavaScript, and
HTML were utilized to develop this project. MySQL is a database application.
The research’s main purpose is the same as the developed system which
is to innovate manual labor and promote convenience for both the water supply
office and the water consumers by proposing a new system that can display the
water bill consumption per month and paying transactions online as well as the
programming languages used along the process.
Bangare, P. M. Dhumale, R. B., & Thombare, N. D. (2018), water waste
from manually driven water pumps, human error related to manually operate water
pumps. The development of an Android-based automatic Water Billing (AWB)"
system was prompted by challenges such as incorrect bill production, bill
availability delays, and payment process delays. A low-cost water flow meter is
proposed in the AWB system, which measures the flow rate of water passed
through the supply pipe of a specific user and generates bills based on that
customer's water usage. This allows users to manage their water usage without
incurring additional costs. The user is given a deadline to pay the bill, after which
the water supply will be turned off by the supplier.
The project is developed on Android but its features are similar to the
proposed web application. The only main difference is that it allows the water
supplier to turn off the water generation on the specific house of the consumer if
their bill is due.

PageWater Bill Management Application (WBM-App), which was designed in
Andiron Studio, sends out notifications when payments are due. The user can see
a graphical representation of their water usage over time thanks to a cloud platform
called Thing Speak. The system's major goal is to reduce water waste and human
involvement to avoid paying for the management processes.
Bhagyashree, W. et al., (2020), due to the scarcity of water in the twenty-
first century, preserving and monitoring water flow is critical, particularly during the
summer season. To address the problem of water monitoring and conservation, a
system for water billing employing flow sensors is proposed. If the flow sensors
send high-end flow data, they can be linked with an automated GSM message
service. It also includes an integrated water system. monitoring, which can then be
used for data processing and water resource estimation. Receiving is part of the
billing process. Given the billing rates connected with the billing records, compute
the cost for each billing record, and combine this data on a regular, delivering
invoices to delivered collect payments from consumers. The systems have a lower
overall maintenance cost, and the effects will be beneficial and positive.
The study’s main purpose is different from the developed system as they
are focusing on controlling and preserving the water supplies per consumer. This
project will be beneficial for some of the places that are limited by water supply
which is in contrast to the developed system which is to create a water billing
system to ease up the transaction process.

Page The study by Suresh M. et al., (2017), research describes a novel method
for automating water meter readings in order to update usage data from the field
to the utility office. The suggested smart metering methodology varies from current
commercial approaches by utilizing inexpensive IoT gear and smartphone apps.
This program enables both meter readers and individual domestic and commercial
customers to read meters and update the utility's site or database for billing and
payment using standard smartphones. The suggested plan lowers costs for utilities
by handling meter readings and invoicing for water delivery in major cities and
metropolitan areas.
The study is different from the developed system as it is focusing on the
development of an automated water meter reading in order to control and monitor
the consumption of water for big establishments it was also developed on mobile
devices in terms of monitoring the water bill costs and payment purposes.
Rodney S. et al., (2018), using informatics and advanced metering
technology, it is possible to develop digital multi-utility service providers. These
service providers will be able to gather medium-high resolution data on a
customer's water, electricity, and gas demand at the same time and offer user-
friendly platforms to relay this information to customers and supply/distribution
utility organizations. The advantages of derived operational synergies and access
to mass markets without being constrained by traditional city, state, or country
boundaries will go to providers who can implement affordable integrative systems.
The aspects of an integrated multi-utility service provider, including the system

Page
architecture, opportunities and advantages, challenges and solutions, and
commercial potential, are described in this article as well as the necessary
transformative process. Through illustrative examples and four educational case
studies on the water-energy nexus, the paper's main argument is that data
modeling procedures and informatics opportunities for contemporaneously
collected demand data can be demonstrated. The article concludes with a
summary of the revolutionary R&D priorities needed to realize the goal.
The study is focusing on the development of an application for every utility
such as electricity, water, and gas in order to widen their clients and target market
whereas the developed system made by the developer’s main focus is only on
water consumption and billing transaction purposes.
As determined by Suvarsha S. (2020), communication and technology are
constantly working to improve people's lives. Therefore, the primary goal of this
project is to create a system for automatic electronic water billing. In this project,
we create and put into place a fully autonomous water billing system without any
employee interaction. All currently in-use systems rely on a single bill to cover the
entire building, and water providers must pay a lot of money to print the invoices.
Additionally, some meters are broken or unable to provide readings. The system
we suggest uses smart meters. Every home has one of these meters, which will
measure the water usage and wirelessly transmit the results to the water company
base station using GSM modules. The readings are automatically kept in the
database and sent to the website where the user can make an online payment.
Page
The user receives frequent SMS notifications following each action. The suggested
approach is easy to implement, inexpensive, quick, and user-friendly.
The study proposed a project that aimed to lessen the manpower of water
supplier companies by promoting a smart water billing system to provide the
readings per household and the water bill through the system. The only similarity
it had was the SMS feature that could send water consumption and billing
information to the users.
Related System
There are several existing systems that are related to the proposed project,
Web-Based Water Billing and E-Payment System with Data Analytics for the
Barangay San Joaquin City of Sto. Tomas, Batangas Purok Tindalo Water District
Some of these systems include:
Source: https://play.google.com/store/apps/details?id=info.maintenance.waterbills&hl=en&gl=US
Figure 2.1: WaterBills - Water Bill Maintenance System
Sarfaraz (2020), developed a mobile application that can be easily used by
the consumers/ the target market with simple scheduling and reporting, you can
Page
save time controlling water and wastewater. This program allows you to solve any
water problem you may have anywhere on the planet. The Water Bill App will assist
you in billing for water maintenance. The features of this application are a home
screen with a count of all bills, a listing of due water bills of the customer, detail of
water billing with water reading, filter water bill (by bill no., date, payment status),
customer bill reporting, inquiry page to send a message, view customer inquiry,
customer profile with the update, mobile responsive web admin panel, firebase
Google Integration. The proposed system and WaterBills – WaterBill Maintenance
System has some similarities when it comes to features such as generating water
bills, customer’s water bill can be directly monitored, water bill report generation
and filtering based on data, etc. The advantage of the proposed system to the
Wastewater bill WaterBill Maintenance System is the proposed system has
features such as notifying the customers via SMS and email, and it can also allow
online payment through GCASH.
Source: https://steprimo.com/android/us/app/consumerapp.bsmart.bcits.jk/JK-Water-Billing-APP/
Figure 2.2: JK Water Billing App

PageTummala (2017), the mobile developer of BCITS PVT LTD developed the
JK Water Billing app which is accessible on the google play store. The JK water
Billing App is a mobile application for water and sewage bills. The app’s features
are to display the consumer’s water bill and the bill due. And also, it locates the
nearest office which they can find if they encounter problems regarding their water
consumption. It also has the feature of a compliant screen where the user can state
the complaint to the company or the admin. The similarities of the proposed system
to the JK Water Billing app are that they can both display and monitor the
consumer’s water bills and the due date, and they can both notify the customers
through SMS. The advantage of the proposed system to the JK Water Billing App
is that the proposed system can notify the user through email, the customer can
also pay online through GCASH and it has a feature wherein they are generating
and providing a report about the monthly and yearly bills of the customer.
Source: https://steprimo.com/android/us/app/ke.co.webwire.waterbills/Smart-Water-Billing/
Figure 2.3: Smart Water Billing

PageLeandro et al. (2020), designed and implemented Smart Water Billing
through h mobile application which can be downloaded to the google play store.
The Smart Water billing app can automatically track smart water meters, calculate
water bills, send an SMS notification to customers and process payments, map all
the locations of the customers that downloaded this application, and read their
meters through the admin side and it can immediately give you feedback on how
you manage your water meter. Most of the features of this application are almost
the same as the proposed system but the difference is that the admin side is on
the web while this application is also on mobile. The features that may give an
advantage to the proposed system to this app is the communication of the admin
to the client using email, which is also convenient to the customers and also, and
the system can provide a report generation wherein the customer can track the
financial, yearly and monthly so that they can monitor the usage of water to their
household.
Source: https://www.manilawater.com/customer/manila-water-app
Figure 2.4: Manila Water App.

PageApplication designed by Pevidal et al. (2020), the department head of
Systems and Solutions developed the Manila Water App as it is part of the project
of Manila Water Company Inc. The Manila Water App mobile application’s feature
can check your current water bill and view the consumer’s bill history through
smartphones, has also a messaging feature inside the application which can
provide communication between manila water and the customer, news and
updates from the manila water itself, can pay bills through Gcash, bitcoin dragon
pay and grab pay. Provides real-time service advisories and interruption notices
through push notification, and also the customer can also send their complaints,
concerns, and inquiries through the MW C.A.R.E.S feature of this application. It
also has a feature wherein they can state the project traffic updates wherein
displays the location of the places that are affected by traffic due to Manila Water
pipelaying activities. The proposed system and the Manila Water App are almost
identical as it has all the similarities of features, but the difference is that the
proposed system can be accessed through the Web while this is accessed through
smartphones which is more much convenient to the customers/ consumers. The
advantage of the proposed application to the Manila Water App is that the
proposed system’s target market is consumers of the forthright the Barangay San
Joaquin City of Sto. Tomas Batangas only. They can easily answer and handle
service-related concerns due to not so large several consumers, unlike the Manila
Water App which occupies numerous people in Metro Manila.

Page
Source. http://unbouncepages.com/muni-link-utility-billing-solution/
Figure 2.5: Muni Link Software
Rokosky (2019), developed the Muni-Link which is a cloud-based utility
billing solution developed for utility suppliers to manage payments, billing notices,
interest rates, and penalties for municipal authorities, boroughs, and cities. The
technology integrates with authorities' existing metering and accounting solutions.
Muni-Link allows users to manage individual accounts and access information
such as client addresses, utilities utilized, bills, and more. Customers can also
access a customer portal to view e-bills and make online payments. They can also
check their account balances and payment history. It also puts all of the customer’s
account information on one page as the figure shows to save clicks and minimize
the activity from the customer. The proposed system and the Muni-Link are almost
the same when it comes to their features as they are both web-based but the main
difference and advantage of the proposed system are that they can be notified
Page
through SMS and email which can be very convenient to the customers and it is
very easy to communicate between the Water District and its customers.
Project Synthesis
Ado and Pelandiana (2017), in the Web-Based Billing and Collection
System for a Municipal Water and Services Unit was designed to address a
municipal water unit's problem. This research has similarities with the system in
way that it also has a feature where users can also check the status of daily
transactions through their gadgets and where they receive a text message in
regard to the current status of their water consumption and bill. Ambre, J. A. (2016)
the water billing system is critical for providing clients and service receivers with
consistent and accurate billing information. The system was developed using the
rapid application development model, and its usability was tested using the
software usability measurement inventory questionnaire. The developed system
was found usable because it was designed to fit the needs of ASIST. This research
has similarities with the system in a way that it is an automated water billing system
that provides consistent and accurate billing information to the clients.
Claridad, N. et al. (2018), this article details the creation of an Automated
Water Billing System for the Hinunangan local government unit in the Philippines'
province of Southern Leyte. The developed system gives a bigger benefit in
supplying and delivering superior operation, reporting, and services to the
clientele, according to the study's findings.

PageAs determined by Magalo J.R. (2019), this system can handle billing by
providing it straight to the customer through a mobile app or the web. This will also
function as a repository for billing data on a centralized database so that if the
accounting department requests billing reports regularly billing and collection will
be able to deliver them instantly. The system is precise enough to fulfill the needs
of the client.
Bangare, P. M. Dhumale, R. B., & Thombare, N. D. (2018), water waste
from manually driven water pumps, human error related to manually operate water
pumps. This allows users to manage their water usage without incurring additional
costs. The user is given a deadline to pay the bill, after which the water supply will
be turned off by the supplier.
Water Bill Management Application (WBM-App) the system's major goal is
to reduce water waste and human involvement to avoid paying for the
management processes. This research shows the similarity of sending
notifications to the users when their payments are due which will let them monitor
their status.
Bhagyashree, W. et al. (2020), gave the billing rates connected with the
billing records, compute the cost for each billing record, and combine this data on
a regular, delivering invoices to delivered collect payments from consumers. The
systems have a lower overall maintenance cost, and the effects will be beneficial
and positive. This research has similarities in the system in the way that it sends a
message to users that are part of the billing process

Page CHAPTER III
DESIGN AND METHODOLOGY
This chapter discusses research methods that were used during the
research process. Research methodology is the path through which researchers
must conduct their research. This research design and methodology chapter show
the research outcome at the end will be obtained in line with meeting the objective
of the study. It shows the path through which researchers formulate the problem
and objective and present the result from the data obtained during the study period.
For emphasis in this chapter the outlines of the research strategy, research design,
research methodology, and the data sources such as primary data sources and
secondary data. The methods of data analysis used such as quantitative data
analysis and qualitative data. Therefore, the main purpose of this methodology is
to satisfy the research plan. The study used these strategies because the data
were obtained from all aspects of the data source during the study time.
Research Design
Web-Based Water Billing and E-Payment System for Purok Tindalo is a
system that sought to handle the matter of Barangay San Joaquin. It’s a significant
decision in research design to process the selection to be made regarding the
research approach since it determines how relevant information for a study will be
obtained. However, these research designs process many interrelated decisions.
The research design is meant to provide an appropriate framework for a study.
This study shows a descriptive research design. Therefore, this research design
Page
enabled a wide range of respondents on the impact of a fast transaction using E-
payment. It can be accessed through the web end-users and water consumers
could connect and perform transactions enabling them to become efficient in their
daily tasks whether within the office or at home.
To address these research objectives the qualitative data supports the
quantitative data analysis and results. The overall viewing the status of daily
transactions can be viewed using devices connected to the internet. The result
obtained the qualitative and quantitative data types in the data analysis. Auto
reminds the consumers for their bills are to be paid onward to the due date. The
system will serve as a record-keeping and monitoring system for the administration
and end-users of the proposed real-time billing system. This is another
breakthrough in Purok Tindalo bringing people together longing for a positive
change not only in business but in some other aspects as well.
Requirement Analysis
In Purok Tindalo Water District, they are using the traditional way of giving
water bills and receiving payment by going to every house and collecting the
payment manually and listing all the customers that are already paid or overdue
their water bill for a specific month. The secretary of Purok Tindalo Water District
Eden Jinky Manila is the one who is validating all the customers who paid at their
office. Oyet Cambronero is the reader messenger and the one who gives bills to
every consumer of Purok Tindalo Water District at the Barangay San Joaquin City
of Sto. Tomas Batangas every month. They are currently using a system that
Page
requires a manual input of data that results in inconsistencies of records and slow
processing that may result in a loss for their business and the consumers as it may
cause some confusion but as the consumers are growing in that area. To lessen
the time-consuming efforts and to be able to accommodate all of the consumers in
that area via the website for bill generation and the consumers can be notified
through their SMS and email.
Current Technical Situation
Figure 3.1: Current Technical Situation
Figure 3.1 illustrate the current technical situation of the Purok Tindalo
Water District. The consumer will use water from their barangay's water district.
Personnel from the water district will read the water meters in the San Joaquin
Page
Purok Tindalo at the end of each month. After reading and calculating the amount
of money due, one of the staff will return to the barangay to collect the payment
from clients, house to house. If a customer fails to pay on time, they will be directed
to the water district's office to pay the full cost or any outstanding balance.
Customers will receive a receipt from the Water District once their balance or
payment has been paid.
New Technical Situation
Figure 3.2: Login Flowchart Diagram

PageFigure 3.1 illustrate the new technical situation of the Purok Tindalo Water
District. The consumer used water from the water district of San Joaquin Purok
Tindalo. The reader of the water meter reads the consumption of water and will
give the information in the admin. The admin will use the system to input the
consumption of water to create a billing in the customers. The customer will use
the system to view and pay their billing and the admin will approve the payment of
the customer after verifying the payment.
Flowchart Diagram
Login
Figure 3.3: Login Flowchart Diagram

PageThe figure 3.3 illustrate the login process begins with the admin and
customer accessing the web-based water billing and e-payment system. The
admin and customer logs into the system using their account information, which is
typically their email address and a password. The system verifies the login
credentials and grants them access to their account. The customer is presented
with their account dashboard, which displays their current balance, recent
transactions, and other account information. The admin can view the water
company's financial data, such as total revenue, expenses, and outstanding
payments.
Admin
Figure 3.4: Admin Flowchart Diagram

PageThe figure 3.4 illustrate the admin’s part and can create new customer
accounts by entering their information into the system, the admin can also view the
billing information. If the customer's payment is successful, it will notify the admin
and will have to check the payment transaction. The customer can only have up to
three due dates.
Customer
C
Figure 3.5: Customer Flowchart Diagram

PageThe figure 3.5 illustrate the customer’s part. The customer can view their
billing history with statement of the account. The customer will pay the bill and will
receive by the admin and after the admin approved the customer’s payment the
email and SMS will automatically receive by the customer. If the admin rejected
the payment, it will notify the customer and will have to repeat the payment.
Requirement Documentation
1. Login Module
This module handles the login for both admin and customer wherein
when they put the correct credentials, they can access the system.
2. Admin Account Module
This module handles the account for the admin as when they log in with the
credentials for admin, they can have full access to the system.
2.1. Admin’s Dashboard Module
The admin dashboard shows the data analytics and the main overview of
the system when the admin login to the system.
2.2. Customers List Module
This module handles the creation of customers’ accounts along with their
personal information and login credentials that they will use the access the
website. It also handles the admin's privilege to update and delete the
customer's information and credentials and displays the list of all customers
that are registered on the system. Navigate the customer part to the sidebar
Page2.3. Admin's Billing Module
This module handles the billing that will be given based on the specific
customer. the total bill is automatically computed based on the units, and the
billing, date, and due date are also automatically filled up based on the real-
time date that the customer is created on the list and its bill's due date. The
billing for the customers for the present month was also displayed here which
can be sorted through the search bar and also displays the billing history for all
customers.
2.4. Admin's Payments Module
This module handles the customer's payment regarding whether the
customer will pay through cash, Gcash, and Paymaya. The admin will input the
name of the customer and there will be a verify button there wherein the units,
total bill, billing date, and due date will be automatically filled and with the pay
button, the cash payment will be confirmed and displayed on payment history
here.
2.5. Admin's My Profile Module
This module handles the admin's profile and it is displayed, the information
such as full name, email, mobile no., and address will also be displayed and
they can edit that personal information if they want to. The admin can update
all of the customer's personal information

Page3. Customer's Account Module
This module handles the account for the customer as when they log in with
the credentials for the customer, they can have to access their information
about their bills only.
3.1. Customer's Dashboard Module
This module handles the complete generated bills for the customer on their
dashboard when they login to the system
3.2. Customer's Billing Module
This module handles the billing that will be given based on the customer.
The total bill is automatically computed based on the units, billing date, and due
date is also automatically filled up based on the real-time date that the customer
is created on the list and its bill's due date. The billing for the customer for the
present month was also displayed here which can be sorted through the search
bar and also displays the billing history for the specific account of the customer.
3.3. Customer's Payments Module
This module handles the customer's payment regarding whether the
customer will pay through cash, Gcash, and Paymaya. If the customer uses
Gcash and Paymaya payment, they can insert an attachment of proof of
payment through Gcash and Paymaya for verification for the admin side.
Page3. 4. Customer's My Profile Module
This module handles the admin's profile and it is displayed, the information
such as full name, email, mobile no, and address will also be displayed and
they can edit that personal information if they want to. The customer can only
edit his/her personal information on my profile.
System Requirements
Table 3.1: System Requirements
EQUIPMENT QUANTITY SPECIFICATIONS
• Full view HD Display
• At least core i3
• Windows 10 Operating System

Desktop /
1
• 128GB SSD and 1TB of internal
Laptop
Storage
• Fast and Smoot operate performance
WIFI / Mobile • At least 5mbps or higher speed

1
Data
• Any branded printer

Printer 1
Software Requirements
Source: https://www.apachefriends.org/
Figure 3.6: XAMPP

Page
XAMPP
XAMPP is a free and open-source cross-platform web server solution stack
package developed by Apache Friends, comprising largely of the Apache HTTP
Server, MariaDB database, and interpreters for scripts written in the PHP and Perl
programming languages. Since most actual web server installations employ the
same components as XAMPP, it enables migrating from a local test server to a
live server possible.
Source: https://www.sublimetext.com/
Figure 3.7: Sublime Text
SUBLIME TEXT
A text and source code editor for Windows, macOS, and Linux is called
Sublime Text. Numerous markup and programming languages are supported
natively. Users can personalize it with themes and increase its functionality with
plugins, which are often developed and maintained by the local community under
free software licenses. The editor uses a basic interface and includes functionality
for programmers such as adjustable syntax highlighting, code folding, search-and-
replace supporting regular expressions, terminal output window, and more.
Sublime Text features a Python API to facilitate plugins. Although there is a free
demo version available, the program is proprietary.

Page
Source: https:// https://www.google.com/chrome/
Figure 3.8: Google Chrome
Google Chrome
A cross-platform web browser created by Google is called Chrome. It was
created using open-source technologies from Mozilla Firefox and Apple WebKit,
and it was first made available in 2008 for Microsoft Windows. Versions were
eventually produced for Android, which is the default browser, along with Linux,
macOS, iOS, and these platforms. The browser also makes up the bulk of Chrome
OS, which uses it to host web apps. Although Chrome is licensed as private
freeware, the majority of its source code is derived from Google's free and open-
source software project Chromium.
Hardware Requirements
Source: https://www.turbosquid.com/
Figure 3.9: System Unit

Page
System Unit Processor – Intel(R) Core (TM) i5-3210M CPU @ 2.50GHz
2.50GHz
A processor (CPU) is the logic circuitry that responds to and processes the
basic instructions that drive a computer. The CPU is seen as the main and most
crucial integrated circuitry (IC) chip in a computer, as it is responsible for
interpreting most of the computer’s commands.
Source: https://thehappystation.com.ph/
Figure 3.10: Printer
Printer
An electronic device that accepts text files or images from a computer and
transfers them to a medium such as paper or film.
Source: https://www.javatpoint.com/
Figure 3.11: Monitor

Page
Monitor
A monitor is a piece of computer hardware that displays the video and
graphics information generated by a connected computer through the computer's
video card. Monitors are similar to TVs but usually display information at a much
higher resolution.
Source: http://didljumpstart.com/
Figure 3.12: Input Device
Input Device
An input device is a piece of equipment used to provide data and control
signals to an information processing system, such as a computer or information
appliance. Examples of input devices include keyboards, mouses, scanners,
cameras, joysticks, and microphones.

Page
Design of Software, Systems, Products, and/or Process
System Architecture
Figure 3.13: System Architecture
Figure 3.13 shows an overview of the entire system. This diagram shows
the internal process of the Web-Based Water Billing and E-Payment System with
Data Analytics for the Barangay San Joaquin City of Sto. Tomas, Batangas Purok
Tindalo Water District. This includes all the inputs and outputs, the process of the
admin, and the client of the system. The water consumers may receive emails and
short messaging systems showing their current water consumption. The process
Page
of daily meter to cash operations records all customer data and conducts periodic
billing for water providers. It supports customer service transactions accepts
meter readings, calculates and produces an invoice for the consumer, manages
account receivables, tracking, and an advanced customer portal. It is optimized to
suit the unique needs of water utility providers. The system is automated for
billing, payments, and report generation.
Conceptual Design
Figure 3.14: Conceptual Design
Figure 3.14 illustrate the design basis with the main process of web-based
E-payment is defined as the overall flow of the water billing system. All of these
drawings should preferably be finalized with the status of our system. Billing is a
Page
critical function of most Water Boards, especially in sending the bills to the
consumers. This system will be reliable and accurate to suit the requirements of
the Purok Tindalo water board. The proposed solution uses evolving Mobile
Technologies known as SMS/email and E-payment, over a solution that uses web-
based to handle the payment’s day-to-day transactions which will allow the admin
to send bills to their consumers via SMS/email and consumers to pay their bills
after receiving the invoice. Consumer interaction with this system is improved and
consumers can easily view their monthly water bills by login into the system. The
burden on the billing is lessened and other new features have also been
introduced. The process of this design is to determine the construction, flow
controls, operating conditions, and meter reading per month and year. It helps to
keep a record of consumers, and monthly bills. It also helps the admin to send
consumers monthly bills via a web-based system. To maintain its profitability, the
admin must secure good communication with their clients and also secure their
financial status. The billing and collection system must be effective and accurate
to be able to assure revenue.

Page
Data Models
Figure 3.15: Data Models
Figure 3.15 illustrate the data models. The account has a user type to
identify if you’re an admin or user. The account is connected to payment and billing
and points to the full name because it identifies whose bill o payment the arrow is
zero to one because only one person can use one account. The payment is
connected to the notification and pointing payment ID identifies the payment
information the arrow is zero to one because one transaction can do at a time. The
billing is connected in notification and points to the billing ID identify the billing
Page
information customer or the admin makes billing for the customer and the arrow is
zero to one because there is only one bill in the customer.
Block Diagram
Figure 3.16: Block Diagram
Figure 3.16 illustrate the block models. The figure shows the connection
between the management of the admin to the customer's account and the
database. This also includes the data that is provided by the customer and the
admin, all of the data of the admin and the customer will be saved to the database.
The system will send SMS and email reminders to the customers.
Page
Use Case Diagram
Figure 3.17: Use Case Diagram

Page Figure 3.17 illustrate the login will be used by the customer and admin for
putting their email and password. The admin will access the add user which is add
new customer. The dashboard will be both used by the customer and the admin.
The admin can manage bills and it extends to add billing to a customer and include
a bill history which can check the history of the customer’s bill. The customer will
be able to access the bill where they can see how much to pay. The payment will
access by the customer, this is where they can pay and include the print receipt
for proof of having paid. The logout will be used by the customer and admin to
prevent other users from accessing their accounts.
Development and Testing
Project Development
Figure 3.18: Waterfall Model

PageFigure 3.18 illustrate the waterfall model. The development of a web-based
water billing and e-payment system that provides a simple, quick, and convenient
way for customers to pay their bills. The system also allows for better record-
keeping and tracking of monthly and yearly consumption, as well as account
transaction information. The use of the waterfall model is explained as a process
that ensures the successful implementation and decision-making for the
operational paradigm for payment. The system also includes features such as
identity verification for customers, leak detection, and detailed billing statements.
Overall, the system aims to provide a secure and reliable payment solution for
customers while improving the efficiency of water district utilities.
The waterfall model describes the process of the development of the Web-
Based Water Billing and E-payment System with Data Analytics for Barangay San
Joaquin City of Sto. Tomas, Batangas Purok Tindalo Water District is chosen
because it allows for a thorough and systematic approach to development that can
help to minimize errors, reduce risk, and ensure that the system is fully functional
and meets the needs of both customers and administrators. By breaking down the
development process into distinct phases, the team can focus on each aspect of
the system in detail and ensure that it is properly designed, developed, and tested
before moving on to the next phase.
Phase 1: Requirements phase of the waterfall model involves identifying
and defining the goals and objectives of the system, as well as the specific features
and functions that it needs to have to meet those goals. This phase is critical for
Page
the success of the project because it sets the foundation for all subsequent
development work.
Phase 2: Design phase involves creating a detailed blueprint or plan for the
system, including its architecture, user interface, and database design. This phase
ensures that the system is well-organized and structured in a way that is easy to
use and maintain.
Phase 3: Implementation phase involves writing the code for the system
based on the design specifications. This phase requires careful attention to detail
and testing to ensure that the system is free of bugs and errors.
Phase 4: Testing phase involves thorough testing of the system to ensure
that it meets the requirements and functions as intended. This includes both
functional testing to ensure that the system works as expected, as well as
performance testing to ensure that it can handle a high volume of transactions.
Phase 5: Maintenance phase involves ongoing monitoring and updates to
ensure that the system remains functional and meets the needs of its users.
Data Analysis Plan
ISO 9126: software production evaluation – quality characteristics and
guidelines for their use, which was developed to support these needs, defined six
quality characteristics, and described a software product evaluation process
model.
Page
Table 3.2: ISO 9126 Quality Mode
Software Quality Definition Rating
Factors 1 2 3 4 5
This is the essential Functionality characteristic and refers to the

Suitability
appropriateness (to specification) of the functional of the software
Accurateness This refers to the correctness of the function
A give software component or system does not typically function in
Interoperability isolation. This sub characteristic concerns the ability of a software
FUNCTIONALITY component to interact with other components or system.
Where appropriate certain industry laws and guidelines need to be
Compliance complied with this sub characteristic addresses the compliant capability
of software
This sub characteristic relate to unauthorized access to the software

Security
function
Maturity This sub characteristic concerns frequency of failure of the software
The ability of software to with (and recovery) from component, or

Fault Tolerance
RELIABILITY environmental. Failure of the software
Ability to bring back a failed system functional can be understood,

Recoverability
relates to user mental models in Human computer Interaction methods
Determines the ease to which the system functions can be understood,

Understandability
relates to user mental models in Human computer Interaction methods
USABILTY Learnability Learning effort for a different user, i.e. novice, expert casual, etc.
Ability of the software to be easily operated by a given user in a given

Operability
environment
Time Behavior Characterizes response times for a given thru put, i.e. transaction rate
EFFICIENCY Characterizes resources used, i.e. memory, CPU. Disk and network
Resource behavior
usage
Characterizes the ability to identify the root cause of a failure within the
Analyzability
software
Changeability Characterizes the amount of effort to change a system

MAINTABILITY
Characterizes the sensitivity to change of a given system that is the
Stability
negative impact that may be caused by system changes
Testability Characterizes the effort needed to verify (test) a system change
Characterizes the ability of the system to change to new Specification or

Adaptability
operating environments
Install ability Characterizes the effort required to install the software
Similar to compliance for functionality, but this characteristic relates to

PORTABILITY Conformance
portability
Characterizes the plug-and-play aspect of software components, that is
Replaceability how easy it is to exchange a given software component within a
specified component
Table 3.2 shows an evaluation instrument employing various criteria
included in the questionnaire form used to assess the performance of the system:
Page
function, reliability, usability, efficiency, portability, and maintainability. The Likert
scale is a rating scale used to measure opinions, attitudes, or behaviors it consists
of a statement or a question, followed by a series of five or seven answer
statements. Respondents choose the option that best corresponds with how they
feel about the statement or question.
Table 3.3: Rating Scale Criteria

Range of the Average Mean Interpretation
4.51-5.00 Highly Acceptable for each of the

assessment form's subcategories.
3.51-4.50 Very Acceptable for each of the

assessment form’s subcategories.
2.51-3.50 Moderately Acceptable for each of the

1.51-2.50 Slightly Acceptable for each of the

1.50-below Not at all Acceptable for each of the

Table 3.3 shows the rating scale criteria that were used in evaluating the
developed system. The respondents were asked to answer the questionnaire by
checking a number that is next to each question. The mean was used to determine
the average responses of the evaluators for each item of the five (5) options in
each category of the ISO 9126 standards namely, 5 (Highly Acceptable), 4 (Very
Acceptable), 3 (Acceptable), 2 (Fairly Acceptable), and 1 (Not at all Acceptable).

Page
The points used are: Highly Acceptable- 5 point, Very Acceptable- 4 points,
Acceptable- 3 points, Fairly Acceptable- 2 points, and Not Acceptable at all- 1
point.
Testing Plan
The Web-Based Water Billing and E-Payment System with Data Analytics
for the Barangay San Joaquin City of Sto. Tomas, Batangas Purok Tindalo Water
District will be subjected to a variety of tests, including the following test procedures
for the proposed web system.
Functional Testing - The tester must operate the system while
simultaneously scanning for any widespread issues with the system's functionality
or user interface. The system's features will be tested by the developers to ensure
that they are operational.
Usability Testing - The tester will evaluate the system through its tests for
determining whether the planned system is user-friendly and errors to improve.
Compatibility Testing - The web-based water billing and e-payment
system will be tested on Google Chrome, Microsoft Edge, and other browsers. The
system's developers will also try running it on both low- and high-end hardware.
Performance Testing - The tester tests all aspects of the system to check
if issues such as delaying, lagging, and disconnecting will occur. In this test, the
developers will know what to improve in the performance of the system.
Security Testing - The tester tests the system by inputting an invalid email
and password of the users to check the reaction of the system to ensure that no
one can access it by malicious users.

Page
Test Plan
Admin
Table 3.4: Test Plan Login

Page
Table 3.5: Test Plan Add Customer
Page
Table 3.6: Test Plan Search Customer
Page
Table 3.7: Test Plan Update Customer
Page
Table 3.8: Test Plan Add Billing
Table 3.9: Test Plan Search Billing History

Page
Table 3.10: Test Plan Payment Approval
Table 3.11: Test Plan Cash Payment

Page
Table 3.12: Test Plan Search Payment History
Table 3.13: Test Plan Edit Profile

Page
Table 3.14: Test Plan Change Password
Customer
Table 3.15: Test Plan Statement of Account

Page
Table 3.16: Test Plan Search Billing History
Table 3.17: Test Plan Create Payment

Page
Table 3.18: Test Plan History Payment
Table 3.19: Test Plan Edit Profile

Page
Table 3.20: Test Plan Change Password
Implementation Plan
An implementation plan is a management tool that illustrates the steps in
developing and starting a project.

Page
Table 3.21: Implementation Plan
Strategy Activities Person Involve Duration

Discussion about
the costing plan:
Meeting with the
Hosting, Domain,
Purok Purok Secretary Eden
and Website 1 hour
Tindalo Water Jinky Manila
Maintenance that
District
cost one 1,000
pesos
Approval from System
Secretary Eden
Purok Tindalo Implementation 1 hour
Jinky Manila
Water District Agreement
Secretary Eden
Jinky Manila, and
Admin Training
residents of the
3 Days Training and the User of 5 hours
San Joaquin City
the System.
of Sto. Tomas
Batangas
Installation of System Secretary Eden
1 hour
System Installation Jinky Manila
Ensuring that the
Examining the Secretary Eden
system works 1 hour
system Jinky Manila
properly
Table 3.20 shows the Implementation Plan. The first activity is a discussion
about the costing plan: Hosting, Domain, and Website Maintenance that cost 1,000
pesos which is done for one (1) hour. Second, the System Implementation
Agreement of Purok Tindalo Water District with the Secretary Eden Jinky Manila
was done for one (1) hour. Third, Admin Training and the User of the System were
done for five (5) hours. Afterward, the Installation of the system provides for (1)
hour. Lastly, examine the system and ensure that the system works properly for
one (1) hour, The plan also indicates the persons involved.
Page CHAPTER IV
RESULT AND DISCUSSION
This chapter covers the result of the evaluation of the researcher’s project,
their finding, and recommendations for future developers who will improve the
developed project.
Discussion of the Interface
Figure 4.1: Login Module
Figure 4.1 contains the login interface which is the first interface that will
display when the users search the system in the browser. Object 1 in the login
interface is where the users should input their email. Object 2 in the login interface
is where the admin and customers should input the password that they provided.
Object 3 in the login interface is represented as a checkbox, by clicking the

Page
checkbox the user will be able to see the password that they inputted. Object 4 in
the login interface should click by the user to be able to login into their account.
Figure 4.2: Admin Dashboard Module
Figure 4.2 contains the admin’s dashboard interface that will be the
destination after the admin account successfully logs in. Object 1 by clicking the
dashboard button, the admin will be able to see the homepage or the dashboard
interface. Object 2 the icon represents a sidebar button that when it is clicked then
it disappears and to reappear it has to be clicked again. Object 3 in the dashboard
interface represents the total bill of the year when the admin adds billing to the
customer it will automatically add to the total bill. Object 4 in the dashboard
interface represents the total pay of the year and the admin can see how much did
Page
they earn that year when the customer pays their bills it will automatically add to
the total pay. Object 5 in the dashboard interface represents customers for
payment it is the calculation of the customer who did not pay yet. Object 6 in the
dashboard interface represents the total of active and inactive users when the
admin registered a customer it will automatically add to the action and if the admin
marked the customer as inactive then it will automatically add to the inactive but if
the admin marked the customer as active again then it will automatically add to the
active. Object 7 in the dashboard interface represents the filter date button which
the admin can choose which year should display in the dashboard. Object 8 in the
dashboard interface represents the customers for payment which the admin can
see who else hasn't paid yet. Object 9 in the dashboard interface in customers for
payment represents the data table in which the admin can select how many should
be shown in the list. Object 10 in the dashboard interface in customers for payment
tells how many are shown out of all lists. Object 11 in the dashboard interface in
customers for payment represents a search bar in which the admin can search the
customers for payment easily. Object 12 in the dashboard interface represents a
monthly billing of the year using a line graph the admin can see here how much
they earn each month. Object 13 in the dashboard interface in monthly billing
represents a menu button that the admin can select what type of picture to
download.
Page
Figure 4.3: List of Customers Module
Figure 4.3 contains the customer’s list interface. Object 1 by clicking the
customer button the admin will be able to see the list of the customers. Object 2
represents add new button it is for creating an account for the customer. Object 3
in the customer’s list interface represents a search bar in which the admin can
search for the customer easily. Object 4 in the customer’s list interface represents
an action button that the admin can mark as inactive or active the customer. Object
5 in the customer’s list interface represents the data page of the customer’s list
which the admin can select what page to be shown.

Page
Figure 4.4: Add Customer Module
Figure 4.4 contains the adding customer’s interface which the admin can
add a customer. Object 1 the admin will input the customer’s full name. Object 2
the admin will input the customer’s email. Object the admin will input the
customer’s mobile no. Object 4 the admin will input the customer’s address. Object
5 the admin will input the customer’s password. Object 6 the admin will input the
customer’s re-type password which will need to be the same as the password.
Object 7 represents a submit button, this will only work if all of the text boxes have
been filled up. Object 8 represents a cancel button to return to the customer’s list.
Page
Figure 4.5: Add Billing Module
Figure 4.5 contains the add billing interface in which the admin can add bills
for the customer. Object 1 by clicking the add billing button, the admin will go to
the add billing interface. Object 2 in the added billing for the customer represents
selecting a customer, the admin should click the select customer which will show
all of the customers alphabetically. Object 3 in the add billing for the customer
represents the units of consumed water the admin will input the units of the month.
Object 4 in the add billing for the customer represents the total bill, if the admin
input the units the total bill will automatically calculate the total bill of the consumed
water. Object 5 and object 6 in the add billing for the customer represents the date
which is automatically one month apart. Object 7 in the add billing for the customer
represents a submit button, this will only work if the admin input all required fields.
Object 8 in the add billing for the customer represents the clear button when the
Page
admin clicks the clear button it will reset everything inside the add billing. Object 9
represents the present billing for the month after the admin added a bill to the
customer’s account it will be added to the billing in the present month. Object 10
in the billing of the month represents a search bar in which the admin can search
the customers billing easily.
Figure 4.6: Admin Billing History Module
Figure 4.6 contains the admin billing history interface in which the admin
can see all of the bills of the customers. Object 1 by clicking the billing history
button, the admin will go to the billing history interface. Object 2 in the billing history
interface represents the search bar in which the admin can search the billing
history of the customers. Object 3 in the billing history interface the print icon
represents viewing the statement of the account of the customer which the admin
can print the statement of the account of the customer. Object 4 in the billing history
Page
interface represents the data page of the customer’s list which the admin can
select what page to be shown.
Figure 4.7: Payment Approval Module
Figure 4.7 contains the payment approval. Object 1 by clicking the payment
approval button the admin will go to the payment approval interface of the
customer. Object 2 in the payment approval’s interface represents the attachment
which the admin can check the screenshot of the payment of the customer. Object
3 in the payment approval interface represents the action that the admin can
approve or decline, the green button is to approve and the red button is to decline.
Page
Figure 4.8: Cash Payment Module
Figure 4.8 contains the cash payment which the customer can pay face-to-
face to the Purok Tindalo Water District. Object 1 by clicking the cash payment
button the admin will go to the cash payment interface. Object 2 in the cash
payment interface represents selecting the customer the admin will select the
customer that is going to pay. Object 3 in the cash payment interface represents
selecting a billing no. in which the admin will select the bill that was wanted to pay
by the customer. Object 4 in the cash payment interface represents a verify button
that will verify the selected customer and billing no., once the verify button was
clicked, the admin can’t select a customer again and needs to reset to be able to
select again. In the cash payment interface object 5 which is the units, object 6
which is the total bill, and objects 7 and object 8 which is the date that is one month
apart will automatically input when the verified button was clicked by the admin.
Object 9 in the cash payment interface represents the pay button which the admin
Page
should click after receiving the customer’s payment and if it is verified correctly.
Object 10 in the cash payment interface represents the cancel button which if the
admin clicks it, the fields will reset. Object 11 in the cash payment of the present
month after the payment of the customer, the payment will transfer to the history
of the present month. Object 12 in the cash payment of the present month
represents a search bar in which the admin can search the payments in the present
month of the customer.
Figure 4.9: Admin Payment History Module
Figure 4.9 contains all of the admin payment histories. Object 1 by clicking
the payment history button the admin will go to the payment history interface.
Object 2 represents a search bar in which the admin can search the payment
history of the customer easily. Object 3 in the payment history interface represents
Page
the data page of the customer’s list which the admin can select what page to be
shown.
Figure 4.10: User Profile Module
Figure 4.10 contains the user profile which the user can view and edit.
Object 1 by clicking my profile button the user will go to their profile. Object 2
represents the profile of the customer which they can view or edit the profile
picture. Object 3 represents the overview button where the user can view their
profile details. Object 4 represents the edit profile which the user can edit their
profile. Object 5 in the edit profile interface represents the full name and it will
display the present name but only the admin can change the full name. Object 6
in the edit profile interface represents the email and it will display the present email
and the user can edit it. Object 7 in the edit profile interface represents the mobile
no. and it will display the present mobile no. and the user is able to edit it. Object
Page
8 in the edit profile interface represents the address and it will display the present
address and the user can edit it. Object 9 in the edit profile interface represents
the save changes button which will successfully change the inputted fields. Object
10 represents the change password for which the user can change their password.
Object 11 in the change password interface represents the current password which
the user should input their current password to be able to change their password.
Object 12 in the change password interface represents the new password that the
user should input the new password they wanted. Object 13 in the change
password interface represents the re-enter new password which the user should
input the re-enter new password that is the same as the new password. Object 14
in the change password interface represents the change password button which
will successfully change the password.
Figure 4.11: User Menu Module

PageFigure 4.11 contains the user menu. Object 1 by clicking the name which is
the drop-down button the menu will be shown. Object 2 represents my profile by
going to the profile of the user. Object 3 represents the need help button and the
user can view some of the instructions about the system. Object 4 represents the
sign-out, the user account will be signed out and will transfer to the login interface.
Figure 4.12: Customer’s Dashboard Module
Figure 4.12 contains the customer’s dashboard that will be the destination
after the customer account successfully logs in. Object 1 by clicking the dashboard
button, the customer will be able to see the homepage or the dashboard interface.
Object 2 in the dashboard interface represents the total bill of the year of the
customer when the admin adds billing to the customer it will automatically add to
the total bill. Object 3 in the dashboard interface represents the total pay of the
year and the customer can see how much did they pay that year when the
customer pays their bills it will automatically add to the total pay. Object 4 in the
Page
dashboard interface represents customers for payment it is the calculation of the
customer did not pay yet. Object 5 in the dashboard interface represents the
usage(units) it has the lowest and the highest usage of the customer, the customer
can see the lowest and highest usage in the current year. Object 6 in the
dashboard interface represents the filter date button which the customer can
choose which year should display in the dashboard. Object 7 in the dashboard
interface represents the customers for payment, which the customers can see the
bills that need to pay. Object 8 in the dashboard interface represents the click here
to pay which is a shortcut button to go in to create a payment. Object 9 in the
dashboard interface in customer for payment represents a search bar in which the
customer can search the billing easily. Object 10 in the dashboard interface
represents a monthly billing of the year using a line graph the customer can see
here how much they paid each month. Object 11 in the dashboard interface in
monthly billing represents a menu button that the customer can select what type
of picture to download.
Figure 4.13: Customer Billing History Module

PageFigure 4.13 contains the customer billing history interface in which the
customer can see all of the bills of the customers. Object 1 by clicking the billing
history button, the customer will go to the billing history interface. Object 2 in the
billing history interface represents the search bar in which the customer can search
for their billing history. Object 3 in the billing history interface the print icon
represents viewing the statement of the account of the customer which the
customer can print their statement of the account. Object 4 in the billing history
interface represents the data page of the customer’s billing list which the customer
can select what page to be shown.
Figure 4.14: Customer Create Payment Module

PageFigure 4.14 contains the created payment interface which the customer can
view and pay their bills. Object 1 by clicking the create payment button the
customer will go to the create payment interface. Object 2 in the create payment
interface represents the search bar in which the customer can search for what they
wanted to pay. Object 3 in the create payment interface the green button which is
to pay and the modal will appear. Object 4 in the customer payment interface
represents the unit it is automatically input based on the units of the customer’s
bill. Object 5 in the customer payment interface represents the total bill it is
automatically input based on the total bill of the customer. Object 6 in the customer
payment interface represents the select mode that the customer should select a
mode whether Gcash or Paymaya. Object 7 in the customer payment interface
represents the amount it is automatically input based on the amount of the
customer’s bill. Object 8 in the customer payment interface represents the
reference in which the customers should input the reference no. that is on the proof
of payment. Object 9 in the customer payment interface represents the attachment
in which the customers should upload the proof of payment. Object 10 in the
customer payment interface represents the pay button, the customer should click
the pay button so the admin can receive the payment. Object 11 in the customer
payment interface represents the cancel button to cancel the payment of the
customer and will return to create the payment interface.

Page
Figure 4.15: Customer Payment History Module
Figure 4.15 contains the customer payment history. Object 1 by clicking the
payment history button the customer will go to the payment history interface.
Object 2 represents a search bar in which the customer can search their payment
history easily. Object 3 in the payment history interface represents the data page
of the customer’s list which the customer can select what page to be shown.
Project Evaluation
To evaluate the functionality, usability, reliability, portability, maintainability,
and efficiency of “Web-Based Water Billing and E-Payment System with Data
Analytics for Barangay San Joaquin, City of Sto. Tomas, Batangas, Purok
Tindalo Water District”, the developers discussed the system testing result of the
capstone project. For the system evaluation, there are five (5) IT Practitioners, five
Page
(5) officials in Purok Tindalo, and ten (10) residents in the Barangay San Joaquin
City of Sto. Tomas, Batangas.
IT Practitioners
The following tables are the results gathered from five (5) IT Practitioners
conducted by the developers.
Table 4.1: IT Practitioner’s Evaluation Based on Functionality
Functionality Average Mean Interpretation
Sustainability 4.80 Highly Acceptable
Accurateness 4.80 Highly Acceptable
Interoperability 4.60 Highly Acceptable
Compliance 4.60 Highly Acceptable
Security 4.00 Very Acceptable
Overall Mean 4.56 Highly Acceptable
Table 4.1 shows the IT Experts’ Evaluation based on Functionality that have
an average mean of 4.56 which is interpreted as highly acceptable. The sub-
category suitability and accurateness received a rating of 4.80 which is interpreted
as highly acceptable, this means that the project will do its functions. For
interoperability and compliance, it received a rating of 4.60 which is interpreted as
highly acceptable, this shows that the project interacts well with other components
and successfully complied with the industry guidelines. For security received a
rating of 4.00 which is interpreted as very acceptable, it shows that according to

Page
the IT experts’ evaluator the project or website is secured. This result shows that
the system is functional and will be capable of doing its purpose.
Table 4.2: IT Practitioner’s Evaluation Based on Reliability
Reliability Average Mean Interpretation
Maturity 4.60 Highly Acceptable
Fault Tolerance 4.60 Highly Acceptable
Recoverability 4.20 Very Acceptable
Overall Mean 4.47 Very Acceptable
Table 4.2 shows the IT Experts Evaluation based on Reliability that have an
average mean of 4.47 which is interpreted as very acceptable. The sub-category:
maturity and fault tolerance received a rating of 4.60 which is interpreted as highly
acceptable, this conveys that the project shows less to no failure and it implies that
the project can recover from software failure. The recoverability receives a rating
of 4.20 is interpreted as very acceptable, can recover when error has occurred.
This result shows that the system is reliable and will perform consistently well.
Table 4.3: IT Practitioner’s Evaluation Based on Usability
Usability Average Mean Interpretation
Understandability 4.80 Highly Acceptable
Learnability 4.80 Highly Acceptable
Operability 4.60 Highly Acceptable

PageTable 4.3 shows IT Experts Evaluation based on Usability that have an
average mean of 4.74 which is interpreted as highly acceptable. The sub-
category: understandability and learnability received a 4.80 which is interpreted
as highly acceptable, this suggests that the project is easy to use or understand
and can be learned by different type of users. The operability received a rating of
4.60 which is interpreted as highly acceptable which means that it can operate in
a given environment. This result shows that the system is easy to use and will
perform task effectively.
Table 4.4: IT Practitioner’s Evaluation Based on Efficiency
Efficiency Average Mean Interpretation
Time Behavior 4.80 Highly Acceptable
Resource Behavior 4.60 Highly Acceptable
Table 4.4 shows the IT Experts Evaluation based on Efficiency that have an
average mean of 4.60 which is interpreted as highly acceptable. The sub-category:
time behavior received a rating of 4.80 which is interpreted as highly acceptable
and this denotes that it has fast response time. The resource behavior received a
rating 4.80 which is interpreted as highly acceptable and which means it do not
consume memory or network usage. This result shows that the system will function
in a way that will not waste the user time.

Page
Table 4.5: IT Practitioner’s Evaluation Based on Maintainability
Maintainability Average Mean Interpretation
Analyzability 4.60 Highly Acceptable
Changeability 4.60 Highly Acceptable
Stability 4.40 Very Acceptable
Testability 4.00 Very Acceptable
Table 4.5 shows the IT partitioners on Maintainability that have an average
mean of 4.45, which is interpreted as very acceptable. The criteria: analyzability,
changeability have a weighted mean of 4.60 which is interpreted as high
acceptable this means the system can identify the failure within the system and
less amount of effort to change the system. The stability has a weighted mean of
4.40 which is also interpreted as very acceptable this means it will not cause any
harm in the software or hardware. The testability has a weighted mean of 4.00
which is also interpreted as very acceptable this mean effort needed to verify
system change. This result shows that the website can be maintained and updated
in the future
Table 4.6: IT Practitioner’s Evaluation Based on Portability
Portability Average Mean Interpretation
Adaptability 4.40 Very Acceptable
Install ability 4.60 Highly Acceptable
Conformance 4.60 Highly Acceptable

Page
Continuation of Table 4.6: IT Practitioner’s Evaluation Based on Portability
Replaceability 4.60 Highly Acceptable
Table 4.6 shows the IT Experts Evaluation based on Portability that have
an average mean of 4.50, which is interpreted as highly acceptable. The
adaptability criteria have weighted mean of 4.40 which is interpreted as very
acceptable, this denotes that the project can adapt in different operating system
and device specifications. Install ability, conformance and replaceability has a
weighted mean of 4.60 which is interpreted as highly acceptable, this suggest that
the project is portable since it is a web-based system. This result shows that the
system is portable and can be access on both mobile and desktop view.
Table 4.7: Summary of IT Practitioner’s Evaluation
Software Quality Average Mean Interpretation
Criteria
Functionality 4.56 Highly Acceptable
Reliability 4.47 Very Acceptable
Usability 4.74 Highly Acceptable
Efficiency 4.60 Highly Acceptable
Maintainability 4.40 Very Acceptable
Portability 4.60 Highly Acceptable

PageTable 4.7 shows the summarize results of five (5) IT Experts based on the
Software Qualities Criteria. Functionality has a weighted mean of 4.56, which is
interpreted as highly acceptable which means that the project/website is functional.
Reliability has a weighted mean of 4.47 which is interpreted as very acceptable
which denotes that the website shows less to no-error. Usability has a weighted
mean of 4.74 which is interpreted as highly acceptable, this implies that the website
is easy to use or can be learn by different type of user. Efficiency has a weighted
mean of 4.60, which is interpreted as highly acceptable this means the system has
ability to end goal to no waste, effort or energy. Maintainability has a weighted
mean of 4.40 which is interpreted as very acceptable this shows that system
probability to fail will be restored or repaired to a specified condition. Portability has
a weighted mean of 4.60, which is interpreted as highly acceptable this implies that
the project/website is portable since the project is a web-based system and can be
accessed using mobile device. The results of the IT Experts evaluation indicate a
good performance of the website. The Overall Mean is 4.56 with an interpretation
of highly acceptable which means the system met all the software qualities
standard and required functions.
Client Practitioners
The following tables are the results gathered from five (5) officials in Purok
Tindalo conducted by the developers.

Page
Table 4.8: Client’s Evaluation Based on Functionality
Sustainability 3.80 Very Acceptable
Accurateness 3.40 Moderately Acceptable
Interoperability 3.60 Very Acceptable
Compliance 4.20 Very Acceptable
Table 4.8 shows the evaluation of the clients based on the Functionality that
have an average mean of 3.80 which is interpreted as very acceptable. Suitability
has a weighted mean of 3.80, which is interpreted as very acceptable this means
that the system functionality characteristics and appropriateness of the function of
the software has been achieved. Accurateness has a weighted mean of 3.40 this
means that the system correctness of the function is moderately acceptable. The
interoperability criteria have a weighted mean of 3.60 which means the ability of
the software component can interact in other system are very acceptable.
Compliance has a weighted mean of 4.20 which is interpreted as very acceptable
this shows that the certain industry laws and guidelines has been complied with
the compliant capability software. For security criteria, the weighted mean is 4.00
that indicate software function is secured. This result shows that the system is
functional and will be capable of doing its purpose

Page
Table 4.9: Client’s Evaluation Based on Reliability
Maturity 4.40 Very Acceptable
Fault Tolerance 3.00 Moderately Acceptable
Table 4.9 shows the evaluation of the client’s partitioners based on
Reliability that have an average mean of 3.93 which is interpreted as very
acceptable. Maturity has a weighted mean of 4.40 this means less failure in the
software, which is interpreted as very acceptable. Fault Tolerance has a weighted
mean of 3.00 which is interpreted as moderately acceptable that shows that the
system can recover from errors and system bug. Recoverability has a weighted
mean of 4.40 which is interpreted as very acceptable this means software has
ability to bring back to a failed system function. This result shows that the system
is reliable and will perform consistently well.
Table 4.10: Client’s Evaluation Based on Usability
Understandability 4.40 Very Acceptable
Learnability 4.20 Very Acceptable
Operability 4.40 Very Acceptable

PageTable 4.10 shows the evaluation of the clients based on Usability that have
an average mean of 4.33 which is interpreted as very acceptable. The sub-
category: understandability and learnability received a 4.40 which is interpreted
as very acceptable, this suggests that the project is easy to use or understand
and can be learned by different type of users. The operability received a rating of
4.20 which is interpreted as very acceptable which means that it can operate in a
given environment. This result shows that the system is easy to use and will
perform task effectively.
Table 4.11: Client’s Evaluation Based on Efficiency
Time Behavior 3.40 Moderately Acceptable
Resource Behavior 4.40 Very Acceptable
Table 4.11 shows the evaluation of the clients based on Efficiency that have
an average mean of 3.98, which is interpreted as very acceptable. Time behavior
has a weighted mean of 3.40 which is interpreted as moderately acceptable and
resource behavior has a weighted mean of 4.00 which is interpreted as very
acceptable that shows the fast response of the website and the resources used.
This result shows that the system will function in a way that will not waste the user
time.
Page
Table 4.12: Client’s Evaluation Based on Maintainability
Analyzability 4.20 Very Acceptable
Changeability 4.80 Highly Acceptable
Testability 3.60 Very Acceptable
Table 4.12 shows the evaluation of the clients based on Maintainability that
have an average mean of 4.15, which is interpreted as very acceptable. The
criteria: analyzability have a weighted mean of 4.20 which is interpreted as very
acceptable this means the system can identify the failure within the system.
Changeability average mean of 4.80, which is interpreted as highly acceptable this
means the system is a less amount of effort to change the system. The stability
has a weighted mean of 4.20 which is also interpreted as very acceptable this
means it will not cause any harm in the software or hardware. The testability has
a weighted mean of 4.00 which is also interpreted as very acceptable this means
effort needed to verify system change. This result shows that the website can be
maintained and updated in the future
Table 4.13: Client’s Evaluation Based on Portability
Install ability 4.00 Very Acceptable

Page
Continuation of Table 4.13: Client’s Evaluation Based on Portability
Conformance 4.60 Highly Acceptable
Replaceability 4.60 Highly Acceptable
Table 4.13 shows the evaluation of the client’s based on Portability. The
average mean in adaptability is 3.80 with the interpretation of very acceptable; also
in install ability, the average mean is 4.00 with the interpretation of very acceptable;
also in conformance, the average mean is 4.60 with the interpretation of highly
acceptable; and in replaceability, the average mean is 4.60 with the interpretation
of highly acceptable. The overall mean in portability is 4.30 which is very
acceptable.
Table 4.14: Summary of Client’s Evaluation
Criteria
Functionality 3.80 Very Acceptable
Reliability 3.93 Very Acceptable
Usability 4.33 Very Acceptable
Efficiency 3.80 Very Acceptable
Portability 4.30 Very Acceptable

PageTable 4.14shows the summarize results of, five (5) officials in Purok Tindalo
based on the Software Qualities Criteria. Functionality has a weighted mean of
3.80, which is interpreted as very acceptable which means that the project/website
is functional. Reliability has a weighted mean of 3.93 which is interpreted as very
acceptable which denotes that the website shows less to no-error. Usability has a
weighted mean of 4.33 which is interpreted as very acceptable, this implies that
the website is easy to use or can be learn by different type of user. Efficiency has
a weighted mean of 3.80, which is interpreted as very acceptable this means the
system has ability to end goal to no waste, effort or energy. Maintainability has a
weighted mean of 4.15 which is interpreted as very acceptable this shows that
system probability to fail will be restored or repaired to a specified condition.
Portability has a weighted mean of 4.30, which is interpreted as very acceptable
this implies that the project/website is portable since the project is a web-based
system and can be accessed using mobile device. The results of the IT Experts
evaluation indicate a good performance of the website. The Overall Mean is 4.05
with an interpretation of very acceptable which means the system met all the
software qualities standard and required functions.
User Practitioners
The following tables are the results gathered from ten (10) residents in the
Barangay San Joaquin City of Sto. Tomas, Batangas, conducted by the
developers.
Page
Table 4.15: User’s Evaluation Based on Functionality
Sustainability 3.70 Very Acceptable
Accurateness 3.60 Very Acceptable
Interoperability 3.10 Moderately Acceptable
Compliance 3.50 Very Acceptable
Table 4.15 shows the evaluation of the user’s based on the Functionality
that have an average mean of 3.52 which is interpreted as very acceptable.
Suitability has a weighted mean of 3.70, which is interpreted as very acceptable
this means that the system functionality characteristics and appropriateness of the
function of the software has been achieved. Accurateness has a weighted mean
of 3.60 this means that the system correctness of the function is very acceptable.
The interoperability criteria have a weighted mean of 3.10 which means the ability
of the software component can interact in other system are moderately acceptable.
Compliance has a weighted mean of 4.50 which is interpreted as very acceptable
this shows that the certain industry laws and guidelines has been complied with
the compliant capability software. For security criteria, the weighted mean is 3.70
that indicate software function is secured. This result shows that the system is
functional and will be capable of doing its purpose

Page
Table 4.16: User’s Evaluation Based on Reliability
Maturity 3.00 Moderately Acceptable
Fault Tolerance 3.20 Moderately Acceptable
Overall Mean 3.33 Moderately Acceptable
Table 4.16 shows the evaluation of the user’s partitioners based on
Reliability that have an average mean of 3.33 which is interpreted as moderately
acceptable. Maturity has a weighted mean of 3.00 this means less failure in the
software, which is interpreted as moderately acceptable. Fault Tolerance has a
weighted mean of 3.20 which is interpreted as moderately acceptable that shows
that the system can recover from errors and system bug. Recoverability has a
weighted mean of 3.80 which is interpreted as very acceptable this means software
has ability to bring back to a failed system function. This result shows that the
system is reliable and will perform consistently well.
Table 4.17: User’s Evaluation Based on Usability
Understandability 3.70 Very Acceptable
Learnability 4.10 Very Acceptable
Operability 4.50 Very Acceptable

PageTable 4.17 shows the evaluation of the user’s based on Usability that have
an average mean of 3.80 which is interpreted as very acceptable. The sub-
category: understandability received a rating 3.70 which is interpreted as very
acceptable this suggests that the project is easy to use or understand. Learnability
received a rating 4.10 which is interpreted as very acceptable can be learned by
different type of users. The operability received a rating of 4.50 which is interpreted
as very acceptable which means that it can operate in a given environment. This
result shows that the system is easy to use and will perform task effectively.
Table 4.18: User’s Evaluation Based on Efficiency
Time Behavior 3.90 Very Acceptable
Resource Behavior 3.40 Moderately Acceptable
Table 4.18 shows the evaluation of the user’s based on Efficiency that have
an average mean of 3.70, which is interpreted as very acceptable. Time behavior
has a weighted mean of 3.90 which is interpreted as moderately acceptable and
resource behavior has a weighted mean of 3.40 which is interpreted as moderately
acceptable that shows the fast response of the website and the resources used.
This result shows that the system will function in a way that will not waste the user
time.
Page
Table 4.19: User’s Evaluation Based on Maintainability
Analyzability 3.70 Very Acceptable
Changeability 3.60 Very Acceptable
Testability 3.50 Moderately Acceptable
Table 4.19 shows the evaluation of the users based on Maintainability that
have an average mean of 4.70, which is interpreted as very acceptable. The
criteria: analyzability have a weighted mean of 3.70 which is interpreted as very
acceptable this means the system can identify the failure within the system.
Changeability average mean of 3.60, which is interpreted as very acceptable this
means the system is a less amount of effort to change the system. The stability
has a weighted mean of 4.00 which is also interpreted as very acceptable this
means it will not cause any harm in the software or hardware. The testability has
a weighted mean of 3.50 which is also interpreted as moderately acceptable this
means effort needed to verify system change. This result shows that the website
can be maintained and updated in the future
Table 4.20: User’s Evaluation Based on Portability
Install ability 3.40 Moderately Acceptable

Page
Continuation of Table 4.20: User’s Evaluation Based on Portability
Conformance 3.40 Moderately Acceptable
Replaceability 3.50 Moderately Acceptable
Overall Mean 3.48 Moderately Acceptable
Table 4.20 shows the evaluation of the users based on portability. The
average mean in adaptability is 3.60 with the interpretation of very acceptable; also
in install ability, the average mean is 3.40 with the interpretation of moderately
acceptable; also in conformance, the average mean is 3.40 with the interpretation
of moderately acceptable; and in replaceability, the average mean is 3.50 with the
interpretation of moderately acceptable. The overall mean in portability is 3.48
which is moderately acceptable.
Table 4.21: Summary of User’s Evaluation
Criteria
Functionality 3.52 Very Acceptable
Reliability 3.33 Moderately Acceptable
Usability 3.80 Very Acceptable
Efficiency 3.70 Very Acceptable
Portability 3.48 Moderately Acceptable

PageTable 4.21 shows the summarize results of ten (10) residents in the
Barangay San Joaquin City of Sto. Tomas, Batangas. This result is based on the
Software Qualities Criteria. Functionality has a weighted mean of 3.52, which is
interpreted as very acceptable this means that overall functionality and quality of
the system has been suited to serve it purpose. Reliability has a weighted mean
of 3.33 which is interpreted as moderately acceptable, this indicate the Reliability
and the quality of the system is being trustworthy or of performing consistently well.
Usability has a weighted mean of 3.80 which is interpreted as very acceptable this
shows the system is easy to use. Efficiency has a weighted mean of 3.70, which
is interpreted as very acceptable, this means the system has ability to end goal to
no waste, effort or energy. Maintainability has a weighted mean of 3.70 which is
interpreted as very acceptable, this shows that system. Probability to fail will be
restored or repaired to a specified condition. Portability has a weighted mean of
3.48, which is interpreted as moderately acceptable acceptable this implies that
the project/website is portable since the project is a web-based system and can be
accessed using mobile device. The Overall Mean is 3.60 with an interpretation of
very acceptable which means the system met all the software qualities standard
and required functions.

Page
Table 4.22: Overall Evaluation
Software IT Clients Users Average Interpretation
Quality Practitioners Mean
Criteria
Functionality 4.56 3.80 3.52 4.00 Very Acceptable
Reliability 4.47 3.93 3.33 3.91 Very Acceptable
Usability 4.74 4.33 3.80 4.29 Very Acceptable
Efficiency 4.60 3.80 3.70 4.03 Very Acceptable
Maintainability 4.40 4.15 3.70 4.08 Very Acceptable
Portability 4.60 4.30 3.48 4.13 Very Acceptable
Overall Mean 4.56 4.05 3.60 4.07 Very
Acceptable
Table 4.22 shows the overall evaluation of the system. In the IT
practitioner’s evaluation, there is an average of 4.56 in functionality, 4.47 in
reliability, 4.74 in usability, 4.60 in efficiency, 4.40 in maintainability, and 4.60 in
portability, and the overall mean of the IT practitioner’s evaluation is 4.56. In the
client’s evaluation, there is an average of 3.80 in functionality, 3.93 in reliability,
4.33 in usability, 3.80 in efficiency, 4.15 in maintainability, and 4.30 in portability,
and the overall mean of the client’s evaluation is 4.05. In the user’s evaluation,
there is an average of 3.52 in functionality, 3.33 in reliability, 3.80 in usability, 3.70
in efficiency, 3.70 in maintainability, and 3.59 in portability, and the overall mean
of the user’s evaluation is 3.60. The average of IT practitioners, clients, and users
Page
in functionality is 4.00 with an interpretation of very acceptable; in reliability, the
average mean is 3.91 with an interpretation of very acceptable; in usability, the
average mean is 4.29 with an interpretation of very acceptable; in efficiency, the
average mean is 4.03 with an interpretation of very acceptable; in maintainability,
the average mean is 4.08 with an interpretation of very acceptable; and in
portability, the average mean is 4.13 with an interpretation of very acceptable. The
overall mean of overall evaluation is 4.07 which is very acceptable.
Conclusion
The system was evaluated by five (5) IT Practitioners, five (5) officials in
Purok Tindalo, and ten (10) residents in barangay San Joaquin city of Sto. Tomas,
Batangas. The developed system received an overall mean of 4.07 with an
interpretation of Very Acceptable using the ISO 9126 Quality Model Evaluation
instrument, which includes functionality, reliability, usability, efficiency,
maintainability, and portability. This means that the system met all of the software
quality standards and required functions objectives and the ISO 9126 Quality
Model. This means the system is approved to be implemented by Purok Tindalo
Water District.
Recommendations
Based on the result of the evaluation of the system, the researchers come
up with different recommendations.

Page
1 The researchers suggest to the future researchers to improve the recovery
plan of the system.
2 The researchers suggest to the future researchers to expand the range of
payment methods.
3 The last suggestion of the researchers to the future researchers develops
a mobile app version of the system.

Page BIBLIOGRAPHY
Abeje, M. et al., (2016). Water Billing and Customer Management for Wolkite
Water Supply Service Office [EPub]. Retrieved from
https://pdfcoffee.com/water-billing-system-pdf
free.HTML?fbclid=IwAR0bsshrOlQJah_VSWOJhUI8NtfpfdeK00DC0aXXP
OhW8N3y__mzmcM6LDc
Abdullah, H. & Valentine, B. (2009). Fundamental and ethics theories of corporate
governance. Journal of Middle Eastern Finance and Economics, 4, 88-96.
Ado, R., & Pelandiana, A. (2017). Web-Based Billing and Collection System for
Municipal Water and Services Unit [EPub.] Retrieved from
https://knepublishing.com/index.php/KnE-
Social/article/view/2371/5222?fbclid=IwAR3cxJTUPJ7nn8VXwjWYhGw_F
X-xkisHUS03lLdG7hbUGMsq8tMdMwKL2pU
Akech, J. M. M. (2007). Governing Water and Sanitation in Kenya: Public Law,
Private Sector Participation, and the Elusive Quest for a Suitable
Institutional Framework. Conf. International Environmental Law Research
Center, Geneva 20-21 April 2009
Ambre, J.A. (2016). ASIST Automated Water Billing System [EPub]. Retrieved
from http://ijrmbs.com/vol3issue1/janelyn.pdf?fbclid=IwAR3P_7ZFVOiv-
QXVRR4QL2UNqjRgqJbu7u8VXwhu7T59QR7FhrLpfdOGuRI
Page
Backlund, A. (2000). Health information systems - past, present, future.
International Journal of Medical Informatics, 60(1), 3-20.
Baker, J. L. (2009). Opportunities and Challenges for Small Scale Private Service
Providers in Electricity and Water Supply Evidence from Bangladesh,
Cambodia, Kenya, and the Philippines. Washington, DC: World Bank
Bangare, P.M., Dhumale, R.B., & Thombare, N.D. (2018). Automatic Water Billing
System based on Android Application [EPub]. Retrieved from
https://www.irjet.net/archives/V5/i8/IRJET-V5I8169.pdf
Bello, Z. (2014). Design and Implementation of SMS Water Billing System [EPub].
Retrieved from
http://oer.udusok.edu.ng:8080/xmlui/bitstream/handle/123456789/544/DE
SIGN%20AND%20IMPLEMENTATION%20OF%20SMS%20BASED%20
WATER%20BILLING%20SYSTEM.pdf?sequence=1&isAllowed=y&fbclid=
IwAR0q0YTtviQfYYI4eqe4-
0PRx7SO9byvbbtWECqa_G3jZw1UhUhVRHwvrrc
Berners-Lee, T. (2021, January 28). The world wide web project. World Wide Web
Consortium. Retrieved from https://www.w3.org/History/1989/proposal.html
Bhagyashree, W. et al., (2020). Automatic Water Billing System using Arduino
[EPub]. Retrieved from
https://www.jetir.org/papers/JETIR2003170.pdf?fbclid=IwAR3M4hgn4V0x
ZkeKMk8KTBPhBUBaBEFf89QLyzv8TADy78den9UP1HMwvfc
Page
Bhimani, A. (2008). Making Corporate Governance Count: The Fusion of Ethics
and Economic Rationality. Journal of Management and Governance, 2(2), 135-
147.
Bootstrap. (2022). Bootstrap About. Retrieved from
https://getbootstrap.com/docs/5.1/about/
Claridad, N. et al., (2018). Automated Water Billing System of Hinunangan
Municipality [EPub]. Retrieved from
https://journal.evsu.edu.ph/index.php/itmj/article/view/41?fbclid=IwAR3M4
hgn4V0xZkeKMk8KTBPhBUBaBEFf89QLyzv8TADy78den9UP1HMwvfc
Fatonah, S. (2018). E-Payment System. In Proceedings of the 2018 International
Conference on Information Management and Technology (ICIMTech) (pp.
255-259). IEEE.
GCash (2022). Gcash About Us. Retrieved from https://www.gcash.com/about
Heather, K. (2012). Retrieved from
https://www.techopedia.com/definition/5122/short-message-service-sms
Investopedia, (2022). Bill. Retrieved from
https://www.investopedia.com/terms/b/bill.asp
Jalil, H. (2018). Software Project Management: A Process-Driven Approach. John
Wiley & Sons.

Page
Leandro, K. (2020, March 8). Smart Water Billing. Retrieved from
https://steprimo.com/android/us/app/ke.co.webwire.waterbills/Smart-
Water-Billing/
Magalona, J.R. (2019). Web-Based Water Billing System with Mobile Application
for San Jose Del Monte Water District, Bulacan [EPub]. Retrieved from
https://www.academia.edu/37264495/Online_Based_Water_Billing_Syste
m_with_Mobile_Application_docx?fbclid=IwAR2bHTLN_uAhqJvph9BnfmA
RxK64LH6XmjUSdm8_R2zayHPqkrDBUlBLpjU
Oracle. (2022). Java Technology. Retrieved from
https://www.oracle.com/java/technologies/
PayMaya Philippines, Inc. (2022). PayMaya Philippines, Inc. About Us. Retrieved
from https://www.paymaya.com/about
Pevidal, E. (2020, October 7). Manila Water App. Retrieved from
https://www.manilawater.com/customer/manila-water-app
Rodney S. et al., (2018). Integrated intelligent water-energy metering systems and
informatics: Visioning a digital multi-utility service provider. [EPub]. Retrieved from
https://www.sciencedirect.com/science/article/ab s/pii/S1364815217311271
Rokosky, J. (2019, March). Muni Link Software. Retrieved from
http://unbouncepages.com/muni-link-utility-billing-solution/
Sahil Roy. (2018, August 1). What is a transaction? Definition and examples.
Cleverism. Retrieved from https://www.cleverism.com/lexicon/transaction/

Page
Sarfaraz, S. (2020, September 9). WaterBills – Water Bill Maintenance System.
Retrieved from
https://play.google.com/store/apps/details?id=info.maintenance.waterbills
&hl=en&gl=US
Suresh M. et al., (2017). A novel smart water meter based on IoT and smartphone
app for city distribution management. [EPub]. Retrieved from
https://ieeexplore.ieee.org/document/8070088
Suresh, S. (2020). Water Billing System [EPub]. Retrieved from
http://14.99.188.242:8080/jspui/bitstream/123456789/13277/1/15VFSB705
8.pdf?fbclid=IwAR2TwddF5urm-
tHWBGyyKU9L3ktdNFVDTMl5jHoY7pvn43VOHek7QcWQTRE
Suvarsha S. (2020). Water Billing System [EPub]. Retrieved from
http://14.99.188.242:8080/jspui/bitstream/123456789/13277/1/15VFSB705
8.pdf
Tummala, S. (2017, May 9). JK Water Billing App. Retrieved from
https://steprimo.com/android/us/app/consumerapp.bsmart.bcits.jk/JK-
Water-Billing-APP/
Weber, C. (2015). Water district. In M. J. Sullivan (Ed.), The SAGE glossary of the
social and behavioral sciences (pp. 920-921). Thousand Oaks, CA: SAGE
Publications, Inc.
Page
Welling, L., & Thomson, L. (2016). PHP and MySQL Web Development (5th ed.).
Addison-Wesley Professional.
W3C. (2017). HTML 5.2. World Wide Web Consortium. Retrieved from
https://www.w3.org/TR/html52/
W3C. (2017). CSS Current Status. World Wide Web Consortium. Retrieved from
https://www.w3.org/Style/CSS/current-work

AlterTech Final1.2

Uploaded by

Document Information

Original Description:

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

AlterTech Final1.2

Uploaded by

Copyright:

Available Formats

WEB-BASED WATER BILLING AND E-PAYMENT SYSTEM WITH DATA

ANALYTICS FOR BARANGAY SAN JOAQUIN CITY OF STO. TOMAS,

BATANGAS PUROK TINDALO WATER DISTRICT

Presented to the Faculty of

College of Computer Studies and Technology

Pamantasan ng Lungsod ng San Pablo

San Pablo City, Laguna

In Partial Fulfillment of the Requirements for the Degree

BACHELOR OF SCIENCE IN INFORMATION TECHNOLOGY

John Lloyd N. Abergas

Jane Irish M. Bautista

Joshua Miguel R. Demesa

Van Buren B. Magadia

Kurt Warren R. Manzanero

The Capstone Project is entitled WEB-BASED WATER BILLING AND E-

PAYMENT SYSTEM WITH DATA ANALYTICS FOR BARANGAY SAN

JOAQUIN CITY OF STO. TOMAS, BATANGAS PUROK TINDALO WATER

DISTRICT prepared and submitted by John Lloyd N. Abergas, Jane Irish M.

R. Manzanero in partial fulfillment of the requirements for the degree of

BACHELOR OF SCIENCE IN INFORMATION TECHNOLOGY has been

examined and is recommended for acceptance and approval.

The capstone project entitled Web-Based Water Billing and E-Payment

Batangas Purok Tindalo Water District is wholeheartedly dedicated to beloved

finish the Capstone Project

To Pamantasan ng Lungsod ng San Pablo serves as their second home

To Mr. Sherwin D. Quizon, Dean of the College of Computer Studies and

Technology, for his continuous encouragement.

staff who accept the offer to be their client

To Mr. Apolo Joseph D. Capuno, Capstone Project Adviser for always

them finish this project

described in this capstone project in some form.

Joseph D. Capuno, their capstone project adviser, whose encouragement, and

their capstone project.

during data collection to create this capstone project.

Fourthly the institution, Pamantasan ng Lungsod ng San Pablo where

in Information Technology students under the mentorship of their knowledgeable

One of the most essential requirements of humanity is water. Water districts

the manual process and support innovation of technology.

handle all of the payments made by the customer.

development of this project.

from the waterfall model, which leads to a well-developed project.

Batangas. The developed system received an overall mean of 4.07 with an

instrument, which includes Functionality, Reliability, Usability, Efficiency,

develops a mobile app version of the system.

Title Page ............................................................................................... i

Approval Sheet …................................................................................... ii

Dedication …........................................................................................... iii

Executive Summary …........................................................................... vii

Table of Contents …............................................................................... x

List of Figures …..................................................................................... xiii

List of Tables …...................................................................................... xv

CHAPTER I – THE PROBLEM AND ITS BACKGROUND

Background of the Study .............................................................. 2

Objectives of the Study ................................................................ 4

Purpose and Description ............................................................. 5

Theoretical Framework ................................................................ 6

Conceptual Framework ............................................................... 9

Scope and Limitation of the Study................................................ 10

Significance of the Study ............................................................. 12

Definition of Terms ....................................................................... 13

CHAPTER III DESIGN AND METHODOLOGY

Current Technical Situation.......................................................... 37