117

BAB IV

ANALISIS DAN HASIL PENGEMBANGAN

A. Analisis Data

Data yang berhasil dikumpulkan dalam penelitian pengembangan ini

secara garis besar dikelompokkan menjadi dua macam, yaitu data teknis dan

data non teknis. Data teknis adalah data terkait pengembangan langsung

halaman web untuk media pembelajaran. Sedangkan data non teknis adalah data

sebagai bahan yang akan dijadikan modal dalam melakukan pengembangan.

Keduanya merupakan data yang saling mendukung dan tidak bisa dikatakan

mana yang lebih penting atau lebih utama dalam bingkai pengembangan sebuah

media pembelajaran berbasis web.

Data teknis adalah data yang berhasil dihimpun peneliti untuk keperluan

pengembangan media pembelajaran. Seperti data tentang kodifikasi dalam

pengembangan halaman web. Script-script hasil trial and develop yang

dilakukan selama pengembangan, serta data hasil studi pustaka baik dari buku

tentang bahasa pemograman PHP, MySQL, dan lainnya maupun tutorial dari

dunia maya yang diperoleh dengan memanfaatkan situs mesin pencari, Google.

Sedangkan data non teknis adalah data yang tidak terkait secara langsung dalam

proses pengembangan halaman web sebagai media pembelajaran mata pelajaran

PAI untuk kelas X di tingkat satuan pendidikan sekolah menengah atas. Seperti

data tentang kebutuhan pembelajaran dan lainnya. Karena data teknis dihimpun

dengan mendasarkan kepada data non teknis, maka pemaparan data teknis

118

118

terkait pengembangan media pembelajaran berbasis web dilakukan setelah

pemaparan data non teknis seperti berikut.

1. Data Non Teknis

Termasuk ke dalam kategori data non teknis adalah seperti hasil

observasi pembelajaran PAI di kelas, hasil analisis kebutuhan siswa dan

guru dalam pembelajaran, analisis kurikulum/silabus, RPP dan buku ajar

yang digunakan untuk siswa kelas X di SMA Al-Falah Ketintang Surabaya.

a. Hasil observasi pembelajaran di kelas

Metode dan strategi yang digunakan guru cukup kreatif dan

bervariatif, dengan didukung oleh sarana pembelajaran yang memadai.

Media video dengan pemutaran film dokumenter yang mengisahkan

sejarah sahabat Rasulullah SAW atau penugasan dengan membuat slide

presentation untuk mengasah kemampuan siswa dalam ranah kognitif

(pemahaman) dan keterampilan (psikomotorik) dalam

mengkomunikasikan atau mempraktekkan hasil pembelajaran.

Dari segi siswa, menurut hasil pengamatan (observasi) terkadang

motivasi dan aktifitas naik turun sehingga target pembelajaran yang

diperoleh tidak sesuai dengan yang diharapkan. Pemutaran video dalam

waktu tertentu dalam upaya menyampaikan pesan pembelajaran perlu

mendapatkan apresiasi, namun waktu menonton yang tidak ditentukan

(dibuat fleksibel) serta mencari cara agar perhatian siswa tertuju secara

penuh terhadap penayangannya, perlu dicarikan solusi.

119

119

Sebagai catatan dalam observasi kelas yang dilakukan, dari 22 siswa

yang hadir hanya sekitar 15 siswa yang dapat fokus dalam melihat

penayangan video dari awal hingga akhir. Sedang yang 7 siswa lainnya

sibuk dengan aktifitasnya sendiri. Dari segi hasil pencapaian target

pembelajaran yang diharapkan, setelah diakhir penayangan diberikan

beberapa pertanyaan sebagai kesimpulan dari pesan pembelajaran,

ternyata tidak sampai 5 orang yang berhasil menjawab dengan benar.

Melihat dari dua aspek tersebut di atas (perhatian dan pencapaian

hasil belajar), dapat disimpulkan bahwa “pemaksaan” untuk fokus dan

memperhatikan perlu lebih “dilunakkan/difleksibelkan”. Peran guru

dalam penyelenggaraan pembelajaran di kelas perlu pula dilakukan,

semisal berkeliling hanya agar perhatian siswa tetap tertuju kepada

media yang disuguhkan. Sementara siswa, perlu pula dilakukan upaya

optimalisasi indra. Tidak hanya menfokuskan pada indera penglihatan,

tapi indra lain seperti penugasan mencatat, dan meringkas apa yang

dilihat perlu ditekankan. Sehingga diakhir penayangan, siswa lebih bisa

mempresentasikan apa yang telah mereka tangkap sebagai pesan

pembelajaran yang terkandung dalam video pembelajaran.

Penyuguhan video secara online pada sebuah situs pembelajaran

yang dapat diputar kapan saja, dan dimana saja merupakan solusi

terhadap problem permasalahan di atas. Dengan menyertakan instruksi

yang jelas terhadap kegiatan pembelajaran dan tujuan yang diharapkan.

Sehingga dengan arah yang jelas siswa akan dapat mandiri untuk

120

120

mencari dan menggali informasi/pesan pembelajaran. Guru hanya

mengarahkan dan menguatkan pemahaman siswa saat tatap muka di

kelas.

b. Analisis kebutuhan Siswa

Dari kuesioner yang peneliti berikan untuk menggali informasi

terkait kebutuhan siswa dalam pembelajaran PAI, diperoleh data bahwa;

1) Seluruh siswa tidak mengganggap bahwa mata pelajaran PAI adalah

mata pelajaran yang sulit dipahami dengan beberapa alasan yang

bervariasi seperti penyampaian materi oleh guru yang

menyenangkan, dan faktor materi yang memang diperlukan dalam

kehidupan sehari-hari.

2) Seluruh siswa setiap hari mengakses internet, setidaknya untuk

update atau mengecek status facebook, jejaring sosial mereka.

3) Dan untuk mata pelajaran PAI seluruhnya pernah menggunakan

internet untuk mencari informasi dalam mengerjakan tugas yang

diberikan.

4) Seluruh siswa menghendaki media pembelajaran berbasis web

dimana materi, media dan pesan pembelajaran disuguhkan.

5) Dari 22 siswa yang ada, sebanyak 10 orang menyiapkan diri dengan

membaca buku ajar sebelum mengikuti pembelajaran di kelas,

sementara 12 siswa tidak melakukannya.

6) Seluruh siswa menyatakan bahwa tidak terdapat materi khusus yang

memerlukan media secara khusus untuk memahami materi pelajaran.

121

121

Dengan membaca buku materi dan bertanya/berdiskusi dengan guru

atau teman pemahaman materi pembelajaran masih dapat dilakukan.

7) Seluruh siswa menyatakan bahwa pemakaian media yang bervariasi

dalam pembelajaran akan membantu mereka dalam mengatasi

kejenuhan belajar. Dengan media yang menyuguhkan secara detail

pesan pembelajaran baik berupa audio, video, maupun slide

presentation dan yang lain akan membantu mereka dalam belajar.

Berdasarkan data yang diperoleh dari siswa diatas, pengembangan

sebuah media pembelajaran berbasis web yang memuat konten untuk

mendukung pertemuan di kelas perlu dikembangkan. Sebuah situs,

sebagai jembatan penghubung antara siswa dan guru dalam aktifitas

pembelajaran PAI adalah sesuai dengan kebutuhan siswa.

c. Analisis kebutuhan guru

Berdasarkan kuesioner yang peneliti buat, dalam bentuk

diskusi/wawancara secara personal yang dilakukan terhadap guru

pengampu mata pelajaran PAI siswa kelas X di SMA Al-Falah Ketintang

Surabaya, diperoleh data sebagai berikut.

1) Aktifitas pembelajaran di kelas terkait motivasi, partisipasi dan minat

siswa cukup variatif. Ada yang aktif dan ada pula yang pasif. Walau

demikian minat mereka terhadap pembelajaran PAI dapat dikatakan

sangat baik. Hal ini dibuktikan dengan tingkat kehadiran yang tinggi

di setiap penyelenggaraan pembelajaran.

122

122

2) Jika dalam penyelenggaraan pembelajaran dipandang bahwa

motivasi dan partisipasi siswa menurun, maka upaya yang dilakukan

adalah dengan cara melakukan kegiatan pembelajaran yang tidak

seperti biasanya. Misalnya dengan pemutaran film dokumenter

terkait materi yang diajarkan.

