BAB IV IMPLEMENTASI DAN ANALISA

Transkripsi

1 BAB IV IMPLEMENTASI DAN ANALISA 4.1 Produksi Proses produksi Aplikasi Media Pembelajaran Sistem Tata Surya menggunakan Augmeted Reality ini tersusun atas beberapa tahap dimulai dengan pembuatan antar muka Pembuatan Antarmuka (Interface Design) Pembuatan Aplikasi Media Pembelajaran Sistem Tata Surya menggunakan Augmented Reality ini terdiri atas beberapa interface sekaligus Pembuatan Desain Background Menu Utama Desain background menu utama menggunakan background dengan gambar matahari dan beberapa planet yang mengelilinginya. Tampilan ini dipilih untuk mewakili keseluruhan dari isi aplikasi. Gambar 4.1 Pembuatan Desain Background 48

2 Pembuatan Desain Tutorial Pembutan desain tutorial menggunakan background yang sama dengan desain background utama. Perbedaan terdapat pada penambahan objek rectangle dengan round corner 20 agar sudut dari objek rectangle tersebut tidak terlalu tajam. Font yang dipilih adalah arial karena tampilannya yang simple tetapi mudah dibaca. Gambar 4.2 Desain Tutorial Pembuatan Desain Developer Pembutan desain developer menggunakan background yang sama dengan desain background utama. Perbedaan terdapat pada penambahan objek rectangle dengan round corner 20 agar sudut dari objek rectangle tersebut tidak terlalu tajam. Font yang dipilih adalah arial karena tampilannya yang simple tetapi mudah dibaca. 49

3 Gambar 4.3 Desain Developer Pembuatan Elemen Desain Grafis (Graphic Design) Pembuatan Logo Pada pembuatan logo digunakan 3 buah elemen yakni teks bertuliskan sistem tata surya sebagai main text, teks bertuliskan augmented rality dan sebuah mapping dari planet merkurius. Pada teks bertuliskan sistem tata surya digunakan font galactic vanguardian ncv dan pada teks augmented reality menggunakan font arial. Untuk main text diubah kedalam bitmap dan ditumpuk dengan gambar mapping dari planet merkurius kemudian dengan memafaatkan fitur intersect maka main text bisa memiliki tekstur dari mapping planet merkurius. 50

4 Gambar 4.4 Pembuatan Logo Pembutan Desain Tombol Pada pembuatan tombol digunakan beberapa bentuk objek untuk menghasilkan tombol yang terkesan memiliki cincin logam di bagian tepinya. Terdapat empat buah objek untuk menghasilkan sebuah tombol, dua di antaranya digunakan untuk membentuk cincin logam, satu yang lainnya sebagai bagian tengah dari tombol dan yang terakhir untuk memberikan kesan mengkilap pada tombol. Gambar 4.5 Desain Tombol Pembuatan Katalog Pada pembuatan katalog, ditampilkan penjelasan singkat mengenai 51

5 sistem tata surya dengan background berupa gambar planet, bintang-bintang dan atau benda langit lainnya sebagai background Gambar 4.6 Pembuatan Katalog Pembuatan Objek 3D Pembuatan objek 3Dimensi menggunakan software blender versi Dalam peroses pembuatan objek, komponen yang digunakan adalah komponenkomponen yang terdapat pada tools blender. Gambar 4.7 Matahari Pada pembuatan objek Matahari dipilih objek sphere untuk membuat bentuk bola 3D. Pada menu add, pilih objek mesh kemudian pilih sphere. Atur 52

6 permukaan objek agar menjadi lebih halus dengan mengatur nilai pada smooth. Untuk memasukan tekstur matahari, drag bagian kiri aplikasi blender hingga halaman menjadi double. Plih view menjadi image editor kemudian pilih menu image. Pada menu image pilih add image sehingga kita akan dialihkan ke halaman untuk memilih image atau gambar yang akan digunakan sebagai tekstur dari objek 3D. pilih gambar tekstur matahari yang sudah tersimpan. Gambar 4.8 Merkurius Pada pembuatan objek Merkurius dipilih objek sphere untuk membuat bentuk bola 3D. Pada menu add, pilih objek mesh kemudian pilih sphere. Atur permukaan objek agar menjadi lebih halus dengan mengatur nilai pada smooth. Untuk memasukan tekstur matahari, drag bagian kiri aplikasi blender hingga halaman menjadi double. Plih view menjadi image editor kemudian pilih menu image. Pada menu image pilih add image sehingga kita akan dialihkan ke halaman untuk memilih image atau gambar yang akan digunakan sebagai tekstur dari objek 3D, pilih gambar tekstur matahari yang sudah tersimpan. Untuk membuat rotasi Merkurius, pertama kita atur frame sebanyak

