MAHAROT: Journal of Islamic Education Vol. No. 2, 2023 ISSN: 2580-3980 . 2580-3999 . http://ejournal. id/index. php/maharot WEBSITE-BASED WUDU INTERACTIVE LEARNING ANIMATION TO INCREASE STUDENTS' LEARNING ENTHUSIASM ANIMASI PEMBELAJARAN INTERAKTIF WUDU BERBASIS WEBSITE UNTUK MENINGKATKAN ANTUSIASME BELAJAR PESERTA DIDIK Received 04-12-2023 Revised 25-12-2023 Accepted 29-12-2023 DOI : 10. 28944/maharot. Fariz Hendra Setiawan. Mario Azano. Andre Rivaldo Febriansyah. Muhamad Basyrul Muvid* Universitas Dinamika Surabaya *muvid@dinamika. Keywords: Kata kunci: Abstract Website-Based Wudu Learning Animation is an innovation in wudu learning aimed at the younger generation, especially young children. this lesson, animation is used to clarify the ablution process and make it interesting for children so as to improve the quality of their worship. The method used is the development of a website that contains interactive animations that show the steps for ablution visually. Each step is equipped with an explanation that is easy to understand and that children can follow. The result of this development is a learning website with the name (Wudu Splas. which can be accessed by anyone and at any time online and for free. It is hoped that with this website (Wudu Splas. , users can more easily understand and master the correct ablution techniques, as well as improve the quality of their Abstrak Animasi Pembelajaran Wudu Berbasis Website adalah sebuah inovasi dalam pembelajaran wudu yang ditujukan untuk generasi muda khususnya anak-anak usia dini. Dalam pembelajaran ini, animasi digunakan untuk memperjelas proses wudu dan membuatnya menarik bagi anak-anak sehingga dapat meningkatkan kualitas ibadah mereka. Metode yang digunakan adalah pengembangan website yang berisi animasi interaktif yang memperlihatkan langkah-langkah wudu secara Setiap langkah dilengkapi dengan penjelasan yang mudah dipahami dan dapat diikuti oleh anak-anak. Hasil dari pengembangan ini adalah sebuah website pembelajaran dengan nama (Wudu Splas. yang dapat diakses oleh siapa saja dan kapan saja secara online dan Diharapkan dengan adanya website (Wudu Splas. ini, pengguna Fariz HS. Mario A. Andre RF. Muhamad B M| MAHAROT Vol. No. 2, 2023 dapat lebih mudah memahami dan menguasai teknik berwudu yang benar, serta meningkatkan kualitas ibadah mereka. AMAHAROT: Journal of Islamic Education. This work is licensed under CC BY-NC-SA 4. PENDAHULUAN Pembelajaran berbasis teknologi informasi dan komunikasi (TIK) telah menjadi fenomena yang semakin populer dalam dunia pendidikan, salah satu bentuk pembelajaran berbasis TIK adalah animasi pembelajaran interaktif. Animasi Pembelajaran Interaktif Wudu Berbasis Website adalah suatu inovasi dalam pembelajaran agama Islam khususnya mengenai cara berwudu (Santoso & Utomo. Pada era digital seperti sekarang, pembelajaran melalui media online menjadi sangat penting, terutama bagi generasi muda yang lebih mengandalkan teknologi khususnya anak-anak usia dini. Pembelajaran melalui animasi interaktif memberikan pengalaman belajar yang lebih menyenangkan dan efektif, karena selain dapat dipahami dengan mudah, juga dapat memberikan pengalaman langsung dalam simulasi praktik Dalam konteks agama Islam, pembelajaran wudu menjadi salah satu topik yang penting untuk dipelajari oleh umat muslim. Wudu adalah ritual pembersihan diri sebelum melakukan ibadah sholat. Wudu disyariatkan bukan hanya ketika kita hendak beribadah, bahkan juga disyariatkan pada seluruh kondisi. Allah telah berfirman tentang wudu dalam Quran (Qs. Almaidah: . Oleh karena itu, seorang muslim dianjurkan agar selalu dalam kondisi bersuci . sebagaimana yang dahulu dilazimi oleh Nabi Muhammad SAW dan para sahabatnya yang mulia (Muna & Fauziyah, 2. Dalam praktiknya, cara berwudu yang benar tidak hanya membutuhkan pemahaman, namun juga perlu dilakukan dengan urutan dan teknik yang benar. Oleh karena itu, penggunaan teknologi animasi pembelajaran interaktif dalam pembelajaran wudu dapat menjadi solusi yang efektif untuk membantu pengguna dalam memahami dan menguasai teknik berwudu yang benar. Dalam penelitian ini, kami membuat sebuah Animasi Pembelajaran Interaktif Wudu Berbasis Website dengan nama (Wudu Splas. yang menyediakan animasi pembelajaran interaktif wudu juga dapat diakses oleh siapa saja dan kapan saja secara online dan gratis, sehingga memudahkan pengguna dalam mempelajari dan mempraktikkan ilmu yang telah dipelajari (Hompu et al. , 2. Website (Wudu Splas. ini dibuat dengan tujuan membantu pengguna dalam mempelajari teknik berwudu secara interaktif melalui animasi dan multimedia. Fariz HS. Mario A. Andre RF. Muhamad B M| MAHAROT Vol. No. 2, 2023 memberikan nilai tambah seperti kedisiplinan, kesabaran, dan kecintaan terhadap Pengguna juga dapat mengikuti latihan dan mengevaluasi pemahaman mereka dengan menggunakan fitur kuis pada aplikasi. Diharapkan dengan adanya website (Wudu Splas. ini, pengguna dapat lebih mudah memahami dan menguasai teknik berwudu yang benar, serta meningkatkan kualitas ibadah mereka (Pambudi & Fauzi. Hal tersebut sebagai solusi terhadap materi wudu yang sering terjadi ketidakpahaman siswa antara materi dengan praktik. Mengingat, wudu sebagai materi yang membutuhkan praktik, sehingga diperlukan teknik praktik yang jelas, mudah dan simpel (Inar et al. , 2. Melalui desain animasi ini diharapkan menjadi solusi buat peserta didik untuk bisa mempraktikkan wudu secara benar, menyenangkan dan antusias, sehingga berdampak pada semangat beribadah . Jika wudu dikemas secara konseptual, tanpa dipraktikkan atau dipraktikkan dengan Auala kadarnyaAy maka secara langsung juga akan mempengaruhi antusiasme mereka dalam melaksanakan ibadah salat. Untuk itu, kajian penelitian ini fokus pada bagainama desain animasi berbasis web pada materi wudu bisa menarik antusiasme peserta didik sehingga mereka mudah dalam mempraktikkan wudu. METODE PENELITIAN Metode yang digunakan dalam penelitian ini adalah metode participatory design yang dimana metode ini dapat didefinisikan sebagai proses untuk memeriksa, memahami, membangun dan membantu keinginan dari beberapa partisipan dalam membangun suatu desain. Para partisipan biasanya memiliki 2 peran penting dalam proses ini. Peran tersebut yaitu sebagai pengguna atau user yang mana mampu menyampaikan keinginan yang ingin dicapai dalam suatu desain dan sebagai desainer yang mempelajari situasi pengguna secara nyata. HASIL DAN PEMBAHASAN Dalam pembuatan website peneliti terlebih dahulu melakukan kajian terkait Software atau aplikasi yang sesuai, di antaranya: Pertama. Wordpress. Wordpress pertama kali diluncurkan pada tahun 2003 oleh 2 developer. Matt Mullenweg dan Mike Little. Dan itu merupakan awal dari bagaimana platform blogging terbesar di internet terbentuk. Wordpress merupakan content Fariz HS. Mario A. Andre RF. Muhamad B M| MAHAROT Vol. No. 2, 2023 management system (CMS) yang merupakan sebuah power pada website. Sebuah CMS memungkinkan seseorang yang mungkin kurang memahami code, dapat membuat dan mempublikasikan konten secara online. Gambar 1. Logo WordPress . ttps://. CMS bekerja seperti penerjemah untuk orang-orang yang kurang mengerti code dapat membangun website yang bekerja secara tepat. Platform ini menawarkan dua cara kerja yang berbeda. Yang pertama yaitu blogging sederhana, yaitu Wordpress. dan yang kedua merupakan platform yang lebih kompleks. Wordpress. org (Simonsen & Robertson, 2. Wordpress memiliki beberapa keunggulan, antara lain: . bersifat bebas karena memiliki lisensi dibawah GPL (GNU Public Licens. , . dapat digunakan tanpa menggunakan koneksi internet . dengan menggunakan web server yang diinstal secara lokal, . dapat diinstal pada web hosting yang mendukung penggunaan PHP dan MySQL, . dapat dengan mudah disesuaikan . , dan . Menyediakan banyak tema dan plugin (Nielsen Norman Group, n. Kedua. H5P. H5P (HTML 5 Packe. merupakan plugin open source yang berbasis komunitas untuk membuat konten-konten HTML 5 yang interaktif. Tujuan H5P adalah untuk memberikan fasilitas dalam berbagai konten yang dapat diakses dan memudahkan pada content creator dalam mempublikasi karyanya seperti animasi interaktif, gambar dan sebagainya. Gambar 2. Logo H5P . ttp://Qurani. Plugin pada H5P ini memiliki banyak kelebihan dan keuntungan, di antaranya adalah plugin ini gratis untuk digunakan dan dapat digunakan dalam berbagai Plugin ini juga memudahkan pengguna untuk membuat kontenAekonten Fariz HS. Mario A. Andre RF. Muhamad B M| MAHAROT Vol. No. 2, 2023 berupa video, animasi, edukasi dan sebagainya, dengan memberikan interaksi pada konten tersebut. Pada laman resminya terdapat panduan tata cara membuat interaksi pada suatu konten. Dengan menggunakan plugin H5P dapat memudahkan orang dalam proses pembelajaran dengan animasi yang dapat diinteraksi (Nkearns, 2. Animasi Pembelajaran Interaktif Wudu Berbasis Website Proses pembuatan dilakukan melalui software Adobe Ilustrator untuk pembuatan asset animasi wudhu. Nama Gerakan Membaca Niat Wudu Keterangan Asset Niat ini adalah suatu keinginan dalam hati untuk melakukan wudu sebagai ibadah kepada Allah SWT. ambar: Niat wudu. Sumber: Mencuci Tangan Berkumur Mencuci tangan sampai pergelangan tangan sebanyak 3 kali, maksud dari tindakan ini adalah membersihkan kedua tangan dari segala macam kotoran dan najis yang mungkin ada pada tangan. Mencuci Sumber: Berkumur-kumur lalu sebanyak 3 kali. Hal ini dilakukan untuk membersihkan mulut, gigi dari kotoran dan . ambar: Berkumur. Sumber: Fariz HS. Mario A. Andre RF. Muhamad B M| MAHAROT Vol. No. 2, 2023 Membersihkan Hidung Membersihkan hidung dengan air sebanyak 3 kali. Hal ini dilakukan untuk membersihkan agar bersih dari kotoran dan najis. Membersihkan Sumber: Membasuh Wajah Membasuh muka secara menyelutuh dari ujung dahi sampai akhir dagu 3 kali agar bersih dari kotoran dan najis. ambar: Membasuh Sumber: Membasuh Lengan Kedua Membasuh Atas Kepala Membasuh kedua lengan sampai siku sebanyak 3 kali, dimulai dari lengan kanan kemudian dilanjutkan ke lengan kiri. Maksud dari tindakan ini adalah membersihkan kedua lengan dari kotoran dan najis. Mengusap kepala sebanyak 3 kali, dimulai dari bagian atas kepala hingga ujung rambut di belakang kepala. Maksud dari tindakan ini adalah membersihkan kepala dari kotoran dan najis. ambar: Membasuh Sumber: ambar: Membasuh atas kepala. Sumber: Fariz HS. Mario A. Andre RF. Muhamad B M| MAHAROT Vol. No. 2, 2023 Membersihkan Telinga Membasuh Kedua Kaki Membasuh kedua telinga sebanyak 3 kali, yaitu dengan mengusap telinga bagian luar dengan jari telunjuk dan ibu jari. Maksud dari tindakan ini adalah membersihkan telinga dari kotoran dan najis. Membasuh kedua kaki dari ujung jari sampai mata kaki sebanyak tiga kali, dimulai dari kaki kanan kemudian dilanjutkan ke kaki kiri. Maksud dari tindakan ini adalah membersihkan kedua kaki dari kotoran dan . Membersihkan Sumber: ambar: Membasuh kedua kaki. Sumber: Berdasarkan penjelasan di atas dapat dipahami bahwa hasil yang dibuat merupakan berbasis vektor agar gambar yang akan ditampilkan pada website nantinya tidak pecah. Penataan Komposisi Konten pada Website Setelah proses digitalisasi aset, aset kemudian memasuki tahap layouting atau penataan komposisi. Pada proses ini merupakan gambaran bagaimana hasil jadi dari website nantinya Fariz HS. Mario A. Andre RF. Muhamad B M| MAHAROT Vol. No. 2, 2023 Gambar 3. Layout Website. (Sumber: dokumentasi penelit. Pada animasi terdapat simbol berupa Au Ay yang jika di klik akan muncul penjelasan lebih lanjut mengenai animasi tersebut. Animasi berbasis website pada materi wudu ini diharapkan memberikan kemudahan belajar kepada peserta didik, sehingga praktik wudu bisa dilakukan dengan mudah tanpa mengalami kesulitan sedikitpun (Arinal et al. , 2. Animasi sebagai deskripsi gambaran secara visual yang membantu mengasah kemampuan motorik dan kognitif peserta didik, dalam arti lain animasi ini memberikan sumbangsih terhadap pemahaman, pengetahuan dan keterampilan peserta didik dalam mengimplementasikan wudu yang itu menjadi syarat utama . sebelum melaksanakan salat (Setiawan et al. , 2. (Rahayu & Denenty. Pembuatan animasi berbasis website untuk materi wudu secara langsung dapat meningkatkan motivasi dan semangat belajar peserta didik. Hal ini sesuai riset Agustin, dkk . , yang menyimpulkan bahwa materi wudu yang didesain berbasis teknologi dapat meningkatkan antusiasme peserta didik, sehingga mereka lebih tertarik. Suhariyaningsih . menyebutkan bahwa implementasi wudu tidak bisa dipahami hanya dengan metode ceramah, karena materi tersebut berbasis demo . , untuk memudahkan anak-anak dalam mengimplementasikan wudu maka dibutuhkan sarana media yang tepat sehingga praktik wudu bisa efektif dan efisien. SIMPULAN Berdasarkan tulisan di atas pembelajaran interaktif animasi berbasis website adalah sebuah metode pembelajaran yang menggunakan animasi sebagai media utama untuk menyampaikan materi pembelajaran wudu dan memfasilitasi interaksi antara Fariz HS. Mario A. Andre RF. Muhamad B M| MAHAROT Vol. No. 2, 2023 pengajar dan peserta didik melalui website. Metode ini memiliki beberapa keunggulan seperti visualisasi materi pembelajaran, interaksi yang aktif, penilaian real-time, aksesibilitas dan fleksibilitas, pengayaan pembelajaran, kreativitas dan inovasi, serta dukungan visual dan auditori. Pembelajaran interaktif animasi berbasis website dapat memberikan berbagai manfaat seperti meningkatkan pemahaman materi, memotivasi peserta didik, meningkatkan retensi informasi, meningkatkan keterlibatan peserta didik, meningkatkan pembelajaran mandiri, menyediakan umpan balik secara real-time, dan menggali kreativitas dan inovasi. Cara kerja pembelajaran interaktif animasi berbasis website meliputi pembuatan konten animasi, integrasi dengan website, interaksi peserta didik, umpan balik dan evaluasi, pengaturan dan pelacakan pembelajaran, serta akses dan penggunaan. DAFTAR PUSTAKA