Human Computer Interaction Design in Web Based Warehouse Management Systems Using the Task Centered System Design (TCSD) Method

Muhammad Izzan Fieldi; Fathoni; Muhammad Aiman

doi:10.34148/teknika.v14i3.1375

Authors

Muhammad Izzan Fieldi Information Systems Department, Faculty of Computer Science, Sriwijaya University, Indralaya, South Sumatera, Indonesia
Fathoni Information Systems Department, Faculty of Computer Science, Sriwijaya University, Indralaya, South Sumatera, Indonesia
Muhammad Aiman Information Technology Department, Faculty of Computing and Informatics, Malaysia Sabah University, Kinabalu, Sabah, Malaysia

DOI:

https://doi.org/10.34148/teknika.v14i3.1375

Keywords:

HCI, UI, UX, TCSD, Warehouse Management System

Abstract

In the digital transformation era, web-based warehouse management systems play an essential role in ensuring operational efficiency, yet their effectiveness depends not only on functional accuracy but also on a user-centered interface design. This study aims to redesign the interface of Company XYZ’s warehouse management system using the Task-Centered System Design (TCSD) method within the Human-Computer Interaction (HCI) framework. TCSD emphasizes mapping real user tasks, analyzing user-centered requirements, prototyping through scenarios, and conducting usability evaluations. Data were collected through direct observation, structured interviews, and literature review, followed by interface prototyping in Figma and testing with the Maze platform. Six main warehouse tasks login, item distribution, returns, receiving, cycle counting, and searching were evaluated with five participants. The results demonstrated a Task Success Rate (TSR) of 100% across all tasks, with the shortest average Time on Task (ToT) for login (7.89 seconds) and item search (8.58 seconds), and the longest for cycle counting (58.10 seconds). Click Rate (CR) and Error Rate (ER) varied depending on task complexity, with login and item search showing higher ER values, which were influenced by predefined task flows. Overall, findings confirm that TCSD yields a practical and measurable design aligned with user workflows, producing an interface that is efficient, user-friendly, and adaptable to warehouse operations. This research contributes to HCI studies by demonstrating the effectiveness of scenario-based design in logistics systems, while also highlighting the need for larger-scale usability testing in future work.

Downloads

Download data is not yet available.

References

[1] V. B. Hadikin and J. Wiratama, “Web-Based ERP System Prototype for Enhanced Inventory and Supply Chain Management in the Logistics Industry,” Ultim. InfoSys J. Ilmu Sist. Inf., vol. 15, no. 2, pp. 138–145, 2024, doi: 10.31937/si.v15i2.3839.

[2] A. A. Marpaung, Wijiyanto, and B. P. C. Utomo, “Digitization of Warehouse Stock Management Through Web-Based Information Systems,” bit-Tech, vol. 8, no. 1, pp. 1009–1017, Aug. 2025, doi: 10.32877/bt.v8i1.2806.

[3] V. Wijaya, V. Joeanca, H. Yap, and S. Lim, “Methodical Approach: Building a Web-Based Warehouse Management System Using the Waterfall Method,” IJISIT Int. J. Comput. Sci. Inf. Technol., vol. 1, no. 1, pp. 8–19, 2024, doi: 10.55123/ijisit.v1i1.7.

[4] D. Debora, N. N. Kharisma, W. Rifaldi, and U. Nugraha, “UI/UX Transformation of XYZ Retail Information System Through User-Centered Design Approach,” J. Sist. Inf. dan Teknol. Inf., vol. 2, no. 2 SE-Articles, pp. 158–167, Jul. 2025, doi: 10.33197/justinfo.v2i2.2539.

[5] A. J. Amadeo, Andryan, J. G. Siento, P. D. A. Pramunita, V. A. Hongastu, and K. Purwandari, “A Web-Based Application Development for Efficient Warehouse Management,” in 2024 International Conference on Information Technology Systems and Innovation (ICITSI), 2024, pp. 283–289. doi: 10.1109/ICITSI65188.2024.10929443.

[6] C. Krupitzer et al., “A Survey on Human Machine Interaction in Industry 4.0,” Feb. 2020, [Online]. Available: http://arxiv.org/abs/2002.01025

[7] M. Moencks, E. Roth, T. Bohné, and P. O. Kristensson, “Human-Computer Interaction in Industry: A Systematic Review on the Applicability and Value-added of Operator Assistance Systems,” Found. Trends® Human–Computer Interact., vol. 16, no. 2–3, pp. 65–213, 2022, doi: 10.1561/1100000088.

[8] A. Chalipour, E. Noorzai, M. Golabchi, and S. H. Hosseini Nourzad, “Uncovering key success factors for enhanced office-site communication through digital twins,” TQM J., Mar. 2025, doi: 10.1108/TQM-04-2024-0146.

[9] Md Arifur Rahman and Sheratun Noor Jyoti, “A Systematic Literature Review of User-Centric Design in Digital Business Systems: Enhancing Accessibility, Adoption, and Organizational Impact,” Rev. Appl. Sci. Technol. , vol. 1, no. 04 SE-Articles, pp. 1–25, doi: 10.63125/ndjkpm77.

