PERIODIKAR : APLIKASI PEMBELAJARAN PENGENALAN UNSUR PADA TABEL PERIODIK UNSUR BERBASIS AUGMENTED REALITY

Transkripsi

1 PERIODIKAR : APLIKASI PEMBELAJARAN PENGENALAN UNSUR PADA TABEL PERIODIK UNSUR BERBASIS AUGMENTED REALITY TUGAS AKHIR Diajukan Guna Memenuhi Sebagian Persyaratan dalam rangka menyelesaikan Pendidikan Sarjana Strata Satu (S1) Program Studi Teknologi Informasi AGUS SETIAWAN NIM JURUSAN TEKNOLOGI INFORMASI FAKULTAS TEKNIK UNIVERSITAS UDAYANA 2016

2 PERIODIKAR : APLIKASI PEMBELAJARAN PENGENALAN UNSUR PADA TABEL PERIODIK UNSUR BERBASIS AUGMENTED REALITY TUGAS AKHIR Diajukan Guna Memenuhi Sebagian Persyaratan dalam rangka menyelesaikan Pendidikan Sarjana Strata Satu (S1) Program Studi Teknologi Informasi AGUS SETIAWAN NIM JURUSAN TEKNOLOGI INFORMASI FAKULTAS TEKNIK UNIVERSITAS UDAYANA 2016

3 PERNYATAAN Dengan ini saya menyatakan bahwa dalam Tugas Akhir ini tidak terdapat karya yang pernah diajukan untuk memperoleh gelar kesarjanaan di suatu perguruan tinggi dan sepanjang pengetahuan saya juga tidak terdapat karya atau pendapat yang pernah ditulis atau diterbitkan oleh orang lain, kecuali yang secara tertulis diacu dalam naskah ini dan disebutkan dalam daftar pustaka. Denpasar, 24 Juni 2016 Agus Setiawan iii

4

5

6 KATA PENGANTAR Puji dan syukur penulis panjatkan kehadapan Tuhan Yang Maha Esa, karena atas Asung Kerta Wara Nugraha-Nya, penulis dapat menyelesaikan Tugas Akhir dengan judul PeriodikAR : Aplikasi Pembelajaran Pengenalan Unsur pada Tabel Periodik Unsur Berbasis Augmented Reality. Selama pelaksanaan Tugas Akhir ini penulis mendapat banyak masukan dan bimbingan dari berbagai pihak. Penulis ingin mengucapkan rasa terima kasih kepada: 1. Bapak Prof. Ir. Ngakan Putu Gede Suardana, M.T., Ph.D, selaku Dekan Fakultas Teknik Universitas Udayana. 2. Bapak Dr. Eng. I Putu Agung Bayupati, S.T., M.T, selaku Ketua Jurusan Teknologi Informasi Universitas Udayana. 3. Bapak A.A. Kompiang Oka Sudana, S.Kom., M.T., selaku dosen pembimbing I dan Bapak I Putu Agus Eka Pratama, S.T. M.T. selaku dosen pembimbing II yang telah banyak memberikan masukan dan bimbingan selama menyusun Tugas Akhir ini. 4. Bapak A.A Ketut Agung Cahyawan Wiranatha, S.T., M.T., selaku pembimbing akademik, yang telah memberikan bimbingan selama menempuh pendidikan di Jurusan Teknologi Informasi Fakultas Teknik Universitas Udayana. 5. Kedua orang tua dan keluarga yang telah memberikan motivasi dan dukungan dalam pembuatan Tugas Akhir ini. 6. Saudari Putu Ari Sri Lestari Eka Ningsih yang selalu memberikan dukungan dan selalu rela menemani dalam pembuatan Tugas Akhir ini. 7. Teman-teman seperjuangan dan HMTI yang telah memberikan sumbangan ide, pemikiran, dan dukungan dalam menyusun Tugas Akhir. Penulis memohon maaf jika ada kesalahan dalam penulisan Laporan Tugas Akhir ini. Denpasar, 24 Juni 2016 Agus Setiawan vi

