1

Chapter 1

THE PROBLEM

1.1 Introduction

There are many different reasons why a person may hire a private tutor.

Some are looking for a remedial or general help for the student that is catching

up with grade-level skills or course materials the student are struggling with.

Others are looking to advance in by providing support, effective studying

techniques, and test-taking skills.

The proponents found an existing system (Class Management and

Monitoring System for Online Tutorial, 2016), this system helped tutor to update

profile and experiences. As well as for student to search and choose the desired

tutor the student wants by seeing tutor’s profile and experiences to ensure the

capabilities and/or skills of the tutor. The proposed system can also allow student

to request for specific topic. Moreover, the system can monitor schedules for

student and tutor.

The proponents also found an existing system (Attendance Monitoring for

Online Job Employee, 2016) which connected to the first existing system

mentioned above. This system monitored the attendance of each employee. The

developed system can address the issues concerning payment scheme based

on the actual worked hours. The system can also calculate the total work hours

rendered by the employee based on the assigned schedule of the employee.

 2

Moreover, it can provide notification and approval for late request and can

generate Employee’s attendance report.

However, the existing developed systems have limitations, which the

systems do not include payments. Thus, the proponents proposed a system that

solves the problem of the existing systems which has been named Billing System

for Online Tutorial Classes. The proposed system identified the rate of every

tutor and the rate per hour of the class. The system allows the student to pay for

every tutorial classes using PayPal. Moreover, the proposed system generates

the salaries based on the calculated total work hours of the tutor; this includes

the late and under time, deductions and penalty of the tutor’s salary.

In order to understand the system flow and design for Billing System for

Online Tutorial Classes, several diagrams (Figure 1.1, Figure 1.2, Figure 1.3 and

Figure 1.4) are provided.

Figure 1.1 shows the process flow activity of the admin. The admin can

manage the payment using the PayPal account. The admin will deposit the

tutor’s salary after calculating the total worked hours of the tutor. The admin can

also generate the reports, invoices, income and salaries of the tutor. This

includes the payment history, date and the amount.

 3

Figure 1.1 Propose System Activities for Admin

Figure 1.2 shows the process flow activity of the tutor. The tutor can log in

anytime but in calculating the worked hours will rely on the given schedule and if

the tutor will scan the QR code.

If the tutor cannot scan the QR verification code even though the tutor is

logged in during the time schedule of the class, the system will still mark the

attendance as absent. If the tutor will scan the QR verification code in the middle

of the class, thus served as late of the tutor’s attendance.

Moreover, the system can calculate the number of worked hours of the

tutor. The system will be notified that the class is about to begin. The system will
 4

also notify the tutor that the class will about to end in more or less than five

minutes. At the end of the class, the tutor will scan again the QR code. When

tutor will scan again the QR code, albeit the class is not yet ended, this will serve

as an under time record of the tutor. However, if the tutor is still logged in and

didn’t scan QR code even if the class already ends, it will not count to the

calculated worked hour of the tutor. The system will compute the salary base in

all total working hour of the tutor and generate the reports.

Figure 1.2 Propose System Activities for Tutor

 5

Figure 1.3 shows the process flow activity of the student. The student can

request for a tutorial class but will pay first before the request will be posted on

the wall. The student payment will be via online payment using the PayPal

account. The student will thereafter receive a PayPal invoice and history reports.

When the student wants to start the class, the student will notify the tutor.

Also, when the tutor wants to start the class, the tutor will tap the QR verification

code and the student will confirm.

Figure 1.3 Propose System Activities for Student

Figure 1.4 shows the process flow activity on how the QR verification code

was being used by the users.

 6

Every tutor has a unique QR code to be scanned for a tutorial class. The

tutor will scan the QR code and the student will receive the notification. The

student will thereafter confirm the QR code and the tutorial class will begin.

Thus, the system will start to calculate the salary of the tutor when the QR

code is active during the working hours of the tutor, whether the student will

confirm the code or not.

1.4 Propose System Activities for QR code

1.2 Statement of the Problem

The proponents found that the problem of the two existing systems which

are the Class Management and Monitoring System for Online Tutorial and
 7