3) Terkait hasil belajar/pencapaian target pembelajaran siswa kelas x

pada materi-materi sebelumnya pun bervariatif. Ada siswa yang

menonjol ada pula yang sedang. Dan dapat dikatakan tidak ada siswa

yang tergolong dalam kategori gagal. Dalam skala nilai 10 sampai

dengan 100, hasil belajar untuk mata pelajaran PAI adalah 60 ke

atas.

4) Terkait media yang digunakan, guru pengampu mata pelajaran PAI

memandang bahwa tidak ada satupun media yang dapat mengatasi

kejenuhan. Suatu media masih memerlukan media lain di saat

penggunaannya mulai membuat siswa jenuh. Dengan kata lain,

bahwa pemakaian media pembelajaran yang bervariasi akan dapat

membantu menaikkan partisipasi/keaktifan siswa dalam pencapaian

target pembelajaran.

5) Untuk membantu pemahaman siswa terhadap materi/pesan

pembelajaran, yang dilakukan selama ini adalah penugasan secara

berkelompok dengan membuat slide presentation, untuk kemudian

dipaparkan secara bergilir dalam pertemuan diskusi di kelas,

penayangan video pembelajaran dan lainnya.

123

123

6) Pemanfaatan laboratorium komputer untuk pembelajaran PAI selama

ini belum pernah dilakukan walaupun sarana pendukung ada.

7) Sangat mendukung dan mengapresiasi bila mata pembelajaran PAI

menggunakan media pembelajaran berbasis web yang memuat

konten bervariasi, dimana siswa akan lebih fleksibel dalam

menentukan persiapan belajarnya.

Berdasarkan data yang berhasil dihimpun dari guru pengampu mata

pelajaran PAI siswa kelas X di atas, dapat disimpulkan bahwa

pengembangan media pembelajaran berbasis web yang memuat

konten/materi pembelajaran yang juga disertai media pembelajaran lain

(text, video, maupun audio) perlu untuk dilakukan.

d. Analisis silabus/kurikulum

Secara keseluruhan, silabus dan kurikulum mata pelajaran PAI

adalah seperti pada lampiran 3 tentang Kurikulum dan Silabus mata

pelajaran PAI kelas X di SMA Al-Falah Ketintang Surabaya. Adapun

target pembelajaran materi wakaf, adalah seperti berikut.

Bab PokokBahasan Target Hasil Belajar Indikator

7Pengelolaan

Waqaf secaraJujur

Setelah menyelesaikanpembelajaran bab ini, siswadiharapkan mampu :

1. Memahami ketentuan hukumIslam tentang wakaf.

2. Menerapkan wakaf dalamkehidupan sehari-hari.

3. Bersikap jujur dalam kehidupansehari-hari, termasuk saatmengelola wakaf.

Peserta didik dapat :

1. Menerangkan sejarah wakaf,ketentuan, syarat, dan rukun wakaf,serta menyebutkan beberapa contohharta yang dapat diwakafkan.

2. Menjelaskan hikmah wakaf, danmendeskripsikan penerapan wakaf.

3. Berperilaku jujur pada diri sendiri,keluarga, dan masyarakat disekitarnya, termasuk saat mengelolawakaf.

Tabel 4.1 Silabus Materi Fiqih Wakaf

124

124

Dari telaah kurikulum dan Silabus terkait materi fikih wakaf di atas,

maka target yang harus dicapai pada bab ini dapat diketahui. Untuk

selanjutnya adalah menetapkan batasan materi pembelajaran yang akan

dijadikan konten pembelajaran (materi) pada media berbasis web yang

akan dikembangkan.

e. Analisis buku ajar

Untuk keperluan penyelarasan materi yang akan dijadikan konten

media web yang akan dikembangkan, peneliti juga menelaah buku ajar

yang digunakan untuk siswa kelas X di SMA Al-Falah Ketintang

Surabaya. Buku ajar yang di gunakan untuk pembelajaran PAI dan Budi

Pekerti adalah buku yang telah lolos seleksi kurikulum 2013 oleh

Kementerian Pendidikan dan Kebudayaan RI (kemdikbud), yang dapat

diunduh di http://bse.kemdikbud.go.id.

Berikut adalah spesifikasi buku ajar yang digunakan untuk siswa

kelas X di SMA Al-Falah Ketintang Surabaya yang berhasil peneliti

unduh dari situs kementerian pendidikan dan kebudayaan.

Judul Buku : Pendidikan Agama Islam dan Budi Pekerti

Untuk siswa kelas X (SMA/MA/SMK/MAK)

Kontributor : Endi Suhendy Zen dan Nelty Khairiyyah

Penelaah : Yusuf A. Hasan

Penerbit : Pusat Kurikulum dan Perbukuan, Balitbang,

Kemdikbud.

Tahun : 2014

125

125

Dari telaah yang dilakukan terhadap buku ajar tersebut di atas

peneliti menyimpulkan beberapa karakteristik yang ada, yakni bahwa

pada setiap bab di susun dengan pola yang sama dengan beberapa bagian

meliputi : Membuka Relung Hati, Mengkritisi Sekitar Kita, Memperkaya

Khazanah Peserta Didik, Pesan-Pesan Mulia, Menerapkan Perilaku

Mulia, Rangkuman dan Evaluasi. Hal ini sejalan dengan tuntutan

kurikulum 2013 yang mengharuskan penyelenggaraan pembelajaran

dengan prinsip bagaimana membuat siswa mengamati, menanya,

mengumpulkan informasi, mengasosiasi, kemudian mengkomunikasikan

suatu pesan pembelajaran.

Sebagai referensi bandingan untuk melengkapi kebutuhan penyajian

materi yang akan dijadikan konten dalam media pembelajaran yang

dikembangkan, peneliti juga menggunakan buku yang diterbitkan oleh

Penerbit Erlangga, dengan judul yang sama yang disusun oleh Sadi dan

H.M. Nasikin.

f. Analisis sarana pendukung

Sarana pendukung berupa laboratorium komputer juga akses

internet dalam jaringan sekolah tersedia di SMA Al-Falah Ketintang

Surabaya. Hal dapat dimanfaatkan oleh guru PAI dalam

mengembangkan sebuah media pembelajaran berbasis web untuk

mendukung kegiatan pembelajaran mata pelajaran yang diampunya.

Bahkan, semua guru bidang studi dapat memanfaatkannya.

126

126

Dari data non teknis yang berhasil dihimpun di atas, peneliti melakukan

verifikasi dan klarifikasi atas instrumen analisis kebutuhan baik kepada

siswa di kelas maupun terhadap guru pengampu. Setelah itu menyimpulkan

dengan membuat list sebagai daftar kebutuhan yang akan dijadikan modal

dalam melakukan pengembangan, yakni merumuskannya menjadi konsep

yang akan dituangkan dalam bentuk desain untuk dikembangkan menjadi

web sebagai media pembelajaran.

Kebutuhan Keterangan

1. Semua siswa dapat menggunakaninternet, dan pernahmenggunakannya untukmengakses informasi terkaitpenugasan materi PAI, begipunguru pengampu kelas X di SMAAl-Falah Ketintang Surabaya.

2. Siswa dan guru menghendakipenggunaan media yangbervariasi dalam pembelajaran.

3. Siswa dan guru menghendakipembelajaran dilakukan secaraaktif dan berkesinambunganantara offline dan online dengankonten yang menarik.

4. Materi disajikan sesederhanamungkin dengan paparan yangdetail dan menarik sesuaikurikulum dan silabus yangditetapkan. Media lain sepertivideo atau audio, maupun slidepresentation juga disipkan.

5. Akses pembelajaran, kegiatanpenugasan, diskusi, soal latihan,dll.

6. Adanya koneksi internet dalamjaringan sekolah dan saranapendukung lain seperti LCDProjector, Laboratorium komputersekolah dapat dimanfaatkan untukpembelajaran PAI.

1. Dengan kemapuan siswa dan guru dalammenggunakan internet untuk mengaksesinformasi, semakin mempertegaskebutuhan akan media pembelajaranberbasis web untuk mata pelajaran PAI,bahwa memang diperlukan dan layakuntuk dikembangkan.

2. Dengan pemanfaatan web sebagai basismedia pembelajaran, pemakaian mediayang bervariasi bisa dilakukan.

