2009 International Conference on Computer Technology and Development
Analysis, Design and Implementation of a Web-based Payroll
Application Software
Husin J. Then, Biju Issac, Lau T. Chung, Susanti Wongso, Riyan Bong, Lesley Lu and Yu P. Ling
Swinburne University of Technology (Sarawak Campus),
Kuching, Malaysia.
husinjamil@gmail.com, bissac@swinburne.edu.my, lead0928@gmail.com, susanti_wongso@yahoo.co.id,
rainy_wu888@yahoo.com, babyaun@hotmail.com, emily_yupeiling@yahoo.com
Abstract—The need to develop customized application
software is quite high now-a-days with the ever increasing
automation process within many companies. In this paper,
we analyze, design, implement and test a web-based
payroll software for an external company with the Setup
module, PI (personnel information) module, OT (over
time) module, Payroll module and Report module. These
modules and their implementation are discussed in detail.
The software development life cycle followed is discussed
to show how different phases are evolved and how they
interact with each other to form the software that the
client needs.
Keywords — internet technologies, software analysis;
software design; software implementation
I. INTRODUCTION
The application software is a type of computer
software that uses the capabilities of a computing
machine fully for doing a specific task that the user
wants to do. Typical examples of software applications
are database applications, word processors, spreadsheets,
web browsers etc. The development of any application
software needs to be done in a modular fashion under
structured or object oriented programming approach. In
this paper we are developing the application software for
a large size external firm that would help them to
automate the payroll processing and related tasks for the
employees in that company. The paper is organized as
follows. Section 2 is the related works, section 3 is the
software development life cycle, section 4 is the
analysis, section 5 is the design, section 6 is the
implementation, section 7 is the testing, section 8 is the
software used and section 9 is the conclusion.
II. RELATED WORKS
Diez et al. deals with instructional software that can
be defined as any computer program used for
instruction. As a means to optimize the development
process of instructional software, different authors have
defined a range of methods based on software
engineering. However, the use of a method does not
guarantee the validity and quality of the product
developed; hence, a series of software process
improvement (SPI) approaches aimed to improve and
guarantee the development process have arisen. The
authors are reviewing the aforementioned approaches
and applying them to the analysis phase of the
instructional software development process [1]. Adelson
978-0-7695-3892-1/09 $26.00 © 2009 IEEE
DOI 10.1109/ICCTD.2009.112
et al. in their paper look at the software designer's
underlying constellation of knowledge and skills, and at
the way in which this constellation is dependent upon
experience in a domain [2]. Guindon describes how
designers exploit powerful heuristics and personalized
evaluation criteria to constrain the design process and
select a satisfactory solution [3]. Adelson et al. present a
preliminary cognitive model of the process of software
design, where they develop a model of expert problem-
solving skills for a task in which domain knowledge
played an extensive role. In their model the process of
design is captured via goals-and-operators interacting
with a knowledge base [4].
III. SOFTWARE DEVELOPMENT LIFE CYCLE
The software development life cycle (SDLC) is the
life cycle through which any application software is
born. The basic waterfall model has the four stages as
follows: (1) Requirements Analysis and Definition,
where goals, constraints and services are agreed upon;
(2) Systems and Program design, where hardware and
software are partitioned and the functions are
represented in a way that can be translated into a
program; (3) Coding where the design is implemented;
(4) Validation and Verification at various levels to
check if the requirements have been met [5].
IV. SOFTWARE ANALYSIS
Detailed analysis has been done in order to have a
further view of the current system, identifying all the
strength and weakness of it. The following three
methods were used for the in-depth analysis.
A. Documentation collection
The authors requested all the necessary
documentations from client that were being used in the
current system, so as to improve the new system. Some
were used daily and others were used in different areas
of business processes. Some of the documents were Pay
slips, Staff Personal Record, Recall from Annual Leave,
Report on Lost of Fixed Asset and Leave Application
forms etc.
B. Interview
One to one interview was held between the
Information Technology (IT) manager assistant and also
the Human Resource (HR) manager to have more
detailed information on their experience of the old
system. Interview questions have been planed and below
are part of the questions that have been asked.
107
1. What kind of attributes are involved in the whole
payroll system?
2. What is involved in personal information system?
3. What are the processes of the performance
appraisal? How are the employees evaluated? How
often are the employees being evaluated?
4. What are the deductions and additions of the
employee’s salary?
5. What are the formulae available to get the final
figure of the salary?
6. What are the assets available in the asset assignment
module? What are the other attributes involve in
this module?
7. What is the format of the statutory report? What are
the main attributes available in this report?
8. What is the basic management? How is the flow
Figure 1. Entity-Relationship (E-R) diagram
like?
9. What is the problem with the current system?
10. What should be the basic changes in the new would be reused throughout the program. Sub-modules
system? will later be tested individually and lastly integrated into
the overall program structure.
C. Group Meeting The Entity-Relationship (E-R) diagram is shown in
Weekly meetings were done to meet up with all fig. 1, which is an abstract and conceptual representation
clients that have and will be in contact with the new of the data used. The context diagram in fig. 2
system to get feedback on their requirements. Questions represents the overall user’s interaction with the system.
that were asked are similar to interview questions with The main system is called PI & Payroll system and it
the IT manager and the HR manager but in the group can be divided into 5 major processes which are Setup
meeting there were even more feedback on the system. module, PI (personal information) module, OT (over
This is to get the overview of the existing system and time) module, Payroll module, and Report module. The
where the possible areas that the new system can users of the PI & Payroll system are HR staff, Normal
improve more for their business process without fully staff and Supervisor. Further information will be
changing their tradition. discussed in Level 0, Level 1, Level 2, and Level 3 DFD
(Data Flow Diagram) sections respectively.
V. SOFTWARE DESIGN
After a comprehensive analysis, development of A. DFD Level 0
logical and physical design prototype has been
developed. The prototype is designed based on user’s The DFD level 0 diagram in fig. 3 shows the flow of
requirements and through team discussion. the system. There are five major processes which are –
Developers usually map out the overall program Setup module, PI module, OT module, Payroll module,
structure into separate subsections and it is usually and Report module.
hierarchical design model. These sub-modules will be Setup module consists of two major setups called
called again which also means that the sub-modules Company setup and Staff setup. Setup module allows