Attendance Monitoring for Online Job Employee is that the payments and

salaries of the stakeholders are not included.

1.3 Objectives of the Study

1.3.1 General Objectives

The research study aims to design and develop a Billing System for

Online Tutorial Classes that addresses the proper calculations of the tutor’s work

hours including the late and under time. The system can also display the proper

rate per hour of the class.

1.3.2 Specific Objectives

 To gather the information needed for the development of Billing

System for Online Tutorial Classes.

 To Design Billing System for Online Tutorial Classes that allows to:

 Calculate total worked hours including the late and under time of

the tutor.

 Generate report, invoices, salaries, work hours, income and

attendance.

 Manage the payment of the tutor.

 To implement an online - based Application for Billing System for

Online Tutorial Classes base on design application.

 To test the Billing System for Online Tutorial Classes.

 8

Significance of the Study

The developed system will be a good opportunity for the proponents to test

skills in developing a system that would contribute to the needs of the

stakeholders of this system.

Furthermore, the system is beneficial for the both stakeholders; the tutor

and the student. To the tutor, the system will be a huge help to inform the exact

salary per hour of every tutor. The system is also an enormous help for the

student to know the precise rate per hour of every tutorial class.

The tutor receives the payment after the whole class ended through

PayPal. This is to be fair for the both stakeholders. The system is always

updated in each class, so that it will generate the attendance and invoices and

calculate the salary of the tutor.

1.5 Scope and Limitation

The developed system calculates the number of work hours of the tutor

including the late, under time and the absences. However, government premiums

are not included in calculating the salary of the tutor.

The system’s design is focused only in the calculation of the total worked

hours, absences, late and under time for the tutor’s salary. When it comes to

identifying the total worked hours of the tutor, whether the tutor is attending their

assigned schedules, the system relies on the QR identification upon access on

the class.
 9

When the tutor cannot attend or absent to the given tutorial class, it will

deduct to the tutor’s salary and the student will be reassigned to the other tutor.

Nevertheless, if the tutor will request to reschedule the tutorial class, it cannot

deduct to the tutor’s salary but will have a penalty. Moreover, the student can

also request for the rescheduling of the tutorial class.

Furthermore, when the tutor will logged in earlier before the class started,

it will not calculate to the tutor’s salary. The tutor can scan a QR verification code

that to be confirmed by the student. However, verification and recognition if the

user that logs on the particular account is legitimate or not, is already beyond of

the scope of the system.

1.6 Definition of Terms

Salary - refers to the payment of the tutor.

class - It refers on the working hours of the tutor and

ongoing tutorial.

student - refers to someone who requested a tutorial class.

tutor - refers to someone who will teach the student.

Under time - refers to the tutor’s unfinished time of the class.

worked hours- total computed time of the tutor.

 10

Chapter 2

REVIEW OF RELATED LITERATURE AND STUDIES

This chapter contains foreign and local related literature and studies that

support the idea of the proponents on conducted study. The foreign and local

related literature opens a key problem that the proponents want to address.

2.1 Foreign Related Study

Bederson(2014) studied Web Workers (the Challenges of Online Labors),

stated that the ongoing rise of human computation as a means of solving

computational problems has created an environment where human workers are

often regarded as nameless, faceless computational resources. The recent

growth of the field of “human computation” has brought with it expanded interest

in online labor. Online labor includes people being paid to do web-based tasks

posted by “requestors”. By performing tasks on demand from around the world,

these “web workers” offer an inexpensive and high through put solution to a

variety of problems that only humans can solve. Web workers have the potential

of earning money in places where they may otherwise have poor job prospects.

From privacy breaches to unpaid or underpaid labor, there are real social risks

that arise with the use of the technologies. Wage issues have been the largest

source of complaints raised by web workers; requestors sometimes pay late, pay

too little, or don’t pay at all.

“A good starting place is for requestor to calculate the expected hourly

wage of workers doing their tasks – through a combination of doing some of the
 11

tasks in house as well as monitoring the time spent by web workers. Even if

requestors choose to offer the lowest wage possible, requestors could still post

the information they do have.” Bederson (2014)

According to Yang (2017) online payment is a form of electronic payment,

