BAB IV IMPLEMENTASI DAN ANALISA

perpustakaan.uns.ac.id

digilib.uns.ac.id

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 4.1.1

Pembuatan Antarmuka (Interface Design) Pembuatan

Aplikasi

Media

Pembelajaran

Sistem

Tata

Surya

menggunakan Augmented Reality ini terdiri atas beberapa interface sekaligus. 4.1.1.1

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

commit to user 48


4.1.1.2

digilib.uns.ac.id

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 4.1.1.3

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.

commit to user 49


digilib.uns.ac.id

Gambar 4.3 Desain Developer 4.1.2 4.1.2.1

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.

commit to user 50


digilib.uns.ac.id

Gambar 4.4 Pembuatan Logo 4.1.2.2

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 4.1.2.3

Pembuatan Katalog Pada pembuatan katalog, ditampilkan penjelasan singkat mengenai

commit to user 51


digilib.uns.ac.id

sistem tata surya dengan background berupa gambar planet, bintang-bintang dan atau benda langit lainnya sebagai background

Gambar 4.6 Pembuatan Katalog 4.1.2.4

Pembuatan Objek 3D Pembuatan objek 3Dimensi menggunakan software blender versi 2.7.2.

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

commit to user 52


digilib.uns.ac.id

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 250

commit to user 53


digilib.uns.ac.id

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

commit to user 54


digilib.uns.ac.id

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.

commit to user 55


digilib.uns.ac.id

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

commit to user 56


digilib.uns.ac.id

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.

commit to user 57


digilib.uns.ac.id

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

commit to user 58


digilib.uns.ac.id

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)

commit to user 59


digilib.uns.ac.id

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,

commit to user 60


digilib.uns.ac.id

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.

commit to user 61


digilib.uns.ac.id

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.

commit to user 62


digilib.uns.ac.id

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 2000. 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.

commit to user 63


digilib.uns.ac.id

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 2000. 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.

commit to user 64


digilib.uns.ac.id

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

commit to user 65


digilib.uns.ac.id

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. 4.1.3

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

commit to user 66


digilib.uns.ac.id

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.

commit to user 67


4.1.4

digilib.uns.ac.id

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

commit to user 68


digilib.uns.ac.id

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.

commit to user 69


digilib.uns.ac.id

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

commit to user 70


4.1.5

digilib.uns.ac.id

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. 4.1.5.2 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 4.40.

commit to user 71


digilib.uns.ac.id

Gambar 4.27 Pembuatan Scene Halaman Utama

Gambar 4.28 Pembuatan Scene Halaman Tutorial

commit to user 72


digilib.uns.ac.id

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 4.43.

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 4.4

commit to user 73


digilib.uns.ac.id

Gambar 4.31 Pembuatan Logika perpindahan objek 4.1.5.2 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.

commit to user 74


digilib.uns.ac.id

Gambar 4.32 Pembuatan Scene Mulai 4.1.6

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.

commit to user 75


digilib.uns.ac.id

Gambar 4.33 Pembuatan Cover Katalog 4.2 4.2.1

Implementasi Implementasi Interaktif (Interactive Design) Pada tampilan ini berisi tentang penggunaan dari aplikasi. Implementasi

Interaktif ditunjukkan pada Gambar 4.48

commit to user 76


digilib.uns.ac.id

Gambar 4.34 Implementasi Interactive Design

4.2.2

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.

Gambar 4.35 Interface Menu Mulai 2. Antarmuka Halaman Tutorial

commit to user 77


digilib.uns.ac.id

Gambar 4.36 Interface Menu Tutorial 3. Halaman Utama Developer

Gambar 4.37 Interface Halaman Menu Developer 4.2.3

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

commit to user 78


digilib.uns.ac.id

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 4.2.4

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 4.39.

commit to user 79


digilib.uns.ac.id

Gambar 4.39 Implementasi Suara dan Musik 4.2.5

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 4.40. adalah implementasi page menu utama