3. Penyajian materi sebagai kontenpembelajaran dirancang untuk mendukungpertemuan di kelas. Penugasan di setiapsegmen kegiatan pembelajaran terintegrasidengan pertemuan di kelas.

4. Materi diambilkan dari buku ajar yangdigunakan, dengan penambahan dari bukuajar lain yang terkait. Penambahan videoatau audio untuk illustrasi sajian perludibuatkan. Begitupun dengan slidepresentation oleh guru maupun hasil karyasiswa.

5. Pengembangan widget untuk mendukungkegiatan online pembelajaran perludisiapkan.

6. Walau keberadaan laboratorium komputerdan koneksi internet dalam jaringansekolah tidak mutlak, namunkeberadaannya dapat dimanfaatkan untukkeperluan sesekali secara online dalamkegiatan pembelajaran di sekolah.

Tabel 4.2 Data Non Teknis : Daftar Kebutuhan Pengembangan

127

127

Data kebutuhan di atas dirumuskan menjadi konsep untuk kemudian

dituangkan dalam bentuk desain pembelajaran berbasis web yang meliputi

beberapa hal secara garis besar seperti berikut.

1) Web dibuat dalam bentuk kelas pembelajaran virtual, yang hanya dapat

diakses oleh guru dan siswa yang terdaftar. Dalam hal ini perlu otorisasi

pengguna (user privileges) dengan menyediakan registration form

(formulir pendaftaran) dan login/logout (akses masuk dan keluar)

sebagai web widget (komponen/fitur web).

2) Admin sekolah (bisa guru, kepala sekolah, atau penanggung jawab

lembaga pendidikan/sekolah) adalah mereka yang berhak melakukan

pendaftaran/membuat akun pada web. Memiliki otoritas untuk mengatur

keanggotaan pada “sekolah virtual” yang dalam hal ini adalah siswa dan

guru pada sekolah yang bersangkutan.

3) Guru dan siswa adalah pengguna akhir yang dapat akses ke sekolah

virtual dengan memasukkan kode unik yang dibuat Admin pada saat

pendaftaran.

4) Guru dapat melakukan akses pada kelas virtual yang disediakan oleh

admin. Mengelola pembelajaran dalam kelas virtualnya dengan

menginput materi pembelajaran, penugasan, hingga kegiatan

pembelajaran lainnya. Dalam hal ini, guru adalah sebagai kontributor

utama konten pembelajaran yang tersedia pada kelas virtual masing-

masing.

128

128

5) Siswa dapat melakukan akses ke sekolah virtual untuk selanjutnya

menuju kelas virtual dengan cara login menggunakan akun unik yang

telah didaftarkan oleh admin sekolah. Dengan demikian, satu akun siswa

dapat digunakan untuk mengakses seluruh kelas pembelajaran virtual

sesuai mata pelajaran/bidang studi yang ada.

6) Terkait konten pembelajaran, template dibuat berdasarkan pendekatan

kurikulum 2013 dimana siswa diarahkan untuk melakukan kegiatan

menanya, mengumpulkan informasi, mengasosiasi, kemudian

mengkomunikasikan suatu pesan pembelajaran, yang merupakan

keterampilan dalam berfikir saintifik.

7) Format penyajian konten berupa template yang bisa digunakan untuk

bidang studi lain dengan mengacu pada model pembelajaran kurikulum

2013 dalam membuat siswa mengamati, menanya, mengumpulkan

informasi, mengasosiasi, kemudian mengkomunikasikan suatu pesan

pembelajaran.

Dari konsep yang telah dirumuskan di atas dapat dipaparkan bahwa

media pembelajaran berbasis web yang dikembangkan dalam penelitian ini

adalah media pembelajaran yang merupakan konten dari kelas virtual yang

ditempatkan pada sekolah virtual dimana siswa dan guru dapat melakukan

akses ke dalamnya. Kedudukan kelas virtual yang difungsikan sebagai

media pembelajaran yang terintegrasi dengan kegiatan pembelajaran di

sekolah dapat digambarkan sebagai bagian dari suatu sistem pembelajaran

virtual sebagaimana pada gambar berikut.

129

129

Setelah perumusan konsep sebagaimana beberapa langkah yang

dilakukan di atas, langkah berikutnya adalah menuangkan dalam bentuk

desain atau protptipe produk, bisa dengan diagram alir (flowchart ) atau peta

tautan (link map), dan (story board). Dari desain yang sudah siap

dikembangkan, kodifikasi menjadi halaman-halaman web dapat dilakukan

secara bertahap. Ujicoba dilakukan secara offline (tidak terkoneksi dengan

internet) melalui komputer yang difungsikan sebagai server lokal.

2. Data Teknis

Data Teknis adalah data kebutuhan peneliti secara langsung dalam

melakukan pengembangan media pembelajaran berbasis web mata pelajaran

PAI pada materi wakaf untuk siswa kelas X SMA Al-Falah Ketintang

Surabaya. Data Teknis ini meliputi dua hal, yaitu kebutuhan

peralatan/applikasi yang akan digunakan dalam melakukan pengembangan

dan data berupa kumpulan bahasa pemograman berupa script-script yang

diperlukan secara langsung dalam melakukan pengembangan.

Gambar 4.1 Konsep Pengembangan Media Pembelajaran berbasis Web

Produkpengembangan

Admin Sekolah

Guru sebagai Kontributor

Kegiatan Pembelajaran

Internet

Media pembelajaran berbasis web

Sekolah Virtual

Kelas Virtual

PembelajaranVirtual

130

130

a. Peralatan dan Aplikasi /Program

1) Komputer/Laptop

Untuk keperluan pengembangan media pembelajaran berbasis

web ini peneliti menggunakan laptop untuk kegiatan mobile dan

desktop saat di rumah. Untuk melakukan pembangunan web tidak

terlalu memerlukan komputer dengan spesifikasi yang tinggi. Hal

yang terpenting adalah bahwa komputer tersebut dapat menjalankan

aplikasi program yang diperlukan seperti : Dreamweaver, Xampp,

photoshop, notepad Plus dan internet browser seperti Internet

Explorer (IE), Mozilla , Chrome, Opera dan lainnya.

Dalam penelitian ini peneliti menggunakan laptop dengan

spesifikasi sebagai berikut.

Gambar 4.2 Spesifikasi Komputer yang digunakan

131

131

2) Applikasi /Program

a) Xampp Server

XAMPP merupakan software gratis (freeware) untuk

keperluan pembuatan server lokal yang berdiri sendiri

(dikomputer dimana program ini diinstal). Applikasi ini biasanya

digunakan untuk keperluan uji coba pengembangan situs. Xampp

adalah perangkat lunak bebas, yang mendukung banyak sistem

operasi, merupakan kompilasi dari beberapa program.

Beberapa program yang dipaketkan dalam Xampp antara

lain : Apache HTTP Server, MySQL database, dan bahasa

pemograman yang ditulis dengan bahasa pemrograman PHP dan

Perl. Nama XAMPP merupakan singkatan dari X (empat sistem

operasi apapun), Apache, MySQL, PHP dan Perl. Program ini

tersedia dalam GNU (General Public License) dan bebas,

merupakan web server yang mudah digunakan yang dapat

melayani tampilan halaman web yang dinamis. 1 Untuk

mendapatkanya dapat men-download langsung dari web

resminya atau dengan cara memasukkan kata kunci “Xampp

Server download” di situs mesin pencari Google. Kemudian klik

tautan/link yang sesuai untuk mengunduhnya.

b) Web Browser

Web Browser adalah suatu applikasi atau software yang

digunakan untuk menjelajahi internet atau untuk mencari

1 Wikipedia, “XAMPP” dalam http://id.wikipedia.org/wiki/XAMPP (diakses tanggal 10 Maret 2015)

132

132

informasi dari suatu web yang tersimpan di dalam server.

Awalnya, web browser berorientasi pada teks dan belum dapat

menampilkan gambar. Namun, web browser sekarang tidak

hanya menampilkan gambar dan teks saja, tetapi juga memutar

file multimedia seperti video maupun audio.

Web browser juga dapat digunakan sebagai media bertukar

informasi, berinteraksi melalui situs jejaring sosial, mengirim dan

menerima email, hingga menjelajah berbagai situs yang memuat

informasi tentang segala hal. Halaman web merupakan dokumen

yang dibangun dengan bahasa pemograman tertentu yang dapat

diakses oleh siapapun dan dimanapun dengan perlakuan sesuai

