Multimedia Interaktif Berbasis Progressive Web Application (PWA) pada Materi HTML Dasar dengan Metode Tutorial

Abstract

Pandemi Covid-19 membuat pembelajaran dilaksanakan secara jarak jauh dan daring sehingga guru dituntut untuk cermat memilih media pembelajaran yang tepat agar peserta didik dapat diarahkan untuk belajar secara mandiri. Media pembelajaran interaktif yang memungkinkan peserta didik untuk berinteraksi langsung dengan program dapat menjadi pilihan yang tepat untuk membantu peserta didik belajar secara mandiri. Sejalan dengan hal tersebut, penelitian ini bertujuan untuk mengembangkan media pembelajaran interaktif berbasis web berbantuan teknologi progressive web application (PWA) pada materi HTML dasar dan mendeskripsikan kelayakan media yang dikembangkan tersebut berdasarkan 3 kriteria kelayakan yaitu validitas, praktikalitas, dan efektivitas. Metode yang digunakan dalam penelitian ini adalah Research and Development dengan model pengembangan ADDIE. Desain uji coba yang digunakan pada tahap implementasi adalah One Group Pretest-Posttest Design dengan subjek uji coba 20 orang peserta didik dan 1 orang guru SMKN 4 Banjarbaru. Teknik pengumpulan data yang digunakan adalah observasi, angket, serta tes. Sedangkan instrument pengumpulan data yang digunakan adalah soal tes yang digunakan untuk mendapatkan data hasil belajar peserta didik, lembar validitas untuk mendapatkan data validitas materi dan media, serta lembar respon pengguna untuk mendapatkan data respon guru dan peserta didik. Teknologi yang digunakan dalam mengembangkan media adalah HTML, CSS, Bootstrap, Javascript, Firebase Cloud Firestore, Progressive Web Application, AceEditor, dan Netlify. Hasil yang didapatkan dari penelitian ini adalah media pembelajaran interaktif pada materi HTML dasar yang layak digunakan dalam proses pembelajaran karena telah memenuhi 3 kriteria kelayakan yaitu (a) hasil validitas materi mencapai 85% dengan tingkat validitas sangat tinggi dan hasil validitas media mencapai 80,8% dengan tingkat validitas sangat tinggi sehingga media tergolong valid; (b) hasil respon guru dan peserta didik positif sehingga media tergolong praktis; (c) hasil tes hasil belajar peserta didik memperoleh skor n-gain sebesar 0,51 dengan kategori sedang sehingga media tergolong efektif.

The Covid-19 pandemic made learning carried out remotely and online, so teachers must carefully choose the suitable learning media so that students can be directed to learn independently. Interactive learning media that allows learners to interact directly with the program can be the right choice to help learners learn independently. This study aims to develop web-based interactive learning media assisted by progressive web application (PWA) technology in basic HTML materials and describe the feasibility of the created media based on 3 feasibility criteria, namely validity, practicality, and effectiveness. The method used in this research is Research and Development with the ADDIE development model. The trial design used at the implementation stage is One Group Pretest-Posttest Design with 20 learners and 1 teacher of SMKN 4 Banjarbaru. The data collection techniques used are observations, questionnaires, and tests. While the data collection instrument used is a test question used to get student learning outcome data, a validity sheet to get material and media validity data, and a user response sheet to get teacher and learner response data. The technologies used in developing media are HTML, CSS, Bootstrap, Javascript, Firebase Cloud Firestore, Progressive Web Application, AceEditor, and Netlify. The results obtained from this study are interactive learning media on basic HTML materials that are suitable for use in the learning process because they have met 3 eligibility criteria, namely (a) the material validity results reach 85% with a very high validity level, and the media validity results reach 80.8% with a very high validity level so that the media is classified as valid; (b) the results of the response of teachers and learners are favorable so that the media is relatively practical; (c) the results of the learner's learning outcome test obtained an n-gain score of 0.51 with a medium category so that the media was relatively effective.