7 atau 10 detik. Aktifkan menu pada objek planet dengan klik pada tombol + (Plus) yang terdapat di pojok atas sebelah kanan di dalam view port. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Masukkan angka 0 untuk derajat awal rotasi objek tersebut lalu klik kanan dan pilih insert single keyframe pada keyframe ke 0. Dengan cara yang sama, masukkan angka 358 untuk derajat akhir rotasi objek lalu klik kaana dan pilih insert single keyframe pada keyframe ke 250. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Buat view menjadi dua, untuk view yang terakhir kita buat, kita ganti menjadi dopesheet. Pilih key kemudian interpolation dan pilih linear. Gambar 4.9 Venus Pada pembuatan objek Venus dipilih objek sphere untuk membuat bentuk bola 3D. Pada menu add, pilih objek mesh kemudian pilih sphere. Atur permukaan objek agar menjadi lebih halus dengan mengatur nilai pada smooth. Untuk memasukan tekstur, drag bagian kiri aplikasi blender hingga halaman menjadi double. Plih view menjadi image editor kemudian pilih menu image. Pada menu image pilih add image sehingga kita akan dialihkan ke halaman untuk 54

8 memilih image atau gambar yang akan digunakan sebagai tekstur dari objek 3D, pilih gambar tekstur matahari yang sudah tersimpan. Untuk membuat rotasi Venus, pertama kita atur frame sebanyak 250 atau 10 detik. Aktifkan menu pada objek planet dengan klik pada tombol + (Plus) yang terdapat di pojok atas sebelah kanan di dalam view port. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Masukkan angka 0 untuk derajat awal rotasi objek tersebut lalu klik kanan dan pilih insert single keyframe pada keyframe ke 0. Dengan cara yang sama, masukkan angka 358 untuk derajat akhir rotasi objek lalu klik kaana dan pilih insert single keyframe pada keyframe ke 250. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Buat view menjadi dua, untuk view yang terakhir kita buat, kita ganti menjadi dopesheet. Pilih key kemudian interpolation dan pilih linear. Gambar 4.10 Bumi Pada pembuatan objek Bumi dipilih objek sphere untuk membuat bentuk bola 3D. Pada menu add, pilih objek mesh kemudian pilih sphere. Atur permukaan objek agar menjadi lebih halus dengan mengatur nilai pada smooth. 55

9 Untuk memasukan tekstur, drag bagian kiri aplikasi blender hingga halaman menjadi double. Plih view menjadi image editor kemudian pilih menu image. Pada menu image pilih add image sehingga kita akan dialihkan ke halaman untuk memilih image atau gambar yang akan digunakan sebagai tekstur dari objek 3D, pilih gambar tekstur matahari yang sudah tersimpan. Untuk membuat rotasi Bumi, pertama kita atur frame sebanyak 250 atau 10 detik. Aktifkan menu pada objek planet dengan klik pada tombol + (Plus) yang terdapat di pojok atas sebelah kanan di dalam view port. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Masukkan angka 0 untuk derajat awal rotasi objek tersebut lalu klik kanan dan pilih insert single keyframe pada keyframe ke 0. Dengan cara yang sama, masukkan angka 358 untuk derajat akhir rotasi objek lalu klik kaana dan pilih insert single keyframe pada keyframe ke 250. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Buat view menjadi dua, untuk view yang terakhir kita buat, kita ganti menjadi dopesheet. Pilih key kemudian interpolation dan pilih linear. Gambar 4.11 Mars 56

10 Pada pembuatan objek Mars dipilih objek sphere untuk membuat bentuk bola 3D. Pada menu add, pilih objek mesh kemudian pilih sphere. Atur permukaan objek agar menjadi lebih halus dengan mengatur nilai pada smooth. Untuk memasukan tekstur, drag bagian kiri aplikasi blender hingga halaman menjadi double. Plih view menjadi image editor kemudian pilih menu image. Pada menu image pilih add image sehingga kita akan dialihkan ke halaman untuk memilih image atau gambar yang akan digunakan sebagai tekstur dari objek 3D, pilih gambar tekstur matahari yang sudah tersimpan. Untuk membuat rotasi Mars, pertama kita atur frame sebanyak 250 atau 10 detik. Aktifkan menu pada objek planet dengan klik pada tombol + (Plus) yang terdapat di pojok atas sebelah kanan di dalam view port. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Masukkan angka 0 untuk derajat awal rotasi objek tersebut lalu klik kanan dan pilih insert single keyframe pada keyframe ke 0. Dengan cara yang sama, masukkan angka 358 untuk derajat akhir rotasi objek lalu klik kanan dan pilih insert single keyframe pada keyframe ke 250. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Buat view menjadi dua, untuk view yang terakhir kita buat, kita ganti menjadi dopesheet. Pilih key kemudian interpolation dan pilih linear. 57