peruntukan pengelola web atau halaman situs itu sendiri.

Pemanfaatan web sebagai media informasi banyak digunakan

diberbagai bidang kehidupan manusia. Tidak terkecuali pada

dunia pendidikan. Penelitian ini bertujuan untuk menghasilkan

produk berupa halaman web yang dapat digunakan sebagai media

pembelajaran untuk mata pelajaran PAI bagi siswa kelas X di

tingkat satuan pendidikan sekolah menengah atas. Karenanya

peneliti menggunakan beberapa web browser untuk mengetahui

kompabilitas tampilan web yang dikembangkan, diantaranya

adalah Internet Explore, Mozilla Firefox, Chrome, dan UC

Browser, baik melalui komputer maupun telepon pintar.

133

133

c) DreamWeaver

Adobe Dreamweaver merupakan program penyunting

halaman web keluaran Adobe Systems yang dulu dikenal sebagai

Macromedia Dreamweaver keluaran Macromedia. Program ini

banyak digunakan oleh pengembang web karena fitur-fiturnya

yang menarik dan kemudahan penggunaannya.

Dengan fitur split preview untuk design dan kode dalam

scripting sangat membantu mereka para pemula yang belajar

bahasa pemograman. Versi terakhir Macromedia Dreamweaver

sebelum Macromedia dibeli oleh Adobe Systems yaitu versi 8. 2

Versi inilah yang peneliti gunakan sebagai salah satu editor

dalam melakukan pengembangan halaman web sebagai media

pembelajaran berbasis web sebagaimana dalam penelitian dan

pengembangan ini.

d) NotePad Plus

Notepad++ atau biasa disebut NotePad Plus adalah sebuah

penyunting teks dan penyunting kode sumber yang berjalan di

sistem operasi Windows. Applikasi ini menggunakan komponen

Scintilla untuk dapat menampilkan dan menyunting teks dan

berkas kode sumber berbagai bahasa pemrograman.3

Dengan pertimbangan kepraktisan dalam pengembangan,

terutama disaat harus melakukan multitasking dalam

2 Wikipedia, “Adobe Dream Weaver” dalam http://id.wikipedia.org/wiki/Adobe_Dreamweaver (diaksestanggal 10 Maret 2015)3 Wikipedia, “Notepad Plus” dalam http://id.wikipedia.org/wiki/Notepad%2B%2B (diakses tanggal 10Maret

134

134

penyuntingan script untuk keperluan pengembangan, applikasi

ini peneliti gunakan. Terutama saat penyuntingan CSS eksternal

sebagai pengatur layout atau tampilan web yang dikembangkan.

e) PhotoShop

Photoshop merupakan software besutan Adobe yang

digunakan untuk keperluan editing / memodifikasi gambar atau

foto secara profesional baik meliputi modifikasi obyek yang

sederhana maupun yang sulit sekalipun. Kelengkapan fitur yang

ada di dalam Photoshop inilah yang akhirnya membuat software

ini banyak digunakan oleh desainer grafis profesional.

Untuk kepentingan pengolahan image/gambar yang

diperlukan dalam pengembangan web yang dilakukan, peneliti

menggunakan adobe photoshop sebagai pengolah gambarnya.

b. Script bahasa pemograman

Dalam penelitian ini, pengembangan web sebagai media

pembelajaran dilakukan dengan menggunakan bahasa pemograman yang

bervariasi. Bahasa utama menggunakan html dan javascript (client side

script) yang didukung dengan pemakaian css eksternal dan internal,

sedang untuk sisi server (server side script) menggunakan php.

1) HTML

HyperText Markup Language (HTML) adalah bahasa

pemograman yang digunakan utntuk menyusun dan membentuk

dokumen halaman web agar dapat ditampilkan pada program web

135

135

browser. HTML juga dapat disebut sebagai protocol yang digunakan

untuk mentransfer data atau dokumen dari web server ke browser.

HTML inilah yang menjadi dasar untuk pengembangan desain

sebuah halaman web.

Secara umum HTML memiliki dua fungsi, yaitu : (1)

Membentuk tata letak document, dalam hal ini menentukan jenis

huruf, gambar, dan komponen dokumen lainnya seperti beberapa

kode (srcipt) dalam tag head (<head></head>) dan body

(<body></body>) setelah sebelumnya diawali dengan tag penanda

html (<html>) dan pada bagian akhir dengan </html>; (2)

Menentukan hubungan ke dokumen lain, misalnya tautan atau link

yang dikodifikasikan dengan tag <a></a>.

HTML merupakan suatu bahasa pemrograman yang termasuk

dalam kategori SGML (Standart Generalized Markup Language)

dimana bentuknya merupakan standar ASCII yang berisi kode-kode

untuk mengatur tampilan dokumen/halaman web dalam browser.

2) PHP

PHP dulunya adalah PHP/FI yang merupakan singkatan dari

Personal Home Page/Form Interface. Diciptakan pertamakali oleh

Lasmus Lerdoff pada tahun 1994. Dari semula yang hanya

digunakan untuk mengetahui jumlah pengunjung situs, namun

karena software ini disebarluaskan sebagai open source sehingga

136

136

dalam perkembangannya banyak mendapatkan kontribusi dari para

penggunanya. 4

PHP merupakan bahasa pemrograman dari sisi server dimana

dokumen/halaman web tersimpan (server-side script), yang didesain

untuk para pengembang web. Saat ini dikelola oleh The PHP Group

dengan situs resminya yang beralamat di http://www.php.net. PHP

disebut bahasa pemrograman server side karena PHP diproses pada

komputer server. Hal ini berbeda bila dibandingkan dengan bahasa

pemrograman sisi klien (client-side script) seperti JavaScript yang

diproses pada web browser (client) milik pengguna/pengunjung.

Pengembangan web sebagai media pembelajaran dalam

penelitian ini sepenuhnya dilakukan dengan memanfaatkan mesin

pencari google. Beberapa script php yang diperlukan dicari dengan

menggunakan kata kunci yang sesuai kebutuhan. Dari beberapa

script yang berasal dari tutorial yang banyak dijumpai, peneliti

kemudian melakukan uji coba disesuaikan dengan kebutuhan setelah

dilakukan beberapa modifikasi tentunya.

3) MySQL

MySQL adalah pogram aplikasi database open source. MySQL

mampu menanani database yang kompleks dan cukup besar. MySQL

juga dapat menangani database client server. MySQL AB membuat

MySQL sebagai perangkat lunak gratis di bawah lisensi GNU

4 Rina Musyawarah, Membangun Applikasi Database berbasis Web untuk Pemula, (Jakarta : ElexKomputindo. 2005), 72-73.

137

137

General Public License (GPL), tetapi mereka juga menjual dibawah

lisensi komersial untuk kasus-kasus dimana penggunaannya tidak

cocok dengan penggunaan GPL.

Tidak seperti open source yang lain, MySQL dimiliki dan

disponsori oleh sebuah perusahaan komersial Swedia yaitu MySQL

AB. MySQL AB memegang penuh hak cipta hampir atas semua

kode sumbernya. Orang yang mendirikan MySQL AB adalah: David

Axmark dan Allan Larsson berasal dari Swedia, dan Michael

"Monty" Widenius yang berasal dari Finlandia.5

Untuk mengakses database MySQL dari PHP, fungsi-fungsi

seperti mysql_connect(), mysql_query(), dan mysql_fetch_array()

biasanya sering digunakan. Fungsi-fungsi tersebut tergabung ke

dalam mysql extension. Namun saat ini, tepatnya mulai PHP versi

5.5.0, PHP memutuskan untuk membuat mysql extension berstatus

deprecated. Yang artinya pengaksesan database MySQL

menggunakan fungsi mysql extension sudah tidak disarankan lagi,

dan programmer diharapkan pindah ke MySQLi extension atau PDO

(PHP Data Object) yang berbasis objek.

Hal ini disebabkan MySQL versi terbaru memiliki fitur-fitur

yang semakin lengkap dan kompleks, sehingga PHP memutuskan

untuk membuat fungsi extension baru agar programmer PHP bisa

5 Taufik, “Definisi di bidang HTML” dalam http://www.blogsitaufik.web.id/2013/04/definisi-istilah-istilah-di-bidang.html?en-ID (diakses tanggal 10 Maret 2015)

138

138

menggunakan fitur-fitur tersebut, yakni menggunakan MySQLi