which is provided by a third party payment interface between banks for real-time

payment. Compared with the traditional payment, online payment systems are

more convenient, fast, efficient and economical. This is a huge help after

monitoring and calculating the number of worked hours by the employee.

One of the most reliable online payment system used by online employers

is the PayPal. PayPal allows any business or individual with an email address to

transfer money online in a more secure, convenient and efficient way. “The

network is based on the existing bank account and the credit card to create a

real-time payment solution.” (PayPal.com, 2017) PayPal is the most popular

third-party online payment system in the world. It has 8 million transactions every

day and has over 137 million PayPal accounts in 193 markets and includes 26

currencies that it can transfer all over the world. Aki (2015)

2.2 Local Related Study

The study research of Perez et.al (2016) by Kupler (2011) stated that

actual tutorial class is more expensive compare to online tutorial class. Also

educators like online tutoring because it is a new place to do what they love and

at the same time they can earn extra income in the comfort of their time.

Moreover, according to the study of Salcedo et.al (2016) different online

 12

companies offers different payment scheme to their online workers. It could be on

an hourly basis in which online workers are paid based only on the number of

hours he worked online. It could also be project-based, where an online worker is

paid after the project is completed. One of these companies is Golden Voice

English Online Education Inc., an online English tutorial site and up work, an

online freelance site is example of companies that offers online job.

However, these two studies haven’t included payments on their research

studies, yet they still enunciate how payment was significant to both studies. This

is how the proponents jumped up to the online banking or online payment study.

“The internet is low-cost of source of information and service delivery for a

bank, providing the availability at any time anywhere so banks can serve around

the globe” Mojares (2014).

In the related studies of Mojares, internet banking as an internet portal,

through which customer can use different kind of banking services ranging from

bill payment to making investments, many employers Philippines taking the

advantage to use the internet banking to satisfy employee’s wage, especially

online employees’ wages.

The Department of Trade Industry (DTI) and Department of Finance

(DOF) implemented an Electronic Payment and Collection System, because it

provides an efficient and payment collection service for government transactions.

This system can validated the availability of funds, and debits the client

accounts in favor of a government security, and provides the client with an

 13

Electronic Official Receipt as a proof of payment. It also ensures secure access

and creates; restrains and safeguards the details of the transaction records

which are only accessible by authorize personnel.

“E-payment covers transactions made over the internet or the form of

transaction that do not require the client to transact over the counter or face-to-

face with the government representative” Disini (2013).

The findings of this study suggest that online payment may be an effective

intervention for everyone in high-need settings. The findings support that the

extant literature on online payment provides further evidence that online payment

makes a convenience and fast transaction speed.

 14

Chapter 3

RESEARCH METHODOLOGY

The research methodology used by the proponents as to how the system

being produced and done was the System Development Life Cycle (SDLC) or

Waterfall Method. The proponents choose SDLC approach that is appropriate for

the developed system. The development approach consisted of five phases:

Data Requirement Analysis, System Design, Develop, Testing and System

Implementation. (see Figure 3.1)

Figure 3.1 Waterfall Method of System Development Life Cycle

 15

3.1 Data Requirement Analysis

This phase involves analyzing system needs. The proponents conducted

a research in order to know well about the system fundamentals. The proponents

had analyzed the results of the research which is the related studies of the

system located in review of related literature.

3.2 Design

In this phase, the researches provided a conceptual design of the Billing

System for Online Tutorial Classes. This serves as description of the system and

concepts about how the system works and what the system can do. The

researchers make use of tools such as: Data flow diagrams to show the input,

processes and output of the systems’ functions, Use case diagram to show or

describe the sets of functions, System Activity Flowchart to show the activity of

the entire system that involves each entity, Sequence diagram to show the object

interactions arrange in time sequence, Entity Relationship diagram that would

show the relationships of each entity sets stored in a database, Logical Entity

Relationship diagram that would show the logical connection of each table of the

ERD, and the User Interface Design as well as the output through the use of Hi-

Fi Designs which will describe the scenarios of the system.

In this phase, the Context level data flow diagram is shown for the

functional and features of the propose system. (see Figure 3.2) The context

