BAB III ANALISA DAN PERANCANGAN

Transkripsi

1 BAB III ANALISA DAN PERANCANGAN Dalam proses perancangan suatu aplikasi diperlukan analisa konsep yang tepat agar proses pembuatan dapat berjalan dengan baik dan sistem yang dibuat sesuai dengan yang diinginkan. Setelah analisis perlu dilakukan perancangan aplikasi yang bertujuan untuk memberikan gambaran bagaimana jalannya aplikasi tersebut. Selain itu, perancangan juga dapat mempermudah programmer dalam mengimplementasikan aplikasi tersebut. 3.1 Konsep Dalam membuat sebuah aplikasi pengenalan alat musik Betawi menggunakan Augmented Reality tentunya harus diawali dengan proses pembuatan konsep. Pada tahap konsep ini berisi mengenai analisa permasalahan, analisa kebutuhan, deskripsi umum sistem dan alur kerja sistem Analisa Permasalahan Media pembelajaran pengenalan alat musik Betawi untuk masyarakat pada umumnya hanya berada pada media berupa buku, dan video. Sedangkan media pembelajaran interaktif masing jarang ditemukan, media interaktif merupakan media yang menarik untuk mempelajari sesuatu, dalam hal ini pengenalan alat musik Betawi. Pada umumnya masyarakat lebih mudah menyerap informasi dari media interaktif dibandingkan harus menghadapi tulisan-tulisan pada media atau buku. Berikut ini penulis melakukan analisa permasalahan apa saja dalam membuat aplikasi pengenalan alat musik Betawi untuk masyarakat berbasis Augmented Reality pada Android: 1. Data-data apa saja yang dibutuhkan dalam pembuatan aplikasi? 2. Bagaimana cara melakukan pembuatan model 2D dan 3D untuk membuat bentuk alat musik Betawi? 3. Bagaimana cara merancang antarmuka aplikasi yang menarik dengan navigasi yang mudah untuk dipahami? 13

2 14 4. Bagaimana membuat desain marker unik dan dapat memudahkan user untuk menggunakan aplikasi ini? 5. Bagaimana cara memberikan suara pada alat musik Betawi ketika terjadi interaksi sentuhan ataupun animasi yang sudah tersusun secara sekuensial/urut? Analisa Kebutuhan Perangkat keras atau hardware yang digunakan untuk melakukan penelitian ini adalah satu set komputer dengan spesifikasi: 1. Processor: Intel(R) Core(TM) i5-3337u 1.80GHz (4 CPUs), ~1.8GHz 2. Memory: 4096MB RAM 3. Harddisk Drive (HDD): 500GB 4. Video Graphics Addapter (VGA): NVIDIA GEFORCE GT720M 2GB DDR3 5. Mouse: PowerLogic Asic Keyboard: Include Laptop Sedangkan perangkat lunak atau software yang digunakan untuk membantu penelitian ini adalah: 1. Microsoft Windows 7 Ultimate SP1 64-bit sebagai sistem operasi. 2. Blender 2.71 sebagai aplikasi pemodelan objek. 3. Unity Game Engine 4.6.7f1 sebagai aplikasi pengembangan Android. 4. Mono Develop-Unity sebagai scripting editor. 5. Vuforia sebagai SDK Augmented Reality. 6. Android SDK sebagai compiler untuk membuat Android package (.apk). 7. Adobe Photoshop CS3 sebagai editor gambar. 8. Adobe Ilustrator CS3 sebagai editor gambar. Sedangkan device yang digunakan untuk membantu penelitian ini adalah satu buah Smartphone dengan spesifikasi: 1. Device: Samsung Galaxy Grand Prime 2. Operating System: Android (Kit Kat) 3. Chipset: Qualcomm MSM8916 Snapdragon Memory: 8 GB