extension dan PDO (PHP Data Object) untuk mengkases database.

Pembuatan database dalam penelitian pengembangan ini

dilakukan dengan menggunakan phpmyadmin yang terpaketkan

dalam xampp server.

4) Javascript

Javascript adalah bahasa pemograman (scripting language)

yang banyak digunakan oleh banyak pengembang yang fokus pada

pembuatan aplikasi website dan maupun web biasa. Javascript

adalah Object Oriented Programming (OOP), bahasa yang sangat

mirip dengan PHP dan Actionscript 3.0 dalam cara yang bekerja

dengan variabel, string, array, angka, dan objek.

Penggunaan javascript dalam penelitian pengembangan ini

dilakukan dengan juga memanfaatkan situs pencarian google.

Terutama berkaitan erat dengan menampilkan pesan kesalahan

(error) untuk validasi form, pemanis text dengan tampilan pelangi,

atau slide show yang digunakan menampilkan image yang

bergantian disertai dengan teks penjelas, serta untuk keperluan

lainnya sesuai kebutuhan.

5) CSS

Cascading Style Sheets (CSS ) adalah sebuah file berisi baris

kode untuk memberitahukan pada web browser bagaimana sebuah

139

139

halaman HTML ditampilkan, umumnya presentasi yang diatur

adalah tampilan dan format halaman sebuah dokumen.

Dalam pemakaiannya file dengan ekstensi css (*.css)

digunakan sebagai eksternal properties untuk mengatur tampilan

sebuah halaman web. Namun ada pula yang secara langsung

mengunakannya sebagai internal css dengan penambahan style pada

tag yang hendak dimanipulasi tampilannya. Dalam penelitian ini,

peneliti menggunakan kedua teknik.

CSS didesain utamanya untuk memungkinkan pemisahan

antara konten dokumen (ditulis dalam HTML atau bahasa

pemrograman sejenis) dari penyajian dokumen, termasuk elemen

layout, warna, background, font, dan keperluan lainnya. Dengan

pemisahan ini akan memudahkan aksesibilitas, menyediakan kontrol

yang lebih fleksibel dan mengurangi kompleksitas dan pengulangan

struktur konten.

c. Sarana Pendukung

1) Nama domain

Untuk keperluan melakukan desain atau perancangan, nama

domain yang merupakan tema dan menggambarkan isi atau konten

situs, peneliti pilihkan. Karena situs yang akan dikembangkan

merupakan situs yang didesain untuk pengembangan ke depan dapat

digunakan oleh semua mata pelajaran, semua tingkatan pendidikan,

dan semua jenis pendidikan (formal/nonformal), maka peneliti

memilihkan sebuah nama domain dengan alamat

140

140

www.indomedia.web.id. Selaras dengan tema web yang

dikembangkan, yakni pengembangan media pembelajaran berbasis

web untuk pendidikan di Indonesia. Dimana mata pelajaran PAI

adalah merupakan bagian dari kontennya.

2) Hosting

Untuk keperluan uji coba internal saat pengembangan, serta uji

coba di lapangan, peneliti memilih idhostinger.com sebagai tempat

hosting halaman web yang dikembangkan. Disamping gratis, juga

support PHP dan MySQL. Dengan file manager dan layanan edit

langsung pada server memudahkan peneliti dalam melakukan

pengembangan. Hosting Gratis, Space 2GB, Bandwidth 100GB

support PHP dan MySQL, Site Builder yang user friendly tanpa iklan

atau banner peneliti rasa cukup untuk pengembangan pemula sebuah

situs yang akan digunakan untuk media pembelajaran sebagai produk

“starter” ini.

3) Koneksi internet

Adapun koneksi internet, pada tahap pengembangan belum

terlalu diperlukan. Karena ujicoba dilakukan pada server local di

komputer yang digunakan dengan applikasi Xampp server. Baru

setelah selesai dan dianggap perlu ujicoba secara online dengan

melakukan hosting beberapa file hasil pengembangan, koneksi

internet menjadi keharusan. Untuk meminimalkan biaya

pengembangan bisa dilakukan di warnet atau dengan berlangganan

141

141

Telkom Speedy dirumah, atau untuk guru PAI di sekolah bisa

memanfatkan koneksi internet (wifi) dalam jaringan sekolah.

B. Hasil Pengembangan

Berikut dipaparkan hasil pengembangan sebagai pemecahan dari rumusan

permasalahan dalam penelitian pengembangan ini.

1. Langkah-langkah pengembangan

Secara umum pengembangan dimulai dari kegiatan melakukan analisis

kebutuhan, menginventarisir kemudian melakukan seleksi yang kemudian

disusun menjadi sebuah konsep pengembangan. Dari konsep pengembangan

yang telah dirumuskan kemudian dituangkan menjadi desain berupa

rancangan pembuatan web beruapa flowchart dan storyboard yang siap

untuk dilakukan pengembangan/pembuatan halaman web.

Seorang guru PAI dalam hal ini dapat bekerjasama dengan programmer

web dengan biaya, atau secara mandiri berupaya untuk berkreasi. Dalam

penelitian pengembangan ini peneliti mencoba memilih opsi terakhir, yakni

melakukan pengembangan secara mandiri dengan memanfaatkan informasi

pemograman dari forum-forum tutorial di internet yang diperoleh dari situs

mesin pencari Google, maupun dari buku-buku pemograman web.

Secara singkat tahapan pengembangan dalam penelitian ini diselaraskan

dengan model ADDIE yang dirujuk sebagai langkah pengembangan.

Tahapan dalam pengembangan ini meliputi : Analysis, yakni kegiatan

menggali data kebutuhan penelitian, menginventarisir dan melakukan seleksi

terhadapnya menyesuaikan dengan tujuan, dan peruntukan serta

142

142

merumuskannya menjadi konsep; Design, yaitu menuangkan konsep yang

telah dirumuskan ke dalam bentuk rancangan pengembangan berupa story

board dan flowchart (link map) sebagai arah dalam melakukan kodifikasi,

membangun halaman web; Develop, merupakan kegiatan kodifikasi atau

menterjemahkan desain menjadi media pembelajaran berbasih web yang

dirupakan kelas virtual; Implementation adalah kegiatan melakukan uji

coba, baik internal (oleh peneliti) maupun lapangan (subjek uji coba); serta

Evaluation , yang merupakan tahap penilaian yang dilakukan di setiap

fase/tahapan pengembangan (evaluasi formatif) maupun di akhir kegiatan

pengembangan (evaluasi sumatif).

Media pembelajaran tidak dirupakan sebagai halaman web independen,

melainkan diintegrasikan ke dalam suatu sistem pengelolaan web dengan

merupakannya sebagai kelas pembelajaran virtual yang merupakan konten

dari sekolah virtual. Karenanya produk penelitian dirupakan sebagai sistem

penyedia layanan pembuatan sekolah-sekolah virtual yang diharapkan dapat

digunakan untuk pendidikan di semua tingkatan baik formal maupun

nonformal. Dan sebagai tema dari pembangunan web ini adalah “Media

Pembelajaran berbasis Web, untuk Pendidikan Nusantara”. Dengan alasan

inilah penamaan domain diberikan, yakni www.indomedia.web.id.

Hasil penelitian ini berupa media pembelajaran berbasis web yang

dirupakan sebagai template kelas virtual untuk pembelajaran PAI dengan

materi tentang wakaf yang diperuntukkan bagi siswa kelas X pada tingkat

satuan pendidikan sekolah menengah atas. Template tersebut dapat diisi

143

143

materi pembelajaran berupa teks, gambar, audio maupun video. Disertai pula

dengan widget seperti forum diskusi, latihan soal, penugasan, dan hal

lainnya sesuai kebutuhan pembelajaran. Rumusan konsep yang telah

dirancang sebagaimana dalam alir desain (storyboard), menghasilkan sebuah

model kelas virtual seperti gambar hasil screen shoot berikut.

Gambar 4.3 Template Kelas Virtual : Media Pembelajaran PAI

144

144

Screen shoot di atas merupakan tampilan default yang diakses oleh

siswa dengan nama panggilan “Aqilah”. Konsep pendekatan yang digunakan

adalah secara personal antara guru dengan satu orang siswanya. Sehingga

perhatian guru seolah penuh terhadap siswanya. Dan hal ini berlaku untuk

seluruh siswa keseluruhan yang terdaftar.