7 ABSTRAK Tabel Periodik Unsur merupakan sekumpulan unsur yang mengandung informasi mengenai unsur-unsur. Informasi unsur pada tabel periodik unsur umumnya disediakan dalam bentuk teks, yang membuat kurang menarik untuk dipelajari. Hal tersebut bisa diatasi dengan memvisualisasikan informasi tersebut. Augmented Reality merupakan salah satu teknologi yang dapat digunakan untuk memvisualisasikan objek. Teknologi Agumented Reality yang dikembangkan digunakan untuk memvisualisasikan unsur kimia, yang bernama PeriodikAR. Aplikasi PeriodikAR dikembangkan untuk platform Android dengan menggunakan library Vuforia. Teknik tracking objek yang digunakan adalah markerless. Aplikasi PeriodikAR dikembangkan dengan menggunakan metodologi DSRM. Aplikasi PeriodikAR berjalan dinamis untuk memberikan informasi unsur kimia dalam bentuk video animasi. Informasi tersebut diantaranya nama, nomor atom, titik didih, titik leleh, massa jenis, massa atom, tingkat oksidasi, lambang unsur, jenis unsur, sifat unsur, struktur elektron dan cara melakukan konfigurasi elektron. Dinamis dalam kasus ini, berarti marker dan video animasi dapat ditambah maupun dikurangi tanpa harus melakukan modifikasi terhadap kode program aplikasi. Hal tersebut dikarenakan penyimpanan marker dan video animasi berada pada tempat yang terpisah dari media penyimpanan aplikasi. Aplikasi PeriodikAR bertujuan untuk membantu akademisi yang memiliki latar belakang IT dalam membangun aplikasi Augmented Reality dinamis dan untuk menambah daya tarik dalam mempelajari unsur pada tabel periodik unsur. Aplikasi PeriodikAR memiliki enam fitur. Hasil dari penelitian ini menunjukkan bahwa Aplikasi PeriodikAR dapat membantu siswa, mahasiswa, dan masyarakat umum dalam mempelajari unsur kimia pada Tabel Periodik Unsur. Kata Kunci : PeriodikAR, Augmented Reality Dinamis, Augmented Reality untuk Unsur Kimia, Video Animasi. vii

8 ABSTRACT A periodic table is a group of arranged chemical elements that contain some information for each elements. Information in a periodic table usually provided in the text form, which is less interesting to learn. It can be overcome by creating visualization of each element in the periodic table. Augmented Reality is a technology that can be used for visualizing an object. In this research, augmented reality technology is implemented for visualizing each element in a periodic table, named PeriodikAR. PeriodikAR is an application developed for Android platform by using Vuforia library. The object-tracking technique that is used in this application is markerless augmented reality technique. This application developed by using DSRM methodology. This application runs dynamically to provide some information of elements in an animated video. Some information are including the name of each element, atomic number, boiling point, melting point, density, atomic mass, standard atomic weight, oxidation state, symbol, phase, element category, electron configuration and visualization of electron orbital. In this case, the term of dynamic means all the marker and animated video of the application can be added or decreased without modifying the source code of the application. It is because all the markers and animated videos storage are placed in the different place from the application s storage. This application has six features that can be used by the user. The results of this research showed that this application can help students and the general public to learn chemical elements in the periodic table. Keywords : PeriodikAR, Dynamic Augmented Reality, Augmented Reality for Chemical Elements, Video Animation Augmented Reality. viii

9 DAFTAR ISI HALAMAN SAMPUL... i HALAMAN JUDUL... ii PERNYATAAN... iii LEMBAR PENGESAHAN TUGAS AKHIR... iv BERITA ACARA TUGAS AKHIR...v KATA PENGANTAR... vi ABSTRAK... vii ABSTRACT... viii DAFTAR ISI... ix DAFTAR GAMBAR... xiv DAFTAR TABEL... xviii DAFTAR KODE PROGRAM... xxi BAB I PENDAHULUAN Latar Belakang Rumusan Masalah Batasan Masalah Tujuan Manfaat Sistematika Penulisan...5 BAB II KAJIAN PUSTAKA State of the Art Augmented Reality Vuforia Target Manager Target atau Marker Metadata Struktur Atom Nomor Atom dan Nomor Massa Elektron dalam Atom Kulit Atom Konfigurasi Elektron...17 ix