Gambar 4.40 Implementasi Navigasi

commit to user 80


digilib.uns.ac.id

Gambar 4.41 Implementasi Objek Animasi Tata Surya

Gambar 4.42 Implementasi Objek Matahari

commit to user 81


digilib.uns.ac.id

Gambar 4.43 Implementasi Objek Merkurius

Gambar 4.44 Implementasi Objek Venus

commit to user 82


digilib.uns.ac.id

Gambar 4.45 Implementasi Objek Bumi

Gambar 4.46 Implementasi Objek Mars

commit to user 83


digilib.uns.ac.id

Gambar 4.47 Implementasi Objek Jupiter

Gambar 4.48 Implementasi Objek Saturnus

commit to user 84


digilib.uns.ac.id

Gambar 4.49 Implementasi Objek Uranus

Gambar 4.50 Implementasi Objek Neptunus

commit to user 85


digilib.uns.ac.id

Gambar 4.51 Implementasi Objek Gerhana

Gambar 4.52 Implementasi Objek Komet

commit to user 86


digilib.uns.ac.id

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

commit to user 87


digilib.uns.ac.id

navigasi, cahaya, jarak dan sudut. 4.3.1

Pengujian Naviagasi Tabel 4.1 Pengujian Navigasi

No

Halaman

Perlakuan

Hasil yang diharapkan

Hasil Akhir

1

Pengujian Button mulai

2

Button mulai ditekan

Tampil halaman mulai

Tampil halaman mulai

Ya

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


Ya

7

Pengujian Button play button play ditekan pada objek 3d

Audio dimainkan

Audio dimainkan

Ya

8

Pengujian Button stop button stop ditekan

Audio dihentikan

Audio dihentikan

Ya

commit to user 88

Hasil Tercapai


digilib.uns.ac.id

pada objek 3d 9

4.3.2

Pengujian button kembali pada info objek 3d

Button kembali ditekan



Pengujian Objek 3D

1. Pengujian Objek 3D Berdasarkan Jarak Tabel 4.2 Pengujian Berdasarkan Jarak No

Objek 3d

Jarak terdekat (cm)

Jarak terjauh (cm)

Matahari

5

90

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

5

100

Gerhana

5

80

commit to user 89

Ya


digilib.uns.ac.id

Komet

5

70

Asteroid

5

80

Meteoroid

5

80

2. Pengujian Objek 3D Berdasarkan Sudut atau Kemiringan Marker Tabel 4.3 Pengujian Berdasarkan Sudut No

Objek 3d

1

Matahari

Sudut 0º

Tidak

Sudut 30º

Sudut 45º

Sudut 60º

Sudut 90º

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

tampak 2

Merkurius

Tidak tampak

3

Venus

Tidak tampak

4

Bumi

Tidak tampak

5

Mars

Tidak tampak

6

Jupiter

Tidak tampak

7

Saturnus

Tidak tampak

commit to user 90


8

Uranus

digilib.uns.ac.id

Tidak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

Tampak

tampak 9

Neptunus

Tidak tampak

10

Tata surya

Tidak tampak

11

Gerhana

Tidak tampak

12

Komet

Tidak tampak

13

Asteroid

Tidak tampak

14

Meteoroid

Tidak tampak

3. Pengujian Objek 3D Berdasarkan Intesitas Cahaya Tabel 4.4 Pengujian Berdasarkan Intesitas Cahaya No

Objek 3d

Terang

Remangremang

1

Matahari

Tampak

Tidak tampak

Tidak Tampak

2

Merkurius

Tampak

Tidak tampak

Tidak Tampak

3

Venus

Tampak

Tidak tampak

Tidak Tampak

commit to user 91

Gelap


digilib.uns.ac.id

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

commit to user 92


4.4

digilib.uns.ac.id

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%

commit to user 93


digilib.uns.ac.id

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%

commit to user 94


digilib.uns.ac.id

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%

commit to user 95

BAB IV IMPLEMENTASI DAN ANALISA

Recommend Documents