3 Deskripsi Umum Sistem Aplikasi pengenalan alat musik Betawi ini akan menampilkan objek 3D alat musik Betawi dan juga akan mengeluarkan suara nada atau musik permainannya dari alat musik tersebut. Objek 3D alat musik Betawi ini nantinya bisa berotasi yang dimaksudkan untuk pengguna bisa melihat lebih detail bentuk dari alat musik Betawi. Pengguna akan melihat objek 3D alat musik Betawi dalam bentuk tampilan augmented reality. Aplikasi pengenalan alat musik Betawi ini menggunakan metode User Defined Targets. Pengguna menggunakan kamera yang ada pada device kemudian sistem melakukan proses konversi Format Pixel dari inputan yang telah di ambil oleh camera frame atau bisa disebut juga proses capture foto yang kemudian didefinisikan sebagai tracker. Dalam ruang lingkup tracker terjadi proses pendeteksian objek baru, dalam hal ini yang dideteksi adalah marker / foto yang sudah didefinisikan sebelumnya, kemudian setelah foto / marker terdeteksi sistem melakukan load data dari database lokal berupa karakter. Setelah data di-load dari database lokal, sistem melakukan tracking pada marker yang telah terdeteksi tersebut kemudian dilanjutkan proses konversi frame kembali untuk dilakukan proses selanjutnya yaitu pada ruang lingkup aplikasi dilakukan proses pemanggilan objek menggunakan query yang dilanjutkan pada proses update logika dari aplikasi yang kemudian dilakukan proses render graphics berupa objek karakter. Output yang dihasilkan terdiri dari dua layer yaitu layer background dan layer foreground. Pada layer background sistem melakukan render camera preview sebagai lingkungan nyata dan pada layer foreground dilakukan render objek virtual yang berupa karakter 3D yang kemudian layer tersebut aktif secara bersamaan dan terlihat karakter 3D menempel pada dunia nyata. 3.2 Perancangan Perancangan sistem merupakan gambaran, sketsa atau pengaturan dan pembuatan dari beberapa aturan yang terpisah kedalam satu kesatuan yang utuh. Tujuan dari perancangan aplikasi adalah untuk memberikan gambaran kepada pengguna tentang aplikasi yang akan dibuat serta memberi ilustrasi atau rekayasa aplikasi yang lengkap untuk diimplementasikan kedalam program tersebut.

4 Perancangan Objek Perancangan objek merupakan gambaran dari sebuah objek yang ada dalam aplikasi. Dalam aplikasi ini objek akan ditampilakn dalam bentuk 3D disertai dengan suara pendukung. Objek yang ada pada aplikasi ini, yaitu alat musik Betawi yang dapat mengeluarkan suara. Alat musik Betawi tersebut, yaitu: 1. Gambang Gambar 3.1 Gambang Gambang adalah alat musik tradisional yang terdiri dari 18 bilah yang dimainkan dengan cara dipukul. Bilah-bilah gambang terbuat dari kayu jati atau sulangkring (kayu besi). Alat musik ini mempunyai nada antara 17 sampai 21 bilah dalam satu ancak. Tangga nada yang digunakan adalah Mayor dan Minor serta Gregorian. Gambang merupakan salah satu instrumen yang terdapat dalam orkes Gambang Kromong.

5 17 2. Kecrek Gambar 3.2 Kecrek Salah satu alat musik dalam orkes Gambang Kromong. Kecrek terdiri dari beberapa bilah perunggu yang diberi landasan kayu untuk dipukul-pukul sehingga berbunyi crek-crek. Gunanya untuk memberi tanda akan dimulai atau diakhiri oleh seorang pemimpin musik. Alat musik ini pada zaman perunggu besi yang terbuat dan lempengan logam. 3. Rebana Biang Gambar 3.3 Rebana Biang Salah satu rebana yang berukuran besar. Rebana Biang terdiri dari tiga buah rebana yang mempunyai nama masing-masing. Yang kecil bergaris tengah

6 18 30 cm diberi nama gendung. Yang berukuran sedang bergaris tengah 60 cm dinamai kotek. Rebana Biang juga memiliki pasak sebagai dogdog reog Sunda atau tifa Maluku. Rebana Biang sampai di Betawi dibawa oleh pasukan Mataram pimpinan Sultan Agung. Ketika itu rebana biang berfungsi sebagai hiburan dan sarana melakukan kegiatan tarekat. Diperkirakan rebana biang sudah ada sebelum agama Islam masuk Betawi Storyboard Gambar 3.4 Storyboard Gambang Gambar 3.5 Storyboard Kecrek

7 19 Gambar 3.6 Storyboard Rebana Biang Flow Chart Flow Chart adalah penggambaran secara grafik dari langkah-langkah dan urut-urutan prosedur dari suatu program. Flow chart menjelaskan urutan dari prosedur-prosedur yang ada di dalam sistem. Aplikasi pengenalan alat musik Betawi untuk masyarakat berbasis Augmented Reality pada Android ini digunakan oleh satu user saja, dimana user tersebut dapat menjalankan aplikasi ini dengan media marker yang sudah ditentukan. Secara umum alur sistem aplikasi yang dibuat adalah sebagai berikut: 1. User membuka aplikasi melalui Smartphone Android yang sudah terpasang aplikasi ini. 2. Aplikasi akan menampilkan splash screen selama tiga detik. 3. Aplikasi akan menampilkan main menu dimana user akan memilih tombol untuk memulai, panduan, atau keluar aplikasi. 4. User akan menekan tombol Panduan untuk menampilkan jendela instruksi pemakaian aplikasi. 5. Jika user sudah mengerti cara penggunaan aplikasi ini, maka user dapat menekan tombol X untuk menutup jendela panduan dan kembali ke menu utama.

