MEDIA PEMBELAJARAN TEKNIK DASAR OLAHRAGA BULUTANGKIS PADA SMP Media Pembelajaran Teknik Dasar Olahraga Bulutangkis Pada SMP Menggunakan HTML5.
MEDIA PEMBELAJARAN TEKNIK DASAR
OLAHRAGA BULUTANGKIS PADA SMP
MENGGUNAKAN HTML5
SKRIPSI
Disusun sebagai salah satu syarat menyelesaikan Program Studi Strata I
pada Program Studi Informatika Fakultas Komunikasi dan Informatika
Universitas Muhammadiyah Surakarta
Oleh :
SYAIFURRIZAL ZHAFIRIN
NIM : L200100140
PROGRAM STUDI INFORMATIKA
FAKULTAS KOMUNIKASI DAN INFORMATIKA
UNIVERSITAS MUHAMMADIYAH SURAKARTA
2015
i
ii
iii
iv
MOTTO
“ Siapa pun yang dikehendaki kebaikan oleh Allah ia pasti akan diuji “
( H.R. Bukhari )
“ Bersungguh – sungguh adalah syarat utama dalam meraih sukses“
( Syaifurrizal Zhafirin )
v
PERSEMBAHAN
1. Allah SWT yang telah melimpahkan rahmat serta hidayahNya.
2. Kedua orang tuaku tercinta, Bapak Drs. Rochani dan Ibu Sih ngaini
yang telah mendidik dan membimbing saya dari lahir sampai saat ini.
3. Kakak ku Azharrudin Aufar yang selama ini menjadi contoh yang baik
untuk saya, adikku Ady Prasetya Nugraha yang memberikan semangat.
4. Octavia Rahmawati yang selama lima tahun ini selalu ada baik saat
senang maupun susah.
5. Teman – teman GEMBEL ( Gerombolan Belajar ), Yaka, Jati, Fikri,
Aziz, Lukman, Amin, Eko, Bias, Adjie, Agung, dan Alvin teman
seperjuangan suka duka selama 5 tahun ini.
6. Teman – teman kelompok bulutangkis dan futsal yang telah menerima
aku sebagai anggota.
vi
KATA PENGANTAR
Syukur Alhamdulliah saya ucapkan kepada Allah SWT yang telah
memberikan rahmat dan hidayahNya serta melimpahkan nikmat yang tidak ada
batasnya sehingga penulis dapat menyelesaikan skripsi dengan judul “ Media
Pembelajaran Teknik Dasar Olahraga Bulutangkis Pada SMP Menggunakan
Html5”.
Penulis menyadari sepenuhnya bahwa skripsi ini tidak akan selesai tanpa
bantuan dari berbagai pihak sehingga dalam kesempatan ini penulis ingin
mengucapkan terima kasih kepada :
1.
Bapak Husni Thamrin, S.T, M.T., Ph.D. selaku Dekan Fakultas
Komunikasi dan Informatika Universitas Muhammadiyah Surakarta.
2.
Bapak Dr. Heru Supriyono, S.T., M.Sc selaku Ketua Jurusan Teknik
Informatika
Universitas
Muhammadiyah
Surakarta
serta
menjadi
pembimbing skripsi yang berkenan untuk meluangkan waktu untuk
membimbing serta mengarahkan penulis dari awal hingga penulis dapat
menyelesaikan penyusunan skripsi.
3.
Dewan penguji yang telah memberikan masukan serta saran yang sangat
membangun.
4.
Segenap dosen dan karyawan progdi Tenik Informatika atas bantuan dan
ilmu yang diberikan kepada penulis selama masa perkuliahan dari pertama
masuk kulah hingga dinyatakan mendapat gelar Strata 1.
vii
5.
Kepada orang tua yang selalu memberikan dukungan berupa doa,
semangat, dan motivasi dengan tiada hentinya kepada penulis.
6.
Teman – teman angkatan 2010 Teknik Informatika.
7.
Semua pihak yang tidak bisa disebutkan satu - persatu yang telah
membantu dari awal hingga terselesaikannya skripsi ini.
Akhirnya penulis hanya dapat membalas doa dari semua pihak yang telah
membantu dalam penyusunan skripsi ini serta berharap semoga skripsi ini dapat
berguna untuk semua pihak dan bermanfaat bagi penuis, serta pembaca pada
umumnya dalam menambah pengetahuan dan wawasan ilmu.
Surakarta,
Maret 2015
Syaifurrizal Zhafirin
viii
DAFTAR ISI
Halaman Judul .................................................................................................
i
Lembar Persetujuan .........................................................................................
ii
Lembar Pengesahan ........................................................................................
iii
Daftar Kontribusi ............................................................................................
iv
Motto ...............................................................................................................
v
Persembahan ...................................................................................................
vi
Kata Pengantar ................................................................................................
vii
Daftar Isi ..........................................................................................................
ix
Daftar Tabel ....................................................................................................
xiii
Daftar Gambar .................................................................................................
xiv
Daftar Lampiran ..............................................................................................
xv
Abstrak ............................................................................................................ xviii
BAB I
BAB II
PENDAHULUAN .........................................................................
1
1.1. Latar Belakang Masalah ........................................................
1
1.2. Rumusan Masalah .................................................................
2
1.3. Batasan Masalah ....................................................................
3
1.4. Tujuan Penelitian ..................................................................
3
1.5. Manfaat Penelitian ................................................................
4
1.6. Sistematika Penulisan ...........................................................
5
TINJAUAN PUSTAKA ................................................................
6
2.1. Telaah Pustaka ......................................................................
6
2.2. Landasan Teori ......................................................................
8
ix
2.2.1. Pendidikan ..........................................................
8
2.2.2. CSS3....................................................................
8
2.2.3. JavaScript ...........................................................
8
2.2.4. Bulutangkis ........................................................
9
2.2.5. Html5 .................................................................
9
2.2.6. Database .............................................................
10
2.2.7. MySQL ...............................................................
10
2.2.8. Adobe Dreamweaver ..........................................
10
BAB III METODOLOGI PENELITIAN .................................................
11
3.1. Waktu dan Tempat Penelitian ...............................................
11
3.2. Peralatan Utama dan Pendukung ..........................................
11
3.2.1. Pembuatan Program ..................................................
12
1) Perangkat Keras ...................................................
12
2) Perangakat Lunak ................................................
12
3.2.2. Penggunaan Program .................................................
12
1) Perangkat Keras ...................................................
12
2) Perangkat Lunak ..................................................
13
3.3. Alur Penelitian ......................................................................
13
3.4. Perancangan Aplikasi ............................................................
16
3.4.1. Analisis Kebutuhan ...................................................
16
3.4.2. Pengumpulan Data ....................................................
16
3.4.3. Perancangan Desain Web ..........................................
16
1) Desain Sistem ......................................................
16
x
A. DFD Level 0 ............................................
16
B. DFD Level 1 ............................................
17
C. Use Case Diagram ...................................
19
2) Desain Terperinci ................................................
21
A. Tampilan Menu Utama ...........................
21
B. Tampilan Menu Sejarah ..........................
22
C. Tampilan Menu Teknik Dasar .................
23
D. Tampilan Menu Peraturan .......................
25
E. Tampilan Menu Kejuaraan ......................
26
F. Tampilan Menu Quiz ...............................
28
G. Tampilan Menu Tentang ..........................
30
3.4.4. Perancangan Pengujian .............................................
31
BAB IV HASIL DAN PEMBAHASAN ....................................................
35
4.1. Hasil Penelitian .....................................................................
35
4.1.1. Halaman Menu Utama ..............................................
35
4.1.2. Halaman Menu Sejarah .............................................
36
4.1.3. Halaman Menu Teknik Dasar ...................................
37
4.1.4. Halaman Menu Peraturan ..........................................
40
4.1.5. Halaman Menu Kejuaraan ..........................................
44
4.1.6. Halaman Menu Quiz .................................................
46
4.1.7. Halaman Menu Tentang ............................................
49
4.2. Pembahasan ...........................................................................
49
4.3. Analisa Kuesioner .................................................................
56
xi
4.4. Analisa Sistem .......................................................................
67
4.4.1. Kelebihan ..................................................................
67
4.4.2. Kekurangan ...............................................................
68
PENUTUP ......................................................................................
69
7.1. Kesimpulan ...........................................................................
69
7.2. Saran ......................................................................................
70
DAFTAR PUSTAKA ....................................................................................
71
LAMPIRAN ....................................................................................................
73
BAB V
xii
DAFTAR TABEL
Tabel 3.1. Rancangan Kuisioner Guru ............................................................
32
Tabel 3.2. Rancangan Kuisioner Siswa ...........................................................
33
Tabel 4.1. Tabel Hasil Pengisian Kuisioner Siswa .........................................
56
Tabel 4.2. Tabel Skoring Kuisioner Siswa ......................................................
57
Tabel 4.3. Tabel Hasil Pengisian Kuisioner Guru ...........................................
62
Tabel 4.4. Tabel Skoring Kuisioner Guru .......................................................
63
xiii
DAFTAR GAMBAR
Gambar 3.1. Diagram Alir ............................................................................
14
Gambar 3.2. DFD Level 0 .............................................................................
16
Gambar 3.3. DFD Level 1 .............................................................................
17
Gambar 3.4. Use Case Diagram ....................................................................
19
Gambar 3.5. Rancangan Menu Utama ..........................................................
21
Gambar 3.6. Rancangan Menu Sejarah .........................................................
22
Gambar 3.7. Rancangan Hasil Menu Sejarah ...............................................
22
Gambar 3.8. Rancangan Menu Teknik Dasar ...............................................
23
Gambar 3.9. Rancangan Hasil Menu Teknik Dasar ......................................
24
Gambar 3.10. Rancangan Menu Peraturan ....................................................
25
Gambar 3.11. Rancangan Hasil Menu Peraturan ...........................................
25
Gambar 3.12. Rancangan Menu Kejuaraan ...................................................
27
Gambar 3.13. Rancangan Hasil Menu Kejuaraan ...........................................
27
Gambar 3.14. Rancangan Menu Quiz ............................................................
28
Gambar 3.15. Rancangan Hasil Menu Quiz ...................................................
29
Gambar 3.16. Rancangan Menu Tentang .......................................................
30
Gambar 3.17. Rancangan Hasil Menu Tentang .............................................
31
Gambar 4.1.
Halaman Menu Utama .............................................................
36
Gambar 4.2.
Tampilan Isi Sejarah Bulutangkis di Dunia ............................
37
Gambar 4.3.
Tampilan Isi Sejarah Bulutangkis di Indonesia .......................
37
Gambar 4.4. Tampilan Menu Teknik Dasar ..................................................
38
Gambar 4.5. Tampilan Materi Service ..........................................................
39
xiv
Gambar 4.6. Tampilan Materi Memegang Raket ..........................................
39
Gambar 4.7. Tampilan Materi Teknik Smash ...............................................
40
Gambar 4.8. Tampilan Menu Teknik Dropshot ............................................
40
Gambar 4.9. Tampilan Menu Peraturan ........................................................
41
Gambar 4.10. Tampilan Peraturan Lapangan .................................................
41
Gambar 4.11. Gambar Lapangan Bulutangkis .................................................
42
Gambar 4.12. Tampilan Peraturan Penilaian ..................................................
42
Gambar 4.13. Tampilan Peraturan Jenis Permainan .......................................
43
Gambar 4.14. Tampilan Peraturan Untuk Kesalahan.......................................
43
Gambar 4.15. Tampilan peraturan Umum Dalam Pertandinan........................
44
Gambar 4.16. Tampilan Pertandingan Bulutangkis .........................................
45
Gambar 4.17. Tampilan Pertandingan Internasional .......................................
45
Gambar 4.18. Tampilan Pertandingan Nasional .............................................
46
Gambar 4.19. Halaman Menu Quiz .................................................................
46
Gambar 4.20. Tampilan Menu Quiz Sejarah ...................................................
47
Gambar 4.21. Tampilan Menu Quiz Teknik Dasar ..........................................
47
Gambar 4.22. Tampilan Menu Quiz Peraturan ................................................
48
Gambar 4.23. Tampilan Menu Quiz Kejuaraan ...............................................
48
Gambar 4.23. Tampilan Menu Tentang ...........................................................
49
Gambar 4.24. Tampilan Pada Mozilla Firefox 32.0.2......................................
50
Gambar 4.25. Spesifikasi Mozilla Firefox 32.0.2 ............................................
51
Gambar 4.26. Tampilan Pada Google Chrome 38.0.2 .....................................
51
Gambar 4.27. Spesifikasi Google Chrome 38.0.2 ............................................
52
xv
Gambar 4.28. Tampilan Pada Internet Explorer 10 .........................................
53
Gambar 4.29. Spesifikasi Internet Explorer 10 ................................................
54
Gambar 4.30. Tampilan Pada Opera 10.62 ......................................................
54
Gambar 4.31. Spesifikasi Opera 10.62.............................................................
55
Gambar 4.32. Prosentase Penilaian Responden Siswa ....................................
59
Gambar 4.33. Prosentase Penilaian Responden Guru ......................................
64
xvi
DAFTAR LAMPIRAN
Lampiran Surat Keterangan Penelitian
Lampiran Dokumentasi Saat Pengujian
Lampiran Kuisioner
Lampiran Script
xvii
ABSTRAK
Proses pembelajaran di Madrasah Tsanawiyah yang masih dilakukan hingga
saat ini adalah guru menyampaikan secara lisan dan sebagai penunjang
pembelajaran hanya buku materi sehingga siswa merasa kesulitan dalam
memahami materi. Dalam proses belajar mengajar para pendidik dituntut untuk
mengembangkan keterampilan dalam memberikan materi agar siswa lebih mudah
dalam memahami materi. Berdasarkan permasalahan itu peneliti merancang dan
menguji media pembelajaran menggunakan html5. Media pembelajaran ini
memuat materi tentang olahraga bulutangkis dengan menampilkan materi sejarah,
teknik dasar, peraturan serta kejuaraan olahraga bulutangkis dengan tampilan
yang menarik dan interaktif sehingga dapat menarik minat siswa dalam belajar
mata pelajaran olahraga bulutangkis
Metode pembuatan media pembelajaran ini menggunakan model waterfall,
dimana dalam merancang dan pembangunannya melalui beberapa tahapan seperti
definisi kebutuhan, analisis kebutuhan, desain sistem, pembangunan sistem,
pengujian, dan pemeliharaan.
Hasil dari penelitian ini adalah media pembelajaran yang memuat tentang
olahraga bulutangkis yang sesuai dengan kurikulum untuk Madrasah Tsanawiyah
Negeri 1 Klaten. Dari data yang diperoleh setelah pengujian dapat disimpulkan
bahwa aplikasi ini dapat membuat siswa lebih tertarik untuk belajar tentang
olahraga bulutangkis. Hal ini terbukti dari hasil kuesioner 82% siswa yang
semakin tertarik untuk belajar olahraga bulutangkis setelah mempelajari materi
yang ada dalam aplikasi ini.
Kata Kunci : bulutangkis, media berbasis web, madrasah tsanawiyah,
xviii
OLAHRAGA BULUTANGKIS PADA SMP
MENGGUNAKAN HTML5
SKRIPSI
Disusun sebagai salah satu syarat menyelesaikan Program Studi Strata I
pada Program Studi Informatika Fakultas Komunikasi dan Informatika
Universitas Muhammadiyah Surakarta
Oleh :
SYAIFURRIZAL ZHAFIRIN
NIM : L200100140
PROGRAM STUDI INFORMATIKA
FAKULTAS KOMUNIKASI DAN INFORMATIKA
UNIVERSITAS MUHAMMADIYAH SURAKARTA
2015
i
ii
iii
iv
MOTTO
“ Siapa pun yang dikehendaki kebaikan oleh Allah ia pasti akan diuji “
( H.R. Bukhari )
“ Bersungguh – sungguh adalah syarat utama dalam meraih sukses“
( Syaifurrizal Zhafirin )
v
PERSEMBAHAN
1. Allah SWT yang telah melimpahkan rahmat serta hidayahNya.
2. Kedua orang tuaku tercinta, Bapak Drs. Rochani dan Ibu Sih ngaini
yang telah mendidik dan membimbing saya dari lahir sampai saat ini.
3. Kakak ku Azharrudin Aufar yang selama ini menjadi contoh yang baik
untuk saya, adikku Ady Prasetya Nugraha yang memberikan semangat.
4. Octavia Rahmawati yang selama lima tahun ini selalu ada baik saat
senang maupun susah.
5. Teman – teman GEMBEL ( Gerombolan Belajar ), Yaka, Jati, Fikri,
Aziz, Lukman, Amin, Eko, Bias, Adjie, Agung, dan Alvin teman
seperjuangan suka duka selama 5 tahun ini.
6. Teman – teman kelompok bulutangkis dan futsal yang telah menerima
aku sebagai anggota.
vi
KATA PENGANTAR
Syukur Alhamdulliah saya ucapkan kepada Allah SWT yang telah
memberikan rahmat dan hidayahNya serta melimpahkan nikmat yang tidak ada
batasnya sehingga penulis dapat menyelesaikan skripsi dengan judul “ Media
Pembelajaran Teknik Dasar Olahraga Bulutangkis Pada SMP Menggunakan
Html5”.
Penulis menyadari sepenuhnya bahwa skripsi ini tidak akan selesai tanpa
bantuan dari berbagai pihak sehingga dalam kesempatan ini penulis ingin
mengucapkan terima kasih kepada :
1.
Bapak Husni Thamrin, S.T, M.T., Ph.D. selaku Dekan Fakultas
Komunikasi dan Informatika Universitas Muhammadiyah Surakarta.
2.
Bapak Dr. Heru Supriyono, S.T., M.Sc selaku Ketua Jurusan Teknik
Informatika
Universitas
Muhammadiyah
Surakarta
serta
menjadi
pembimbing skripsi yang berkenan untuk meluangkan waktu untuk
membimbing serta mengarahkan penulis dari awal hingga penulis dapat
menyelesaikan penyusunan skripsi.
3.
Dewan penguji yang telah memberikan masukan serta saran yang sangat
membangun.
4.
Segenap dosen dan karyawan progdi Tenik Informatika atas bantuan dan
ilmu yang diberikan kepada penulis selama masa perkuliahan dari pertama
masuk kulah hingga dinyatakan mendapat gelar Strata 1.
vii
5.
Kepada orang tua yang selalu memberikan dukungan berupa doa,
semangat, dan motivasi dengan tiada hentinya kepada penulis.
6.
Teman – teman angkatan 2010 Teknik Informatika.
7.
Semua pihak yang tidak bisa disebutkan satu - persatu yang telah
membantu dari awal hingga terselesaikannya skripsi ini.
Akhirnya penulis hanya dapat membalas doa dari semua pihak yang telah
membantu dalam penyusunan skripsi ini serta berharap semoga skripsi ini dapat
berguna untuk semua pihak dan bermanfaat bagi penuis, serta pembaca pada
umumnya dalam menambah pengetahuan dan wawasan ilmu.
Surakarta,
Maret 2015
Syaifurrizal Zhafirin
viii
DAFTAR ISI
Halaman Judul .................................................................................................
i
Lembar Persetujuan .........................................................................................
ii
Lembar Pengesahan ........................................................................................
iii
Daftar Kontribusi ............................................................................................
iv
Motto ...............................................................................................................
v
Persembahan ...................................................................................................
vi
Kata Pengantar ................................................................................................
vii
Daftar Isi ..........................................................................................................
ix
Daftar Tabel ....................................................................................................
xiii
Daftar Gambar .................................................................................................
xiv
Daftar Lampiran ..............................................................................................
xv
Abstrak ............................................................................................................ xviii
BAB I
BAB II
PENDAHULUAN .........................................................................
1
1.1. Latar Belakang Masalah ........................................................
1
1.2. Rumusan Masalah .................................................................
2
1.3. Batasan Masalah ....................................................................
3
1.4. Tujuan Penelitian ..................................................................
3
1.5. Manfaat Penelitian ................................................................
4
1.6. Sistematika Penulisan ...........................................................
5
TINJAUAN PUSTAKA ................................................................
6
2.1. Telaah Pustaka ......................................................................
6
2.2. Landasan Teori ......................................................................
8
ix
2.2.1. Pendidikan ..........................................................
8
2.2.2. CSS3....................................................................
8
2.2.3. JavaScript ...........................................................
8
2.2.4. Bulutangkis ........................................................
9
2.2.5. Html5 .................................................................
9
2.2.6. Database .............................................................
10
2.2.7. MySQL ...............................................................
10
2.2.8. Adobe Dreamweaver ..........................................
10
BAB III METODOLOGI PENELITIAN .................................................
11
3.1. Waktu dan Tempat Penelitian ...............................................
11
3.2. Peralatan Utama dan Pendukung ..........................................
11
3.2.1. Pembuatan Program ..................................................
12
1) Perangkat Keras ...................................................
12
2) Perangakat Lunak ................................................
12
3.2.2. Penggunaan Program .................................................
12
1) Perangkat Keras ...................................................
12
2) Perangkat Lunak ..................................................
13
3.3. Alur Penelitian ......................................................................
13
3.4. Perancangan Aplikasi ............................................................
16
3.4.1. Analisis Kebutuhan ...................................................
16
3.4.2. Pengumpulan Data ....................................................
16
3.4.3. Perancangan Desain Web ..........................................
16
1) Desain Sistem ......................................................
16
x
A. DFD Level 0 ............................................
16
B. DFD Level 1 ............................................
17
C. Use Case Diagram ...................................
19
2) Desain Terperinci ................................................
21
A. Tampilan Menu Utama ...........................
21
B. Tampilan Menu Sejarah ..........................
22
C. Tampilan Menu Teknik Dasar .................
23
D. Tampilan Menu Peraturan .......................
25
E. Tampilan Menu Kejuaraan ......................
26
F. Tampilan Menu Quiz ...............................
28
G. Tampilan Menu Tentang ..........................
30
3.4.4. Perancangan Pengujian .............................................
31
BAB IV HASIL DAN PEMBAHASAN ....................................................
35
4.1. Hasil Penelitian .....................................................................
35
4.1.1. Halaman Menu Utama ..............................................
35
4.1.2. Halaman Menu Sejarah .............................................
36
4.1.3. Halaman Menu Teknik Dasar ...................................
37
4.1.4. Halaman Menu Peraturan ..........................................
40
4.1.5. Halaman Menu Kejuaraan ..........................................
44
4.1.6. Halaman Menu Quiz .................................................
46
4.1.7. Halaman Menu Tentang ............................................
49
4.2. Pembahasan ...........................................................................
49
4.3. Analisa Kuesioner .................................................................
56
xi
4.4. Analisa Sistem .......................................................................
67
4.4.1. Kelebihan ..................................................................
67
4.4.2. Kekurangan ...............................................................
68
PENUTUP ......................................................................................
69
7.1. Kesimpulan ...........................................................................
69
7.2. Saran ......................................................................................
70
DAFTAR PUSTAKA ....................................................................................
71
LAMPIRAN ....................................................................................................
73
BAB V
xii
DAFTAR TABEL
Tabel 3.1. Rancangan Kuisioner Guru ............................................................
32
Tabel 3.2. Rancangan Kuisioner Siswa ...........................................................
33
Tabel 4.1. Tabel Hasil Pengisian Kuisioner Siswa .........................................
56
Tabel 4.2. Tabel Skoring Kuisioner Siswa ......................................................
57
Tabel 4.3. Tabel Hasil Pengisian Kuisioner Guru ...........................................
62
Tabel 4.4. Tabel Skoring Kuisioner Guru .......................................................
63
xiii
DAFTAR GAMBAR
Gambar 3.1. Diagram Alir ............................................................................
14
Gambar 3.2. DFD Level 0 .............................................................................
16
Gambar 3.3. DFD Level 1 .............................................................................
17
Gambar 3.4. Use Case Diagram ....................................................................
19
Gambar 3.5. Rancangan Menu Utama ..........................................................
21
Gambar 3.6. Rancangan Menu Sejarah .........................................................
22
Gambar 3.7. Rancangan Hasil Menu Sejarah ...............................................
22
Gambar 3.8. Rancangan Menu Teknik Dasar ...............................................
23
Gambar 3.9. Rancangan Hasil Menu Teknik Dasar ......................................
24
Gambar 3.10. Rancangan Menu Peraturan ....................................................
25
Gambar 3.11. Rancangan Hasil Menu Peraturan ...........................................
25
Gambar 3.12. Rancangan Menu Kejuaraan ...................................................
27
Gambar 3.13. Rancangan Hasil Menu Kejuaraan ...........................................
27
Gambar 3.14. Rancangan Menu Quiz ............................................................
28
Gambar 3.15. Rancangan Hasil Menu Quiz ...................................................
29
Gambar 3.16. Rancangan Menu Tentang .......................................................
30
Gambar 3.17. Rancangan Hasil Menu Tentang .............................................
31
Gambar 4.1.
Halaman Menu Utama .............................................................
36
Gambar 4.2.
Tampilan Isi Sejarah Bulutangkis di Dunia ............................
37
Gambar 4.3.
Tampilan Isi Sejarah Bulutangkis di Indonesia .......................
37
Gambar 4.4. Tampilan Menu Teknik Dasar ..................................................
38
Gambar 4.5. Tampilan Materi Service ..........................................................
39
xiv
Gambar 4.6. Tampilan Materi Memegang Raket ..........................................
39
Gambar 4.7. Tampilan Materi Teknik Smash ...............................................
40
Gambar 4.8. Tampilan Menu Teknik Dropshot ............................................
40
Gambar 4.9. Tampilan Menu Peraturan ........................................................
41
Gambar 4.10. Tampilan Peraturan Lapangan .................................................
41
Gambar 4.11. Gambar Lapangan Bulutangkis .................................................
42
Gambar 4.12. Tampilan Peraturan Penilaian ..................................................
42
Gambar 4.13. Tampilan Peraturan Jenis Permainan .......................................
43
Gambar 4.14. Tampilan Peraturan Untuk Kesalahan.......................................
43
Gambar 4.15. Tampilan peraturan Umum Dalam Pertandinan........................
44
Gambar 4.16. Tampilan Pertandingan Bulutangkis .........................................
45
Gambar 4.17. Tampilan Pertandingan Internasional .......................................
45
Gambar 4.18. Tampilan Pertandingan Nasional .............................................
46
Gambar 4.19. Halaman Menu Quiz .................................................................
46
Gambar 4.20. Tampilan Menu Quiz Sejarah ...................................................
47
Gambar 4.21. Tampilan Menu Quiz Teknik Dasar ..........................................
47
Gambar 4.22. Tampilan Menu Quiz Peraturan ................................................
48
Gambar 4.23. Tampilan Menu Quiz Kejuaraan ...............................................
48
Gambar 4.23. Tampilan Menu Tentang ...........................................................
49
Gambar 4.24. Tampilan Pada Mozilla Firefox 32.0.2......................................
50
Gambar 4.25. Spesifikasi Mozilla Firefox 32.0.2 ............................................
51
Gambar 4.26. Tampilan Pada Google Chrome 38.0.2 .....................................
51
Gambar 4.27. Spesifikasi Google Chrome 38.0.2 ............................................
52
xv
Gambar 4.28. Tampilan Pada Internet Explorer 10 .........................................
53
Gambar 4.29. Spesifikasi Internet Explorer 10 ................................................
54
Gambar 4.30. Tampilan Pada Opera 10.62 ......................................................
54
Gambar 4.31. Spesifikasi Opera 10.62.............................................................
55
Gambar 4.32. Prosentase Penilaian Responden Siswa ....................................
59
Gambar 4.33. Prosentase Penilaian Responden Guru ......................................
64
xvi
DAFTAR LAMPIRAN
Lampiran Surat Keterangan Penelitian
Lampiran Dokumentasi Saat Pengujian
Lampiran Kuisioner
Lampiran Script
xvii
ABSTRAK
Proses pembelajaran di Madrasah Tsanawiyah yang masih dilakukan hingga
saat ini adalah guru menyampaikan secara lisan dan sebagai penunjang
pembelajaran hanya buku materi sehingga siswa merasa kesulitan dalam
memahami materi. Dalam proses belajar mengajar para pendidik dituntut untuk
mengembangkan keterampilan dalam memberikan materi agar siswa lebih mudah
dalam memahami materi. Berdasarkan permasalahan itu peneliti merancang dan
menguji media pembelajaran menggunakan html5. Media pembelajaran ini
memuat materi tentang olahraga bulutangkis dengan menampilkan materi sejarah,
teknik dasar, peraturan serta kejuaraan olahraga bulutangkis dengan tampilan
yang menarik dan interaktif sehingga dapat menarik minat siswa dalam belajar
mata pelajaran olahraga bulutangkis
Metode pembuatan media pembelajaran ini menggunakan model waterfall,
dimana dalam merancang dan pembangunannya melalui beberapa tahapan seperti
definisi kebutuhan, analisis kebutuhan, desain sistem, pembangunan sistem,
pengujian, dan pemeliharaan.
Hasil dari penelitian ini adalah media pembelajaran yang memuat tentang
olahraga bulutangkis yang sesuai dengan kurikulum untuk Madrasah Tsanawiyah
Negeri 1 Klaten. Dari data yang diperoleh setelah pengujian dapat disimpulkan
bahwa aplikasi ini dapat membuat siswa lebih tertarik untuk belajar tentang
olahraga bulutangkis. Hal ini terbukti dari hasil kuesioner 82% siswa yang
semakin tertarik untuk belajar olahraga bulutangkis setelah mempelajari materi
yang ada dalam aplikasi ini.
Kata Kunci : bulutangkis, media berbasis web, madrasah tsanawiyah,
xviii