Rancang Bangun dan Evaluasi Sistem Web Augmented Reality Berbasis Persistent Multi-Marker dan Spatial Anchoring untuk Simulasi Kaligrafi Huruf Hijaiyah
DOI:
https://doi.org/10.54065/artificial.1629Keywords:
Huruf Hijaiyah, Persistent Multi-Marker, Pengenalan Ucapan, Spatial Anchoring, WebARAbstract
Pembelajaran huruf hijaiyah dan kaligrafi dasar bahasa Arab memerlukan media yang mampu memvisualisasikan penyusunan huruf dari kanan ke kiri secara interaktif. Penelitian ini bertujuan merancang, mengembangkan, dan mengevaluasi secara fungsional sistem Web Augmented Reality (WebAR) berbasis peramban yang mampu mempertahankan beberapa huruf hasil pemindaian pada kanvas persisten dan menyusunnya menjadi kata berbahasa Arab. Penelitian menggunakan pendekatan Research and Development (R&D) dengan model Multimedia Development Life Cycle (MDLC) yang meliputi tahap concept, design, material collecting, assembly, testing, dan distribution. Sistem dikembangkan menggunakan TypeScript, Vite, Three.js, MindAR, model GLTF, Web Audio API, dan Web Speech API. Data dikumpulkan melalui observasi terhadap respons sistem menggunakan instrumen uji black-box, kompatibilitas perangkat, pengukuran jarak, pencahayaan, kebisingan, dan log performa peramban, kemudian dianalisis secara deskriptif. Hasil penelitian menunjukkan bahwa sistem berhasil menjalankan seluruh tujuh skenario pengujian fungsional, mempertahankan objek setelah penanda keluar dari bidang pandang, serta menyusun huruf secara otomatis dari kanan ke kiri. Sistem bekerja optimal pada jarak 15–30 cm dan pencahayaan 300–500 lux. Persentase penerimaan transkrip suara mencapai 97% pada kebisingan 30 dB dan 94% pada 45 dB, sedangkan kinerja perenderan bertahan pada 54–60 FPS hingga sepuluh model persisten. Hasil penelitian menunjukkan bahwa sistem WebAR yang dikembangkan layak secara fungsional sebagai media simulasi penyusunan huruf hijaiyah berbasis persistent multi-marker, meskipun efektivitasnya terhadap hasil belajar masih memerlukan pengujian lebih lanjut.
References
Adrian, D., Muktiadi, R., Sugiyanto, S., & Wijaya, E. S. (2026). Implementation of Augmented Reality (AR) as a Learning Medium For Introducing Hijaiyah Letters: A Case Study at UMP Kindergarten. Jurnal E-Komtek, 9(2), 474–487. https://doi.org/10.37339/e-komtek.v9i2.2614
Akcayir, M., & Akcayir, G. (2017). Advantages and Challenges Associated with Augmented Reality for Education: A Systematic Review of the Literature. Educational Research Review, 20, 1–11. https://doi.org/10.1016/j.edurev.2016.11.002
Aldayel, M. (2024). Khatti: An Interactive Mobile Application for Training of Arabic Calligraphy. Intelligent Human Systems Integration (IHSI 2024): Integrating People and Intelligent Systems, 119, 714–724. https://doi.org/10.54941/ahfe1004536
Alimamy, S., & Jung, T. (2025). The AR Cloud: Navigating Metaverse Augmentation Technologies for Enhanced Co-Creation of Value Within Services. Journal of Service Research, 28(4), 580–597. https://doi.org/10.1177/10946705241265753
Alzahrani, N. M. (2020). Augmented Reality: A Systematic Review of its Benefits and Challenges in E-Learning Contexts. Applied Sciences, 10(16), Article 5660. https://doi.org/10.3390/app10165660
Buchner, J., Buntins, K., & Kerres, M. (2021). The Impact of Augmented Reality on Cognitive Load and Performance: A Systematic Review. Computers and Education Open, 2, Article 100036. https://doi.org/10.1016/j.caeo.2021.100036
Cao, J., Lam, K.-Y., Lee, L.-H., Liu, X., Hui, P., & Su, X. (2023). Mobile Augmented Reality: User Interfaces, Frameworks, and Intelligence. ACM Computing Surveys, 55(9), 1–36. https://doi.org/10.1145/3557999
Chang, H.-Y., Binali, T., Liang, J. C., Chiou, G.-L., Cheng, K.-H., Lee, S. W.-Y., & Tsai, C.-C. (2022). Ten Years of Augmented Reality in Education: A Meta-Analysis of (Quasi-) Experimental Studies to Investigate the Impact. Computers & Education, 191, Article 104641. https://doi.org/10.1016/j.compedu.2022.104641
Ferrao, J., Dias, P., Sousa Santos, B., & Oliveira, M. (2023). Environment-Aware Rendering and Interaction in Web-Based Augmented Reality. Journal of Imaging, 9(3), Article 63. https://doi.org/10.3390/jimaging9030063
Garzon, J. (2021). An Overview of Twenty-Five Years of Augmented Reality in Education. Multimodal Technologies and Interaction, 5(7), Article 37. https://doi.org/10.3390/mti5070037
Garzon, J., Pavon, J., & Baldiris, S. (2019). Systematic Review and Meta-Analysis of Augmented Reality in Educational Settings. Virtual Reality, 23(4), 447–459. https://doi.org/10.1007/s10055-019-00379-9
Hafidhoh, N., Lestariningsih, T., Atmaja, A. P., Fajar, M. S., Sumafta, I. B., & Izzah, D. N. (2023). Recognition of Hijaiyah Letters with Punctuation Using Augmented Reality. TIERS Information Technology Journal, 4(1), 25–31. https://doi.org/10.38043/tiers.v4i1.4348
Hamzah, M. L., Rizal, F., & Simatupang, W. (2021). Development of Augmented Reality Application for Learning Computer Network Device. International Journal of Interactive Mobile Technologies, 15(12), 47–64. https://doi.org/10.3991/ijim.v15i12.21993
Ibanez, M. B., & Delgado-Kloos, C. (2018). Augmented Reality for STEM Learning: A Systematic Review. Computers & Education, 123, 109–123. https://doi.org/10.1016/j.compedu.2018.05.002
Layona, R., Yulianto, B., & Turnadi, Y. (2018). Web Based Augmented Reality for Human Body Anatomy Learning. Procedia Computer Science, 135, 457–464. https://doi.org/10.1016/j.procs.2018.08.197
Li, J., Zhou, X., Yang, B., Zhang, G., Wang, X., & Bao, H. (2023). RLP-VIO: Robust and Lightweight Plane-Based Visual-Inertial Odometry for Augmented Reality. Computer Animation and Virtual Worlds, 34(2), Article e2046. https://doi.org/10.1002/cav.2046
McNally, K. F., & Koviland, H. (2024). A Web-Based Augmented Reality System. EAI Endorsed Transactions on Scalable Information Systems, 11(6). https://doi.org/10.4108/eetsis.5481
Ouali, I., Ben Halima, M., & Wali, A. (2023). An Augmented Reality for an Arabic Text Reading and Visualization Assistant for the Visually Impaired. Multimedia Tools and Applications, 82(28), 43569–43597. https://doi.org/10.1007/s11042-023-14880-6
Pan, X., Huang, G., Zhang, Z., Li, J., Bao, H., & Zhang, G. (2024). Robust Collaborative Visual-Inertial SLAM for Mobile Augmented Reality. IEEE Transactions on Visualization and Computer Graphics, 30(11), 7354–7363. https://doi.org/10.1109/TVCG.2024.3456152
Parmaxi, A., & Demetriou, A. A. (2020). Augmented Reality in Language Learning: A State-of-the-Art Review of 2014–2019. Journal of Computer Assisted Learning, 36(6), 861–875. https://doi.org/10.1111/jcal.12486
Piao, J.-C., & Kim, S.-D. (2017). Adaptive Monocular Visual-Inertial SLAM for Real-Time Augmented Reality Applications in Mobile Devices. Sensors, 17(11), Article 2567. https://doi.org/10.3390/s17112567
Rahmat, R., Akbar, F., Syahputra, M., Budiman, M., & Hizriadi, A. (2018). An Interactive Augmented Reality Implementation of Hijaiyah Alphabet for Children Education. Journal of Physics: Conference Series, 978(1), Article 012102. https://doi.org/10.1088/1742-6596/978/1/012102
Ramadhani, U. H., & Arifin, M. B. U. B. (2024). Augmented Reality Flashcards for Arabic Vocabulary Learning. Indonesian Journal of Islamic Studies, 12(2). https://doi.org/10.21070/ijis.v12i2.1756
Roy, S. G., & Kanjilal, U. (2021). Web-Based Augmented Reality for Information Delivery Services: A Performance Study. DESIDOC Journal of Library & Information Technology, 41(3), 167–174. https://doi.org/10.14429/djlit.41.3.16428
Shadiev, R., & Liang, Q. (2024). A review of Research on AR-Supported Language Learning. Innovation in Language Learning and Teaching, 18(1), 78–100. https://doi.org/10.1080/17501229.2023.2229804
Sirakaya, M., & Alsancak Sirakaya, D. (2018). Effects of Augmented Reality on Student Achievement and Self-Efficacy in Vocational Education and Training. International Journal for Research in Vocational Education and Training, 5(1), 1–18. https://doi.org/10.13152/IJRVET.5.1.1
Downloads
Published
How to Cite
Issue
Section
License
Copyright (c) 2026 Hasna Minatul Mardiah, Muhamad Veva Ramadhan, LM Irsal Shydiq, Hasbi Nurwahid Ash Shiddiey
This work is licensed under a Creative Commons Attribution 4.0 International License.
License and Copyright Agreement
- Authors retain copyright and other proprietary rights related to the article.
- Authors retain the right and are permitted to use the substance of the article in their own future works, including lectures and books.
- Authors grant the journal the right of first publication with the work simultaneously licensed under Creative Commons Attribution License (CC BY 4.0) that allows others to share the work with an acknowledgment of the work's authorship and initial publication in this journal.
- Authors are able to enter into separate, additional contractual arrangements for the non-exclusive distribution of the journal's published version of the work (e.g., post it to an institutional repository or publish it in a book), with an acknowledgment of its initial publication in this journal.
- Authors are permitted and encouraged to post or self-archive their work online (e.g., in institutional repositories or on their website) prior to and during the submission process, as it can lead to productive exchanges, as well as earlier and greater citation of published work.