[10] I. Ramadhani, R. Nindyasari, and A. Catur Murti, “Design and Development of a Web-Based Point of Sale System for Small-Scale Retail Management,” bit-Tech, vol. 8, no. 1, pp. 181–189, Aug. 2025, doi: 10.32877/bt.v8i1.2487.

[11] W. Yulita et al., “Analisis dan Rancangan User Experience Website OAIL Menggunakan Metode Task Centered System Design (TCSD),” J. Sains Komput. Inform. (J-SAKTI, vol. 5, no. 2, pp. 879–886, 2021.

[12] M. N. Taufani, T. Sagirani, and V. Nurcahyawati, “Application of the Task Centered System Design (TCSD) Method for UI / UX Design Analysis in E-Learning at SMAN 1 Sidoarjo,” J. Sist. Inf. dan Komput. Akunt., vol. 10, no. 2, pp. 83–89, 2021.

[13] V. Meiriza, P. Putra, N. R. Oktadini, A. Meiriza, and P. E. Sevtiyuni, “Penerapan metode task centered system design pada perancangan user interface sistem pelelangan rumah dinas perusahaan,” J. Penelit. Saintek, vol. 1, no. 2 SE-Articles, pp. 63–77, Oct. 2024, doi: 10.21831/jps.v1i2.77699.

[14] O. A. Fatma, “Perancangan UI/UX Menggunakan Metode Task Centered System Design Dan User Experience Questionnaire Pada Website banyumaskab.go.id,” Innotech J. Ilmu Komputer, Sist. Inf. dan Teknol. Inf., vol. 1, no. 2 SE-Articles, pp. 12–23, Jul. 2024, [Online]. Available: https://ejournal.cyber-univ.ac.id/index.php/innotech/article/view/30

[15] M. Praseptiawan and P. Wisnubroto, “Redesigning UI/UX of A Mobile Application Using Task Centered System Design Approach,” Inf. Manag., vol. 6, pp. 21–28, May 2023.

[16] C. P. Putra, M. K. Sabaria, and S. Widowati, “Perancangan User Interface E-Commerce Neitzo Company Menggunakan Metode Task Centered System Design (Tcsd),” e-Proceeding Eng., vol. 2, no. 3, pp. 7779–7790, 2015.

[17] E. Maulidina, P. Putra, D. Y. Hardiyanti, and M. H. Syahbani, “Implementasi Metode TCSD Pada Perancangan User Interface Layanan Shared-Service (SS) ICT,” J. Ekon. Manaj. Sist. Inf., vol. 6, no. 2 SE-Articles, pp. 917–928, Nov. 2024, doi: 10.38035/jemsi.v6i2.3254.

[18] N. R. Ayu, P. Putra, N. R. Oktadini, P. E. Sevtiyuni, and A. Meiriza, “Designing Interface of Marketplace Build ID Merchant Architect Using Task-Centered System Design,” JURTEKSI (jurnal Teknol. dan Sist. Informasi), vol. 9, no. 4 SE-Articles, pp. 673–680, Sep. 2023, doi: 10.33330/jurteksi.v9i4.2658.

[19] S. M. Jibran, “Pengembangan Sistem Informasi Manajemen Rumah Sakit di Rumah Sakit Umum Daerah Buton Selatan Menggunakan Metode Task Centered System Design,” Universitas Islam Indonesia, 2023. [Online]. Available: dspace.uii.ac.id/123456789/45764

[20] A. Mirabdolah, M. Alaeifard, and A. Marandi, “User-Centered Design in HCl: Enhancing Usability and Interaction in Complex Systems,” Int. J. Adv. Hum. Comput. Interact. Int. J. Adv. Hum. Comput. Interact. Int. J. Adv. Hum. Comput. Interact., vol. 1, no. 1, p. 2023, 2023, [Online]. Available: https://www.ijahci.com/index.php/ijahci/article/view/16

[21] O. Okfalisa, F. Fahruddin, H. Setiaji, M. F. A. Pratama, H. Finaldhi, and N. Delifah, “UI/UX design thinking adoption for integrated AI point-of-sale system (Case study: Plastic Poultry Wholesale Store),” Sci. Technol. Commun. J., vol. 5, no. 3 SE-, pp. 109–116, Jun. 2025, doi: 10.59190/stc.v5i3.311.

[22] C. Altin Gumussoy, A. Pekpazar, M. Esengun, A. E. Bayraktaroglu, and G. Ince, “Usability Evaluation of TV Interfaces: Subjective Evaluation Vs. Objective Evaluation,” Int. J. Human–Computer Interact., vol. 38, no. 7, pp. 661–679, Apr. 2022, doi: 10.1080/10447318.2021.1960093.

[23] J. Nielsen and T. K. Landauer, “A mathematical model of the finding of usability problems,” in Proceedings of the INTERACT ’93 and CHI ’93 Conference on Human Factors in Computing Systems, in CHI ’93. New York, NY, USA: Association for Computing Machinery, 1993, pp. 206–213. doi: 10.1145/169059.169166.