8 20 6. Jika user menekan tombol Mulai, maka aplikasi akan menampilkan mode kamera dimana user dapat mengarahkan kamera ke arah marker untuk dapat memunculkan objek 3D alat musik Betawi beserta suaranya bila disentuh di satu objek tersebut. 7. Jika marker dapat terdeteksi maka sistem akan menampilkan objek 3D beserta tombol untuk menampilkan pilihan objek alat musik Betawi. Langkah-langkah tersebut dapat digambarkan ke dalam sebuah flow chart seperti disajikan pada gambar. Gambar 3.7 Flow Chart System Aplikasi Augmented Reality membutuhkan sebuah marker yang harus didaftarkan pada Qualcomm Vuforia. Marker dapat dibuat menggunakan aplikasi

9 21 pengolah gambar. Setelah desain marker selesai dibuat, kemudian marker di upload pada website qualcomm vuforia untuk mendapatkan dataset yang dibutuhkan pada unity. Berikut ini merupakan flow chart pembuatan marker. Gambar 3.8 Flow Chart pembuatan Marker Use Case Diagram Use Case Diagram digunakan untuk menjelaskan dan menggambarkan sistem dan perilaku pengguna terhadap sistem itu sendiri. Diagram use case lebih menekankan apa yang akan diperbuat oleh sistem dan bukan menekankan bagaimana sistem tersebut bertindak.

10 22 Gambar 3.9 Use Case Diagram Aplikasi Spesifikasi skenario diagram use case aplikasi pengenalan alat musik Betawi dijelaskan dalam tabel. Tabel 3.1 Skenario Use Case melihat Splash Screen Nama Use Case Melihat Splash Screen Aktor User Deskripsi Singkat Pengguna dapat melihat Splash Screen yang merupakan tampilan awal dari aplikasi Skenario 1. Membuka aplikasi 2. Sistem menampilkan splash screen selama 3 detik

11 23 Tabel 3.1 Skenario Use Case melihat Splash Screen (Lanjutan) 3. Pengguna dapat melihat tampilan splash screen Kondisi Awal Aplikasi AR Alat Musik Betawi terpasang pada gadget android Kondisi Akhir Aplikasi menampilkan splash screen Tabel 3.2 Skenario Use Case melihat Menu Utama Nama Use Case Melihat Menu Utama Aktor User Deskripsi Pengguna dapat melihat pilihan-pilihan menu yang ada Singkat pada aplikasi Skenario 1. Membuka aplikasi 2. Sistem menampilkan splash screen selama 3 detik 3. Sistem menampilkan menu utama 4. Pengguna dapat melihat tampilan menu aplikasi yang berisi tombol-tombol pilihan pada aplikasi Kondisi Awal Aplikasi AR Alat Musik Betawi terpasang pada gadget android Kondisi Akhir Aplikasi menampilkan menu utama Tabel 3.3 Skenario Use Case mengakses halaman Panduan Nama Use Case Melihat halaman Panduan Aktor User Deskripsi Singkat Pengguna dapat melihat informasi cara penggunaan aplikasi AR Alat Musik Betawi Skenario 1. Membuka aplikasi 2. Sistem menampilkan splash screen selama 3 detik 3. Sistem menampilkan menu utama 4. User memilih tombol panduan 5. Sistem menampilkan halaman panduan penggunaan aplikasi 6. Pengguna dapat melihat cara penggunaan aplikasi

