Design and Implementation of a Web-Based Sales System for Ghany Moslem Using User-Centered Design

Authors

DOI:

https://doi.org/10.51903/aehchh10

Keywords:

User-Centered Design, Sales Information System, System Usability Scale, Web-Based System, MSMEs

Abstract

Ghany Moslem Fashion Store still relies on manual sales communication through WhatsApp, resulting in unstructured product information and inefficient ordering processes. This study aims to develop a web-based sales information system that provides centralized product information and a structured ordering workflow. The User-Centered Design (UCD) approach was employed through user needs identification, prototype design, usability evaluation, system implementation, and post-implementation evaluation. Usability was assessed using the System Usability Scale (SUS), consisting of 10 questionnaire items. Prototype evaluation involved 20 respondents and achieved an average SUS score of 70.88, exceeding the acceptance threshold of 68 and falling within the “Acceptable” category. These results supported the progression from prototyping to implementation. The developed system provides a structured product catalog, inventory information, and WhatsApp-integrated ordering, with a mobile interface for customers and a desktop interface for administrators. Subsequent usability testing yielded an average SUS score of 78.5, also categorized as “Acceptable,” indicating improved usability compared with the prototype. The findings demonstrate the potential of UCD-based system development to support the digitalization of sales processes in micro-scale fashion enterprises.

Author Biographies

  • Fitro Nur Hakim Hakim, Universitas Sains dan teknologi Komputer, Semarang, Jawa Tengah, Indonesia

    Lecturer at Universitas STEKOM Semarang

  • Nur Rokhman, Universitas Sains dan teknologi Komputer, Semarang, Jawa Tengah, Indonesia

    Lecturer at Universitas STEKOM Semarang

References

[1] Badan Pusat Statistik, “Statistik E-Commerce 2024,” 7th ed. Jakarta: Badan Pusat Statistik (BPS-Statistics Indonesia), 2025. [Online]. Available: https://www.bps.go.id/id/publication/2025/11/28/647323224ecc656c2933571b/statistik-e-commerce-2024.html

[2] Badan Pusat Statistik Provinsi Jawa Tengah, “Profil Industri Mikro dan Kecil Provinsi Jawa Tengah 2024,” Semarang, 2025. [Online]. Available: https://jateng.bps.go.id/id/publication/2025/08/28/30327de4f2ec8cfd7fa47950/profil-industri-mikro-dan-kecil-provinsi-jawa-tengah-2024.html

[3] A. N. Albalkhi and R. Komalasari, “SISINFO Sistem Informasi Penjualan (E-Commerce) UMKM DANISA Collection SisInfo,” vol. 6, no. 1, pp. 34–43, 2024, doi: https://doi.org/10.37278/sisinfo.v6i1.789.

[4] P. M. Jakak, V. Sinta, Wardianto, R. Fadholi, and Nurpiji, “Implementasi Sistem Penjualan Sembako pada Toko Sundari Berbasis Desktop,” vol. 6, no. 1, pp. 1150–1155, 2025, doi: 10.55338/jpkmn.v6i1.4941.

[5] M. I. Fakhmi, Nurul Huda, and Firamon Syakti, “Penerapan UI/UX dengan User Centered Design pada Aplikasi Android Penjualan pada Toko Nataz Collection,” JSAI (Journal Sci. Appl. Informatics), vol. 6, no. 3, pp. 342–350, 2023, doi: 10.36085/jsai.v6i3.5792.

[6] R. Febriyansyah, A. Voutama, N. A. Muhaa, L. M. Mulyono, and M. R. I. Ihsan, “Perancangan UI/UX Aplikasi Mobile Thrifthunt menggunakan Motode User Centered Design,” J. Teknol. Sist. Inf., vol. 6, no. 1, pp. 209–219, 2025, doi: 10.35957/jtsi.v6i1.11425.

[7] H. Haniyah, “Sistem Informasi Katalog Produk Berbasis Web dengan Metode User-Centered Design,” Media SISFO, vol. 19, no. 1, pp. 63–77, 2025, doi: 10.33998/mediasisfo.2025.19.1.2293.

[8] M. B. Aryantoro, R. Widayanti, H. D. Ariessanti, and R. P. Laksana, “Implementasi Sistem Informasi Penjualan Berbasis Website sebagai Strategi Digitalisasi UMKM Pada Rano Cake,” vol. 5, no. 3, pp. 30224–30235, 2025.

[9] R. T. Amanda and R. A. Putri, “Application of User-Centered Design Method in E-Commerce Sales System,” SISTEMASI, vol. 13, no. 3, p. 1295, May 2024, doi: 10.32520/stmsi.v13i3.4145.

