PERANCANGAN UI/UX MOBILE PRESENSI KEHADIRAN SISWA DAN GURU DI SMP ADAB KESUMA BANGSA MENGGUNAKAN METODE DESIGN THINKING

Anisa, Ika Dyah Prameswari (2026) PERANCANGAN UI/UX MOBILE PRESENSI KEHADIRAN SISWA DAN GURU DI SMP ADAB KESUMA BANGSA MENGGUNAKAN METODE DESIGN THINKING. Diploma thesis, UIN RADEN INTAN LAMPUNG.

PDF Download (10MB)

Abstract

ABSTRAK SMP Adab Kesuma Bangsa menghadapi tantangan pada sistem presensi yang lambat, rentan terjadi human error, dan menyulitkan pemantauan real-time oleh orang tua. Sistem web sebelumnya juga gagal karena tidak kompatibel dengan perangkat mobile, memiliki desain antarmuka (UI) yang kaku, dan tidak user-friendly. Penelitian ini bertujuan untuk merancang dan mengimplementasikan UI/UX aplikasi presensi berbasis Web mobile yang efektif dan intuitif menggunakan metode Design Thinking untuk mengahasilkan antarmuka yang efektif dan intuitif. Penelitian ini menggunakan model R&D dengan kerangka kerja ADDIE yang diimplementasikan melalui lima tahapan Design Thinking. Tahap Analyze (Empathize dan Define) mengidentifikasi kebutuhan pengguna . Tahap Design (Ideate) menghasilkan arsitektur informasi dan diagram UML untuk empat peran pengguna. Tahap Development (Prototype) mewujudkan rancangan yang menghasilkan prototipe fungsional berbasis web mobile. Tahap Implement and Evaluate (Test) menggunakan dua pendekatan: (1) Validasi Ahli oleh satu Dosen Ahli Teknologi menggunakan angket validasi , dan (2) Unmoderated Remote Usability Testing di platform Maze terhadap 5 pengguna akhir (1 Admin, 2 Wali Kelas, 2 Guru) . Hasil penelitian ini adalah prototipe fungsional yang telah divalidasi dan diuji. Hasil Validasi Ahli menyatakan prototipe "Layak... dengan revisi" , yang mengarah pada perbaikan bug teknis (pada fitur presensi QR) dan penambahan fitur manajerial (Dashboard Pimpinan dan Manajemen Cuti) . Hasil Usability Testing pada prototype final menunjukkan tingkat usability yang sangat tinggi dengan metrik: efektivitas 92,31% , efisiensi 24,77 detik per tugas , dan kepuasan 4,62 dari 5. Disimpulkan bahwa sistem ini sangat efektif dan memuaskan, namun ditemukan satu anomali (kegagalan 50% pada tugas "Presensi Pribadi" ) yang mengindikasikan perlunya perbaikan pada kejelasan label menu . Kata Kunci: Design Thinking, perancangan UI/UX, presensi, Usability Testing, web mobile. ABSTRACT SMP Adab Kesuma Bangsa faces challenges with its attendance system, which is slow, prone to human error , and complicates real time monitoring by parents. The previous web system also failed as it was not compatible with mobile devices, had a rigid user interface (UI) , and was not user-friendly. This research aims to design and implement an effective and intuitive UI/UX for a mobile-web-based attendance application using the Design Thinking method to address these problems. This study uses an R&D model with the ADDIE framework, implemented through the five stages of Design Thinking. The Analyze stage (Empathize and Define) identified user needs . The Design stage (Ideate) produced the information architecture and UML diagrams for four user roles. The Development stage (Prototype) realized the design into a functional prototype using Laravel and Tailwind CSS . The Implement and Evaluate stage (Test) used two approaches: (1) Expert Validation by one Technology Expert Lecturer using a validation questionnaire , and (2) Unmoderated Remote Usability Testing on the Maze platform with 5 end-users (1 Admin, 2 Homeroom Teachers, 2 Teachers) . The result of this research is a functional prototype that was validated and tested. The Expert Validation results declared the prototype "Feasible... with revisions," which led to technical bug fixes (in the QR attendance feature) and the addition of managerial features (Leader's Dashboard and Leave Management) . The Usability Testing on the final prototype showed a very high level of usability with metrics: 92,31% effectiveness, 24,77 seconds per task efficiency, and 4,62 out of 5 satisfaction. It is concluded that this system is highly effective and satisfactory, yet one anomaly was found (a 50% failure rate on the "Personal Attendance" task), indicating a need for improvement in menu label clarity . Keywords: UI/UX Design, Design Thinking, Attendance, Mobile Web, Usability Testing.

Actions (login required)

View Item