Aplikasi Pembelajaran IPA Berbasis Multimedia Interaktif Menggunakan HTML5 (Studi Kasus: SD Negeri 06 Salatiga)

Transkripsi

1 Aplikasi Pembelajaran IPA Berbasis Multimedia Interaktif Menggunakan HTML5 (Studi Kasus: SD Negeri 06 Salatiga) TUGAS AKHIR Diajukan kepada Fakultas Teknologi Informasi Untuk memperoleh Gelar Sarjana Komputer Peneliti : Wuri Pujayanti Michael Bezaleel Wenas, S.Kom., M.Cs. Adriyanto Juliastomo Gundo, S.Si., M.Pd. Program Studi Teknik Informatika Fakultas Teknologi Informasi Universitas Kristen Satya Wacana Salatiga Maret 2012 i

2 ii

3 Pernyataan Tugas akhir yang berikut ini : Judul : Aplikasi Pembelajaran IPA Berbasis Multimedia Interaktif Menggunakan HTML5 (Studi Kasus SDN 06 Salatiga). Pembimbing : 1. Michael Bezaleel Wenas, S.Kom., M.Cs. Adalah benar hasil karya saya : 2. Adriyanto Juliastomo Gundo, S.Si., M.Pd. Nama : Wuri Pujayanti Nim : Saya menyatakan tidak mengambil sebagian atau seluruhnya dari hasil karya orang lain kecuali sebagaimana yang tertulis pada daftar pustaka. Pernyataan ini dibuat dengan sebenarnya sesuai dengan ketentuan yang berlaku dalam penulisan karya ilmiah. Salatiga, Maret 2012 Wuri Pujayanti iii

4 Prakata Puja dan puji syukur penulis panjatkan kepada Allah SWT atas Rahmat dan Hidayah-Nya, penulis dapat menyelesaikan tugas akhir yang berjudul Aplikasi Pembelajaran IPA Berbasis Multimedia Interaktif Menggunakan HTML5 ini. Tugas akhir ini disusun untuk memenuhi persyaratan dalam memperoleh gelar Sarjana Komputer pada Program Studi Teknik Informatika, Fakultas Teknologi Informasi Universitas Kristen Stya Wacana Salatiga. Tugas akhir ini dapat selesai berkat bantuan dari berbagai pihak yang telah memberikan bimbingan, ide, dan berbagai dukungan lainnya kepada penulis. Pada kesempatan ini penulis mengucapkan terima kasih kepada : 1. Bapak Andeka Rocky Tanamaah, S.E., M.Cs., selaku Dekan Fakultas Teknologi Informasi Universitas Kristen Satya Wacana Salatiga. 2. Bapak Dian W. Chandra, S.Kom., M.Cs., selaku Ketua Program Studi Teknik Informatika Fakultas Teknologi Informasi Universitas Satya Wacana Salatiga. 3. Bapak Michael Bezaleel Wenas, S.Kom., M.Cs., selaku dosen pembimbing pertama yang selalu memberikan arahan dan dukungan dalam penyelesaian laporan penelitian ini. Terimakasih telah membimbing penulis dengan baik sehingga laporan penelitian ini bisa selesai dengan baik. 4. Bapak Adriyanto Juliastomo Gundo, S.Si., M.Pd., selaku dosen pembimbing kedua dan selaku Koordinator KP/TA Fakultas Teknologi Informasi, Universitas Kristen Satya iv

5 Wacana, Salatiga. Terima kasih atas kesabarannya dalam membimbing penulis, masukan-masukan yang sangat berarti untuk penulis, serta kata-kata positif yang selalu membangkitkan semangat penulis. 5. Dosen-dosen pengajar dan asisten-asisten di FTI yang baik secara langsung maupun tidak langsung telah bersama-sama membagikan pengetahuannya kepada penulis. 6. Petugas TU FTI yang selama ini telah banyak berjasa dalam pelayanannya kepada mahasiswa. 7. Pak Joko dan Pak Wagimin, terima kasih sudah membantu sehingga laporan penelitian ini bisa selesai. 8. Teman-teman di FTI angkatan 2007, angkatan sebelumnya dan sesudahnya yang tidak dapat penulis sebutkan satu per satu. 9. Teman-teman seperjuangan sekaligus sahabat-sahabat terdekat, Novia, Etna, Rani, Danang, Anjas, Arya, Angga, Rosa dan yang lain. Terima kasih atas semangat dan bantuan yang selalu diberikan. Luv u all ^^. 10. Kakak-kakakq koh Mike, kak Rici Lozano, kak abet, kak Dian. Terima kasih semua bantuan dan semangat yang diberikan sehingga laporan penelitian cepat selesai dan mendapatkan hasil yang terbaik. 11. Seseorang yang selalu membuat saya tersenyum dan bahagia, semangat dan doanya juga. 12. Yang tersayang Bapak, Ibuk, Dawis, dan semua keluarga yang selalu memberikan doa dan dukungan. Semoga Allah v