11 Gambar 4.12 Jupiter Pada pembuatan objek Jupiter dipilih objek sphere untuk membuat bentuk bola 3D. Pada menu add, pilih objek mesh kemudian pilih sphere. Atur permukaan objek agar menjadi lebih halus dengan mengatur nilai pada smooth. Untuk memasukan tekstur, drag bagian kiri aplikasi blender hingga halaman menjadi double. Plih view menjadi image editor kemudian pilih menu image. Pada menu image pilih add image sehingga kita akan dialihkan ke halaman untuk memilih image atau gambar yang akan digunakan sebagai tekstur dari objek 3D, pilih gambar tekstur matahari yang sudah tersimpan. Untuk membuat rotasi Jupiter, pertama kita atur frame sebanyak 250 atau 10 detik. Aktifkan menu pada objek planet dengan klik pada tombol + (Plus) yang terdapat di pojok atas sebelah kanan di dalam view port. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Masukkan angka 0 untuk derajat awal rotasi objek tersebut lalu klik kanan dan pilih insert single keyframe pada keyframe ke 0. Dengan cara yang sama, masukkan angka 358 untuk derajat akhir rotasi objek lalu klik kanan dan pilih insert single 58

12 keyframe pada keyframe ke 250. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Buat view menjadi dua, untuk view yang terakhir kita buat, kita ganti menjadi dopesheet. Pilih key kemudian interpolation dan pilih linear. Gambar 4.13 Saturnus Pada pembuatan objek mars dipilih objek sphere untuk membuat bentuk bola 3D. Pada menu add, pilih objek mesh kemudian pilih sphere. Atur permukaan objek agar menjadi lebih halus dengan mengatur nilai pada smooth. Untuk memasukan tekstur, drag bagian kiri aplikasi blender hingga halaman menjadi double. Plih view menjadi image editor kemudian pilih menu image. Pada menu image pilih add image sehingga kita akan dialihkan ke halaman untuk memilih image atau gambar yang akan digunakan sebagai tekstur dari objek 3D, pilih gambar tekstur matahari yang sudah tersimpan. Untuk membuat cincin Saturnus, buat objek baru dengan memilih add kemudian mesh dan pilih plane. Untuk membuat rotasi Saturnus, pertama kita atur frame sebanyak 250 atau 10 detik. Aktifkan menu pada objek planet dengan klik pada tombol + (Plus) 59

13 yang terdapat di pojok atas sebelah kanan di dalam view port. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Masukkan angka 0 untuk derajat awal rotasi objek tersebut lalu klik kanan dan pilih insert single keyframe pada keyframe ke 0. Dengan cara yang sama, masukkan angka 358 untuk derajat akhir rotasi objek lalu klik kanan dan pilih insert single keyframe pada keyframe ke 250. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Buat view menjadi dua, untuk view yang terakhir kita buat, kita ganti menjadi dopesheet. Pilih key kemudian interpolation dan pilih linear. Gambar 4.14 Uranus Pada pembuatan objek Uranus dipilih objek sphere untuk membuat bentuk bola 3D. Pada menu add, pilih objek mesh kemudian pilih sphere. Atur permukaan objek agar menjadi lebih halus dengan mengatur nilai pada smooth. Untuk memasukan tekstur, drag bagian kiri aplikasi blender hingga halaman menjadi double. Plih view menjadi image editor kemudian pilih menu image. Pada menu image pilih add image sehingga kita akan dialihkan ke halaman untuk memilih image atau gambar yang akan digunakan sebagai tekstur dari objek 3D, 60

14 pilih gambar tekstur matahari yang sudah tersimpan. Untuk membuat rotasi Uranus, pertama kita atur frame sebanyak 250 atau 10 detik. Aktifkan menu pada objek planet dengan klik pada tombol + (Plus) yang terdapat di pojok atas sebelah kanan di dalam view port. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Masukkan angka 0 untuk derajat awal rotasi objek tersebut lalu klik kanan dan pilih insert single keyframe pada keyframe ke 0. Dengan cara yang sama, masukkan angka 358 untuk derajat akhir rotasi objek lalu klik kanan dan pilih insert single keyframe pada keyframe ke 250. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Buat view menjadi dua, untuk view yang terakhir kita buat, kita ganti menjadi dopesheet. Pilih key kemudian interpolation dan pilih linear. Gambar 4.15 Neptunus Pada pembuatan objek Neptunus dipilih objek sphere untuk membuat bentuk bola 3D. Pada menu add, pilih objek mesh kemudian pilih sphere. Atur permukaan objek agar menjadi lebih halus dengan mengatur nilai pada smooth. 61

