SCSV2113-06 HUMAN COMPUTER INTERACTION
(Session 2019/2020 Semester 1)
School of ComputingFaculty of Engineering
University of Technology Malaysia
HUMAN COMPUTER INTERACTION (PROJECT PART #2: Establishing Requirements)
LECTURER: NOR ANITA FAIROS BINTI ISMAIL SECTION : 06
Prepared by The 90’s:LEONG WAI YUI (A18CS0097)
LEE HUEY MIIN (A18CS0096)
TOK KAI XIAN (A18CS0267)
NUR ASNANI BINTI HASSAN (A18CS0186)
Table of Contents1. Submission 1: User Analysis.................................................................................................................3
1.1. Persona....................................................................................................................................3
1.1.1. User Group 1: Student.........................................................................................................3
1.1.2. User Group 2: Lecturer........................................................................................................4
1.1.3. User Group 2: Staff..............................................................................................................5
2. Submission 2: Task Analysis.................................................................................................................6
2.1. Introduction.............................................................................................................................6
2.2. Refinement of HTA..................................................................................................................6
2.2.1. HTA for task 1: Record Attendance.....................................................................................6
2.2.2. HTA for task 2: Check Record Attendance.........................................................................13
2.2.3. HTA for task 3: Payment...................................................................................................19
Table of FiguresFigure 2-1 HTA Task 1 for user 1...............................................................................................................7Figure 2-2 HTA Task 1 for user 2...............................................................................................................8Figure 2-3 HTA Task 1 for user 3...............................................................................................................9Figure 2-4 Proposed HTA Task 1 for user 1..............................................................................................11Figure 2-5 Proposed HTA Task 1 for user 2..............................................................................................12Figure 2-6 Proposed HTA Task 1 for user 3..............................................................................................12Figure 2-7 HTA Task 2 for user 1.............................................................................................................13Figure 2-8 HTA Task 2 for user 2.............................................................................................................14Figure 2-9 HTA Task 2 for user 3.............................................................................................................15Figure 2-10 Proposed HTA Task 2 for user 1............................................................................................17Figure 2-11 Proposed HTA Task 2 for user 2............................................................................................18Figure 2-12Proposed HTA Task 2 for user 3.............................................................................................18Figure 2-13 HTA Task 3 for user 1...........................................................................................................19Figure 2-14 HTA Task 3 for user 2...........................................................................................................20Figure 2-15 HTA Task 3 for user 3...........................................................................................................21Figure 2-16 Proposed HTA Task 3 for user 1............................................................................................23Figure 2-17 Proposed HTA Task 3 for user 2............................................................................................24Figure 2-18 Proposed HTA Task 3 for user 3............................................................................................24
1. Submission 1: User Analysis
1.1.Persona
1.1.1. User Group 1: Student
Nur Irdina binti Ahmad Rifdi is a 20 years old student at the Universiti Teknologi
Malaysia and she also a Computer Science student. She studies in Bachelor of Graphic
and Multimedia Software. The characteristic of her is she was optimistic, active girl and
very passionate in life. Her goals in life are want to keep a balanced social life with
extracurricular activities, graduated with first-class honor, aims to become a lecturer and
to have high speed interne in school area. Motivation of her life is wants to feel good
about herself and live a long life. She also get motivation from her family and friends and
have sufficient studies material and resource provided at campus.
The pains that she faced in her life is she always spend most of the time on studying
and doing assignment and have limited time to enjoy life and entertainment. In addition,
she always faced burden when did assignment because less efficient school internet.
After she become student in UTM, she improved her social circle throughout her
university life. Next, she gain much knowledge regarding on the programming techniques
and technologies. Lastly, she learn a lot of soft skills such as communication skills.
1.1.2. User Group 2: Lecturer
Encik Ahmad Fariz bin Ali is 48 years old and works as lecture in Universiti Teknologi
Malaysia. He has worked as lecturer (DS45) in UTM for the past 18 years and knows it
well. He has unique characteristic which always show enthusiasm when teaching. His
goals as lecturer is to help his students to learn well, to produce a high quality student and
want to keep up in his education and learn through his student. He gets motivation to
teach from students that show deep interest during his teaching lesson and when
conducive teaching environment have.
The pains that he faced as lecturer is he does not want to sacrifice his healthy
habits for a successful career. He also need to deal with the students that unwilling to pay
attention in his class. Then, he needs to do manually to manage students’ attendance and
have insecure attendance system. After became a lecturer, he gains utilize technology to
enhance teaching skills in addition, he can always stay up-to-date to the latest technology.
1.1.3. User Group 2: Staff
Encik Hairudin bin Abdul Majid is 48 years old and works as lecture in Universiti
Teknologi Malaysia. He has worked as lecturer (DS45) in UTM for the past 18 years and
knows it well. He has unique characteristics which always being supportive, patience and
humor. His goals in life are to have a healthy lifestyle, to become more interactive in his
teaching skills and wants to involve in more researches. He gets motivation to teach from
students that show deep interest during his teaching lesson and when his enjoying his
career life.
The pains that he faced are he dealing with health problem, needs to handle with
disobey students. He also need to deal with his massive teaching materials to be prepared.
Then, he needs to do manually to manage students’ attendance and have insecure
attendance system. After became a lecturer, he gains achievement on his research field,
can develop creative designing skills and gets explore lots of knowledge on his
researches.
2. Submission 2: Task Analysis
2.1. Introduction
The application that we are testing is UTM Smart. UTM Smart is built as an initiative
of digital campus lifestyle at UTM, and provide services which complement and facilitate the
needs of students, staffs, and even public users.
UTM Smart help public users that haven’t getting enough information with Freshies’
guide and Residential College. The user can explore the UTM by using location, dining and
shuttle modules that been provided in UTM Smart.
UTM Smart enable staffs and students to record their attendance for events and
lectures through the QR code scanner. To fits the requirement of all user, UTM Smart had
provide specific features for each type of user group. For staff, they able to apply leave on
the go, view personnel record and make payment to specific bills. For lecturer, they able to
respond to student approval and course list. For students, they can done their pre-register
course. Besides, student can check their pre-register course, examination results, financial
status, class attendance and scholarship in UTM Smart.
2.2.Refinement of HTA
2.2.1. HTA for task 1: Record Attendance
2.2.1.1. User 1 – Student
Link video: https://www.youtube.com/watch?v=79Ui3VZxRHk
Textual presentation
0 Record Attendance
1 Log in User ID
2 Select QR scan interface
3 Open camera
4 Scan QR code using QR scan
5 Show record successful message
Diagram Presentation
0 Record Attendance
1 Log in User ID
2 Select QR scan interface
3 Open Camera
4 Scan QR code
5 Show record successful message
Figure 2-1 HTA Task 1 for user 1
2.2.1.2. User 2 – Lecturer
Link: https://www.youtube.com/watch?v=rpQT00soDOw
Textual Presentation
0 Record attendance
1 Press “masuk” interface in iHadir
2 Enter Staff ID
3 Show record successful message
Diagram Presentation
0. Record Attendance
1. Press masuk interface in iHadir
2. Enter Staff ID 3. Show record successful message
Figure 2-2 HTA Task 1 for user 2
2.2.1.3.User 3 – Staff
Link: https://www.youtube.com/watch?v=Zdpcd31IvKE
Textual Presentation
0 Record attendance
1 Press attendance interface in iHadir
2 Enter Staff ID
3 Show record successful message
Diagram Presentation
0. Record Attendance
1. Press attendance interface in iHadir
2. Enter Staff ID 3. Show record successful message
Figure 2-3 HTA Task 1 for user 3
2.2.1.4. Discussion for task 1: Record Attendance
From what we observe from three type of user, we can conclude several problem issue that occur
with this current system. For example, user 1 as students, she finds difficulty to scan the code
because she need to go in front the class to scan the code very well-lit and sharp. Furthermore,
she also need to adjust the distance from the phone to the code as well and the phone need to not
shaky when scanning the QR code.
Upon user 2 as a lecture and user 3 as staff, he takes a different approach from the user 1
which his need to record the attendance using the website ihadir.com. Firstly, he needs to
connect with network of UTM then login the ihadir.com then enter the staff id to record their
attendance. When used the website they should using the UTM network and cannot use their
own internet line.
From what we observe here, the fake attendance issue can occur when using the current
system because the student can snap the code then sent to the absence student at hostel to scan
the code. Next, for the lecture and staff, they can lie their attendance by give their staff id and get
help from their friends to record their attendance even their not attend to work. This is because,
the website ihadir.com just using staff id.
2.2.1.5.Requirement specification for Task 1: Record Attendance
Functional Requirement: face recognition Attendance system
Description: the system should have ability to recognition face of the user to record their
attendance
Justification: the user should setup their database first with UTM before proceed HTA 1
Non-functional requirement: usage of thermal sensor
2.2.1.6. Proposed HTA for Task 2: Check Record Attendance
2.2.1.6.1. User 1: Student
Textual Presentation
0 Record attendance
1 Walk in Faculty or room
2 Show face to camera
3 Compare face image with database
4 Show record was successful message in application
Diagram Presentation
2.2.1.6.2. User 2: Lecturer
Textual Presentation
0 Record attendance
1 Walk in Faculty or room
2 Show face to camera
3 Compare face image with database
4 Show record was successful message in application
Figure 2-4 Proposed HTA Task 1 for user 1
Diagram Presentation
2.2.1.6.3. User 3: Staff
Textual Presentation
0 Record attendance
1 Walk in Faculty or room
2 Show face to camera
3 Compare face image with database
4 Show record was successful message in application
Diagram Presentation
Figure 2-5 Proposed HTA Task 1 for user 2
Figure 2-6 Proposed HTA Task 1 for user 3
2.2.2. HTA for task 2: Check Record Attendance
2.2.2.1. User 1 – Student
Link: https://www.youtube.com/watch?v=O-1A6X4W10A
Textual Presentation
0 Check record attendance
1 Log in User ID
2 Press on attendance interface
3 Select Course and Section
4 List of history attendance
Diagram Presentation
0 Check Record Attendance
1 Log in User ID
2 Press on attendance interface
3 Select Course and Section
4 List of history attendance
Figure 2-7 HTA Task 2 for user 1
2.2.2.2.User 2 – Lecturer
Link video: This task we do not provide the video because the method was same
with the student’s method when they need to check record attendance.
Textual Presentation
0 Check student attendance
1 Take manual attendance from file
2 Check student attendance
Diagram Presentation
0 Check Student Attendance
1 Take manual attendance from file
2 Check student attendance
Figure 2-8 HTA Task 2 for user 2
2.2.2.3.User 3 – Staff
Video Link: This task we do not provide the video because the method was same
with the student’s method when they need to check record attendance.
Textual Presentation
0 Check student attendance
1 Take manual attendance from file
2 Check student attendance
Diagram Presentation
0 Check Student Attendance
1 Take manual attendance from file
2 Check student attendance
Figure 2-9 HTA Task 2 for user 3
2.2.2.4.Discussion for task 2: check record attendance
After all the users had one doing task 2 which checking their history of recorded attendance, we
can observe that there have several problems with the current system. For example, user 1 as
student, she only can see their recorded attendance if they using scanned QR code while if they
used manually, they cannot know their recorded attendance.
For user 2 and 3, they have quite similar problem which whenever they have to check
their student attendance, they need to use manually method which need to take manual
attendance from the file then check student attendance. This will consuming time for the user to
check the attendance of students one by one and calculate statistic of attendance manually. In
addition, it can be worse if the user difficult to find the file. If they still not found the file that
they really need to find, it will make them disappointed and give effect when they writing their
monthly report.
2.2.2.5.Requirement specification for task 2 : check record attendance
Functional Requirement: attendance list
Description: the system should provide the user with the list of presence and absence
student
Justification: the users need to know which student are presence and absent at one time
after HTA 2
Non-functional Requirement: statistics and pie chart of students attendance
2.2.2.6.Proposed HTA for Task 2: Check Record Attendance
2.2.2.6.1. User 1:Student
Textual Presentation
0 Check record attendance
1 Enter user ID
2 Press attendance interface
3 Select course and section
4 Select date
5 List of history attendance
Diagram Presentation
2.2.2.6.2. User 2:Lecturer
Textual Presentation
0 Check record attendance
1 Enter user ID
2 Press attendance interface
3 Select course and section
4 Select date
5 List of history attendance
Figure 2-10 Proposed HTA Task 2 for user 1
Diagram Presentation
2.2.2.6.3. User 3:Staff
Textual Presentation
0 Check record attendance
1 Enter user ID
2 Press attendance interface
3 Select course and section
4 Select date
5 List of history attendance
Diagram Presentation
Figure 2-11 Proposed HTA Task 2 for user 2
2.2.3. HTA for task 3: Payment
2.2.3.1. User 1 – Student
Link: https://www.youtube.com/watch?v=J3eEG7qFJxw
Textual Presentation
0 Payment for charity
1 Log in User ID
2 Select Payment interface
3 Choose Charity interface
4 Select any donation webpage
5 Fill up user information
6 Pay by online banking or card
Diagram Presentation
0 Payment for Charity
1 Log in User ID
2 Select Payment interface
3 Choose Charity interface
4 Select any donation webpage
5 Fill up user information
6 Pay by online banking or debit or credit card
Figure 2-13 HTA Task 3 for user 1
2.2.3.2.User 2 – Lecturer
Link: https://www.youtube.com/watch?v=egBsm8pQxF4
Textual Presentation
0 Payment for charity
1 Log in User ID
2 Select Payment interface
3 Choose Charity interface
4 Select any donation webpage
5 Fill up user information
6 Pay by online banking or card
Diagram Presentation
0 Payment for Charity
1 Log in User ID
2 Select Payment interface
3 Choose Charity interface
4 Select any donation webpage
5 Fill up user information
6 Pay by online banking or debit or credit card
Figure 2-14 HTA Task 3 for user 2
2.2.3.3.User 3 – Staff
Link: https://www.youtube.com/watch?v=9-dGSR6DZyo
Textual Presentation
0 Payment for charity
1 Log in User ID
2 Select Payment interface
3 Choose Charity interface
4 Select any donation webpage
5 Fill up user information
6 Pay by online banking or card
Diagram Presentation
2.2.3.4.Discussion for task 3: Payment
0 Payment for Charity
1 Log in User ID
2 Select Payment interface
3 Choose Charity interface
4 Select any donation webpage
5 Fill up user information
6 Pay by online banking or debit or credit card
Figure 2-15 HTA Task 3 for user 3
From the task 3 given to the 3 different group of users, we realized that the three
categories, students, staff and lecture have faced the same problem when do the payment for
charity using the UTMSmart. From this observation, we observed that 3 users need to log in
using their UTM id and password then select the event that they want to donate. After that,
they need to fill up their information first then choose payment method. If they using fpx
method, the application will connect to the website bank to continue the payment. In this
scenario, we discover the payment task problems is the user needs to do more subtasks. It
makes troublesome for the users to complete their payment for the donation. So, we are
trying to come out with a solution to solve this problems.
2.2.3.5.Requirement specification for task 3: Payment
Functional Requirement: e-wallet
Description: the system should provide the user with balance of their money like e-
wallet without to connect with the website of online banking except when to top up their
balance.
Justification: the user does not need to connect with online banking after they choose
any donation, HTA 4
Non-functional Requirement: photo of payment
2.2.3.6.Proposed HTA for Task 3:Payment
2.2.3.6.1. User 1: Student
Textual Presentation
0 Payment
1 Select item to purchase
2 Sum up total
3 Capture face image
4 Compare face image with database
5 Confirmation of purchasing
6 Receipt
Diagram Presentation
2.2.3.6.2. User 2: Lecturer
Textual Presentation
0 Payment
1 Select item to purchase
2 Sum up total
3 Capture face image
4 Compare face image with database
5 Confirmation of purchasing
6 Receipt
Figure 2-16 Proposed HTA Task 3 for user 1
Diagram Presentation
2.2.3.6.3. User 3: Staff
Textual Presentation
0 Payment
1 Select item to purchase
2 Sum up total
3 Capture face image
4 Compare face image with database
5 Confirmation of purchasing
6 Receipt
Diagram Presentation
Figure 2-17 Proposed HTA Task 3 for user 2
Figure 2-18 Proposed HTA Task 3 for user 3