6 senantiasa memberikan kesehatan dan umur panjang, betapa besar pengorbanan dan usaha yang diberikan kepada penulis. Penulis menyadari pembuatan tugas akhir ini masih belum sempurna. Oleh karena itu, kritik dan saran yang membangun sangat penulis harapkan dalam pengembangan laporan penelitian khususnya, dan dalam pengembangan ilmu pengetahuan ke depannya. Salatiga, Maret 2012 Wuri Pujayanti vi

7 Daftar Isi Halaman Judul... i Lembar Pengesahan... ii Halaman Pernyataan... iii Prakata... iv Daftar Isi... viii Daftar Tabel... x Daftar Gambar... xi Kode Program... xiii Lampiran... xiv Abstract... xv Bab 1 Pendahuluan Latar Belakang Rumusan Masalah Tujuan dan Manfaat Batasan Masalah Sistematika Penulisan... 4 Bab 2 Tinjauan Pustaka Penelitian Terdahulu Multimedia Multimedia Pembelajaran Multimedia Interaktif Unsur-unsur Pendukung dalam Multimedia Manfaat Multimedia Pembelajaran HTML Pengertian Tata Surya Matahari sebagai Pusat Tata Surya Planet-planet Orbit Tata Surya Gerhana Matahari Gerhana Bulan Meteor dan Meteoroid Sistem Penanggalan Profil SD Negeri Salatiga vii

8 Bab 3 Metode Perancangan Sistem Metode Perancangan Sistem Kebutuhan Sistem Perancangan Sistem Use Case Diagram Activity Diagram Sequence Diagram Class Diagram Desain Antarmuka Rancangan Antarmuka Halaman Utama Rancangan Antarmuka Halaman Pengenalan Planet Rancangan Antarmuka Halaman Orbit Tata Surya Rancangan Antarmuka Halaman Gerhana Rancangan Antarmuka Halaman Meteor Rancangan Antarmuka Halaman Sistem Penanggalan Rancangan Antarmuka Halaman Bantuan Bab 4 Hasil dan Pembahasan Prototype Implementasi Sistem Implementasi Halaman Utama Implementasi Halaman Pengenalan Planet Implementasi Halaman Orbit Tata Surya Implementasi Halaman Gerhana Implementasi Halaman Meteor Implementasi Halaman sistem Penanggalan Pengujian Pengujian pada User Bab 5 Kesimpulan dan Saran Kesimpulan Saran Daftar Pustaka... xvi viii

9 Daftar Tabel Tabel 4.1 Tabel Perbandingan Nilai Kelas VI A Tabel 4.2 Tabel Perbandingan Nilai Kelas VI B ix