10 2.7 Unsur Kimia Golongan I A Golongan II A Golongan III A Golongan IV A Golongan V A Golongan VI A Golongan VII A Golongan VIII A...38 BAB III METODOLOGI PENELITIAN Waktu dan Tempat Penelitian Data Sumber Data Jenis Data Metode Pengumpulan Data Metodologi Penelitian Pendekatan Solusi Berbasis Tujuan (Studi Literatur) Identifikasi Masalah dan Motivasi Penentuan Tujuan Penelitian Perancangan dan Pengembangan Solusi Demo Pengujian Pembahasan Kesimpulan Gambaran Umum Aplikasi PeriodikAR Statis Use Case Diagram PeriodikAR Statis Sequence Diagram PeriodikAR Statis Activity Diagram PeriodikAR Statis Class Diagram PeriodikAR Statis Gambaran Umum Aplikasi PeriodikAR Dinamis Use Case Diagram PeriodikAR Dinamis...67 x

11 3.5.2 Sequence Diagram PeriodikAR Dinamis Activity Diagram PeriodikAR Dinamis Bahasa Pemrograman Alat Penelitian Perancangan Aplikasi Kebutuhan Perangkat Lunak Perancangan Aplikasi Kebutuhan Perangkat Keras Perancangan Aplikasi Masukan dan Keluaran Perangkat Lunak PeriodikAR Masukan Perangkat Lunak PeriodikAR Statis Keluaran Perangkat Lunak PeriodikAR Statis Masukan Perangkat Lunak PeriodikAR Dinamis Keluaran Perangkat Lunak PeriodikAR Dinamis Rancangan Antarmuka Aplikasi PeriodikAR Rancangan Splash Screen Rancangan Interface Aplikasi PeriodikAR Statis Rancangan Interface Aplikasi PeriodikAR Dinamis Rancangan Sistem Aplikasi PeriodikAR Rancangan Model 3D Rancangan Marker Pendaftaran Marker...90 BAB IV PENGUJIAN DAN ANALISA HASIL Gambaran Umum Aplikasi Class Diagram Alat Penelitian Implementasi Aplikasi Kebutuhan Perangkat Lunak Implementasi Aplikasi Kebutuhan Perangkat Keras Implementasi Aplikasi Implementasi Desain Antarmuka Tampilan Splash Screen Scene Augmented Reality PeriodikAR Statis Scene Augmented Reality PeriodikAR Dinamis Skenario Pengujian Aplikasi Pengujian Aplikasi PeriodikAR Statis xi

12 4.5.1 Pengujian Tampilan Splash Screen Pengujian Tampilan Model 3D Pengujian Tombol Play Pengujian Tombol Pause Pengujian Tombol Scale Pengujian Tombol Forward Pengujian Tombol Previous Pengujian Tombol Restart Pengujian Tombol Reset Pengujian Aplikasi PeriodikAR Dinamis Pengujian Tampilan Splash Screen Pengujian Tampilan Video Animasi Pengujian Tombol Play Pengujian Tombol Pause Pengujian Tampilan Full Screen Pengujian Tombol Forward Pengujian Tombol Previous Pengujian Seek Bar Analisa Sistem Aplikasi Analisa Hasil Evaluasi Aplikasi Analisa Kelebihan dan Kekurangan Aplikasi Analisa Kesesuaian Proses Aplikasi Perhitungan dan Penyajian Data Aspek Kesesuaian Proses Aplikasi Aspek Kesesuaian Waktu Deteksi Aspek User Interface dan Fitur BAB V PENUTUP Simpulan Saran DAFTAR PUSTAKA LAMPIRAN xii