Figure 2. Context diagram

108
the HR user to modify the content and add new details
of Company setup and Staff setup such as OT, EPF
(Employee Provident Fund), SOCSO, Tax, Grade,
Asset, Division, Department, Personnel Information,
Staff details, Family member, Asset allocation, and Staff
movement. Further information will be discussed in
DFD level 1 section.
PI module is called Personnel information that allows
the HR staff and Staff (including supervisor) to add and
modify their own personnel information respectively.
The contents that are able to add and modify in
Personnel information are Personal information, Staff
details, and Family member details. The content of
Personal information, Staff details, and Family member
will be further discussed in DFD level 1 section.
OT module stands for Overtime module. Basically,
OT module involves 3 main actors such as staff,
supervisor, and HR staff. OT module allows every staff
to request for OT claims over a certain period of time
and it will generate the OT amount as per request by the
staff. Once the staff has requests for an OT claim, the
system will send a notification to supervisor in order to
seek for approval. Before, the system will send
notification to HR staff for record purpose. Further
details will be discussed in DFD level 1 section.
Payroll module is the core functionality of the system
that represents the major part of the processes. Payroll
module allows the HR staff to generate the Payout slip
and send it over the system to the staff. Payroll module
is able to calculate an approximate payout amount for
each staff over the deduction of tax, SOCSO, EPF and
claims from OT. Payroll module is quite deliberate in
searching the payout details from period to period as
been generated before in yearly and monthly. Further
details will be discussed in DFD level 1 section.
Report module is a functionality that can generate any
kind of reports as per request by HR staff. Basically, it
can generate staff details, family member details,
Figure 3. Data Flow Diagram (DFD) Level 0
109
personal information details, division details, department
details, asset allocation details, staff movement details,
staff OT details, staff EPF details, staff SOCSO details,
staff tax details, and payroll transaction details. Further
details will be discussed in DFD level 1 section.
B. DFD Level 1 Components
We are not showing further DFDs to narrow the scope
of the paper, but would explain the functionalities under
them. To show a bigger picture, there are two major
processes in the setup DFD Level 1. Specifically,
Company setup enables HR staff to add new and modify
existing content of department, division, asset (like
mobile phone, laptop etc), grade, tax, SOCSO, OT, and
EPF. Each of it has stored in the database.
Another process in the setup DFD Level 1 is called
Staff setup. Staff setup enables HR staff to add new and
modify existing content of Staff details, Personal
information, Family member, Department assigned,
Asset allocation, and Staff Movement. Each of it has
stored in the database.
PI stands for Personnel Information. There are two
major processes in PI DFD Level 1. It allows every staff
to modify their personal information and family
member. Besides, HR staff is able to search any staff PI
record by entering the staff ID, division code, or
department code.
OT DFD Level 1 has two major processes. Staff can
request OT claims through the system application, and
the system application will send a notification to
supervisor for seeking approval. Once the supervisor
approved the OT claims, the HR staff will receive a
notification from the system application for staff OT
records. Secondly, every staff is able to search the OT
status over the period of time in order to check whether
the OT claim is approved or not.
Payroll DFD Level 1 has 2 major processes. Firstly,
HR staff is able to calculate an approximate amount of
staff payroll through the system application which based
on the data that can be retrieve from the data storage
such as the details of division, department, staff, staff
OT, staff Tax, staff EPF, staff SOCSO. Once the payroll
transaction has been done, the system application will
record it into the payroll transaction data storage. Next,
every staff is able to search payout details over a period
of time and the system application will issue the payout
slip to the staff as per request.
The report generating DFD has only one process. HR
staff can request for any kind of report to be generated
such as staff records, family member records, personal
information records, division records, department
records, asset allocation records, staff movement
records, staff OT records, staff SOCSO records, staff tax
records, and Payroll transaction records.
C. DFD Level 2 Components
In DFD level 2, Setup module has been separated into
4 identical processes. Before HR staff select on any
setup, HR staff has to log in to the system account. It
requests for staff ID and password. After the HR staff
select on any of the setup and then HR staff will be able
to add and modify the content of the company setup or
staff setup. The content of company setup and staff setup
are the same as we mentioned before in diagram level 0
and level 1.
Personnel information DFD level 2 has been
separated into 6 identical processes. Every staff needs to
log in to the system account, before he or she can view
and modify the content of the personal information.
Besides, HR staff is another user of the PI module and
they are able to search staff by staff ID, department
code, or division code. Once they have selected
particular staff, and then they can view staff information.
For OT DFD Diagram Level 2, there are 10 identical
processes. Firstly, staff has to log in to the system before
he or she can submit any OT request. After that, the
system application will send an OT request notification
to the supervisor, and the supervisor has to log in to the
system before he or she can reject or approve The OT
request. Likewise, once the OT request has been
approved by the supervisor, another notification will be
send to the HR staff and HR staff will have to log in to
the system before he or she can record OT details.
Besides, staff can search and view the OT status by
selecting the time of period.
For Payroll DFD Level 2, there are 10 identical
processes. After log in to the system, HR staff will have
to search staff by division and department and select
particular staff to generate payout details. Next step, HR
staff will have to find out the OT request that has been
claim from that particular staff. After that, HR staff will
have to find out all the deductions such Tax, EPF and
SOCSO that have been subjected to that particular staff
and come out an approximate payroll details. Once the
pay slip details have been confirmed, the system
application will send a pay slip detail to that particular
staff. Lastly, Staff can search and view payout details by
selecting the time of period.
For report DFD Level 2, there are 6 identical
processes. HR staff will have to log in to the system and
choose the type of report, report category, and fields to
110
be generated. Once the report is generated by HR staff,
the report will have to be exported to excel file.
D. DFD Level 3 Components
For Company Setup DFD Level 3, there are nine
identical processes. HR staff will able to add & modify
division information, department information, asset
information, grade information, tax information, SOCSO
information, EPF contribution information, and OT
information.
For Staff setup DFD Level 3, there are nine identical
processes. HR staff will be able to add new staff details,
search existing staff by entering ID/name/division
/department. Besides, Hr staff will be able to select
particular staff and modify staff details or remove staff
and enter staff movement details. Apart from that, HR
staff will be able to search asset by entering keyword
and select particular staff to be assigned with asset.
VI. SOFTWARE IMPLEMENTATION
The description of the software development details
are shown in table 1. Below is the functionality
available for the software system.
1. Personal Information
Staff – Able to view own information, able to edit
certain information in the Personal Staff
Information, able to edit family member
information; Human Resource – Able to view own
and other staff’s information, able to edit own and
other staff’s information, able to add and delete staff
movement and asset allocation information.
2. Overtime
Staff – Able to view own overtime, able to apply
overtime; Human Resource – Able to view own and
other staff’s overtime, able to edit own and other
staff’s overtime; Supervisor – Able to approve or
reject overtime
3. Payroll
Staff – Able to view own payroll; Human Resource
– Able to view own and other staff’s payroll, able to
calculate all staff’s payroll
4. Report
Human Resource – Able to view all staff’s report,
able to export report to Microsoft Excel
5. Setup
Human Resource – Able to add new staff, able to
modify staff’s information, able to remove staff,
able to edit staff movement, able to delete and add
asset allocation.
The XAMPP control panel software used to control
Apache web server, MySQL database as in fig. 4 [6].
Some sample screen shots of the web-based payroll
software that was developed through PHP, JavaScript
and MySQL database programming are shown in the fig.
5 to 8. Only a fraction of the overall function is shown in
those figures, as the scope of overall software is too big
and the screens too many to be shown graphically. The
software has in essence, the five functionalities that are
listed before, namely – Personal information
management (along with asset management), Overtime
management, Payroll management, Report management
and Setup management.
 TABLE I. DETAILS OF SOFTWARE APPLICATION DEVELOPMENT