10 Daftar Gambar Gambar 3.1 Metode Perancangan Sistem Gambar 3.2 Use Case Diagram Sistem Gambar 3.3 Activity Diagram User Gambar 3.4 Sequence Diagram Pengenalan Planet Gambar 3.5 Sequence Diagram Orbit Tata Surya Gambar 3.6 Sequence Diagram Gerhana Gambar 3.7 Sequence Diagram Meteor Gambar 3.8 Sequence Diagram Sistem Penanggalan Gambar 3.9 Class Diagram Aplikasi Gambar 3.10 Rancangan Antarmuka Halaman Utama Gambar 3.11 Rancangan Antarmuka Halaman Pengenalan Planet Gambar 3.12 Rancangan Antarmuka Halaman Orbit Tata Surya Gambar 3.13 Rancangan Antarmuka Halaman Gerhana Gambar 3.14 Rancangan Antarmuka Halaman Meteor Gambar 3.15 Rancangan Antarmuka Halaman Sistem Penanggalan Gambar 3.16 Rancangan Antarmuka Halaman Bantuan Gambar 4.1 Prototype 1 Halaman Utama Gambar 4.2 Prototype 1 Halaman Pengenalan Planet Gambar 4.3 Prototype 1 Halaman Orbit Tata Surya Gambar 4.4 Prototype 1 Halaman Gerhana Gambar 4.5 Prototype 1 Halaman Meteor Gambar 4.6 Prototype 1 Halaman Sistem Penanggalan Gambar 4.7 Prototype 2 Halaman Utama Gambar 4.8 Prototype 2 Halaman Pengenalan Planet Gambar 4.9 Prototype 2 Halaman Orbit Tata Surya Gambar 4.10 Prototype 3 Halaman Utama Gambar 4.11 Prototype 3 Halaman Pengenalan Planet Gambar 4.12 Prototype 4 Halaman Utama Gambar 4.13 Prototype 4 Halaman Pengenalan Planet Gambar 4.14 Prototype 4 Halaman Orbit Tata Surya Gambar 4.15 Prototype 4 Halaman Gerhana Gambar 4.16 Prototype 5 Halaman Utama Gambar 4.17 Prototype 5 Halaman Pengenalan Planet Gambar 4.18 Prototype 5 Halaman Orbit Tata Surya x

11 Gambar 4.19 Prototype 5 Halaman Gerhana Gambar 4.20 Prototype 5 Halaman Meteor Gambar 4.21 Prototype 5 Halaman Sistem Penanggalan Gambar 4.22 Tampilan Halaman Utama Gambar 4.23 Tampilan Halaman Pengenalan Planet Gambar 4.24 Tampilan Halaman Orbit Tata Surya Gambar 4.25 Tampilan Halaman Gerhana Gambar 4.26 Tampilan Halaman Meteor Gambar 4.27 Tampilan Halaman Sistem Penanggalan xi

12 Kode Program Kode Program 4.1 Pembuatan Canvas Kode Program 4.2 Halaman Utama Kode Program 4.3 Tampilan Pengenalan Planet Kode Program 4.4 Halaman Orbit Tata Surya xii

13 Lampiran Lampiran 1 Surat Keterangan SDN Salatiga xviii Lampiran 2 Angket Wanwancara Guru SDN 06 Salatiga.. xix Lampiran 3 Surat Pernyataan Guru SDN 06 Salatiga... xx Lampiran 4 Lampiran 5 Lampiran 6 Lampiran 7 Lampiran 8 Lampiran 9 Lampiran 10 Wanwancara Kebutuhan Aplikasi kepada Guru Kelas VI SDN 06 Salatiga...` xxi Wawancara Aplikasi Revisi 1 kepada Guru Kelas VI SDN 06 Salatiga... xxii Wawancara Aplikasi Revisi 2 kepada Guru Kelas VI SDN 06 Salatiga... xxiii Wawancara Aplikasi Revisi 3 kepada Guru Kelas VI SDN 06 Salatiga... xxiv Wawancara Aplikasi Revisi 4 kepada Guru Kelas VI SDN 06 Salatiga... xxv Wawancara Aplikasi Revisi 5 kepada Guru Kelas VI SDN 06 Salatiga... xxvi Wawancara Aplikasi Revisi 6 kepada Guru Kelas VI SDN 06 Salatiga... xxvii xiii

14 Abstract Technology facilities such as computer, LCD and Wi-Fi are available in SDN 6 Salatiga. Based on the research, the teaching process of solar system is still conventional. Students understanding then become less maximum hence influence the learning result in the classroom. The aim of this study is to build an interactive multimedia-based learning application. The solar system learning application of planets introduction as well as its details is built using HTML5 technology an implemented in the web application. This application design uses prototyping and developed according to the result and evaluation in order to provide benefits for the users. This application helps teachers in delivering subject about solar system, especially the planets introduction and details information about each planet. The implementation of interactive multimedia-based applications using HTML5 can increase the learning value outcomes of student class VI at SDN 6 Salatiga. Keywords: HTML5, Multimedia, Solar system xiv