13 DAFTAR GAMBAR Gambar 2.1 Konfigurasi Elektron Hidrogen...10 Gambar 2.2 Target Manager...11 Gambar 2.3 Kunci Akses Target Manager...12 Gambar 2.4 Target dalam Vuforia...13 Gambar 2.5 Kumpulan Target...13 Gambar 2.6 Fitur atau Ciri Target...14 Gambar 2.7 Metadata Marker...14 Gambar 2.8 Model Atom...15 Gambar 3.1 Bagan Urutan Langkah Penelitian dengan Metodologi DSRM...45 Gambar 3.2 Gambaran Umum Sistem PeriodikAR Statis...48 Gambar 3.3 Use Case Diagram Aplikasi PeriodikAR Statis...49 Gambar 3.4 Sequence Diagram Tracking Image PeriodikAR Statis...51 Gambar 3.5 Sequence Diagram Play Animasi PeriodikAR Statis...52 Gambar 3.6 Sequence Diagram Pause Animasi PeriodikAR Statis...52 Gambar 3.7 Sequence Diagram Scale Model 3D PeriodikAR Statis...53 Gambar 3.8 Sequence Diagram Forward Model 3D PeriodikAR Statis...53 Gambar 3.9 Sequence Diagram Previous Model 3D PeriodikAR Statis...54 Gambar 3.10 Sequence Diagram Restart Animasi Model 3D PeriodikAR Statis...54 Gambar 3.11 Sequence Diagram Reset Animasi dan Model 3D PeriodikAR Statis...55 Gambar 3.12 Activity Diagram Tracking Image PeriodikAR Statis...56 Gambar 3.13 Activity Diagram Play Animasi PeriodikAR Statis...57 Gambar 3.14 Activity Diagram Pause Animasi PeriodikAR Statis...58 Gambar 3.15 Activity Diagram Scale Model PeriodikAR Statis...59 Gambar 3.16 Activity Diagram Forward Model 3D PeriodikAR Statis...60 Gambar 3.17 Activity Diagram Previous Model 3D PeriodikAR Statis...61 Gambar 3.18 Activity Diagram Restart Animasi Model 3D xiii

14 PeriodikAR Statis...62 Gambar 3.19 Activity Diagram Reset Animasi dan Model 3D PeriodikAR Statis...63 Gambar 3.20 Class Diagram PeriodikAR Statis...64 Gambar 3.21 Gambaran Umum Sistem PeriodikAR Dinamis...66 Gambar 3.22 Use Case Diagram Aplikasi PeriodikAR Dinamis...67 Gambar 3.23 Sequence Diagram Tracking Marker PeriodikAR Dinamis...69 Gambar 3.24 Sequence Diagram Play Video Animation PeriodikAR Dinamis...70 Gambar 3.25 Sequence Diagram Pause Video Animation PeriodikAR Dinamis...70 Gambar 3.26 Sequence Diagram Full Screen PeriodikAR Dinamis...71 Gambar 3.27 Sequence Diagram Forward Video Animation PeriodikAR Dinamis...71 Gambar 3.28 Sequence Diagram Previous Video Animation PeriodikAR Dinamis...72 Gambar 3.29 Activity Diagram Tracking Marker PeriodikAR Dinamis...73 Gambar 3.30 Activity Diagram Play Video Animation PeriodikAR Dinamis...74 Gambar 3.31 Activity Diagram Pause Video Animation PeriodikAR Dinamis...75 Gambar 3.32 Activity Diagram Full Screen PeriodikAR Dinamis...76 Gambar 3.33 Activity Diagram Forward Video Animation PeriodikAR Dinamis...77 Gambar 3.34 Activity Diagram Previous Video Animation PeriodikAR Dinamis...78 Ganbar 3.35 Rancangan Splash Screen PeriodikAR...83 Gambar 3.36 Interface Aplikasi PeriodikAR Statis...84 Gambar 3.37 Tombol Play PeriodikAR Statis dan PeriodikAR Dinamis...84 Gambar 3.38 Tombol Pause PeriodikAR Statis dan PeriodikAR Dinamis...85 Gambar 3.39 Tombol Scale PeriodikAR Statis...85 xiv