Sesuai dengan konsep pengembangan yang dirumuskan, komponen

template media pembelajaran yang dirupakan sebagai kelas virtual seperti di

atas, terdiri dari dari beberapa bagian sebagai berikut.

1. Bagian atas halaman (Header)

Bagian header, merupakan bagian atas halaman. Bagian ini

terbangun atas beberapa komponen, yaitu ; sisi bagian atas, sisi bagian

tengah dan sisi bagian bawah yang masing-masing juga memiliki objek

untuk menghias tampilannya.

Secara detail tentang bagian header dapat dipaparkan seperti

berikut.

a. Sisi bagian atas

Pada sebelah kanan bagian ini memuat tautan ke halaman utama

Indomedia, yaitu “Beranda” (index.php), “Tentang Kami” (about-

us.php) dan “Hubungi Kami” (contact-us.php), serta teks logo

Gambar 4.4 Bagian Header Template

145

145

Indomedia. Sedangkan pada sebelah kiri, dibuatkan teks animasi

dengan warna pelangi secara bergantian (rainbow text), beserta link

“follow us on” untuk facebook, twitter dan google plus pengembang.

Bagian ini dibuat selalu kelihatan (fixed) dan tetap berada di atas (on

top) halaman sebagai identitas Indomedia, saat scroll bergerak

menuju ke bawah halaman sekalipun.

b. Sisi bagian tengah

Pada sisi bagian tengah, dimasukkan objek berupa gambar

sebagai banner sekolah yang berada di sebelah kanan. Sedangkan

pada sebelah kiri adalah space untuk iklan dengan slide.

Gambar 4.5 Komponen Header Template sisi atas

Gambar 4.6 Komponen Header Template sisi tengah

146

146

c. Sisi bagian bawah

Pada sisi bagian bawah header, sesuai dengan rancangan yang

telah dibuat, pada sebelah kanan ditempatkan logo berupa masjid

dengan tulisan Pendidikan Agama Islam, sedangkan pada sebelah

kiri adalah pesan yang muncul setelah siswa berhasil login, yang

juga disertai dengan tombol logout untuk keluar.

Sebagai pembatas antara header dan body halaman, peneliti

sematkan teks berjalan (marquee) di sebelah kiri, yang dipadukan

dengan kalender hijriyah di sebelah kanan.

Gambar 4.7 Komponen Header Template sisi bawah

Gambar 4.8 Pembatas antara Header dan Body halaman

147

147

2. Bagian Tengah halaman (Body)

Bagian ini merupakan bagian content, dibagi menjadi dua kolom,

sebelah kiri dan kanan.

a. Kolom sebelah kanan

Pada kolom sebelah kanan merupakan fitur tambahan yang

dapat dikembangkan lebih lanjut. Sedangkan pada kolom sebelah kiri

adalah kolom yang akan memuat materi pembelajaran dengan

kegiatan dibuat terintegrasi dengan pertemuan di kelas. Dalam

Gambar 4.9 Bagian Body/Content halaman

148

148

penelitian ini akan difokuskan pada konten materi (kolom sebelah

kiri) dimana yang lain dapat dikembangkan kemudian.

b. Kolom sebelah kiri

Pada kolom sebelah kiri content halaman template, sesuai alir

produksi dibuat beberapa bagian untuk penyajian materi dan

pengaturan kegiatan pembelajaran. Beberapa bagian dijadikan dalam

satu paket vertical tabbed box. Hal ini untuk menyiasati agar sajian

materi dalam satu halaman template yang efisien. Vertical tabbed

box yang dibuat memuat konten sebagai berikut.

1) Sajian materi

Sajian materi dibuat mirip dengan buku ajar yang mengacu

pada kurikulum 2013 dengan kegiatan siswa berupa mengamati,

menanya, mengasosiasi, memahami dan mengkomunikasikan

atau menyampaikan. Seperti dalam screen shoot di atas, materi

disajikan dengan empat tahapan yaitu amati, kritisi, pahami, dan

amalkan.

Dalam pembuatan konten materi ini disusun redaksional

sebagai berikut.

a) Nama Bab

Adalah Bab materi yang akan diajarkan sesuai dengan buku

ajar yang digunakan.

b) Judul Bab sesuai pokok bahasan

Adalah mengacu pada judul pokok bahasan yang akan

disampaikan dalam pembelajaran saat ini.

149

149

c) Target pembelajaran

Standar kompetensi yang diharapkan dalam pembelajaran.

Disebut pula sebagai target atau tujuan pembelajaran yang

hendak dicapai setelah kegiatan pembelajaran.

d) Tanggal update (pembaharuan konten)

Tanggal kapan content materi diperbaharui oleh guru

pengampu mata pelajaran PAI.

e) Ayat pilihan

Adalah ayat Alquran yang dipilihkan sesuai dengan tema

pembahasan dalam kegiatan pembelajaran yang disertai juga

dengan terjemahannya.

f) Pengelompokan materi

Materi dikelompokkan menjadi empat bagian utama, masing-

masing memuat instruksional dengan disertai media

pembelajaran berupa video pilihan yang sesuai dengan

kegiatan, dengan memberikan penugasan pada akhir

ulasannya.

2) Kegiatan diskusi

Kegiatan diskusi adalah untuk mengetahui tingkat keaktifan

siswa sebelum pertemuan di kelas. Disamping untuk wawasan

awal dalam rangka menyiapkan siswa untuk materi baru yang

akan dipelajari. Diskusi secara online baik dengan sesama teman

atau dengan guru pengampu selaku admin akan menjamin bahwa

pembelajaran di kelas akan menjadi lebih bermakna.

150

150

3) Latihan

Latihan adalah merupakan salah satu kegiatan dalam rangka

menunjang pembelajaran dikelas. Mengarahkan pemahaman

siswa tentang materi yang akan dipelajari di kelas.

4) Evaluasi

Evaluasi dilakukan diakhir pembelajaran dengan tujuan untuk

mengukur tingkat keberhasilan atau pencapaian target

pembelajaran.

5) Remedial

Pemberian tugas tambahan/kegiatan untuk mereka yang

dipandang perlu oleh guru pengampu agar dapat mencapai target

pembelajaran yang diharapkan.

6) Kegiatan penugasan

Kegiatan penugasan disetiap paparan dalam sajian materi

ditindak lanjuti dengan pengumpulan tugas melalui form yang

tersedia dalam bagian ini. Tugas yang dikirimkan siswa akan

masuk ke email guru pengampu untuk diberikan penilaian.

7) Penilaian

Penilaian dilakukan terkait pembelajaran yang dilakukan.

Dalam penelitian ini, penilaian belum dintegrasikan ke dalam

template media pembelajaran karena penilaian secara

keseluruhann siswa telah diambil alih oleh dinas pendidikan kota

Surabaya dengan sistem penilaian secara online. Disamping

keterbatasan waktu untuk mengolah formula penilaian, serta

151

151

aspek penilaian siswa oleh guru pengampu yang peneliti

kesulitan untuk mendapatkan. Karenanya peneliti memutuskan

untuk melakukan pengembangan kemudian.

3. Bagian bawah halaman (Footer)

Pada bagian bawah halaman (footer), berisi copyright pengembang.

IM adalah IndoMedia sedang UINSA adalah Universitas Islam Negeri

Sunan Ampel Surabaya, institusi pengembang dimana tesis ini

didedikasikan.

Dengan beberapa pertimbangan, template ini kemudian dibuat

ekslusif dan hanya dapat diakses untuk keperluan pendidikan pada

lembaga pendidikan atau sekolah tertentu. Hal ini agar template ini

berbeda dengan blog maupun lainnya yang dengan mudah

disalahgunakan keberadaaanya. Oleh karenanya peneliti kemudian

melakukan pengembangan tambahan berupa sistem yang mengharuskan

pengunjung untuk login menuju lembaga pendidikan virtualnya, untuk

kemudian dapat mengakses halaman kelas pembelajaran virtual, yang

dalam hal ini adalah template media pembelajaran berbasis web untuk

Gambar 4.10 Bagian Footer halaman

152

152

siswa kelas X pada tingkat satuan pendidikan sekolah menengah atas,

SMA Al-Falah Ketintang Surabaya.

Pada halaman backend/administrator, peneliti membuatnya menjadi

Tiga yaitu : admin system (pengelola Indomedia), admin sekolah virtual