diagram shows the input and output data that is being process in the system.

Three entities are involved in the context diagram.

 16

The student can request a tutorial class and the student will receive a

tutorial bill before the request will be posted in the dashboard. The student and

tutor can start and close the tutorial class using the given QR verification code.

The tutor can request an invoice and the system will display the time logs, total

working hours and salary details. The admin will be the one to manage the

payment for the tutor and the system will generate the entire reports that will be

seen by the admin

Figure 3.2 Context Level Data Flow Diagram

 17

3.3 Develop

In this phase, the proponents make use of the Three Tier Architectural

Design (see Figure 3.3). Since the Billing System for Online tutorial Classes is a

web base application.

In the first tier, which is the Presentation Tier, the proponents use HTML,

CSS and Bootstrap script for the design. For the 2nd tier, which is Application

Tier the proponents use PHP, JavaScript, Java Language to provide functionality

and interactivity to the application. For the 3rd tier, which is Database Tier, the

proponents use MySQL Database for data storage.

Figure 3.3 Three Tier Architectural design

3.4 Testing and Implementing

In this phase where the implementing and testing is involve, the

proponents will first undergo a thorough testing process to ensure that the

system meets the requirements and also to make sure that it is free of bugs.

There are four phases of testing that need to be completed before the program
 18

can be cleared for use: Unit testing, Integration testing, System testing and

Acceptance testing.

In Unit testing where focuses on specific units or components of the

software to determine whether each one is fully functional. It is to determine

whether the application functions as designed. In Integration testing allows user

to combine all of the units within a program and test them as a group. This is

designed to find interface defects between the functions. System testing is very

important of the four phases because it verifies that the application meets the

technical, functional and business requirements that are set for the user. The

final phase which is the Acceptance testing, this is where to determine whether

the system is ready for release. The user will test the system to find out whether

the application meets the user’s needs.

The proponents will use the testing plan mentioned above by letting the

user test the system in order to get feed backs and suggestions from them. The

proponents will find a solution if such concerns will address in order for the

system to improve and maintain.

 19

Chapter 4

RESULTS AND FINDINGS

This chapter discusses the results and findings from the data gathered by the

proponents derived from methodology. Diagrams, figures and tables will be

presented and to be discussed thoroughly in succeeding sections of this chapter.

The proponents presented the Gantt chart which will be served as a road

map of the development of the research. The Gantt chart was designed to help

the proponents to keep track on the presentation of the project schedule and

tasks.

On the first table, which is already completed by the summer (April and May),

this is where the proponents conducted an interview and gathered data to

determine the system requirements and design. After gathering data, the

proponents started preparing the first three chapter of the system document. This

includes the revising of documents and analyzing the data flow diagram of the

proposed system.

In the second table, there are several tasks that were already completed, like

revising the first three chapters. Most of the tasks are still being sort out by the

proponents; Analyzing System functions, Data Flow Diagram, System Activity

Flow Chart, Use Case Diagram, Entity Relationship Diagram, Hi-fi Design,

System Designing and Coding. The testing and implementing of the system will

be done in the future task. (See Figure 4.1)

 20

Figure 4.1 Billing System for Online Tutorial Classes Gantt Chart

Completed Ongoing Future Task

4.1 Requirements Analysis

During the data research gathered by the proponents, the proponents

identified the system requirements for the user through the use of the results

from the data research regarding to the Billing System for Online Tutorial

Classes. Based on the gathered data during the research, the proponents have

formed an idea on how the system should behave, how the system should

operate and what function should be there in the system.

 21

4.2 User Definition

This section discusses on how the users operate the system. There are

three main types of users in this system; the administrator, student and the tutor.

The administrator will be the one to manage the payment deposited from

the student and will be the one to manage the salary of the tutor using the

PayPal account.

The student will be the one to request for a tutorial session which is to be

approved by the admin after depositing the payment through PayPal. The

student can accept the pending QR verification code from the tutor when the

tutorial session is about to start. The student can also tap for a pending of the QR

code which will be accepted also by the tutor.

The tutor will receive the payment after every session ended, and the

payment will be received through PayPal.

4.2.1 System Modules

