report

1. 1 | P a g e
PROJECT REPORT
HUMAN COMPUTER INTERACTION
SECTION 12
LECTURER’S NAME : NIK ISROSZAIDI
GROUP MEMBER’S
MOHD HUSNI BIN AHMAD ( SX132587CSRF04 )
MOHAMAD SYAHMI EFFENDY ( SX132578CSRF04 )
MOHD IKHWAL BIN MOHD NOOR (SX132588CSRF04 )
MOHD HASROL BIN RAMLI ( SX132585CSRF04 )

2. 2 | P a g e
E – TIME OFF
MOHD HUSNI BIN AHMAD husni@kpwkm.gov.my
MOHD SYAHMI EFFENDY syahmi@dgkom.com
MOHD IKHWAL mohd.ikhwal@gmail.com
MOHD HASROL asrules@gmail.com
INTRODUCTION
This tasks are consists of our group members that have to work together
in order to finish this project. The tasks that we must do are:
 Mohd Husni Bin Ahmad as a Project Manager Cum Programmer
 Mohd Ikhwal Bin Mohd Noor as a Analsyt Cum Programmer
 Mohd Hasrol Bin Ramli as a Application Designer Cum Analyst
 Mohamad Syahmi Effendy as a Application Designer Cum Analyst
We decided upon these roles through reviewing our strengths and
experience at past and believe that this division of roles and
strengths will help us be successful.
Problem
Employees have problem to notify their boss whenever they need to
apply for emergency leave, MC etc. Most of the time, employee will use
Short Messaging System ( SMS ) to notify their boss whenever they
wants to apply for emergency leave, MC etc. This is not a formal
procedure for a corporate level companies / organizations. Any
application like leave, time off needs an approval. Proof of the approval
is essential to act as a guarantee if anything happened. The management
also can read the records of the times taken and how many application
was made for an employee.

3. 3 | P a g e
Target User
Employees and Employers
Solution
Instead of using Short Messaging System ( SMS ) or maybe call the boss
in the morning, we are proposing to develop an online system that you
can carry around. Basically, this system not just for notify, it will act as
mobile time off system.
All data in current system should be synchronizing in this system. As for
management level, they can approve any application anywhere and
wherever they want to. This system worked exactly the same like the
current leave application. The only different is, employee and employer
can access it anytime and anywhere. Besides, the system comes with
iconic design which is easy to use and more reliable. It will need user to
register (for first time user) and login to the system.
The Login ID will base on employee number and password in
alphanumeric which is much secure. For employee, they can apply
their time off, view and cancel it. The system will not allow user to login
multiple devices in one time for security reason. Once this happened,
the latest login will stay and it will kick the others. It also comes with
option to select standby employee within the same company. Besides
that, the system allowed user to view their team or colleagues leave in
calendar format.
As for management or employer, they can view user’s application in
mobile. They can approve the application whenever any notification
sends to them thru email. The interface for this level is a bit different.
Management level will have all their team members for approving
purposes. In other words, they have higher level of authority.

4. 4 | P a g e
Personas
1. MUMAMAD SYAHRULFITRI AL QASSAM BIN ALI ( GEN – Y
EMPLOYEE
 27 YEARS OLD
 IT OFFICER OF COMPUTING DEPARTMENT
 NEWLY MARRIED WITH 2 SMALL CHILDREN
 FREQUENTLY TAKES TIME OFF TO MEET PAEDS, SEND
CHILDREN TO NURSERY
2. ABDUL RAHMAN BIN SAID ( GEN – X EMPLOYEE )
 56 YEARS OLD
 CHIEF CLARKS OF HUMAN RESOURCES DEPARTMENT
 HAVE 6 GRANDCHILDREN
 SOMETIMES TAKE TIME OFF TO MEET DOCTOR AND
FATIQUE

5. 5 | P a g e
TASKS
There are few tasks for user to complete it. Firstly, users need to install
the application. Then, the main task which is Login/Register. Users must
have their employee number to access the system. Without that, access
will be denied. After that tasks for apply time off. User can select which
date, time and reason to apply the time off. This application also comes
with option to cancel or update the application. For management level,
system will provide option to approve the leave. Lastly, task to check
status of application.
DESIGN
We need to modify our design of application according to user needs. It
been modify with several stages to make it user familiarize and use to
the application. Hence, we have created few alternatives design to get
feedback from user. This is just few mock ups design for internal viewing
only.
DESIGN ALTERNATIVES

6. 6 | P a g e

7. 7 | P a g e
IMPLEMENTATION
We use proto.io for the implementation stages. In this stage, we come
with combination design of user feedback and alternatives design. We
attach capture screen of application below.
Figure 1 Figure 2 Figure 3

8. 8 | P a g e
Figure 4 – Application Flow
EVALUATION
Our team conducted user testing and evaluations separately on students
who go to UTM Space. Because of the small amount of resources, we
felt this is the only way that we can fully test users on the product.
We designed sample steps for these users to complete, having them
working through it on their own. Once they did complete these steps.
We had them take a survey and interviewed them on what they thought
of the design. Both forms of feedback were used for us to determine
what to fix in the final product that would make this time off system
more reliable.
Result From The Survey:

9. 9 | P a g e

10. 10 | P a g e

11. 11 | P a g e
REFLECTION
From the course of the interactive design, we have learnt that we need
to ensure that the use of the application is functioning as expected. This
is because this device is for the employee and employer. In a company,
there are several of targeted users such as young man and old man. It is
important to combine many aspects in order to make it reliable and
functions.
If we need to make this application again, we will ensure that the use of
this application can be expanded to the entire leave application. This is
because this device is to assist them in completing their needs. Perhaps
any improvements will be made. No significant changes because for us,
this device application is enough to help those in need.
For the features of prototype, we agreed to developed it use iconic
based of application. This can cater the needs of both parties. This so
called “win-win situation” application can make both parties happy and
more understand using it.
For this project, we use paper prototyping because it is not costly and
we manage to finish it early compare to computer prototyping.
However, user will understand better for our design when we are using
computer prototyping, such as power point or software.
In order to evaluate the results, we use Google form to make a survey.
We should make the distribution form early but for some reason we
have make it that late than expected. When we have finish this early, we
can provide a good presentation and more attractive so that, people
want to answer the Google form. By using this, it is easy because we can
give the result in a pie chat or graph directly based on the result. So, no
need to do it manually. Other than that, we should provide the question
that will help us to make an improvement to our design.