(penanggung jawab sekolah/lembaga atau guru yang telah mendaftarkan

sekolah ke Indomedia), dan admin kelas virtual (guru pengampu mata

pelajaran), sebagai kontributor penyajian materi pembelajaran untuk para

siswanya. Sedangkan siswa hanya sebagai user/ pengguna untuk

mengakses pembelajaran virtual yang tersedia.

Dalam penelitian pengembangan ini, hanya akan dipaparkan

bagaimana tampilan admin pembelajaran (kelas virtual) yang berhasil

dibangun. Dengan menggunakan pola dasar CRUD system (Create,

Read, Update dan Delete) sebagai konsep pengembangannya, maka

pembuatan halaman admin untuk guru dibuat dengan desain yang

sederhana dengan kosep sebagaimana diagram berikut.

Admin kelas virtual (guru pengampu)

LOGIN dihalaman sekolah

virtual

Dashboard untuk mengelola/menyunting materi

Diagram 4.1 Akses menuju halaman admin kelas virtual

153

153

Setelah login menggunakan public username dan password,

member sekolah (siswa dan guru) dan juga admin sekolah virtual, akan

menuju halaman sekolah virtual. Pada halaman sekolah virtual

disediakan fasilitas login untuk siswa, guru dan admin sekolah.

Setelah login siswa akan diantarkan pada halaman kelas virtual,

guru akan diantar pada admin kelas virtual dan admin sekolah akan

diantar pada halaman admin sekolah. Jadi tingkatan akses yang tersedia

setelah masuk pada session sekolah virtual ada tiga, yakni siswa, guru,

dan admin sekolah.

Secara lengkap tampilan interface untuk pengguna adalah seperti

dalam lampiran 10 tentang Data Screen Shoot Indomedia.

2. Validasi dan Implementasi produk

Selain meminta masukan dari dosen pembimbing, maupun teman

sejawat, produk yang dikembangkan juga telah dikonsultasikan dan

divalidasi oleh ahli media yang terdiri dari seorang dosen informatika, dan

dua orang praktisi pengembangan software. Beberapa hal yang menjadi

penilaian oleh ahli media adalah sebagai berikut.

1. Aspek Tampilan

Berdasarkan instrumen penilaian yang dibuat, ahli media

memberikan komentar yang positif, rata-rata memuji sangat baik.

Bahkan ada yang mengomentari luar biasa untuk pengembang web yang

tidak ber-background informatika. Dan dari hasil konsultasi lebih lanjut

dapat peneliti simpulkan bahwa konsep yang dikembangkan cakupannya

154

154

sangat luas dan memerlukan tim dalam pengembangannya. Pengolahan

database, bahasa pemograman untuk server-nya (server-side scripting

dengan PHP atau bahasa lainnya), hingga pengembangan halaman

backend user admin yang tiga macam tersebut. Bila pengembangan ini

dimaksudkan sebagai starter untuk dilakukan secara kontinyu dan

berkala sungguh merupakan langkah awal yang sangat baik.

2. Aspek Pemograman

Dari aspek pemograman, ada beberapa evaluasi yang

mengharuskan peneliti mengkaji ulang tentang pengolahan database

yang sesuai dengan kelaziman untuk pengembangan sebuah sistem web

yang aman. Setelah login ada login lagi, atau setelah mendaftar

kemudian login, lalu ada pendaftaran lagi sebaiknya dihindari. Hal ini

untuk keamanan sistem situs dari hal yang tidak diinginkan. Seperti

hacker yang merusak atau dari internal database-nya yang akan “error”.

Terutama kajian tentang relasi antar table dalam sebuah database dalam

suatu sistem web yang dikembangkan dalam penelitian ini.

Hal ini merupakan keterbatasan peneliti sendiri dalam

melakukannya. Karenanya peneliti tetap akan mempresentasikan produk

yang dikembangkan sebagai produk “starter” untuk membuka peluang

untuk dilakukan pengembangan lagi pada saat selanjutnya. Dengan

pertimbangan bahwa produk ini paling tidak bisa digunakan untuk

keperluan peneliti sendiri dalam menyuguhkan materi pembelajaran

yang diujicobakan di SMA Al-Falah Ketintang Surabaya.

155

155

Seperti halnya penilaian yang dilakukan ahli media, penilaian oleh ahli

materi juga telah dilakukan dan menghasilkan beberapa kesimpulan sebagai

berikut.

1. Aspek Penyajian Materi

Penyajian materi sangat menarik, disamping media pendukung

yang disuguhkan seperti video pembelajaran terkait materi. Namun

disarankan bahwa penggunaan media lain sebagai konten perlu pula

diberikan. Semisal audio Alquran dan terjemahan yang bisa diputar dan

didengarkan oleh siswa, agar mendukung kemampuan siswa dalam