In this section shows modules and feature of the system and an outline of

the functional it can offer with the assistance of the system. The proponents with

the help of requirements identified were able to identify on how the system

operated based on the requirements identification. The check marks in the table

indicate the allowed function of a user category. (See Table 4.1)

 22

Table 4.1 System Features

System Modules System Functionality Admin Tutor Student

Approved/Disapproved
Manage Session
Student requested ✓
Request
session

Requesting for a tutorial

Request Session ✓
session

Choose/request for a
Manage Session ✓
student to tutor

Receive student

payment before
✓
approving the requested

session

Manage Payment
Manage the tutors
✓
payment

Receive payment after

✓
the tutorial session

Reports View history reports ✓ ✓ ✓

 23

4.2.2 System Requirements

The requirements specification, the proponents presented the functional

and non-functional requirements of the Billing System for Online Tutorial

Classes. Every stakeholder has its own user privileges.

4.2.3 Functional Requirements

In this section, functional requirements are shown to describe the

functionalities of the system and of what the system can do.

Table 4.2 shows the list of functional requirements for the admin with

unique names of specific functionality and description.

Table 4.2 Functional Requirements for Admin

Functionality Description

The admin shall input the log in

Log in
information to access to the system.

The admin will manage the payments to

Manage Payment the tutor and receive payment from the

student
 24

The admin will be able to manage and

generate the reports from the system

Reports such as time logs, attendance report,

salary reports, income reports and

session payment history

Table 4.3 shows the list of functional requirements for the tutor with unique

names of specific functionality and description.

Table 4.3 Functional Requirements for Tutor

Functionality Description

Log in The tutor shall input the log in

information to access to the system.

Manage Payment Session The tutor will receive a payment after

each session through PayPal

Reports The tutor will be able to manage the

reports from the system such as salary

details, time logs, session payment

history and attendance report

 25

Table 4.4 shows the list of functional requirements for the student with

unique names of specific functionality and description.

Table 4.4 Functional Requirements for Student

Functionality Description

Log in The student shall input the log in

information to access to the system.

Manage Request Session The student will able to request a

session and payments of the request

session

Reports The student will be able to manage

the reports from the system such time

logs and session payment history

4.2.4 Non-Functional Requirements

In this section explains the non-functional requirements of the system. The

non-functional requirements of the system include: the security of the payment in

which going through the process of PayPal. The system can easily be navigated

by the user and have a high accessibility that the user can access the system

anytime anywhere.
 26

4.3 Data and Process Modeling

This section presents the diagrams of the system created by the

proponents. Data flow diagrams, Use case diagram, Activity diagrams, Sequence

diagram and Entity Relationship diagram (ERD) are created in order to visualize

and to know how the stakeholders will interact with the system. These diagrams

are utilized as tools by the proponents to know the structure and dynamic nature

of the system.

4.3.1 Data Flow Diagram

Data flow diagram shows the input and output processes of the systems

function.

Figure 4.2 show the data flow diagram of the admin. It shows all the

processes associated with the admin as well as the data storage involved in the

processes. In the diagram shows the different data that the admin can input and

going through the process activity and going through the storage of specific data

and then produce a result to the admin.

Figure 4.2 Data Flow Diagram for Admin

 27

Figure 4.3 shows the data flow diagram of the tutor. It shows all the

processes associated with the tutor as well as the data storage involved in the

processes. In the diagram shows the different data that the admin can input and

going through the process activity and going through the storage of specific data

and then produce a result to the tutor.

Figure 4.3 Data Flow Diagram for Tutor

Figure 4.4 shows the data flow diagram of the student. It shows all the

processes associated with the student as well as the data storage involved in the

processes. In the diagram shows the different data that the admin can input and

going through the process activity and going through the storage of specific data

and then produce a result to the student.

 28

Figure 4.4 Data Flow Diagram for Student

4.3.2 Use Case Diagram

Use case diagram is use to show or describe the sets of functions. Figure

4.5 shows the use case diagram of the system, the diagrams portrays the three

users involved in the system. System functions will be categorized for each user.

Three main users are shown with their indicated functions. The diagram also

shows how users interact with the system. A use case is a methodology used in