15 Untuk memasukan tekstur, drag bagian kiri aplikasi blender hingga halaman menjadi double. Plih view menjadi image editor kemudian pilih menu image. Pada menu image pilih add image sehingga kita akan dialihkan ke halaman untuk memilih image atau gambar yang akan digunakan sebagai tekstur dari objek 3D, pilih gambar tekstur matahari yang sudah tersimpan. Untuk membuat rotasi Neptunus, pertama kita atur frame sebanyak 250 atau 10 detik. Aktifkan menu pada objek planet dengan klik pada tombol + (Plus) yang terdapat di pojok atas sebelah kanan di dalam view port. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Masukkan angka 0 untuk derajat awal rotasi objek tersebut lalu klik kanan dan pilih insert single keyframe pada keyframe ke 0. Dengan cara yang sama, masukkan angka 358 untuk derajat akhir rotasi objek lalu klik kanan dan pilih insert single keyframe pada keyframe ke 250. Masuk ke dalam sub menu transform lalu pilih sumbu Z di dalam rotasi objek tersebut. Buat view menjadi dua, untuk view yang terakhir kita buat, kita ganti menjadi dopesheet. Pilih key kemudian interpolation dan pilih linear. 62

16 Gambar 4.16 Animasi Tata Surya Untuk membuat revolusi, pastikan cursor untuk di tengah. Jika belum, tekan Shift + S, lalu pilih cursor to center. Buat empty object dengan tekan Shift + A, pilih Empty, pilih Plain Axes. Ganti nama empty object dengan revolusi planet yang dibuat. Aktifkan objek planet, ganti dropdown Dope Sheet menjadi Action Editor, ganti nama animasi rotasi planet nya menjadi revolusi planet. Aktifkan empty object dengan nama revolusi bumi dan klik +New pada action editor. 1. Aktifkan empty object dengan nama Revolusi Bumi lalu copy animasi Revolusi planet. Pilih frame sebanyak Arahkan cursor ke frame lalu tekan "E" untuk End di frame tersebut. Jangan lupa menambahkan Extrapolation supaya planet dapat memurat terus menerus. Aktifkan Planet lalu masuk ke view Graph Editor. Pilih Channel, pilih Extrapolation mode, pilih Linear. Lakukan juga pada Empty object dengan nama Revolusi bumi. Aktifkan objek Planet. Geser menjauhi sumbu 0 derajat sebagai sumbu revolusi. Jangan lupa ganti nama planet. Pilih parent ke Empty Object dengan nama Revolusi Bumi. Lihat dari atas searah sumbu z dengan menekan tombol 7, lalu play. Aktifkan Revolusi Bumi, lalu pilih Ctrl+C dan Ctrl+V untuk copy dan paste. Ubah nama Revolusinya sesuai dengan nama planet yang selanjutnya akan kita buat, buat planet baru. Masuk ke dope sheet, ganti nama untuk animasi planet yang baru. Kita hapus frame (alt+i) untuk revolusinya lalu kita tentukan yang baru. Untuk revolusi yang cepat maka semakin banyak frame yang dibutuhkan untuk revolusi sebesar 360 derajat dan sebaliknya. Setelah itu lakukan langkah yang sama pada tahapan sebelumnya hingga menghasilkan seluruh planet dari komponen sistem tata surya. 63

17 Gambar 4.17 Gerhana Untuk membuat Bulan berevolusi mengelilingi Bumi, pastikan cursor untuk di tengah. Jika belum, tekan Shift + S, lalu pilih cursor to center. Buat empty object dengan tekan Shift + A, pilih Empty, pilih Plain Axes. Ganti nama empty object dengan revolusi bulan yang dibuat. Aktifkan objek bulan, ganti dropdown Dope Sheet menjadi Action Editor, ganti nama animasi rotasi bulan menjadi revolusi bulan. Aktifkan empty object dengan nama revolusi bulan dan klik +New pada action editor. Aktifkan empty object dengan nama Revolusi Bulan lalu copy animasi Revolusi bulan. Pilih frame sebanyak Arahkan cursor ke frame lalu tekan "E" untuk End di frame tersebut. Jangan lupa menambahkan Extrapolation supaya bulan dapat memutar terus menerus. Aktifkan Bulan lalu masuk ke view Graph Editor. Pilih Channel, pilih Extrapolation mode, pilih Linear. Lakukan juga pada Empty object dengan nama Revolusi Bulan. Pilih parent ke Empty Object dengan nama Revolusi Bulan. Lihat dari atas searah sumbu z dengan menekan tombol 7, lalu play. 64