[10] V. Arinal, M. B. Yel, A. Maulida, G. Angel, and A. A. Putra, “Pengembangan Sistem Informasi Manajemen Usaha Mikro Kecil dan Menengah ( UMKM ) Seblak Reyhan Berbasis Web,” J. Artif. Intell. Digit. Bus., vol. 4, no. 4, pp. 12977–12985, 2026, doi: doi.org/10.31004/riggs.v4i4.5816.

[11] L. Dwiyanti, M. J. C. Ananta, and T. H. Hasibuan, “Perancangan Sistem Informasi Penjualan untuk Usaha Kuliner Berbasis Web di Warung Bunda,” J. Rekayasa Inf. Swadharma, vol. 5, no. 1, pp. 16–24, 2025.

[12] R. Permana, S. Diana, and I. Yaurike, “Implementasi Waterfall Method pada Sistem Informasi Akuntansi Penjualan Barang PT Vanilys Indo Patriot Jakarta,” IMTechno J. Ind. Manag. Technol., vol. 5, no. 1, Jan. 2024, doi: 10.31294/imtechno.v5i1.2067.

[13] A. M. Halawa and W. Kurniawan, “Perancangan Sistem Informasi Penjualan (POS) Berbasis Website dengan Metode Agile,” JSAI J. Sci. Appl. Informatics, vol. 8, no. 2, pp. 379–386, 2025, doi: 10.36085/jsai.v8i2.8451.

[14] A. Olivia, P. D. Larasati, M. Femy Mulya, S. Anwar, and Y. Efendi, “Penerapan Design Thinking dalam Perancangan UI/UX Website untuk Meningkatkan Pengalaman Pengguna,” J. SISKOM-KB (Sistem Komput. dan Kecerdasan Buatan), vol. 8, no. 3, pp. 185–193, May 2025, doi: 10.47970/siskom-kb.v8i3.836.

[15] S. Faridha, S. Yulianti, and Y. Sugiarti, “Metode Perancangan User Interface yang Paling Umum Digunakan: Systematic Literature Review,” bit-Tech, vol. 7, no. 1, pp. 58–67, Aug. 2024, doi: https://doi.org/10.32877/bt.v7i1.1467.

[16] B. Y. Prayoga and A. Subiyakto, “Permasalahan dan Solusi Terkini dalam User Interface Aplikasi Mobile: Systematic Literature Review Article,” Walisongo J. Inf. Technol., vol. 6, no. 2, pp. 9–16, 2024, doi: 10.21580/wjit.2024.6.1.18653.

[17] P. M. Effendi and Endra Rahmawati, “Peningkatan terhadap Pengalaman Pengguna: Implementasi Pendekatan User-Centered Design dan Evaluasi Usability pada Prototipe Sistem Inventori,” INFOTECH J. Inform. Teknol., vol. 6, no. 2, pp. 189–197, 2025, doi: 10.37373/infotech.v6i2.1994.

[18] K. P. Sari, S. R. Zulaikha, and A. Mubarokah, “Evaluasi Desain User Interface Berdasarkan User Experience pada Aplikasi Perpustakaan Digital Isleman,” Tik Ilmeu J. Ilmu Perpust. dan Inf., vol. 7, no. 2, p. 301, Dec. 2023, doi: 10.29240/tik.v7i2.8374.

[19] T. Wulansari, D. Kurniawan, and W. Yanuartha, “Pelatihan Fundamental User Experience dan User Interface,” J. Abdimas Indones., vol. 4, no. 3, pp. 1201–1207, Sep. 2024, doi: 10.53769/jai.v4i3.764.

[20] M. N. Ichzan Arsana and A. Ali, “Analisis User Experience (UX) pada Website Layanan Dkampus dengan Metode Cognitive Walkthrough (CW),” J. SIMBOLIKA Res. Learn. Commun. Study, vol. 10, no. 1, pp. 82–93, 2024, doi: 10.31289/simbolika.v10i1.11607.

[21] S. Wulandari, P. Anggraini, and F. Faradika, “Analisis Konseptual Desain UI UX pada Aplikasi Dompetku dalam Meningkatkan Pengalaman Pengguna,” J. Sist. Inf. Dan Inform., vol. 3, no. 2, pp. 87–94, Jul. 2025, doi: 10.47233/jiska.v3i2.2135.

[22] D. A. R. El trin Syahrul, Fitrianingsih, Ihsan Jatnika, Aprillia Intan Khairunnisa, “Penerapan Metode User Centered Design (UCD) pada Modul Rekomendasi Website Sijati,” J. Ilm. Komputasi, vol. 23, no. 4, pp. 539–548, Dec. 2024, doi: 10.32409/jikstik.23.4.3760.

[23] M. S. Hartawan, “Penerapan User Centered Design (UCD) pada Wireframe Desain User Interface dan User Experience Aplikasi Sinopsis Film,” JEIS J. ELEKTRO DAN Inform. SWADHARMA, vol. 2, no. 1, pp. 43–47, Jan. 2022, doi: 10.56486/jeis.vol2no1.161.