15 Gambar 3.40 Tombol Previous PeriodikAR Statis dan PeriodikAR Dinamis...85 Gambar 3.41 Tombol Forward PeriodikAR Statis dan PeriodikAR Dinamis...86 Gambar 3.42 Tombol Restart PeriodikAR Statis...86 Gambar 3.43 Tombol Reset PeriodikAR Statis...86 Gambar 3.44 Rancangan Interface Aplikasi PeriodikAR Dinamis...87 Gambar 3.45 Rancangan Interface Full Screen PeriodikAR Dinamis...87 Gambar 3.46 Tabel Periodik Unsur...90 Gambar 3.47 Target dalam Vuforia...91 Gambar 3.48 Metadata Marker Hidrogen...91 Gambar 3.49 Kumpulan Target...92 Gambar 3.50 Fitur atau Ciri Target...92 Gambar 4.1 Gambaran Alur Aplikasi...94 Gambar 4.2 Class Diagram Implementasi Aplikasi PeriodikAR...95 Gambar 4.3 Tampilan Splash Screen...98 Gambar 4.4 Tampilan Scene Augmented Reality PeriodikAR Statis...98 Gambar 4.5 Tampilan Scene Augmented Reality PeriodikAR Dinamis...99 Gambar 4.6 Tampilan Full Screen PeriodikAR Dinamis Gambar 4.7 Pengujian Tampilan Splash Screen PeriodikAR Statis Gambar 4.8 Pengujian Tampilan Model 3D PeriodikAR Statis Gambar 4.9 Pengujian Tampilan Model 3D PeriodikAR Statis pada Jarak 5cm Gambar 4.10 Pengujian Tampilan Model 3D PeriodikAR Statis pada Jarak 10cm Gambar 4.11 Pengujian Tampilan Model 3D PeriodikAR Statis pada Jarak 15cm Gambar 4.12 Pengujian Tampilan Model 3D PeriodikAR Statis pada Jarak 20cm Gambar 4.13 Pengujian Tombol Play PeriodikAR Statis Gambar 4.14 Pengujian Tombol Pause PeriodikAR Statis xv

16 Gambar 4.15 Pengujian Tombol Scale PeriodikAR Statis Gambar 4.16 Pengujian Tombol Forward PeriodikAR Statis Gambar 4.17 Pengujian Tombol Previous PeriodikAR Statis Gambar 4.18 Pengujian Tombol Restart PeriodikAR Statis Gambar 4.19 Pengujian Tombol Reset PeriodikAR Statis Gambar 4.20 Pengujian Tampilan Splash Screen PeriodikAR Dinamis Gambar 4.21 Pengujian Tampilan Video Animasi PeriodikAR Dinamis Gambar 4.22 Pengujian Tampilan Video Animasi PeriodikAR Dinamis pada Jarak 5cm Gambar 4.23 Pengujian Tampilan Model 3D PeriodikAR Dinamis pada Jarak 10cm Gambar 4.24 Pengujian Tampilan Model 3D PeriodikAR Dinamis pada Jarak 15cm Gambar 4.25 Pengujian Tampilan Model 3D PeriodikAR Dinamis pada Jarak 20cm Gambar 4.26 Pengujian Tampilan Model 3D PeriodikAR Statis pada Jarak 25cm Gambar 4.27 Pengujian Tombol Play PeriodikAR Dinamis Gambar 4.28 Pengujian Tombol Pause PeriodikAR Dinamis Gambar 4.29 Pengujian Double Tap PeriodikAR Dinamis Gambar 4.30 Pengujian Tombol Forward PeriodikAR Dinamis Gambar 4.31 Pengujian Tombol Previous PeriodikAR Dinamis Gambar 4.32 Pengujian Seek Bar PeriodikAR Dinamis xvi

17 DAFTAR TABEL Tabel 2.1 Penyebaran Elektron...16 Tabel 2.2 Hidrogen...18 Tabel 2.3 Litium...18 Tabel 2.4 Natrium...19 Tabel 2.5 Kalium...19 Tabel 2.6 Rubidium...20 Tabel 2.7 Sesium...20 Tabel 2.8 Fransium...21 Tabel 2.9 Berilium...22 Tabel 2.10 Magnesium...22 Tabel 2.11 Kalsium...23 Tabel 2.12 Stronsium...23 Tabel 2.13 Barium...24 Tabel 2.14 Radium...24 Tabel 2.15 Boron...25 Tabel 2.16 Aluminium...25 Tabel 2.17 Galium...26 Tabel 2.18 Indium...26 Tabel 2.19 Talium...27 Tabel 2.20 Karbon...28 Tabel 2.21 Silikon...28 Tabel 2.22 Germanium...29 Tabel 2.23 Timah...29 Tabel 2.24 Timbal...30 Tabel 2.25 Nitrogen...30 Tabel 2.26 Fosfor...31 Tabel 2.27 Arsen...31 Tabel 2.28 Antimon...32 Tabel 2.29 Bismut...32 xvii