18 Gambar 4.18 Komet Pada pembuatan animasi komet diberikan tambahan ekor komet. Ekor komet dibuat dengan menggunakan objek plane yang diatur bentuk dan ukurannya kemudian diletakan pada posisi yang sama dengan sebuah sphere. untuk menambah tekstur, digunakan perintah add image. Untuk mengatur animasinya, posisi objek sphere dan empty di pindah-pindah dan diatur panjang emptynya berdasarkan letak keyframe. Gambar 4.19 Komet 65

19 Pada pembuatan komet, digunakan objek sphere yang diatur sedemikian rupa untuk mengubah bentuknya menjadi bentuk seperti batu. Untuk memberikan terkstur, tambahkan gambar tekstur dengan menggunakan add image. Sebagai animasi agar batu berputar, atur keyframe dan sudut objek pada posisi 0 derajat dan 358 derajat. Gambar 4.20 Meteoroid Pada pembuatan meteoroid, digunakan objek sphere yang diatur sedemikian rupa untuk mengubah bentuknya menjadi bentuk seperti batu. Untuk memberikan terkstur, tambahkan gambar tekstur dengan menggunakan add image. Sebagai animasi agar batu berputar, atur keyframe dan sudut objek pada posisi 0 derajat dan 358 derajat Pembuatan Audio dan Video Pembuatan audio pada aplikasi ini menggunakan dua macam audio yakni audio sebagai backsound dari sebuah music instrument yang bisa diunduh dan audio dubbing untuk penjelasan materi di dalam aplikasi. Dalam pembuatan audio digunakan alat bantu berupa smartphone 66

20 Samsung Galaxy Young yang digunakan untuk merekam suara. Setelah setelah audio tersimpan, format dari setiap audo adalah M4P. Karena yang dibutuhkan adalah audio dengan format MP3 maka digunakan converter sebagai alat untuk mengubah format file audio. Converter yang digunakan bernama any converter yang dapat diunduh secara gratis di internet. Untuk melakukan convert, buka aplikasi any converter. Drag file audio dengan ekstensi M4P ke dalam aplikasi. Selanjutnya pilih ekstensi tujuan dan klik convert. Gambar 4.21 Proses Convert Audio Setelah file tersimpan dalam format MP3, masukan ke dalam scene pada unity. Masukan audio dengan cara pilih image target sebagai tempat yang ingin diberi audio. Pilih menu playmaker lalu pilih play maker audio dan atur audio yang akan digunakan sesuai dengan keinginan. Dalam pembuatan audio pada aplikasi, FSM (Finite State Machine) yang digunakan untuk tombol Audio menggunakan 3 State yaitu, Listener dengan event tracking found, Play dengan event tracking lost dan Stop dengan event finished. 67

21 4.1.4 Pembuatan Marker Marker yang digunakan adalah markerless dan dibuat dengan menggunakan corel draw sesuai dengan desain katalog sehingga marker dan katalog memiliki tampilan yang sama atau katalog yang telah dibuat dapat dijadikan sebagai marker. Untuk mengetahui kualitas gambar katalog sebagai marker, diperlukan penilaian terhadap gambar tersebut. Untuk mengetahui hal tersebut dapat dilakukan melalui situs developer.vuforia.com sebagai situs yang menyediakan fasilitas untuk memberikan penilaian pada marker sebagai markerless untuk aplikasi augmented reality. Buat akun terlebih dahulu pada situs developer.vuforia.com dengan mengikuti langkah-langkah yang tersedia pada situs tersebut. Setelah berhasil membuat akun, login menggunakan username dan password yang telah digunakan untuk mendaftar sebelumnya. Pilih menu develop pada tab menu yang tersedia. Gambar 4.22 Halaman setelah login pada situs developer.vuforia.com Pilih target manager pada sub menu kemudian pilih add database untuk 68

22 membuat database baru. Isikan nama database pada kolom yang tersedia dan pilih create. Gambar 4.23 Membuat Database pada Vuforia Setelah database berhasil, pilih nama database yang telah dibuat sebelumnya. Pilih add target untuk memasukan gambar satu persatu. Pilih gambar yang akan dimasukan dan pilih add. 69

23 Gambar 4.24 Mengunggah Gambar sebagai Marker Setelah beberapa saat akan ditampilkan nama gambar yang sebelumnya dimasukan dan di sisi kanan akan ditampilkan gambar bintang sebagai hasil penilaian dari gambar yang telah kita unggah sebelumnya. Semakin banyak jumlah bintang maka kualitas marker dari gambar tersebut semakin baik. Gambar 4.25 Kualitas Marker ditandai dengan Jumlah Bintang Setelah mengetahui kualitas marker, keseluruhan marker tersebut dapat diunduh dengan memilih menu download database. Gambar 4.26 Doownload Dataset Marker 70

