Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 55 Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native Ahmad Habib1, Moch. Dzawil Haiat2, Balok Hariadi3 Informatics Engineering, University of 17 Agustus 1945 Surabaya habib@untag-sby.ac.id Abstract — Hero Web Design is a small- scale company that is growing, the company is engaged in technology. Attendance activities at Hero Web Design still use the conventional method, every day employees carry out attendance activities manually. This results in fraud, loss, and damage to the processed data because they are not integrated. As a result, with the emergence of these problems the company could not develop. With the problems that Hero Web Design has, here an online attendance information system is made with a QR-Code and face detection using the Scrum method. In this study using the Scrum method using 3 Sprints, each Sprint has a process of not more than one month. The data sources used in this study are observational data in the form of attendance management activities and report management. The second data source is interview data in the form of an answer from a question-and-answer discussion with Hero Web Design. The third data source is literature study data in the form of supporting journals that have similar research. A website-based attendance management information system with a program working process using the PHP programming language, javascript, CSS, and bootstrap framework. The results of the information system that has been created will be tested using the black box method. This method aims to check for missing or incorrect functions, interfaces, performance, program initialization and output errors, data structures, or database access errors. Furthermore, from making this system, it is hoped that it can be used as a remote or online attendance without having to come face to face and overcome the problems found in Hero Web Design. Keywords — Attendance, Quick Response Code, Employee, Information System I. INTRODUCTION The increasingly advanced information technology and its demands have created a situation that has forced many companies to be more computerized, especially in systems attendance at the company Web design heroes. Hero Web Design yourself is a small company which currently growing. Based on interviews that have been done with sources. Web Design Hero of the moment this still operate attendance system that is still implementing manual attendance i.e. write the paper and still do profession by stare face, Attendance can be said to be an attendance data collection which is part of the reporting activities that exist within an agency[1]–[4]. Attendance is arranged and arranged so that it is easy to find and use when needed by interested parties, while during the coronavirus pandemic this is not recommended for doing work by stare face and enforcing WFH (Work from Home) There is an attendance technique that is done manually, starting with data collection and calculating time attendance. This timeout affects a relatively long time in the calculation technique[3]. Employee attendance records and hard copy reports cause data recording errors, making data difficult to find and fear of losing employee attendance data[2]. So the solution given to overcome this problem is to design and make a web-based attendance system by utilizing a quick response code, The system also uses the camera on a laptop or mailto:habib@untag-sby.ac.id Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 56 computer to take pictures as Proof presence and system using Language level tall that is PHP programming. with help bootstrap framework, CSS for beautify website display, and the help of the javascript library[5], [6]. Already there are several application attendance employees from the study before among others are multi-event attendance with QR Code based on restful web service as generated study give solution problem at the moment sending data in time area attendance no there is an internet and can use multi- activity attendance and can do attendance outside the institutional area, however, study this own weakness that is security in do attendance still can be hacked because only depend on QR Code course[7]–[10]. Study makes application attendance mobile-based with intranet and IMEI network filters that take advantage of reading IMEI and do restrictions the existing intranet network at the institution but attendance on research this own weakness that is no can-do attendance outside institutions, and security still can hac. Study make application presence student based on Radio Frequency Identification (RFID ) that makes use of RFID technology that can detect tool or thing that has RFID technology only with stick it on the tool attendance, but in research, it also has the weakness that is system attendance no can do online, security system attendance still can be hacked because only use RFID card[11]. Based on studies before and problems that occur in Hero Web Design, researchers propose making system information management presence employees using a website based System information is the system in organization influence processing interest transaction every day, support operations, including management and activity essential organization, as well as needed by a party outside certain through provision report[8], [12]. System they could record attendance data employee, arrival time or beginning attendance, time to go home or end of working hours, which will be made automatically systematic and computerized with method quick response code for page security first attendance whereas for security second use facial recognition method, so that will eliminate the process of recording employee attendance that has been walking manually and can Upgrade system security attendance at Hero Web Design. As for making Website Based Employee Attendance Management Information System with QR Code using the system development method, namely the Scrum Method[6]. The reason for using the quick response code is for an economical cost because the company small no need to use access cards. After all, tools and access cards are expensive unless large companies already have adequate operating costs[7]. So only need saved on the smartphone and print the code already enough could be used by employees for scanned and because with this, only ni p employees are needed to make attendance by going through a quick response code scan on the quick response code scanner or can with camera computers and laptops are solutions that utilize information technology that can accommodate the process of recording attendance data so that recapitulation can be carried out more quickly and accurately, the application of attendance using a quick response code is a solution to problem- solving attendance data processing and has the advantage of being able to take attendance quickly, precisely and accurately[12]. Scrum is a framework that works for completing complex jobs and is always changed. Method Scrum in implementation not only as a model for development device soft will but more to management development device soft so that the project manager, Scrum Master, and the team involved could by easy control existing tasks, so that performance becomes more fast and efficient[13]. On workmanship study, this Besides use method scrum will also explain the steps processing other, start from the process of Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 57 analysis, planning, construction that uses application web-based, up to stages implementation with using UML (Unified Modeling Language), with make Use Case diagrams, Sequence diagrams, class diagrams, and output, for know what data just be input and output[2], [6], [8], [14]. II. METHOD 1. Data processing In assessment, this is needed the evidence as well as information as materials that can help authenticity Theory description as well as discussion[11], [15]. Data processing carried out by researchers is as follows.  Interview, that is technique collection proof with use method ask answer by direct to related sources. In the interview, use got evidence, submitted questions based on notes important that have prepared the author. In regarding this do it answers several employees and leaders of Hero Web Design company, namely J. Satria Nugraha. With how to do this interview expected could get clarity.  Observation is one technique for collecting enough facts effectively. The researcher does an observation with method monitor as well as observe by direct activities on Jl. Bulak Bull New Orchid Gang Number 40, Surabaya which is concerned about technique making system attendance and looking for correlated information with system attendance use QR Code.  Literature Studies, namely literature search, reference originated from sourcebooks, journals, experts nor from results study before where aim in stringing base theory that has been applied in do related research. 2. Design Scrum According to the developed Scrum model deftly. This is methodology or plan work arranged to use develop the complex product. Scrum set approach literature as well as sustainable to use optimizing predictability as well as control risk. Scrum is one agile technique that is very iterated. This is methodology adaptive, repeatable, reliable, flexible, and effective designed to use provide great value with reliability in all projects. Scrum ensures transparency communication as well as creates an environment not quite enough answer together as well as progress sustainable[2], [9], [16]. Scrum involves three-party: Product Owner, Scrum Master, and Scrum Team.  Product Owner Product Owner responsible answer to use determination specification nor technique business from an application that you build. Owner product includes all condition main must be fulfilled team (Product Backlogs).  Scrum Master Scrum Master is managing section technique Scrum for the whole project. Scrum Master presents as well as operate method work Scrum for your team as well as ensure that everyone on the project you use technique Scrums.  Scrum Team Scrum Team is a team analysis business, analysis systems, developers, testers, as well as others who lead the projects. Scrum Team responsible answer to use complete Backlog Products compiled by the owner product[17]. Figure 1. Scrum Technique Following this is an explanation from the stage’s method Scrums. 1. Product Backlog: Prioritize work in sprints. Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 58 2. Sprint planning meeting: All teams unite to use analyze the profession. This technique is very important before you run or do sprints. 3. Daily stand-up meeting: Assess Duty work team and its flaws. This technique is in progress every day in time 15 minutes during sprints. 4. Sprint review: Every member team show Duty which is resolved During the sprint period. Running sprint review after every sprint finished.  Sprint Retrospective: Phase this, done at each final sprint, allows all member teams to give bait back and review performance while applying technique Scrums. The researcher set Scrum as a plan in making a data system. After finding the information needed from Hero Website Design after that next past application method is Scrum on build system information. Following picture the flow. Figure 2Implementation Flow Scrum Stages first in accordance plot implementation Scrum on is decide Product Backlog, Product Backlog is notes needs something finished product priority main[18]. it will be a Product Backlog from a system that will build as follows: Table 1Product Backlog description Backlog Interest (1-100) Identify client programs 100 design draft start of the program 100 Database design 100 Creating a landing page 80 Writing code for admin 100 Writing code for employee 100 3. Scenario Test System test attendance employees use Black Box. Black Box is a test based on specifications application as interface application, the features that exist in the application, as well as coherence desired by the customer. design created apps later will issue output in the form of attendance data and reports attendance employees[5], [19], [20]. Figure 3 Scenario Blackbox Test III. RESULT AND DISCUSSION 1. Stage design System A. System Analysis Procedure system attendance current employee running on Hero Web Design as follows:  An employee comes to the company  Employee do attendance with method write in the book attendance already provided by Pham company  Admin check attendance the  Admin saves data to report B. Needs Analysis Needs analysis or interest user system information attendance employee with QR- Code on Hero Web Design includes administrator's interests and interests’ employees, can explain as follows:  Admin 1. Administrators can operate login 2. Administrators can control Home 3. Administrators can control job data 4. Administrators can control employee data 5. Administrators can control attendance data employee Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 59 6. Administrators can control report  Employee 1. The employee could run Login 2. Employees could look at the dashboard 3. The employee could do roll call enter 4. The employee could do roll call goes out 5. Employees could look recap roll call As for analysis needs system in system information attendance employee with QR- Code namely :  Employees do attendance with scan the quick response code on the page first then followed by a facial scan or detection face for ensuring that truly employee they do roll call enter if I succeeded so roll call enter will save in recap attendance and database. If employees will return or online working hours already finished so the employee does scan quick response code then followed with facial scan or detection face after its attendance data go out will succeed saved.  Administrators as well employees must log in first before to use can enter to application system attendance employee with method enter username and password.  administrators & employees must logout and resolved the use of implementation system attendance employees. C. Use case diagram design In figure 5 the administrator use case explains that administrators can interact with various use cases as home, manage data with 2 data in it namely employee data and position data, then attendance data as well as a report that will be printed from attendance data. And also admin can manage data, such as delete, add, and update the data[21]. Figure 4Administrator use case diagram In figure 6 use case employee explains that the employee could interact with various use cases as does attendance good that attendance enter or attendance go out with use to scan the quick response code, then could check history from roll call employee that. Employees could interact with use cases other provided employees already interact with Login use cases. Figure 5Employee Use case Diagram 2. Stage Implementation Scrum Study this use method Scrum consisting of from three sprints based on Product Backlogs that have been made before. Below is the description from every sprint. A. Sprint 1  Sprint planning The results of the Sprint 1 design are : Time : 3 weeks Purpose: planning draft system beginning From Sprint planning generated the 1st Sprint Backlog as follows: Table 2Sprint Backlog 1 Spri nt Stag e Task Task Details Estimat ed ( days ) Spri nt 1 Identificat ion system client 1. Activity techniqu e roll call enter 3 Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 60 Spri nt Stag e Task Task Details Estimat ed ( days ) 2. Activity techniqu e roll call goes out 3. attendan ce techniqu e other informat ion 4. Report techniqu e design draft system 1. Use case diagram s 2. Activity diagram s 3. Sequenc e diagram s 8 Database design Making table database table 10  Daily Scrum Something session meeting short daily in limitation time 15 minutes where at the meeting the discuss or share information by fast about development current product done or already worked on.  Sprint Scrum 30 days Meeting or meeting monthly for reviewing the Sprint Backlog products that have been solved and could be evaluated to use Upgrade next Sprint job. B. Sprint 2  Sprint planning Design results Sprint 2 is: Time: 3 weeks Purpose: make admin page From Sprint planning generated Sprint 2nd backlog as follows: Table 3Sprint Backlog 2 Stage s Sprin t Task Task Details Estimate d ( days ) Sprin t 2 Creatin g a landing page Make a page beginning before login to the system 3 Writing code admin page 1. Creating a Login Feature for some users including admin and employe es 2. admin dashboar d 3. Make user data features, including employe e CRUD, admin, and managin g automati c making QR-Code 4. Make CRUD feature of position data and attendan ce data 18 Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 61 Stage s Sprin t Task Task Details Estimate d ( days ) 5. Make feature report  Daily Scrum Something session meeting short daily in limitation time 15 minutes where at the meeting the discuss or share information by fast about development current product done or already worked on.  Sprint Scrum 30 days Meeting or meeting monthly for reviewing the sprint backlog products that have been solved and could be evaluated to use upgrade next Sprint job. C. Sprint 3  Sprint planning The results of the Sprint 3 design are: Time: 3 weeks Purpose: make admin page From Sprint planning generated Sprint 3rd backlog as follows: Table 4Sprint Backlog 3 Stage s Sprin t Task description Task Estimat ed ( days ) Sprin t 3 Writing code on the system that will use employ ee 1. Dashboa rd employee 2. Creating a history menu roll call 3. Create and serve feature attendanc e sign-in, attendanc e exit, 22 Stage s Sprin t Task description Task Estimat ed ( days ) and absence of other informati on on the page dashboar d employee 4. Scan QR -Code and Detect face on features attendanc e 5. Make account edits to employee  Daily Scrum Something session meeting short daily in limitation time 15 minutes where at the meeting the discuss or share information by fast about development current product done or already worked on.  Sprint Scrum 30 days Meeting or meeting monthly for reviewing the Sprint Backlog products that have been solved and could be evaluated to use Upgrade next Sprint job. 3. Stage design Device Soft A. Class Diagram The class diagram describes description or picture class, property, as well as to object beside relationship one each other like inheritance, content, association, etc. Class diagrams can also be considered as database configuration with several tables in a mutual database correlated. Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 62 Figure 6. Class Diagram Design B. Object diagrams Object diagrams are often called instant charts because they are so similar to class diagrams[18]. The object diagram also shows a connection between objects, while the object diagram uses real-world examples. Figure 7. Object Diagram Design C. Sequence Diagram A Sequence diagram is a diagram that shows interaction dynamics Among several objects. Regarding this used to use serve groove message sent between something object, as well as interaction in Among object. Something happened in some points certain on execution system[18].  Sequence Diagram Login Figure 8 explains about Sequence diagram design for all actors i.e. admin and employees do login to in the web. Figure 8. Sequence Diagram Login  Sequence Diagram Manage Data Figure 9 explains about Manage data flow that has plot add data, view data, edit data for a change current data entered there are data errors, and delete data. Figure 9. Sequence Diagram Manage Data  Attendance Diagram Sequence Employee Picture 10 explain about attendance chart flow employees who have a plot of the actor login then succeed enter into the page dashboard, choose roll call for start roll call with prepare QR-Code after QR-Code scan complete so next will go out Detection face and if valid then will automatically Return to the user dashboard and the user can look history attendance. Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 63 Figure 10. Attendance Diagram Sequence Employee  Sequence Diagram Add Account Figure 11 explains about plot add data of employees who have a plot with admin already have employee data, then enter the data in a past form system process the data and succeed add employee data Figure 11. Sequence Diagram Add Account  Sequence Diagram Data and Reports Attendance Figure 12 explains about attendance chart flow employees who have a plot of the actor login then succeed enter into the page dashboard, choose roll call for start roll call with prepare QR-Code after QR-Code scan complete so next will go out Detection face and if valid then will automatically Back to user dashboard and users can look history attendance. Figure 12. Sequence Diagram Data and Reports Attendance D. Interface Design  Admin Page On the admin page, there are some menus already made and will show namely, dashboard menu, admin data, employee data, position data, attendance data, and reports attendance. 1. Dashboard Menu Dashboard menu is the menu for showing page main from the admin which contains information at a glance about the amount of data on the other menu. Figure 13. Admin Dashboard Page 2. Admin Data Menu The admin data menu is a menu that displays a page containing admin account data, in this menu, you can also add, change, and delete data. All admin data will be managed on this menu with good passwords, emails, and others. Figure. Admin Data Page Figure 14 is the appearance admin data menu page. On the page then there is the table containing admin account data and admins can do add data on the page after the push knob add data will modal appears with an empty form inside it the as image 15. Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 64 Figure 14. Add Admin Data On the admin data menu page other than adding data, the page can also change admin data. As case add data, for change data must push knob with picture pen so that the form containing the data has been stored will appear and get changed, like picture 16. Figure 15. Edit Admin Data Then for how to delete admin data same with change starting data from push knob delete it on the action field will appear information related to admin data that you want deleting as image 17. Figure 16. Delete Admin Data 3. Employee Data Menu Employee data menu is a menu whose page contains a table of all account employees who have feature add, edit and delete data. On this menu, all employee data could be managed by administrator actors who have access to the admin page and manage all account or employee data. Figure 17. Employee Data Page employee data menu there is knob add employee data if clicked will raise a modal containing an empty form for filled with the data already there is as picture 19. Figure 18. Add Employee Data Besides feature add employee data, can also change employee data. As the case feature adds data, for change data must push knob with picture pen so that the form containing the data has been stored will appear and get changed, like figure 20. Figure 19. Edit Employee Data Then for deleting employee data the method same as changing employee data starting from the push knob delete it on the action field will appear information related to admin data that you want deleting as image 21. Figure 20. Delete Employee Data 4. Position Data Menu A job data menu is a menu whose page contains a position or a position that is in a company as well as its feature for adding, changing, delete job data. Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 65 Figure 21. Position Data Page job data menu there is knob add job data if clicked will raise a modal containing an empty form for filled with the data already there is as image 23. Figure 22. Add Position Data Besides could add job data, on the job data menu you can also change job data. For a change, data must push knob with picture pen so that the form containing the data has been stored will appear and get changed, like image 24. Figure 23. Edit Position Data Then for deleting job data the method same as changing employee data start from the push knob deleting it on the action field then will appear information related to admin data that you want deleting as image 25. Figure 24. Clear Position Data 5. Menu Data Attendance The attendance data menu is a menu whose page contains about attendance data table employee, from attendance sign-in, attendance exit, nor attendance description another. The attendance data menu also has features to add, change, and delete attendance data. Figure 25. Attendance Data Page attendance data menu there is knob add attendance data if clicked will raise a modal containing an empty form for filled with the data already there is as image 27. Figure 26. Add Attendance Data Besides could add attendance data, on the attendance data menu you can also change attendance data. For a change, data must push knob with picture pen so that the form containing the data has been stored will appear and get changed, like image 28. Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 66 Figure 27. Delete Attendance Data 6. Report Menu Attendance Report menu attendance is a menu that contains attendance data that is equipped with a feature print report. The feature was useful for making reports from attendance data. How to run feature the that is, with fill out the date input form then push the “Print” button and will print a report with pdf format like Figure 29 and Figure 30. Figure 28. Report Page Attendance Figure 30 is an appearance from results downloads attendance data employees on the admin page. On view report attendance employee this there is information about when who, attendance status employees. Figure 29. Appearance Report Attendance 7. Settings menu The Settings menu is a menu that contains time attendance data. The menu works for changing attendance clock data but in the settings menu only one own feature change data or edits attendance clock data. The following picture how it looks. Figure 30. Settings Menu Page The settings menu also has feature change data. The feature change time attendance data, for change attendance clock data, need push knob pictorial pen so will a modal appears containing the data form that has been there being. Figure 31. Edit Time Attendance Data  Employee On page employee, there are some menus already made and will show namely, the dashboard menu, the account menu for employees, and history attendance. 1. Dashboard Dashboard menu is a menu containing feature attendance, ok attendance sign-in, attendance exit, nor attendance description another. this menu is the main menu from page employees because of this menu there is a feature attendance will be used by employee’s good attendance exit, enter, or attendance description another. Figure 32. Employee Home Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 67 On the dashboard page if you Press the “ Enter Attendance ” button so will lead to the QR-Code page to scan the code you have every employee as image 34. Figure 33. Employee QR-Code Scan page After scanning the QR-Code and the results are valid they will appear next button, if pressed so will carry on to the page detection face. Same thing with QR-Code scan page if felt face suitable or valid then will appear next button for save attendance data and will direct return to dashboard page like image 35. Figure 34. Detection Page Face Employee If the button permission or no present is pressed on the dashboard page then on the page detection face if valid and pressed next button will appear modal with the form that will be filled according to available data employee as figure 36. Figure 35. Attendance Data Input Page Other Description 2. History Attendance History menu attendance is a menu whose page contains attendance data from each employee alone. On the history menu attendance only could view attendance data without can change and deleting the data as the picture brought this. Figure 36. History Page Attendance Employee 3. Account Menu Account menu is a menu whose page contains information on account employees like name, email, photo profiles, passwords, and others. this menu owns feature change data for the details as in picture 38. Figure 37. Employee Account Menu Page To change the data on the account menu should enter to account menu page, then push the knob with a picture pen for raises a modal that contains a form with data already stored as image 39. Figure 38. Edit Account Data Employee 4. Stage Test System A. Admin For testing, system administration uses the testing method Blackbox which will test features from the design. There are several Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 68 the test that will do on menus and features owned by admin actors such as table following: Table 5. Stage Admin Login Menu Testing Test goal Login as admin Condition beginning Admin is on page beginning descripti on Test Scenario Expecte d results Status Usernam e and passwor d 1. Log in to page admin login 2. Enter userna me and passw ord 3. Push the " Login " button Conditio n after is lead to the page admin dashboa rd Valid Table 6 is tabling the test that will test the admin data menu in the menu on several features namely: add, delete, view, and change admin data. Table 6. Stage Admin Data Menu Testing Test goal the admin data menu admin data -Edit admin data -Delete admin data Condition beginning Admin is on the admin dashboard menu or page dashboard descript ion Test Scenario Expect ed results Status Name, usernam e, passwor d, name, email contact, photo 1. Log in to the admin data menu page 2. Push knob add data 3. Enteri ng input data on a blank form 4. Push knob save Admin can enter to admin data menu page and add admin data Valid Name, usernam e, passwor d, name, email contact, photo 1. Log in to the admin data menu page 2. Push- button edit data contai ned in the table action field 3. Make edits to the existi ng input data stored Admin can change and save admin data Valid Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 69 4. Push knob Updat es - 1. Log in to the admin data menu page 2. Push knob delete the one in the table action field 3. Push knob delete Admin can delete admin data Valid Table 7 is tabling the test that will test the employee data menu in the menu own several features namely: add, delete, view, and change employee data. Table 7. Stage Employee Data Menu Test Test goal -Enter the Employee data menu. - Add employee data -Edit employee data - Delete employee data Condition beginning Admin is on the Menu page main admin descriptio n Test Scenario Expect ed results Stat us Name, username, password, nip, 1. Log in to the emplo Admin can enter to Vali d address, place birth, date born, type gender, telephone, position, email, photodetect ion, QR Code, active yee data menu page 2. Push knob add data 3. Enteri ng input data on a blank form 4. Push knob save emplo yee data menu page and add emplo yee data Name, password, address, place birth, date born, type gender, telephone, position, email, photodetect ion, active 1. Log in to the emplo yee data menu page 2. Push- button edit data contai ned in the table action field 3. Make edits to the existi ng input data stored 4. Push knob Updat es Admin can change and save emplo yee data Vali d - 1. Log in to Admin can Vali d Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 70 the emplo yee data menu page 2. Push knob delete the one in the table action field 3. Push knob delete delete emplo yee data Table 8 is tabling the test that will test the job data menu in the menu own several features namely: add, delete, view, and change job data. Table 8. Stage Testing Position Data Menu Test goal job data menu -Add job data -Edit job data -Deleting job data Condition beginning Admin is on the Menu page main admin descripti on Test Scenario Expect ed results Stat us Name 1. Log in to the job data menu page 2. Push knob add data 3. Enterin g input Admin can enter to job data menu page and add job data Vali d data on a blank form 4. Push knob save Name 1. Log in to the job data menu page 2. Push- button edit data contai ned in the table action field 3. Make edits to the existin g input data stored 4. Push knob Updat es Admin can change and save job data Vali d - 1. Log in to the job data menu page 2. Push knob delete the one in the table action field 3. Push knob delete Admin can delete job data Vali d Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 71 Table 9 tables the test that will test the attendance data menu in the menu own several features namely: add, delete, view, and change attendance data. Table 9. Stage Attendance Data Menu Test Test goal attendance data menu -Adding attendance data -Edit attendance data -Delete attendance data Condition beginning Admin is on the Menu page main admin descripti on Test Scenario Expect ed results Stat us Name 1. Log in to the attenda nce data menu page 2. Push knob add data 3. Enterin g input data on a blank form 4. Push knob save Admin can enter to job data menu page and add attenda nce data Vali d Name 1. Log in to the attenda nce data menu page 2. Push- button Admin can change and save attenda nce data Vali d edit data contain ed in the table action field 3. Make edits to the existin g input data stored 4. Push knob Update s - 1. Log in to the attenda nce data menu page 2. Look for knob delete the one in the table action field 3. Push knob delete Admin can delete attenda nce data Vali d Table 10 tables the test that will test the report menu attendance in the menu own several features namely: determine the period desired date and print report. Table 10. Stage Testing Report Menu Attendance Test goal -Enter the attendance report menu Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 72 -I made report attendance Condition beginning Admin is on the admin dashboard menu or page dashboard descript ion Test Scenario Expect ed results Stat us Date start, date end 1. Log in to report menu page attenda nce 2. Fill in the input form with the date 3. Push the "print " button 4. Downl oad report data Admin can enter to report menu page attenda nce and make report attenda nce Vali d On the table test, 11 is testing the logout menu where when the admin is logged in and leads to page main admin as well manage the data, then the admin can go out from page the with method push logout button. Table 11. Stage Testing the Admin Logout Menu Test Purpose admin can logout Initial Condition admin is on the main page Input Data Procedur e testing Expecte d results Statu s - 1. Log in to page main admin 2. Press the “Sign out” button in the sidebar below the Photo profile 3. push the "Sign Out" button 4. Lead to the page admin login admin can log out of the system and redirect to the page admin login Valid In table 12 are Step testing for settings menu time attendance where on the menu the admin can change time data according to the correct data and can keep changes to the data. Table 12. Stage Time Setting Menu Test Test goal -Log in to the time setting page - Change time attendance - Save change time attendance Condition beginning admin is on page main descript ion Test Scenario Expecte d results Status Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 73 Hours in, hours out. 1. Log in to page main admin 2. Push knob with 3-line symb ol in the corne r right on 3. Push settin gs menu 4. Log in to page settin gs 5. Push knob with symb ol pen 6. Chan ging the time data alread y stored 7. Push knob save Admin can change and save time data attendan ce Valid B. Employee For testing, system administration uses the testing method black box which will test features from the design. There are 10 tables the test that will do in test some menus and features made for employees. Table testing is as follows: Table 13. Stage Employee Login Menu Test Test goal Login as employee Condition beginning The employee is on the page beginning descripti on Test Scenario Expecte d results Stat us Usernam e and passwor d 1. Log in to page login employ ee 2. Enter userna me and passw ord input data 3. Push the " Login " button The employ ee could enter to page main or employ ee dashboa rd Vali d Table 14 is testing feature attendance enter with stages in detail as follows. Table 14. Stage Testing Attendance Sign In Test goal -Log in to page dashboard - Do attendance enter Condition beginning The employee is on the dashboard menu page descript ion Test Scenario Expect ed results Stat us Name, nip, position, time of entry, attendan 1. Log in to page dashbo ard Employ ee enter to page dashbo ard then Vali d Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 74 ce, and status 2. Push- button " Attenda nce Login" passwo rd 3. Log in to QR - Code scan page and if QR- Code is valid then will appear "Next" button 4. Push the Next button 5. Log in to page detectio n face and if the face is valid then will appear " Attenda nce " button 6. Push the " Attenda nce " button push knob roll call to enter then enter to QR- Code scan page after invalid then enter to page detectio n face and after valid then attenda nce enter has saved In table 15 are testing feature attendance goes out with stages in detail as follows. Table 15. Stage Attendance Feature Test Go out Test goal -Log in to page dashboard - Do attendance go out Condition beginning The employee is on the dashboard menu page descript ion Test Scenario Expect ed results Stat us Name, nip, position, time out, attendan ce, and status 1. Log in to page dashbo ard 2. Push- button " Attenda nce Login" passwo rd 3. Log in to the QR- Code scan page and if QR- Code is valid then will appear "Next" button 4. Push the Next button 5. Log in to page detectio n face and if the face Employ ee enter to page dashbo ard then push knob roll call goes out then enter to QR- Code scan page after invalid then enter to page detectio n face and after valid then attenda nce enter has saved Vali d Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 75 is valid then will appear " Attenda nce " button 6. Push the " Attenda nce " button Table 16 is testing feature attendance other details with stages in detail as follows. Table 16. Stage Attendance Feature Test Other Description Test goal -Log in to page dashboard - Do attendance other information Condition beginning The employee is on the page beginning descripti on Test Scenario Expecte d results Stat us Name, ID, position, time of entry, reason, photo informati on, attendan ce, and status 1. Log in to page dashbo ard 2. Push " No " button Present / Attend ance ” passwo rd 3. Log in to the QR- Code scan page The employe e could do an attendan ce descripti on. Vali d and if QR- Code is valid then will appear "Next" button 4. Push the Next button 5. Log in to page detecti on face and if the face is valid then will appear " Attend ance " button 6. Push the " Attend ance " button 7. Enterin g the input data already there is 8. Push knob save In table 17 are table account menu test employees who have feature changes and save employee data such as name, password, picture Photo profile, email, and more. Table 17. Stage Employee Account Menu Testing Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 76 Test goal -Log in to the employee data edit page - Change account data employee - Save employee data changes Condition beginning The employee is on the page beginning descripti on Test Scenario Expect ed results Stat us Name, password , address, place birth, date birth, telephon e, position, email, photo employe e 1. Log in to page dashbo ard 2. Push knob with 3line symbol in the corner right on 3. Pressin g the account menu profile 4. Log in to account edit page employ ee 5. Push knob with symbol pen 6. Changi ng existin The employ ee could edit data and save account data employ ee Vali d g data stored 7. Push knob save On the table test, 18 is the history menu test roll call from actor employees, where actor employees could look at recap attendance already once done. Table 18. Stage History Menu Test Roll Call Employee Test goal -Log in to page history attendance - view attendance data Condition beginning The employee is on the page beginning descripti on Test Scenario Expect ed results Stat us - 1. Log in to page history attenda nce 2. Look at history roll call The employ ee could view historic al data roll call Vali d On the table test, 19 is employee logout menu testing, where the moment employee already does attendance enter, exit, or other information then can direct use the logout menu to out from system information attendance that. Table 19. Stage Employee Logout Menu Test Test Purpose employees can log out Initial Condition employees are on the main page Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 77 Input Data Procedur e testing Expect ed results Status - 1. Log in to page main employ ee 2. Press the “Sign out” button in the sidebar below the Photo profile 3. push the "Sign Out" button 4. Lead to page login employ ee employ ees can log out of the system and direct to page login employ ee Valid IV. CONCLUSION 1. Conclusion As for the conclusion ! from the report "Design and Build System Information Based Employee Attendance Management Website With Qrcode And PHP Native On Hero Web Design, namely:  System information management attendance employee website -based with QR code makes it easy employee for the present with fast and reduce fraud, loss, and damage caused by system Hero Web Design manual attendance.  Development system information management attendance employee based on a website that provides a QR code use method Scrums. Usage Scrum more dynamic as well as results implementation Scrum in Case this look at system generated. So you can apply Scrum to make a suitable system for your needs.  Testing use method black box, device soft detect feature as feature no valid or lost, error interface, $ data structure and error database access external, error performance, error initialization, error shutdown, and automatically functional return expected results. 2. Suggestion design system information attendance based on this website middle own much weakness good for Writer nor for hero web design. because of it, the Writer advises repair study such as:  Expected participation from Hero Web Design for the future come could maintain and renew the system taking attendance presence employee this.  Could combine with tool attendance so that moment attendance data collection is more accurate.  System attendance could be opened and used although no internet.  System attendance could do through a smartphone REFERENCES [1] Z. Rusdi, W. Wasino, C. Lubis, and J. Praganta, “IMPLEMENTASI SISTEM INFORMASI PENGGAJIAN KEPEGAWAIAN BERBASIS WEBSITE PADA KANTOR DESA SUKAMEKAR BEKASI JAWA BARAT,” Pros. SENAPENMAS, 2021, doi: 10.24912/psenapenmas.v0i0.14980. [2] D. D. S. Fatimah, A. Sutedi, M. S. Hidayat, and L. Fitriani, “Design of employee presence system using Radio Frequency Identification technology,” IOP Conf. Ser. Mater. Sci. Eng., vol. 1098, no. 3, 2021, doi: 10.1088/1757-899x/1098/3/032105. [3] Tukino, “Audit System Informasi Absensi Pada PT Multi Engineering Perkasa Dengan Metode Framework Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 78 Cobit,” Digit. Zo. J. Teknol. Inf. dan Komun., vol. 12, no. 2, 2021, doi: 10.31849/digitalzone.v12i2.6676. [4] Q. Aini, Y. I. Graha, and S. R. Zuliana, “Penerapan Absensi QRCode Mahasiswa Bimbingan Belajar pada Website berbasis YII Framework Application Student Attendance QRCode in Guidance Learn to Website Based on Yii Framework,” J. Ilm. SISFOTENIKA, vol. 7, no. 2, 2017. [5] Z. Lv, R. Lou, H. Feng, D. Chen, and H. Lv, “Novel Machine Learning for Big Data Analytics in Intelligent Support Information Management Systems,” ACM Trans. Manag. Inf. Syst., vol. 13, no. 1, 2022, doi: 10.1145/3469890. [6] I. R. Putra and M. R. Ridha, “ANALYSIS AND DESIGN OF Q- STORE MARKETPLACE CASE STUDY OF TEMBILAHAN,” J. PERANGKAT LUNAK, vol. 2, no. 1, 2020, doi: 10.32520/jupel.v2i1.873. [7] Q. D. Le, T. T. C. Vu, and T. Q. Vo, “Application of 3D face recognition in the access control system,” Robotica, 2021, doi: 10.1017/S0263574721001739. [8] R. Parlika, R. Sandyca, B. Andreanto, M. Ihsanur, and A. Fahri, “Implementasi Otentikasi Dengan Teknologi QR-Code Berbasis Android Menggunakan CodeIgniter Dan React Native,” e-NARODROID, vol. V, no. 2, 2019. [9] L. Kartika and Y. Yudi, “Rancang Bangun Aplikasi Penyembunyian Pesan QRCode Dengan Menggunakan Metode Caesar Cipher Berbasis Android,” J. Mhs. Fak. Tek. dan Ilmu Komput., vol. 1, no. 1, 2020. [10] Sasmito Bagus Sumadyo and Suprianto, “Temple Encyclopedia Application Based on Android (East Java Temple Case Study),” Procedia Eng. Life Sci., vol. 1, no. 1, 2021, doi: 10.21070/pels.v1i1.832. [11] A. N. Sari and T. G. Abdillah, “Metode Absensi Mahasiswa berbasis QR Code dan Time-Based One-Time Password,” J. Inform. Polinema, vol. 7, no. 2, 2021, doi: 10.33795/jip.v7i2.492. [12] S. Wu, “Intelligent Communication Management Terminal in the Construction of Human Resource Management Mode,” Wirel. Commun. Mob. Comput., vol. 2021, 2021, doi: 10.1155/2021/7106104. [13] W. O. Anyim and A. J. C. Mole, “Management Control System for Effective Job Performance Among Librarians in Federal And State University Libraries : Evidence From South East Nigeria,” Int. J. Creat. Bus. Manag., vol. 1, no. 1, 2021, doi: 10.31098/ijcbm.v1i1.4357. [14] В. С. Кудряшов, М. В. Алексеев, А. В. Иванов, В. В. Портнов, Е. В. Князева, and О. А. Орловцева, “DEVELOPMENT AND APPLICATION OF A GEOGRAPHIC INFORMATION SYSTEM FOR MONITORING THE WORK OF SALES REPRESENTATIVES IN THE ‘EFKO’ GROUP OF COMPANIES,” ВЕСТНИК ВОРОНЕЖСКОГО ГОСУДАРСТВЕННОГО ТЕХНИЧЕСКОГО УНИВЕРСИТЕТА, no. 1, 2021, doi: 10.36622/vstu.2021.17.1.002. [15] H. A. Ismael, J. M. Abbas, S. A. Mostafa, and A. H. Fadel, “An enhanced fireworks algorithm to generate prime key for multiple users in fingerprinting domain,” Bull. Electr. Eng. Informatics, vol. 10, no. 1, 2020, doi: 10.11591/eei.v10i1.2521. Development of Employee Attendance Management Information System During the Covid-19 Pandemic Based on Website using QR Code and PHP Native SISFORMA: Journal of Information Systems (e-Journal) Vol.9 | No 2 |Th. 2022 ISSN 2442-7888 (online) DOI 10.24167/sisforma.v9i2.4384 79 [16] A. Mardian, T. Budiman, R. Haroen, and V. Yasin, “PERANCANGAN APLIKASI PEMANTAUAN KINERJA KARYAWAN BERBASIS ANDROID DI PT. SALESTRADE CORP. INDONESIA,” J. Manajamen Inform. Jayakarta, vol. 1, no. 3, 2021, doi: 10.52362/jmijayakarta.v1i3.481. [17] A. Habib, M. A. Jani, D. A. Pratama, and E. Ronando, “Development of archives management information system with RFID and SMS gateway,” Int. J. Psychosoc. Rehabil., vol. 24, no. 4, pp. 5227–5243, Feb. 2020, doi: 10.37200/IJPR/V24I4/PR201621. [18] A. Habib and A. Kartika W. H., “Development of an Online Sales Information System for SMEs Using Incremental Methods,” INTENSIF J. Ilm. Penelit. dan Penerapan Teknol. Sist. Inf., vol. 4, no. 1, pp. 51–62, 2020, doi: 10.29407/intensif.v4i1.13524. [19] I. Srirahayu and I. Muslihah, “PT. Indosurya Finance Solo Baru Employee Management Information System Analysis,” Int. J. Comput. Inf. Syst., vol. 2, no. 1, 2021, doi: 10.29040/ijcis.v2i1.22. [20] P. Vrabcová and H. Urbancová, “Use of human resources information system in agricultural companies in the Czech Republic,” Agric. Econ. (Czech Republic), vol. 67, no. 5, 2021, doi: 10.17221/452/2020- AGRICECON. [21] A. Habib and B. Al Kindhi, “Rancang Bangun Sistem Informasi Manajemen Keuangan Sekolah,” INTENSIF: Jurnal Ilmiah Penelitian dan Penerapan Teknologi Sistem Informasi, Aug. 01, 2018. http://ojs.unpkediri.ac.id/index.php/i ntensif/article/view/12139.