[24] P. Prameswari, R. Mai Candra, M. Affandes, and L. Oktavia, “Desain UI/UX Aplikasi Manajemen Keuangan Pribadi menggunakan Metode User Centered Design (UCD),” J. Pendidik. dan Teknol. Indones., vol. 5, no. 1, Jan. 2025, doi: 10.52436/1.jpti.567.

[25] K. Wulandari and A. Voutama, “Perancangan UI Aplikasi Konsultasi Kesehatan Mental Berbasis Mobile Menggunakan Metode User Centered Design (UCD),” J-SISKO TECH (Jurnal Teknol. Sist. Inf. dan Sist. Komput. TGD), vol. 6, no. 2, p. 445, 2023, doi: 10.53513/jsk.v6i2.8253.

[26] D. K. Nurdatillah, “Optimalisasi Desain UI/UX Website The Originote dengan Pendekatan User Centered Design,” JUSIFOR J. Sist. Inf. dan Inform., vol. 4, no. 1, pp. 59–67, Jun. 2025, doi: 10.70609/jusifor.v4i1.5985.

[27] J. Preece, Y. Rogers, and H. Sharp, “Interaction Design: Beyond Human-Computer Interaction,” New York, NY: John Wiley & Sons, Inc., 2002.

[28] J. Nielsen, “Usability 10: Introduction to Usability,” Nielsen Norman Group. Accessed: May 08, 2026. [Online]. Available: https://www.nngroup.com/articles/usability-101-introduction-to-usability/

[29] M. L. Oktaroza and A. Setiawan, “Efektivitas dan Usability User Interface dalam Aplikasi Modern: Tinjauan Sistematis melalui Studi Literatur Review,” J. Manaj. Terap. dan Keuang., vol. 14, no. 2, pp. 475–486, Jun. 2025, doi: 10.22437/jmk.v14i2.43273.

[30] J. H. Imin, M. Fajar, and Hasniati, “Perancangan UI/UX Website Search Buddy Menggunakan Pendekatan Design Thinking,” J. Ilm. Media Sisfo, vol. 18, no. 1, pp. 89–98, Apr. 2024, doi: 10.33998/mediasisfo.2024.18.1.1642.

[31] R. Handayani and E. Maria, “Usability of the GrabMerchant Application: An Evaluation using the System Usability Scale and the Retrospective Think Aloud Method,” SISTEMASI, vol. 14, no. 4, p. 1749, Jul. 2025, doi: 10.32520/stmsi.v14i4.5283.

[32] J. Brooke, “Usability Evaluation in Industry,” 1st ed., vol. 32, no. 3. London: Taylor & Francis, 1996. doi: https://doi.org/10.1201/9781498710411.

[33] N. I. Al Muharom, N. Suarna, and R. D. Dana, “Usability Testing pada Aplikasi Kas Berbasis Android dan Teknologi API menggunakan Metode System Usability Scale,” J. Inform. Terpadu, vol. 10, no. 1, pp. 73–82, Mar. 2024, doi: 10.54914/jit.v10i1.1099.

[34] A. Bangor, P. T. Kortum, and J. T. Miller, “An Empirical Evaluation of the System Usability Scale,” Int. J. Human–Computer Interact., vol. 24, no. 6, pp. 574–594, Jul. 2008, doi: 10.1080/10447310802205776.

[35] A. I. Maulia, S. P. Kristanto, and L. Hakim, “System Usability Scale dalam Evaluasi Pengembangan Aplikasi Prospect menggunakan Metode Activity Oriented Design,” Infomatek, vol. 26, no. 1, pp. 135–142, 2024, doi: 10.23969/infomatek.v26i1.14094.

[36] C. Abras, D. Maloney-Krichmar, and J. Preece, “User-Centered Design,” in Encyclopedia of Human-Computer Interaction, W. Bainbridge, Ed., Thousand Oaks, CA: Sage Publications, 2004, pp. 1–14.

Downloads

Published

2026-10-28

Issue

Vol. 5 No. 3 (2026): November

Section

Web-Based Information Systems and Knowledge-Based Systems

License

Copyright (c) 2026 Moch Daffa Zaki Budiman, Fitro Nur Hakim Hakim, Nur Rokhman, Sumaryanto Sumaryanto, Setiyo Prihatmoko

Creative Commons License

This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.

All articles published in this journal are open access and licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0 International License (CC BY-SA 4.0).

Under this license:

  • Authors retain copyright of their work.

  • Others are free to:

    • Share — copy and redistribute the material in any medium or format;

    • Adapt — remix, transform, and build upon the material for any purpose, even commercially;

  • As long as they:

    • Give appropriate credit to the original author(s) and the source;

    • Provide a link to the license;

    • Indicate if changes were made;

    • Distribute their contributions under the same license as the original.

This ensures that derivative works will also remain free and open under the same terms.