pembelajaran ta’lim qiraat alqur`an-nya. Disamping itu, latihan soal dan

evaluasi secara online perlu pula disematkan dengan lebih interaktif dan

bervariatif. Serta arsip pembelajaran sebagai tautan menuju materi pada

bab lainnya juga perlu dilakukan pengembangan.

Penilaian seluruh indikator dalam aspek ini yang meliputi : Bahasa

yang digunakan, kejelasan isi materi, struktur pengorganisasian/urutan

materi, pemilihan video, kejelasan instruksi pada setiap penugasan,

pendekatan cara penyajian, dan kesesuaian materi dengan target

pembelajaran dinilai sudah baik dengan skala penilaian 4 (baik).

Atas komentar sebagai masukan berharga ini, peneliti akan

memaparkan dalam bab penutup sebagai saran pengembangan yang

dapat dilakukan lebih lanjut. Hal ini mengingat keterbatasan waktu yang

dimiliki peneliti, juga fokus penelitian yang hanya akan mengupas

tentang materi pembelajaran.

156

156

2. Aspek Pembelajaran

Dari aspek pembelajaran, penilaian dilakukan dengan beberapa

indikator dan menghasilkan kesimpulan bahwa ;

a. Kejelasan judul materi bahasan yang digunakan sudah sangat jelas

/jelas sekali dengan skala penilaian 5 (baik sekali);

b. Kesesuaian kompetensi dasar dengan indikator juga dinilai baik

sekali dengan skala penilaian 5 (sangat baik);

c. Demikian pula dengan materi yang disajikan sudah sangat sesuai

dengan tujuan pembelajaran (Kompetensi dasar) sudah baik dengan

skala penilaian 4 (baik);

d. Petunjuk penugasan dalam setiap segmen pembelajaran dinilai sudah

baik sekali dengan skala penilaian 5 (sangat baik);

e. Pemilihan pendekatan dalam penyampaian materi dinilai baik sekali

dengan skala penilaian 5 (sangat baik);

f. Kejelasan pemaparan materi secara konseptual dengan pengarahan

secara personal dan berkelompok dinilai baik sekali dengan skala

penilaian 5 (baik);

g. Sementara kejelasan materi praktis dinilai baik dengan penyuguhan

video pembelajaran tentang prosedur wakaf dinilai baik sekali,

dengan skala penilaian (5).

157

157

Berdasarkan penilaian oleh ahli materi di atas, dapat disimpulkan bahwa

konten materi yang disuguhkan sudah baik, tinggal menambahkan

beberapa komponen audio dan beberapa fitur yang berhubungan.

3. Efektifitas produk

Kegiatan dalam uji efektifitas produk pengembangan dilakukan

dengan menyelenggarakan test pada sebelum dan sesudah produk

digunakan. Hasil tes sebelum pemakaian produk (pre-test) kemudian

dibandingkan dengan hasil tes setelah pemakaian produk (post-test). Jika

pada selisih nilai terdapat kenaikan yang signifikan maka produk dapat

dikatakan efektif, sebaliknya bila selisih skor yang diraih siswa mengalami

penurunan, maka produk dapat dikatakan tidak efektif. Dalam kegiatan ini

peneliti menyusun daftar pertanyaan terkait materi wakaf sebanyak 15 butir

soal, dengan penilaian perbandingan, yakni prosentase dari jumlah jawaban

yang benar terhadap jumlah butir soal.

Dari data skor pre-test dan post-test yang dilakukan sebelum dan

sesudah pemakaian produk, diketahui bahwa cenderung ada peningkatan.

Dalam penelitian tidak dijumpai satupun siswa yang mengalami penurunan

skor/hasil test. Hal ini dapat dilihat dari nilai pre-test dan post-test siswa.

Dari 20 siswa yang hadir, semuanya mengalami peningkatan. Kecuali dua

orang yang tidak bisa dilakukan pengukuran karena saat pelaksanaan pre-

test dan post- test tidak bisa hadir.

Berikut adalah data hasil perolehan nilai pada pre-test dan post-test

yang diselenggarakan pada saat sebelum dan setelah penggunaan media.

158

158

Tabel 4.3 Data Nilai Pre-Test dan Post-Test

Keterangan :

NIS = Nomer Induk Siswa (Subjek)

N = Jumlah siswa

d = Gain (selisih skor pre-test dan post-test)

∑d = Jumlah Gain (selisih skor pre-test dan post-test)

X1 = Rerata nilai pre-test

X2 = Rerata nilai post-test

No NISNilai

Gain (d) (post-test – pre-test)Pretest Posttest

1 14913 60 80 20

2 14892 53 73 20

3 14910 60 93 33

4 14911 67 87 20

5 14908 33 67 34

6 14900 47 73 26

7 14896 80 93 13

8 14904 60 73 13

9 14894 47 73 26

10 14895 60 87 27

11 14907 33 73 40

12 14903 47 60 13

13 14901 33 67 34

14 14898 47 73 26

15 14912 73 93 20

16 14899 47 73 26

17 14897 53 73 20

18 14902 47 87 40

19 14906 67 93 26

20 14909 60 93 33

N = 201074 1584

∑d = 510X1=53.7 X2=79.2

159

159

Berdasarkan data nilai pre-test dan post-test di atas, dimana eksperimen

yang dilakukan tergolong sebagai one group design, yakni pada sekelompok

siswa kelas X-IPS tanpa melibatkan kelas lain sebagai pembanding, dapat

diketahui Mean Deviasi-nya (Md) dengan cara menjumlahkan selisih skor

(gain/deviasi) seluruh siswa dibagi jumlah siswa seperti berikut.

∑dMd =

N

510=

20

= 25.5

Langkah selanjutnya adalah menghitung deviasi perolehan skor masing-

masing siswa (Xd) dengan cara dikurangkan dengan hasil perhitungan Mean

Deviasi (Md) di atas, serta jumlah kuadrat deviasi-nya (X2d) seperti pada tabel

4.4 berikut.

160

160

Tabel 4.4 Jumlah Kuadrat Deviasi Pre-Test dan Post-Test

Keterangan :

NIS = Nomer Induk Siswa (Subjek)

N = Jumlah siswa

Xd = Gain (selisih skor pre-test dan post-test) dikurangi MeanDeviasi

∑d = Jumlah Gain (selisih skor pre-test dan post-test)

∑ X2d = Jumlah Kuadrat Deviasi

No NIS d X d (d – Md) X2d

1 14913 20 - 5.5 30.252 14892 20 - 5.5 30.253 14910 33 + 7.5 56.254 14911 20 - 5.5 30.255 14908 34 + 8.5 72.256 14900 26 + 0.5 0.257 14896 13 - 12.5 156.258 14904 13 - 12.5 156.259 14894 26 + 0.5 0.2510 14895 27 + 1.5 2.2511 14907 40 + 14.5 210.2512 14903 13 - 12.5 156.2513 14901 34 + 8.5 72.2514 14898 26 + 0.5 0.2515 14912 20 - 5.5 30.2516 14899 26 + 0.5 0.2517 14897 20 - 5.5 30.2518 14902 40 + 14.5 210.2519 14906 26 + 0.5 0.2520 14909 33 + 7.5 56.25

N = 20 ∑d = 510 ∑ X2d = 1301

161

161

Test signifikansinya kemudian dihitung dengan rumus seperti berikut.

Dari data tersebut dapat dideskripsikan bahwa seluruh siswa mengalami

peningkatan kompetensi kognitifnya setelah menggunakan media

pembelajaran berbasis web hasil penelitian pengembangan ini. Hal ini

diperkuat dengan keterangan guru pengampu bahwa para siswa lebih siap

dan antusias dalam mengikuti pembelajaran dibanding sebelumnya.

Dari data hasil pre-test dan post-test tersebut dapat disimpulkan bahwa

produk “starter” hasil penelitian pengembangan ini cukup efektif untuk

meningkatkan kesiapan siswa dalam pembelajaran sehingga dapat

meningkatkan kompetensi kognitif siswa dalam pembelajaran materi tentang

wakaf pada mata pelajaran PAI untuk siswa kelas 10 SMA Al-Falah

Ketintang Surabaya.

C. Spesifikasi Produk Pengembangan

Nama Produk : IndoMedia

Deskripsi : Situs penyedia layanan pembuatan kelas virtual sebagai media

pembelajaran berbasis web untuk pendidikan di sekolah.

Md=

∑ x2d

N(N-1)√ N (N-1)

N(N-1)

25.5=

1301

N(N-1)√ 20 x 19

N(N-1)25.5=

1301

N(N-1)√ 380

N(N-1)

25.5=

3.4

N(N-1)

√25.5

=1.8

N(N-1)

t

= 14.2

N(N-1)

162

162

Alamat url : www.indomedia.web.id

Kompabilitas : Dapat diakses dengan tampilan yang baik menggunakan browser

Internet Explorer, Mozila FireFox, dan Chrome.

D. Cara penggunaan Produk Pengembangan

Pengguna dibedakan atas admin sekolah, siswa dan guru. Admin sekolah

adalah admin yang telah melakukan pendaftaran atas nama lembaga/sekolah di

www.indomedia.web.id. Sedangkan siswa dan guru adalah siswa dan guru dari

lembaga yang bersankutan. Secara umum tentang prosedur pemakaian produk

pendidikan ini adalah sebagai berikut.

1. Admin sekolah (penanggung jawab akun sekolah) didaftarkan oleh siapapun

yang berkepentingan mewakili sekolah. Bisa ketua yayasan, kepala sekolah,

waka kurikulum atau salah satu guru yang ingin lembaga pendidikan dimana ia

bertugas maju dengan pemanfaatan web sebagai basis media pembelajarannya.

2. Pada area sekolah virtual, pengaturan tampilan, isi, dan lainnya diatur oleh

admin sekolah dengan cara login menuju halaman dashboard-nya

menggunakan private username dan password yang telah diset saat melakukan

pendaftaran. Pada halaman admin sekolah virtual dapat menyunting banner

sekolah, program sekolah, dan fitur lainnya. Termasuk mendaftarkan guru dan

siswa di sekolahnya.

3. Siswa login melalui fasilitas yang disediakan untuknya, begitupun guru. Siswa

login menuju kelas pembelajaran virtual yang dipilih, sedangkan guru akan

menuju halaman backend (dashboard) kelas pembelajarannya untuk

163

163

melakukan penyuntingan atau sekedar melihat kelas pembelajaran virtualnya.

Pada pengembangan awal ini, siswa langsung menuju kelas pembelajaran

virtual PAI dengan materi tentang wakaf. Sedangkan guru langsung menuju

halaman dashboard.

4. Beberapa hal yang dapat dilakukan siswa

Dalam pengembangan ini siswa adalah end user yang hanya memiliki

kewenangan akses untuk membaca data (konten materi pelajaran) menginput

komentar pada forum diskusi terkait materi yang diajarkan. Dalam forum

diskusi seluruh siswa pada tingkatan kelas yang sama dalam sekolah dapat

berinteraksi dengan menyatakan pendapat, berkomentar, bertanya atau

kegiatan diskusi lainnya, begitupun guru dapat juga berpartisipasi dengan login

terlebih dahulu.

Selain itu siswa dapat juga mengakses latihan soal dan berkirim laporan

tugas kegiatan yang telah terstruktur dalam model pembelajaran virtual sebagai

upaya persiapan sebelum pertemuan di kelas. Dengan beberapa fitur yang

disematkan dalam tempalate kelas virtual ini diharapkan tatap muka di kelas

akan lebih hidup dan bermakna.

5. Beberapa hal yang dapat dilakukan guru

Guru dalam hal ini adalah sebagai kontributor dalam penyediaan sarana /

media pembelajaran virtual yang ada, yang secara eksklusif hanya dapat

diakses oleh para siswanya.

Lebih lanjut tentang cara penggunaan bisa dilihat di menu “Lihat Panduan”

pada halaman utama di www.indomedia.web.id.