18 Tabel 2.30 Oksigen...33 Tabel 2.31 Belerang...34 Tabel 2.32 Selen...34 Tabel 2.33 Telurium...35 Tabel 2.34 Polonium...35 Tabel 2.35 Flour...36 Tabel 2.36 Khlor...36 Tabel 2.37 Brom...37 Tabel 2.38 Yod...37 Tabel 2.39 Astatin...38 Tabel 2.40 Helium...39 Tabel 2.41 Neon...39 Tabel 2.42 Argon...40 Tabel 2.43 Kripton...40 Tabel 2.44 Ksenon...41 Tabel 2.45 Radon...41 Tabel 3.1 Rancangan Model 3D PeriodikAR...89 Tabel 4.1 Kebutuhan Perangkat Keras Implementasi...97 Tabel 4.2 Hasil Pengujian Tampilan Splash Screen Tabel 4.3 Jarak Marker pada Kamera AR PeriodikAR Statis Tabel 4.4 Waktu Tampil Model 3D PeriodikAR Statis Tabel 4.5 Hasil Pengujian Tombol Play PeriodikAR Statis Tabel 4.6 Hasil Pengujian Tombol Pause PeriodikAR Statis Tabel 4.7 Hasil Pengujian Tombol Scale PeriodikAR Statis Tabel 4.8 Hasil Pengujian Tombol Forward PeriodikAR Statis Tabel 4.9 Hasil Pengujian Tombol Previous PeriodikAR Statis Tabel 4.10 Hasil Pengujian Tombol Restart PeriodikAR Statis Tabel 4.11 Hasil Pengujian Tombol Reset PeriodikAR Statis Tabel 4.12 Hasil Pengujian Tampilan Splash Screen PeriodikAR Dinamis.118 Tabel 4.13 Jarak Marker pada Kamera AR PeriodikAR Dinamis Tabel 4.14 Waktu Tampil Video Animasi PeriodikAR Dinamis xviii

19 Tabel 4.15 Hasil Pengujian Tombol Play PeriodikAR Dinamis Tabel 4.16 Hasil Pengujian Tombol Pause PeriodikAR Dinamis Tabel 4.17 Hasil Pengujian Double Tap PeriodikAR Dinamis Tabel 4.18 Hasil Pengujian Tombol Forward PeriodikAR Dinamis Tabel 4.19 Hasil Pengujian Tombol Previous PeriodikAR Dinamis Tabel 4.20 Hasil Pengujian Seek Bar PeriodikAR Dinamis Tabel 4.21 Hasil Nilai Responden Terhadap Aspek Kesesuaian Proses Aplikasi Tabel 4.22 Hasil Nilai Responden Terhadap Aspek Kesesuaian Waktu Deteksi Tabel 4.23 Hasil Nilai Responden Terhadap Aspek Kesesuaian Waktu Deteksi xix

20 DAFTAR KODE PROGRAM Kode Program 4.1 Tampilan Model 3D Kode Program 4.2 Fokus Kamera Kode Program 4.3 Play Animasi PeriodikAR Statis Kode Program 4.4 Pause Animasi PeriodikAR Statis Kode Program 4.5 Scale Model 3D PeriodikAR Statis Kode Program 4.6 Forward Model 3D PeriodikAR Statis Kode Program 4.7 Previous Model 3D PeriodikAR Statis Kode Program 4.8 Restart Animasi PeriodikAR Statis Kode Program 4.9 Stop Animasi PeriodikAR Statis Kode Program 4.10 Reset Model dan Animasi PeriodkAR Statis Kode Program 4.11 Tampilan Video Animasi Kode Program 4.12 Pengambilan Nilai Metadata Kode Program 4.13 Tampilan Video Animasi dari Metadata Kode Program 4.14 Play Video Animasi Kode Program 4.15 Pause Video Animasi Kode Program 4.16 Tampilan Full Screen Kode Program 4.17 Perubahan Frame Video Animasi xx