Analisis Karakteristik UI/UX Yang Efektif untuk Efisiensi Media Pembelajaran Online
Kata Kunci:
UI/UX, Media Pembelajaran Online, Systematic Literature Review (SLR), System Usability Scale (SUS)Abstrak
Transformasi digital dalam dunia pendidikan telah mempercepat pemanfaatan media pembelajaran online, khususnya setelah pandemi COVID-19 yang mendorong pergeseran besar-besaran dari pembelajaran tatap muka ke daring. Namun, efektivitas pembelajaran online masih menghadapi kendala serius, antara lain desain antarmuka yang kompleks, navigasi yang tidak intuitif, serta pengalaman pengguna yang belum optimal. Kondisi tersebut menjadikan analisis karakteristik UI/UX yang efektif menjadi penting untuk meningkatkan efisiensi pembelajaran daring. Penelitian ini menggunakan metode Systematic Literature Review (SLR) dengan menelaah artikel yang relevan pada periode 2018–2024. Kriteria inklusi meliputi fokus pada desain UI/UX media pembelajaran online, penerapan metode Design Thinking atau User-Centered Design (UCD), serta evaluasi menggunakan instrumen System Usability Scale (SUS). Dari keseluruhan artikel, dipilih enam artikel dengan skor SUS tertinggi untuk dianalisis lebih lanjut. Hasil kajian menunjukkan bahwa pendekatan UCD memperoleh skor usability tertinggi (SUS 91,5) karena lebih berorientasi pada kebutuhan nyata pengguna, sedangkan Design Thinking secara konsisten menghasilkan skor dalam kategori Baik–Sangat Baik. Karakteristik UI/UX yang dominan dan efektif meliputi navigasi sederhana, konsistensi visual, responsivitas lintas perangkat, aksesibilitas tinggi, serta interaktivitas dan personalisasi. Temuan ini menegaskan bahwa perancangan UI/UX yang tepat berkontribusi pada penghematan waktu, peningkatan motivasi belajar, dan pemerataan akses pendidikan. Dengan demikian, penelitian ini memberikan rekomendasi praktis bagi pengembang aplikasi pembelajaran daring maupun institusi pendidikan dalam mewujudkan media digital yang lebih efisien dan berdaya guna.
Unduhan
Referensi
Abiyaksa, D. (2024). Perancangan desain UI/UX website Artealogic sebagai media portofolio, produk, serta kampanye pentingnya branding dan bisnis bagi Generasi Z. Jurnal VICIDI, 14(1). https://doi.org/10.37715/vicidi.v14i1.4600
Adiwinata, K., Nugraha, B., & Ridwan, T. (2024). Penerapan Metode User Centered Design Dalam Perancangan Desain Ui/Ux Website Sman 5 Karawang. Jurnal Informatika Dan Teknik Elektro Terapan, 12(3). https://doi.org/10.23960/jitet.v12i3.4591
Adyaksa, A. C. G., Santoso, D. B., & Razaq, J. A. (2024). Perancangan UI/UX Aplikasi E-learning Kampus Universitas Stikubank Dengan Menggunakan Metode Design Thinking. Jurnal Indonesia : Manajemen Informatika Dan Komunikasi, 5(3), 2402–2412. https://doi.org/10.35870/jimik.v5i3.906
Akbar, M. L., Usman Ari, & Budiman Arief. (2023). Rancang Bangun Desain UIUX Pada Pembuatan. 42–56.
Aldi, A., Mufidah, A. H., & Sanjaya, C. B. (2024). Paket Wisata Di Desa Wonokitri. 12(3).
Alqahtani, A. Y., & Rajkhan, A. A. (2020). E-learning critical success factors during the COVID-19 pandemic: A comprehensive analysis of e-learning managerial perspectives. Education Sciences, 10(9), 216. https://doi.org/10.3390/educsci10090216
Ansori, S., Hendradi, P., & Nugroho, S. (2023). Penerapan Metode Design Thinking dalam Perancangan UI/UX Aplikasi Mobile SIPROPMAWA. Journal of Information System Research (JOSH), 4(4), 1072–1081. https://doi.org/10.47065/josh.v4i4.3648
APJII. (2022). Laporan survei internet APJII 2022. Asosiasi Penyelenggara Jasa Internet Indonesia. https://apjii.or.id
Apriliyanti, P., Irmayanti, D., & Alam, S. (2023). Perancangan UI/UX Aplikasi Media Pembelajaran Pengenalan Budaya Indonesia Untuk Siswa Sekolah Dasar Menggunakan Metode User Centered Design (UCD). Jurnal Teknologi Informatika Dan Komputer, 9(2), 716–733. https://doi.org/10.37012/jtik.v9i2.1665
Artikel, I. (2023). Pelatihan Desain UI / UX Website UMKM Profile Labscarpe Dengan Aplikasi Figma. 3(2), 1972–1980.
Arujisaputra, E. T., Heriansyah, M., Zamani, F. E., & Husain, A. (2025). UI/UX Design Of Website-Based E-Commerce Application Using Lean User Experience Method. CoreID Journal, 3(1), 23–36. https://doi.org/10.60005/coreid.v3i1.92
Ashiddiq, M. N. (2024). Perancangan Ui/Ux Learning Management System (Lms) Aplikasi Mobile Edu-Learn Menggunakan Metode Design Thinking. Jurnal Informatika Dan Teknik Elektro Terapan, 12(1). https://doi.org/10.23960/jitet.v12i1.3693
Biya, A. N. A., Kolibu, M. J., Mambu, J. Y., & Tangka, G. M. W. (2024). Desain UI/UX Aplikasi Unklab Mobile Student Dengan Metode Design Thinking. Journal Cerita, 10(2), 145–156. https://doi.org/10.33050/cerita.v10i2.3362
Brooke, J. (1996). SUS: A “quick and dirty” usability scale. In P. W. Jordan, B. Thomas, B. A. Weerdmeester, & A. L. McClelland (Eds.), Usability evaluation i n industry (pp. 189–194). Taylor & Francis.+
Brown, T. (2009). Change by design: How design thinking creates new alternatives for business and society. Harper Business.
Chairunnisa, A. A., Widodo, S., & Majid, N. W. A. (2024). Perancangan Desain Ui/Ux Sistem E-Learning Menggunakan Metode Design Thinking. Journal of I nformation System Management (JOISM), 6(1), 1–9. https://doi.org/10.24076/joism.2024v6i1.1632
Chasanah, N. I., Meliala, R. J., Bintang, S., & Kuntari, W. (2024). Pembuatan Bisnis Ekstrakurikuler Desain UI/UX Berbasis Figma dengan Penerapan Business Model Canvas. Jurnal Ekonomi, Bisnis Dan Manajemen, 3(4), 114–129. https://doi.org/10.58192/ebismen.v3i4.2732
Fildza, M. A., Putra, A., & Nuryasin, I. (2025). JIPI (Jurnal Ilmiah Penelitian dan Pembelajaran Informatika) Journal homepage: https://jurnal.stkippgritulungagung.ac.id/index.php/jipi PERANCANGAN UI/UX WEBSITE SIM PMM DENGAN METODE HUMAN CENTERED DESIGN. 10(2), 949–958. https://doi.org/10.29100/jipi.v10i2.6054
Firjinia, R., Theo, M., Bangsa, A., Teknologi, S., Informasi, S., Islam, U., Sulthan, N., & Saifuddin, T. (2025). Perancangan UI / UX Sistem Informasi Akademik Berbasis Website Di Ponpes An-Nur Tangkit Muaro Jambi. 4(2), 1161–1168.
Hafidz, H. K., Sardi, I. L., & Wibowo, Y. F. A. (2024). Redesign E-learning with User Centered Design Method for Improved Accessibility Students. KLIK: Kajian Ilmiah Informatika Dan Komputer , 4(4), 2037–2045. https://doi.org/10.30865/klik.v4i4.1662
Harumsari, P., Nawwar Fikri, H., & Hannie, H. (2024). Rancang Interface Ui/Ux E - Learning Berbasis Web Menggunakan Metode User Centered Design Untuk Meningkatkan Efisiensi Kegiatan Belajar Mengajar. JATI (Jurnal Mahasiswa Teknik Informatika), 8(5), 10597–10607. Qhttps://doi.org/10.36040/jati.v8i5.10960
Hassenzahl, M., & Tractinsky, N. (2006). User experience – a research agenda. Behaviour & Information Technology, 25(2), 91–97. https://doi.org/10.1080/01449290500330331
HNW Syahuda Nahatmasuni, Anisa Herdiani, & Ati Suci Dian Martha. (2023). UI/UX Design for Student Discussion Applications Based Felder Silverman Learning Style with the Design Thinking Method. International Journal on Information and Communication Technology (IJoICT), 9(2), 29–40. https://doi.org/10.21108/ijoict.v9i2.754
Hudha, M., & Haryono, K. (2025). Perancangan Desain UI/UX Website E-Learning Berbasis Learning Management System dengan Metode Design Thinking. Jurnal Indonesia : Manajemen Informatika Dan Komunikasi, 6(1), 598–609. https://doi.org/10.35870/jimik.v6i1.1252
Imin, J. H., Fajar, M., & Hasniati. (2024). Perancangan UI/UX Website Search Buddy Menggunakan Pendekatan Design Thinking. Jurnal Ilmiah Media Sisfo, 18(1), 89–98. https://doi.org/10.33998/mediasisfo.2024.18.1.1642
Rahman, A. (2020). Rapid Application Development Sistem Pembelajaran Daring Berbasis Android. INTECH, 1(2), 20-25. Retrieved from https://www.jurnal.unbara.ac.id/index.php/INTECH/article/view/639
Jamilah, R. S., & Pasha, D. (2024). Perancangan UI/UX Smart Aset dan Infrastruktur Jaringan Universitas Teknokrat Indonesia: Pendekatan Human Centered Design. KLIK: Kajian Ilmiah Informatika Dan Komputer, 4(5), 2616–2627. https://doi.org/10.30865/klik.v4i5.1807
Joko Bintarto. (2025). UI/UX Design Aplikasi Belajar Online (Ayo Belajar) Menggunakan Metode Design Thinkingg. Misterius : Publikasi Ilmu Seni Dan Desain Komunikasi Visual., 2(1), 140–147. https://doi.org/10.62383/misterius.v2i1.550
Juansyah, F., & Indah, D. R. (2023). Application of design thinking method in redesigning the UI/UX of SIMAK (Academic Information System) of Sriwijaya University based on a mobile platform. Jurnal Teknologi Informasi Universitas Lambung Mangkurat (JTIULM), 8(1), 61–72.
Karimah, M., Supriyatna, S., & Rozali, C. (2024). Penggunaan Figma dalam Menggali Kreativitas Desain UI/UX Web pada SMK IT Bina Adzkia. JIPM: Jurnal Inovasi Pengabdian Masyarakat, 2(1), 6–10. https://doi.org/10.55903/jipm.v2i1.139
Karlina, D., & Indah, D. R. (2022). User Interface and User Experience Design of E- Learning Information System Using Design Thinking. Jurnal Teknik Informatika Dan Sistem Informasi, 8(3), 580–596.
Kurniyawan, A. B., & Informatika, T. (2025). Redesign UI / UX dengan Metode SUS dan UCD pada Website Akademik. 329–337. https://doi.org/10.47002/metik.v9i2.1093
Mengunakan, K., & Design, M. U. (2025). Swadharma (jeis). 05, 1–11.
Mirza, A., Lusita, M. D., & Diana, D. (2023). Design of Ui/Ux Applications for Mobile- Based E-Commerce Tech.an Gadgets Using the Design Method Thinking. Journal of Information System, Informatics and Computing, 7(1), 58. https://doi.org/10.52362/jisicom.v7i1.1085
Najib, M. K., Dellia, P., Mardiana Natarika, W., Azizatur Rokhmah, N., & Dwi Ningtias, A. (2025). Perancangan Ui/Ux Aplikasi Mobile Learning Management System (Lms) “Neoclass” Dengan Metode Design Thinking. JATI (Jurnal Mahasiswa Teknik Informatika), 9(4), 7065–7074. https://doi.org/10.36040/jati.v9i4.14282
Norman, D. A., & Draper, S. W. (1986). User centered system design: New perspectives on human-computer interaction. CRC Press.
Novianto, A. R., & Rani, S. (2022). Pengembangan Desain UI/UX Aplikasi Learning Management System dengan Pendekatan User Centered Design. Jurnal Sains, Nalar, Dan Aplikasi Teknologi Informasi, 2(1). https://doi.org/10.20885/snati.v2i1.16
Nur Rifa, N., & Darso. (2024). Perancangan Ulang Ui/Ux Design Facebook Lite App Menggunakan Metode Design Thinking. STORAGE: Jurnal Ilmiah Teknik Dan Ilmu Komputer, 3(1), 11–17. https://doi.org/10.55123/storage.v3i1.3111
Nur Saffanah, K., & Andrian, R. (2024). Perancangan Design Ui/Ux Pada Aplikasi Learning Management System Guna Meningkatkan Efektivitas Dan Kepuasan Pengguna Menggunakan Metode Design Thinking. Jurnal Mnemonic, 7(1), 23–30. https://doi.org/10.36040/mnemonic.v7i1.8474
Nurul Rizkyani, Ade Yusupa, Dhiva Runkat, & Luis Manoppo. (2025). Perancangan Desain UI/UX Untuk Aplikasi E-learning UMKM Manado dengan Penerapan Metode Design Thinking. Jurnal Mahasiswa Teknik Informatika, 4(1), 210–220. https://doi.org/10.35473/jamastika.v4i1.3943
Purnamasari, I., Kristianingrum, V., & Voutama, A. (2023). Mobile information academic-based UI/UX design system application using the design thinking method. In Proceedings of the 4th Borobudur International Symposium on Science and Technology (BIS-STE 2022) (pp. 684–695). Atlantis Press. https://doi.org/10.2991/978-94-6463-180-7_74
Raharja, S., Adianti, R., & Hafizha, F. Z. (2022). Pemanfaatan smartphone dalam pembelajaran digital. Jurnal Pendidikan Digital, 4(2), 31–40.
Rantung, R., & Mambu, J. Y. (2023). Perancangan UI/UX Untuk Aplikasi Kedai Online Menggunakan Metode Design Thinking. CogITo Smart Journal, 9(2), 396–410. https://doi.org/10.31154/cogito.v9i2.585.396-410
Ratnaningsih, D., & Rifai, A. (2024). Perancangan Ui/Ux Design Aplikasi Penilaian E- Raport Dengan Metode Pendekatan Design Thinking. Journal of Computer Science and Information Technology, 1(2), 75–88. https://doi.org/10.59407/jcsit.v1i2.559
Richi, M., Gunawan, J., Michael, M., & Farisi, A. (2025). Analisis Metode Perancangan dan Evaluasi UI/UX: Sebuah Tinjauan Literatur Sistematis. MDP Student Conference, 4(1), 601–608. https://doi.org/10.35957/mdp- sc.v4i1.11300
Risyda, F., Gardenia, Y., Awaludin, M., Lucia, Y., & Rehatalanit, R. (2014). Perancangan Desain UI/UX Website Sekolah Menggunakan Metode User Centered Design. Jurnal Sistem Informasi Universitas Suryadarma, 12(1), 165–174. https://doi.org/10.35968/jsi.v12i1.1352
Salsabilah, S., Wahyuddin, M. I., & Sari, R. T. K. (2022). Analisa UI/UX Terhadap Perancangan Website Laundry dengan Metode Human Centered Design dan User Experience Questionnaire. Jurnal Media Informatika Budidarma, 6(1), 720. https://doi.org/10.30865/mib.v6i1.3547
Satria, S. W. K., Icjelyfia, D., Lesmono, A. S., Ekarini, F., & Ristanto, R. D. (2024). Analisis Website Apple Berdasarkan Desain Antarmuka Pengguna (UI). JITU : Journal Informatic Technology And Communication, 8(2), 20–28. https://doi.org/10.36596/jitu.v8i2.1401
Senubekti, M. A., Dajoreyta, G. L., & Anggraini, N. (2024). Pembuatan Desain UI/UX dengan Metode Prototyping pada Aplikasi Layanan Pengadilan Negeri Bale Bandung menggunakan Figma. Jurnal Informatika Terpadu, 10(1), 1–10. https://doi.org/10.54914/jit.v10i1.1001
Sulastri, E. N., Yudha, D. S., & Efrat, A. R. (2024). Penerapan Metode User Centered Design Pada Perancangan Desain Ui/Ux Aplikasi Marketplace Catering. Jurnal Informatika Dan Teknik Elektro Terapan, 12(3), 2201–2209. https://doi.org/10.23960/jitet.v12i3.4702
Sunaryana, S., & Nisa, K. (2024). Perancangan Ui/Ux Aplikasi E-Learning Pada Mtss Irsyadul Athfal Menggunakan Metode Design Thinking. Jurnal Ilmiah Informatika, 12(01), 59–67. https://doi.org/10.33884/jif.v12i01.8326
Syaidah, E. R., Hartono, R., & Supriatman, A. (2025). Perancangan UI/UX Aplikasi Mobile Perpustakaan Digital Dengan Metode User Centered Design (UCD) Studi Kasus : Perpustakaan Universitas Perjuangan Tasikmalaya. Jurnal Elektro & Informatika, 5.
Tazkiyah, S., & Arifin, A. (2022). Perancangan UI/UX pada Website Laboratorium Energy menggunakan Aplikasi Figma. Jurnal Teknologi Terpadu, 8(2), 72–78. https://doi.org/10.54914/jtt.v8i2.513
Ulinuha, Z., Suakanto, S., & Alam, E. N. (2022). Perancangan User Interface Aplikasi Web E-Learning untuk Kader Kesehatan dengan Metode User- Centered Design (UCD). Jurnal Telematika, 17(1), 8–16. https://doi.org/10.61769/telematika.v17i1.462
UNESCO. (2021). Education: From disruption to recovery. United Nations Educational, Scientific and Cultural Organization. https://en.unesco.org/covid19/educationresponse
Yulia Sari, N., Faqihuddin Hanif, I., & Sofia, W. (2025). Perancangan Design UI/UX Media Pembelajaran Daring Dengan Pendekatan Design Thinking. Pondasi: Journal of Apllied Science Engineering, 2(2), 9–19.
Unduhan
Diterbitkan
Terbitan
Bagian
Lisensi
Hak Cipta (c) 2025 Seminar Nasional Econolearn
Artikel ini berlisensi Creative Commons Attribution 4.0 International License.