Name HR Payroll System v1.0

Development PHP, SQL, HTML, Java Script, CSS

Language/Script
Front End Web pages
Database (Back End) MySQL
Report document Microsoft Excel Worksheet

VII. SOFTWARE TESTING

There were six participants involved in our usability
testing. It consisted of four males and two females.
Three of them were students of the University and three
of them are external company staff members. All of the Figure 5. Welcome screen
participants were randomly. The objective of the
usability test was to find out whether the system is –
Easy to understand, the user interface is friendly, the
message/buttons/validation are easy to read, the color
scheme is eye-friendly, the menu is easy to navigate,
the required pages are easy to find, the on screen help is
sufficient etc.
Figure 6. Validation for Figure 7. Validation for
VIII. SOFTWARE USED Username in Login page Password in Login page
The XAMPP 1.7.1 software was used for application
development under Windows XP which contains the
following: Apache HTTPD 2.2.11 + Openssl 0.9.8i,
MySQL 5.1.33, PHP 5.2.9, phpMyAdmin 3.1.3.1,
XAMPP CLI Bundle 1.3, FileZilla FTP Server 0.9.31
and Mercury Mail Transport System 4.62. The ease of
use with which these software components could be
deployed makes it a good option for anyone to use this
open source software.

IX. CONCLUSION
This paper presents the various stages that were
involved in the software development life cycle of the
web-based payroll application software for an external
company. The detailed analysis and design were
discussed to elaborate on the various functionalities that
are supported by the software. Open source tools were Figure 8. View Pay slip or Generate Payroll
used to implement the application software. The
modular software development was the key to success of REFERENCES
the project.
[1] Diez, D. Fernandez, C. Dodero, J.M. Diaz, P. Aedo, I.,
"Instructional Software Analysis: Lessons from Software
Development Process Improvement", In Proceedinsg of the
Seventh IEEE International Conference on Advanced Learning
Technologies, pp. 499-501, 2007.
[2] B. Adelson, E. Soloway, "The Role of Domain Expenence in
Software Design," IEEE Transactions on Software Engineering,
vol. 11, no. 11, pp. 1351-1360, 1985.
[3] R. Guindon, “Knowledge exploited by experts during software
system design”, International Journal of Man-Machine Studies,
33(3), pp.279-304, 1990
[4] B. Adelson, E. Soloway, "A model of software design",
International Journal of Intelligent Systems, 1(3), pp. 195-213,
1986.
[5] Pfleeger, S.L. (2006) Software Engineering: Theory and
Practice, 3rd edition, Prentice-Hall, ch.1.
[6] XAMPP Software, Website: http://www.apachefriends.org/en/
xampp-windows.html, Accessed 15 March 2009.

Figure 4. XAMPP control panel used to control Apache and

MySQL

111