Pengembangan Antarmuka Pengguna Interaktif Mathporia Berbasis Tailwind CSS untuk Pembelajaran Matematika
Abstract
Abstrak — Frontend merupakan elemen krusial dalam pengembangan aplikasi pembelajaran berbasis web karena menjadi titik interaksi utama antara pengguna dan sistem. Penelitian ini membahas pengembangan sisi frontend platform Mathporia, sebuah sistem pembelajaran interaktif yang dikembangkan untuk meningkatkan kreativitas dan keterlibatan siswa di SMP Negeri 21 Kota Bekasi. Pendekatan yang digunakan adalah EduKreativa, yang mengintegrasikan empat elemen utama: komunitas diskusi, sesi penalaran matematika langsung, gamifikasi, dan konten multimedia kontekstual. Proses perancangan frontend meliputi analisis kebutuhan pengguna (guru, siswa, admin), pembuatan prototype UI menggunakan Figma, pengujian rancangan berdasarkan prinsip user experience (UX), pemilihan framework Laravel Blade dan TailwindsCSS untuk konsistensi tampilan, serta implementasi fitur interaktif seperti forum diskusi, kuis adaptif, kalender pembelajaran, dan progress tracking berbasis capaian. Pengujian usability dan compatibility dilakukan pada berbagai perangkat, termasuk desktop, tablet, dan ponsel pintar, guna memastikan kenyamanan dan aksesibilitas pengguna. Hasil pengujian menunjukkan tingkat kepuasan pengguna sebesar 91% pada aspek kemudahan navigasi dan 88% pada aspek tampilan visual. Dengan penerapan desain yang responsif, intuitif, dan menarik, frontend Mathporia dinilai berhasil memenuhi kebutuhan pengguna, meningkatkan motivasi belajar, serta mendukung proses pembelajaran yang kreatif, kolaboratif, dan adaptif terhadap perkembangan teknologi pendidikan. Kata kunci— frontend, UI/UX, pembelajaran interaktif, Laravel Blade, gamifikasi
References
S. Suprianto, "Pengembangan Media Pembelajaran
Interaktif Berbasis Web," Jurnal Pendidikan Informatika dan
Sains, vol. 8, no. 2, pp. 145–156, Dec. 2019.
Iklima Mardiana, Wahyudin, dan Enjun Junaeti,
"Development of Learning Management System with Laravel
Framework and Tailwind CSS," MULTINETICS, vol. 10, no.
, pp. 40–49, May 2024.
Dery Antoro & Sri Wahyuni, "Design and Development
of an E-learning Information System Using the Laravel
Framework at SMA Negeri 3 Medan," Journal of Information
Technology, Computer Science and Electrical Engineering,
vol. 1, no. 3, pp. 142–151, Oct. 2024.
Camacho-Sánchez, R., Rillo-Albert, A., dan LavegaBurgués, P., "Gamified Digital Game-Based Learning as a
Pedagogical Strategy: Student Academic Performance and
Motivation," Applied Sciences, vol. 12, no. 21, p. 11214,
Klaudia Bovermann, Joshua Weidlich, dan Theo
Bastiaens, "Online Learning Readiness and Attitudes
Towards Gaming in Gamified Online Learning – A Mixed
Methods Case Study," International Journal of Educational
Technology in Higher Education, vol. 15, article 27, 2
R. E. Mayer, Multimedia Learning, 2nd ed. Cambridge,
UK: Cambridge University Press, 2009.