24 4.1.5 Authoring dan Pemrograman (Authoring and Programming) Di dalam aplikasi media Pembelajaran Sistem Tata Surya Menggunakan Augmented Reality ini tidak melakukan programming. Sebagai pengganti, dilakukan instalasi beberapa plugin untuk memudahkan pembuatan aplikasi agar tidak perlu melakukan programming. Untuk membuat Aplikasi Media Pembelajaran Sistem Tata Surya menggunakan Augmeted Reality ini menggunakan software unity 3D dan memerlukan vuforia sdk yang digunakan untuk mengubah sebuah gambar menjadi marker diikuti dengan pembuatan logika yang menghubungkan setiap halaman menggunakan FSM (Finite State Machine). Sebelum menggunakan FSM dari playmaker, dibutuhkan component Ngui Events To Playmaker Fsm Events dan Play Maker FSM (script). Berikut merupakan langkah dan cara pembuatan aplikasi augmented reality per scene Pembuatan Scene Halaman Utama, Tutorial dan Developer Langkah awal pembuatan objek Menu Utama, Tutorial dan Developer adalah dengan memilih menu file kemudian pilih new scene. Untuk membuat antarmuka, memilih menu NGUI kemudian pilih create dan pilih 2D. Setelah itu pada kolom hierarchy tambahkan sprite dan mengganti background sebelumnya harus membuat atlas maker. Untuk mengganti background cukup dengan memilih background pada kolom hierachy dan pilih sprite pada kolom Inspector dan double klik pada file yang akan digunakan. Untuk membuat button atau tombol dengan cara memilih NGUI kemudian open dan pilih Widget Legacy kemudian add button. Untuk mengganti gambar button pilih pada button yang ada pada kolom hierarcy dan pilih backgorund pada button. Pada kolom Inspector pilih sprite kemudian memilih gambar untuk button. Lalu atur letak tombol yang telah di import. Pembuatan menu utama ditujukkan pada Gambar

25 Gambar 4.27 Pembuatan Scene Halaman Utama Gambar 4.28 Pembuatan Scene Halaman Tutorial 72

26 Gambar 4.29 Pembuatan Scene Halaman Developer Pembuatan Antarmuka dengan Unity dalam hal peralihan halaman, dapat dilakukan dengan bantuan Playmaker Editor dengan template yang sudah disediakan. FSM diberikan pada setiap tombol yang terdapat pada Antarmuka, seperti terliat pada Gambar Gambar 4.30 Pembuatan logika perpindahan halaman Pembuatan Antarmuka dengan Unity dalam hal peralihan objek, dapat dilakukan dengan bantuan Playmaker Editor dengan template yang sudah disediakan. FSM diberikan pada setiap tombol yang terdapat pada Antarmuka objek, seperti terlihat pada Gambar

27 Gambar 4.31 Pembuatan Logika perpindahan objek Pembuatan Scene Mulai Untuk pembuatan scene Mulai, hanya dengan menyimpan file Menu sebagai scene baru. Pada scene menu pilih file dan pilih save scene as, simpan file dengan nama scene Mulai. Scene Mulai ini digunakan untuk menampilkan objek 3 dimensi yang telah dibuat. Scene Mulai juga berisi menu kembali untuk kembali pada menu utama. Pembuatan Scene Mulai ditunjukkan pada Gambar. 74

28 Gambar 4.32 Pembuatan Scene Mulai Label dan Kemasan (Labels and Packaging) Langkah awal membuat Label dan kemasan adalah pembuatan katalog. Pembuatan katalog menggunakan tool CorelDraw, dengan menggabungkan gambar-gambar 2 dimensi lalu di tata rapi agar terlihat lebih menarik. Pada katalog ini ditampilkan informasi dan marker yang digunakan untuk memunculkan objek augmented reality. 75

29 Gambar 4.33 Pembuatan Cover Katalog 4.2 Implementasi Implementasi Interaktif (Interactive Design) Pada tampilan ini berisi tentang penggunaan dari aplikasi. Implementasi Interaktif ditunjukkan pada Gambar

30 Gambar 4.34 Implementasi Interactive Design Implementasi Antarmuka (Interface Design) 1. Antarmuka Halaman Utama Pada halaman utama ditampilkan menu-menu yang tersedia pada Aplikasi Media Pembelajaran Sistem Tata Surya menggunakan Augmented Reality. Terdapat menu mulai, tutorial, developer dan keluar. 2. Antarmuka Halaman Tutorial Gambar 4.35 Interface Menu Mulai 77

31 3. Halaman Utama Developer Gambar 4.36 Interface Menu Tutorial Gambar 4.37 Interface Halaman Menu Developer Implementasi Elemen Grafis Pembuatan desain grafis menggunakan tool CorelDraw X4. Desain yang dibuat adalah sebuah judul Aplikasi Media Pembelajaran Sistem Tata Surya menggunakan Augmented Reality. Tulisan dibuat dengan dengan warna bertekstur dan diberi efek countour. Tampilan background berlatar gambar sistem tata surya secara 78