12 24 Tabel 3.3 Skenario Use Case mengakses halaman Panduan (Lanjutan) Kondisi Awal Aplikasi AR Alat Musik Betawi terpasang pada gadget android Kondisi Akhir Aplikasi menampilkan halaman panduan Tabel 3.4 Skenario Use Case mengakses halaman Mulai Nama Use Case Melihat halaman Mulai AR Aktor User Deskripsi Pengguna dapat melihat tampilan mode kamera augmented Singkat reality pada aplikasi untuk melakukan pendeteksian marker Skenario 1. Membuka aplikasi 2. Sistem menampilkan splash screen selama 3 detik 3. Sistem menampilkan menu utama 4. User memilih tombol Mulai 5. Sistem menampilkan mode kamera augmented reality beserta tombol navigasi objek 6. Pengguna memposisikan marker di depan kamera 7. Sistem mendeteksi marker 8. Objek muncul pada layar 9. Pengguna menekan tombol rotasi 10. Objek berotasi 11. Pengguna menekan tombol nama alat musik Betawi 12. Objek alat musik Betawi tersebut muncul pada layar 13. Pengguna menggerakkan gadget android 14. Layar bergerak sesuai arah 15. Pengguna menekan tombol keluar 16. Aplikasi keluar Kondisi Awal Aplikasi AR Alat Musik Betawi terpasang pada gadget android Kondisi Akhir Aplikasi menampilkan objek alat musik Betawi

13 Perancangan Struktur Navigasi Navigasi dalam suatu aplikasi memegang peranan yang sangat penting terhadap keberhasilan suatu aplikasi. Dengan adanya navigasi yang baik dan mudah dimengerti, user dapat menelusuri suatu aplikasi dengan nyaman. Berikut adalah struktur navigasi pada aplikasi pengenalan alat musik Betawi menggunakan Augmented Reality. Gambar 3.10 Struktur Navigasi Perancangan Sistem Marker Marker adalah sebuah objek fisik atau tempat dimana lingkungan nyata dan lingkungan virtual tergabung menjadi satu. Dengan ini komputer akan mengenali sebagai tempat dimana informasi digital akan ditampilkan. Marker yang digunakan pada aplikasi ini berupa uang kertas dua ribu rupiah yang bertujuan untuk memudahkan user memainkan atau menggunakan aplikasi ini. Objek yang akan muncul di atas marker tersebut adalah alat musik Betawi beserta suaranya bila disentuh.

14 26 Gambar 3.11 Marker Gambar tersebut merupakan desain marker yang digunakan pada aplikasi AR alat musik Betawi. Marker tersebut akan memunculkan objek 3D alat musik Betawi beserta suaranya sesuai dengan data yang telah di definisikan sebelumnya Perancangan Tampilan Aplikasi Perancangan aplikasi merupakan gambaran, sketsa atau pengaturan dan pembuatan dari beberapa aturan yang terpisah kedalam satu kesatuan yang utuh. Tujuan dari perancangan aplikasi adalah untuk memberikan gambaran kepada pengguna tentang aplikasi yang akan dibuat serta memberi ilustrasi atau rekayasa aplikasi yang lengkap untuk diimplementasikan ke dalam program tersebut.

15 27 Perancangan user interface merupakan perancangan halaman tampilan dalam aplikasi yang akan dibuat. Perancangan user interface ini, merancang halaman dalam proses input maupun output dalam aplikasi AR. Pada saat pertama kali user menjalankan aplikasi AR alat musik Betawi maka halaman pertama yang mereka jumpai adalah halaman splash screen yang menandakan identitas dari pembuat aplikasi. Gambar 3.12 Rancangan Splash Screen Selanjutnya yaitu halaman menu utama yang berisi beberapa pilihan mengenai aplikasi AR alat musik Betawi. Rancangan halamannya dapat dilihat pada gambar berikut.

16 28 Gambar 3.13 Rancangan halaman Menu Utama Pada halaman menu utama terdapat menu-menu yang dapat dipilih oleh user (pengguna) untuk menampilkan halaman lain yang disediakan pada aplikasi AR ini. Berikut ini penjelasan untuk setiap menunya. a. Mulai Halaman ini disediakan untuk pengguna memulai aplikasi AR alat musik Betawi. Dengan mengarahkan kamera pada marker maka akan muncul objek yang sesuai dengan marker tersebut.

17 29 Gambar 3.14 Rancangan tampilan halaman AR Setelah aplikasi berhasil mendeteksi marker, maka aplikasi akan memunculkan objek yang sesuai dengan marker. Jika user ingin melihat objek lebih detail, user dapat menekan tombol rotasi yang ada pada interface. Setelah memilih maka objek yang ada akan berputar atau berotasi. User juga dapat melihat objek yang lain dengan menekan tombol nama alat musik Betawi tersebut, seperti yang ada pada interface. User bisa memainkan objek alat musik Betawi tersebut dengan cara menekan tombol-tombol yang ada pada alat musik Betawi, maka dari alat musik Betawi akan mengeluarkan suara-suara nada. b. Panduan Halaman ini berisi panduan bagaimana menggunakan aplikasi AR alat musik Betawi secara menyeluruh.

18 30 Gambar 3.15 Rancangan tampilan Slide Show Panduan