system analysis to identify and clarify system requirements.

 29

Figure 4.5 Use case Diagram for Billing System for Online Tutorial Classes

4.3.3 System Activity Flowchart

System Activity Flowchart shows the system activity indicating each entity

user involves in the system. Figure 4.6 portrays the system activity flow of the
 30

system which is the user’s information is being verified first before accessing into

the system. After such task, the system will allow the users to enter into the

dashboard by categorizing the user account.

Figure 4.6 System Activity Flow Chart for Billing System for Online Tutorial

Classes

4.3.4 Sequence Diagram

Sequence diagram shows the object interactions arrange in time

sequence of each user of the system.

Figure 4.7 portrays the sequence diagram of the admin. In this diagram

shows every different activity of the admin such as approving the session request
 31

from the student, monitoring the end of each session and managing the payment

from the student and to the tutor.

Figure 4.7 Sequence Diagram for Admin

Figure 4.8 portrays the sequence diagram of the tutor. In this diagram

shows every different activity of the tutor such as choosing a session posted in

the home page of every session requested from the student and receiving

payment after the session ends.

Figure 4.8 Sequence Diagram for Tutor

 32

Figure 4.9 portrays the sequence diagram of the student. In this diagram

shows every different activity of the student such as requesting for a session and

paying for every session request.

Figure 4.9 Sequence Diagram for Student

4.4 User Interface Design

The proponents will present a Hi-fi design of the system which will be

described in the following section.

4.4.1 Hi-fi Design

In this phase, the proponents will show the Hi-fi design of the system

through screen shots and figures. The data included on some user interface

design with the elaborated scenarios on what the user would interact in the UI

design.
 33

Figure 4.10 QR code design

Shows on when the tutor tap the QR verification code for the log in time of

the class. This is where the system will rely on the attendance of the tutor.

Figure 4.11 Payment using PayPal design

 34

Shows on the payment for the tutor after each class were ended. Also this

is where the student will pay when requesting for a tutorial class.

Figure 4.12 Schedules of Classes

Shows the list of class schedules requested by the students.

Figure 4.13 Attendance list

 35

Shows the list of attendance of all tutors in every classes.

Figure 4.14 Monthly Income Analyses

Shows the monthly income report of the admin.

4.5 Data Design

In this phase, the proponents make us the Entity-relationship diagram and

Logical Entity-relationship diagram to display the relationships between each

entity of the table and the logical relationship of each table in the system’s

database.

4.5.1 Logical Entity-Relationship Diagram

Figure 4.15 shows the Logical Entity-relationship diagram of the system.

Which each of the table from the Entity-relationship diagram is connected with

each other and indicates the relationship of the tables.

 36

Figure 4.15 Logical Entity-Relationship Diagram

4.5.2 Entity-Relationship Diagram

The proponents will show the Entity relationship diagram to represent the

entities of the system and the relationships between each entity. The data input

by the user of the system will be stored in the system’s database. (see Figure

4.16)
 37

Figure 4.16 Entity Relationship Diagram

4.6 Development

In this phase, the proponents make use of the three tier architecture for

developing the Billing System for Online Tutorial Classes. By using the first tier

which is the presentation, the proponents used the front end framework

Bootstrap for designing the user interface. The proponents also used a
 38

JavaScript, a client side programming language for the interactivity of the

application.

Moving to the second tier which is the application, the proponents used

the PHP as the main programming language for the application. For the third or

last tier, the proponents make use of the MySQL for storing data. The proponents

will perform queries in order for the user to get the desired data.

4.7 Front End

In the designing phase, the proponents used html and CSS for the

creation and designing of layouts. Also, to improve the graphical user interface of

the application and to make the development much faster, the proponents also

used the front end framework known as Bootstrap. Bootstrap is popular and

famous CSS library among web designers for its benefits when it comes to

designing. To improve the interactivity of the application, the proponents used

JavaScript.

4.8 Back End

In this phase, the proponents will show some code snippets from the

system. This is where the database was being restored. Basically on how the

system works, updates and changes.

 39

tbl_admin

tbl_applicant
 40

tbl_day

tbl_payment_dtl

tbl_schedule
sss