PERANCANGAN UI/UX PADA WEBSITE EDUKASI CODING UNTUK ANAK DENGAN METODE DESIGN THINGKING
INDONESIA
DOI:
https://doi.org/10.23960/jitet.v13i3S1.7524Abstract Views: 67 File Views: 39
Keywords:
Design Thingking, Information Systems, User Experience, User Interface, WebsiteAbstract
Penelitian ini bertujuan untuk merancang User Interface (UI) dan User Experience (UX) pada platform edukasi coding bagi anak-anak usia 6-11 tahun dengan pendekatan metode Design Thinking. Metode ini terdiri dari lima tahapan utama yaitu, Empathize, Define, Ideate, Prototype, dan Test. Penelitian ini dilakukan dengan mengidentifikasi kebutuhan pengguna melalui riset sekunder dan pembuatan User Persona yang merepresentasikan karakteristik, aktivitas, serta tujuan belajar anak-anak. Selain itu, wawancara dengan orang tua dan pengamat pendidikan digunakan untuk memperkaya data kebutuhan pengguna. Prototype high-fidelity dikembangkan menggunakan Figma, mengedepankan elemen visual yang menarik, dan desain interaktif. Usability Testing dilakukan dengan melibatkan enam responden untuk mengevaluasi efektivitas desain dan mengidentifikasi potensi perbaikan. Temuan ini menegaskan pentingnya pendekatan berbasis empati dalam memberikan pengetahuan belajar yang menarik dan efektif bagi anak-anak. Rekomendasi untuk pengembangan lebih lanjut mencakup integrasi fitur gamifikasi guna meningkatkan motivasi belajar, eksplorasi penggunaan teknologi augmented reality (AR) untuk pengalaman yang lebih mendalam, serta uji coba pada kelompok usia yang lebih luas untuk validasi efektivitas desain.
This research aims to design User Interface (UI) and User Experience (UX) for a coding education platform for children aged 6-11 years using the Design Thinking method. This method consists of five stages: Empathize, Define, Ideate, Prototype, and Test. The research identified user needs through secondary research and created User Personas representing children's characteristics, activities, and learning goals. Additionally, interviews with parents and education observers enriched the user data. A high-fidelity prototype was developed using Figma, emphasizing attractive visuals and interactive design. Usability testing involved six respondents to evaluate design effectiveness and identify improvements. This included observing how children used the platform to complete specific tasks, such as interactive quizzes or coding challenges. Results showed the prototype met users' needs with a high success rate in task completion. Findings confirm the importance of an empathy-based approach in creating engaging learning experiences for children. Recommendations for further development include integrating gamification features to boost learning motivation, exploring augmented reality (AR) technology for a more immersive experience, and testing on a wider age group to validate design effectiveness.
Downloads
References
M. A. Muhyidin, M. A. Sulhan, and A. Sevtiana, “Perancangan Ui/Ux Aplikasi My Cic Layanan Informasi Akademik Mahasiswa Menggunakan Aplikasi Figma,” J. Digit, vol. 10, no. 2, p. 208, 2020, doi: 10.51920/jd.v10i2.171.
A. P. Qirani, P. Dellia, I. I. Laili, S. P. Cahyani, N. Rizqiullah, and A. Zahrial, “Perancangan UI/UX Aplikasi Penjualan Makanan Berbasis Mobile Menggunakan Aplikasi FIGMA,” J. Media Inform. [Jumin], vol. 5, no. 2, pp. 189–195, 2024.
M. A. Senubekti, G. L. Dajoreyta, and N. Anggraini, “Pembuatan Desain UI/UX dengan Metode Prototyping pada Aplikasi Layanan Pengadilan Negeri Bale Bandung menggunakan Figma,” J. Inform. Terpadu, vol. 10, no. 1, pp. 1–10, 2024, doi: 10.54914/jit.v10i1.1001.
G. S. Syaharani and W. Sulastri, “Pembuatan Desain UI / UX Dengan Metode Prototyping Pada Aplikasi Perpustakaan Pintar Di SMK Pasundan Rancaekek Menggunakan Tools Figma,” vol. 4, no. 2, 2024.
Y. A. Dio and E. Ekohariadi, “Pengembangan Media Pembelajaran Berbasis Web Dalam Meningkatkan Efektivitas Pembelajaran Pemrograman Web ( Studi Kasus : Smks Semen Gresik ),” IT-Edu J. Inf. Technol. Educ., vol. 6, no. 2, pp. 139–152, 2021.
R. E. Putri, Y. Yusman, and Y. Wira Pratama, “UI/UX Design of Early Childhood Learning Applications Using Figma,” Systematics, vol. 4, no. 3, pp. 525–533, 2022.
A. M. Alhababy, “Menumbuhkan Minat Belajar Pemrograman Siswa Sekolah Dasar Menggunakan Javascript,” vol. 14, no. 5, pp. 1–23, 2024.
M. F. Santoso, “Implementasi Konsep dan Teknik UI/UX Dalam Rancang Bangun Layout Web dengan Figma,” J. Infortech, vol. 4, no. 2, pp. 156–163, 2022, [Online]. Available: http://ejournal.bsi.ac.id/ejurnal/index.php/infortech156
M. A. Yogatura and A. Voutama, “Perancangan Ui/Ux Untuk Platform E-Learning Kelas Fotografi Dan Videografi Berbasis Web Menggunakan Figma,” JATI (Jurnal Mhs. Tek. Inform., vol. 8, no. 3, pp. 2735–2742, 2024, doi: 10.36040/jati.v8i3.9552.
F. T. Pamungkas, “Perancangan UI/UX Aplikasi Variety off Food Layanan Penjualan Makanan Secara Online Menggunakan Aplikasi Figma,” JPIn J. Pendidik Indones., vol. 6, no. 1, pp. 165–183, 2023, doi: 10.47165/jpin.v6i1.497.
M. B. Thoyyib and D. Hafidh Zulfikar, “Desain UI/UX Website Referral untuk Program Gerakan Funding Culture Menggunakan Figma,” Pros. Semin. Nas. Teknol. Komput. dan Sains, vol. 1, no. 1, pp. 232–241, 2023.
A. S. Darsanjaya, A. Masum, and A. A. Ridha, “Perancangan Ui/Ux Pada Wesbite Manufaktur Dengan Metode Design Thinking Process (Studi Kasus: Pt. Trijaya Teknik Karawang),” J. Inform. dan Tek. Elektro Terap., vol. 13, no. 2, 2025, doi: 10.23960/jitet.v13i2.6068.
S. Tazkiyah and A. Arifin, “Perancangan UI/UX pada Website Laboratorium Energy menggunakan Aplikasi Figma,” J. Teknol. Terpadu, vol. 8, no. 2, pp. 72–78, 2022, doi: 10.54914/jtt.v8i2.513.
A. M. Yusuf, R. Gunawan, A. Priatna, and R. A. Pardian, “Perancangan UI/UX Sistem Informasi Pembayaran Pengunaan Air Dengan Metode Design Thinking Pada Website PDAM Karawang,” J-SISKO TECH (Jurnal Teknol. Sist. Inf. dan Sist. Komput. TGD), vol. 6, no. 1, p. 8, 2023, doi: 10.53513/jsk.v6i1.7359.
S. Soedewi, “Penerapan Metode Design Thinking Pada Perancangan Website Umkm Kirihuci,” Vis. J. Online Desain Komun. Vis., vol. 10, no. 02, p. 17, 2022, doi: 10.34010/visualita.v10i02.5378.
Downloads
Published
How to Cite
Issue
Section
License
Copyright (c) 2025 Jurnal Informatika dan Teknik Elektro Terapan

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