32 keseluruhan dengan efek gelap di sekitarnya serta gambar bintang-bintang bertaburan. Gradasi warna diberikan agar memberikan efek tidak monoton Pada tampilan button, pembuatan button menggunakan CorelDraw X4. Button digunakan untuk menjalankan suatu perintah yang diinginkan pada program atau aplikasi. Button sebaiknya dibuat dengan tujuan untuk mempermudah user dalam menjalankan program, mudah digunakan dan jelas. Gambar 4.38 Implementasi Logo, Tombol dan Background Implementasi Suara dan Musik Aplikasi Media Pembelajaran Sistem Tata Surya menggunakan Augmeted Reality dilengkapi dengan musik agar lebih komunikatif, interaktif dan menarik. Dengan adanya musik, user tidak akan merasa bosan menggunakan aplikasi tersebut. Musik pendukung dari aplikasi terdiri dari 2 bagian yaitu backsound dan musik untuk setiap info objek. Untuk backsound-nya akan memutar selama aplikasi berjalan dan backsound info akan diputar pada saat ditekan tombol play. Implementasi backsound di tunjukkan pada Gambar

33 Gambar 4.39 Implementasi Suara dan Musik Implementasi Navigasi (Navigation Design) Antarmuka menu utama merupakan master page yang tampil setelah proses loading pada splash screen selesai. Menu utama berisi tiga navigasi ke halaman lain yaitu Mulai, Tutorial, Developer dan keluar. Gambar adalah implementasi page menu utama Gambar 4.40 Implementasi Navigasi 80

34 Gambar 4.41 Implementasi Objek Animasi Tata Surya Gambar 4.42 Implementasi Objek Matahari 81

35 Gambar 4.43 Implementasi Objek Merkurius Gambar 4.44 Implementasi Objek Venus 82

36 Gambar 4.45 Implementasi Objek Bumi Gambar 4.46 Implementasi Objek Mars 83

37 Gambar 4.47 Implementasi Objek Jupiter Gambar 4.48 Implementasi Objek Saturnus 84

38 Gambar 4.49 Implementasi Objek Uranus Gambar 4.50 Implementasi Objek Neptunus 85

39 Gambar 4.51 Implementasi Objek Gerhana Gambar 4.52 Implementasi Objek Komet 86

40 Gambar 4.53 Implementasi Objek Meteoroid Gambar 4.54 Implementasi Objek Asteroid 4.3 Pengujian Pengujian aplikasi media pembelajaran sistem tata surya menggunakan augmented reality dilakukan melalui beberapa kali pengujian yakni pengujian 87

41 navigasi, cahaya, jarak dan sudut Pengujian Naviagasi Tabel 4.1 Pengujian Navigasi No Halaman Perlakuan Hasil yang diharapkan Hasil Akhir Hasil Tercapai 1 Pengujian Button mulai Button mulai ditekan Tampil halaman mulai Tampil halaman mulai Ya 2 Pengujian Button Tutorial Button tutorial ditekan Tampil halaman tutorial Tampil halaman tutorial Ya 3 Pengujian Button Developer Button developer ditekan Tampil halaman developer Tampil halaman developer Ya 4 Pengujian Button Keluar Button keluar ditekan Keluar dari aplikasi Keluar dari aplikasi Ya 5 Pengujian button kembali pada objek 3d Button kembali ditekan Kembali ke halaman menu Kembali ke halaman menu Ya 6 Pengujian button info pada objek 3d Button info ditekan Kembali ke halaman mulai Kembali ke halaman mulai Ya 7 Pengujian button play pada objek 3d Button play ditekan Audio dimainkan Audio dimainkan Ya 8 Pengujian button stop Button stop ditekan Audio dihentikan Audio dihentikan Ya 88

42 pada objek 3d 9 Pengujian button kembali pada info objek 3d Button kembali ditekan Kembali ke halaman mulai Kembali ke halaman mulai Ya Pengujian Objek 3D 1. Pengujian Objek 3D Berdasarkan Jarak Tabel 4.2 Pengujian Berdasarkan Jarak No Objek 3d Jarak terdekat (cm) Matahari 5 90 Jarak terjauh (cm) Merkurius 5 80 Venus 5 80 Bumi 5 80 Mars 5 80 Jupiter 5 80 Saturnus 5 90 Uranus 5 80 Neptunus 5 70 Tata surya Gerhana

43 Komet 5 70 Asteroid 5 80 Meteoroid Pengujian Objek 3D Berdasarkan Sudut atau Kemiringan Marker Tabel 4.3 Pengujian Berdasarkan Sudut No Objek 3d Sudut 0º Sudut 30º Sudut 45º Sudut 60º Sudut 90º 1 Matahari Tidak Tampak Tampak Tampak Tampak tampak 2 Merkurius Tidak Tampak Tampak Tampak Tampak tampak 3 Venus Tidak Tampak Tampak Tampak Tampak tampak 4 Bumi Tidak Tampak Tampak Tampak Tampak tampak 5 Mars Tidak Tampak Tampak Tampak Tampak tampak 6 Jupiter Tidak Tampak Tampak Tampak Tampak tampak 7 Saturnus Tidak Tampak Tampak Tampak Tampak tampak 90

44 8 Uranus Tidak Tampak Tampak Tampak Tampak tampak 9 Neptunus Tidak Tampak Tampak Tampak Tampak tampak 10 Tata surya Tidak Tampak Tampak Tampak Tampak tampak 11 Gerhana Tidak Tampak Tampak Tampak Tampak tampak 12 Komet Tidak Tampak Tampak Tampak Tampak tampak 13 Asteroid Tidak Tampak Tampak Tampak Tampak tampak 14 Meteoroid Tidak Tampak Tampak Tampak Tampak tampak 3. Pengujian Objek 3D Berdasarkan Intesitas Cahaya Tabel 4.4 Pengujian Berdasarkan Intesitas Cahaya No Objek 3d Terang Remangremang Gelap 1 Matahari Tampak Tidak tampak Tidak Tampak 2 Merkurius Tampak Tidak tampak Tidak Tampak 3 Venus Tampak Tidak tampak Tidak Tampak 91

45 4 Bumi Tampak Tidak tampak Tidak Tampak 5 Mars Tampak Tidak tampak Tidak Tampak 6 Jupiter Tampak Tidak tampak Tidak Tampak 7 Saturnus Tampak Tidak tampak Tidak Tampak 8 Uranus Tampak Tidak tampak Tidak Tampak 9 Neptunus Tampak Tidak tampak Tidak Tampak 10 Tata surya Tampak Tidak tampak Tidak Tampak 11 Gerhana Tampak Tidak tampak Tidak Tampak 12 Komet Tampak Tidak tampak Tidak Tampak 13 Asteroid Tampak Tidak tampak Tidak Tampak 14 Meteoroid Tampak Tidak tampak Tidak Tampak 92

46 4.4 Kuisioner Sebuah kuisioner yang terdiri dari beberapa pertanyaan telah dibagikan kepada beberapa orang responden untuk mengetahui kelebihan dan kekurangan dari Aplikasi Media Pembelajaran Sistem Tata Surya menggunakan Augmented Reality Berbasis Android ini. Selain itu, hasil kuisioner nantinya akan digunakan sebagai saran untuk perbaikan aplikasi agar dapat dikembangkan lebih lanjut. Berdasarkan hasil pengujian apliaksi yang diperoleh dari hasil kuisioner yang telah dibagikan kepada responden adalah sebagai berikut: 1. Teknologi Augmented Reality sebagai media informasi yang interaktif? Sangat setuju 80% Setuju 20% Tidak setuju 0% Sangat tidak setuju 0% 2. Teknologi Augmented Reality merupakan sebuah inovasi untuk dunia pendidikan? Sangat setuju 45% Setuju 55% Tidak setuju 0% Sangat tidak setuju 0% 3. Objek 3 dimensi pada aplikasi ini sudah menarik? Sangat setuju 55% 93

47 Setuju 45% Tidak setuju 0% Sangat tidak setuju 0% 4. Aplikasi Augmented Reality ini mudah untuk digunakan? Sangat setuju 25% Setuju 75% Tidak setuju 0% Sangat tidak setuju 0% 5. Penggunaan media informasi Augmented Reality menarik untuk digunakan? Sangat setuju 25% Setuju 75% Tidak setuju 0% Sangat tidak setuju 0% 6. Implementasi audio sudah menarik? Sangat setuju 50% Setuju 50% Tidak setuju 0% Sangat tidak setuju 0% 7. Tampilan tutorial pada aplikasi ini mudah dipahami? Sangat setuju 45% Setuju 55% 94

48 Tidak setuju 0% Sangat tidak setuju 0% 8. Kombinasi warna pada aplikasi ini sudah menarik? Sangat setuju 45% Setuju 50% Tidak setuju 5% Sangat tidak setuju 0% 9. Simbol button/ navigasi dalam aplikasi ini mudah dipahami? Sangat setuju 50% Setuju 45% Tidak setuju 5% Sangat tidak setuju 0% 10. Fitur-fitur pada aplikasi augmented reality ini sudah cukup? Sangat setuju 25% Setuju 75% Tidak setuju 0% Sangat tidak setuju 0% 95