21

BAB III ANALISA DAN PERANCANGAN Pada perancangan suatu sistem aplikasi game puzzle diperlukan analisis yang tepat sehingga proses pembuatan sistem aplikasi game puzzle dapat berjalan dengan baik dan sistem aplikasi yang dibuat sesuai dengan yang dibutuhkan. Setelah analisis, dilakukan desain sistem aplikasi game puzzle yang berujuan untuk memberikan gambaran tentang jalannya sistem tersebut. Selain itu desain sistem aplikasi juga bertujuan untuk mempermudah programmer dalam mengimplementasikan sistem aplikasi game puzzle tersebut agar aplikasi game puzzle yang dibuat dapat berjalan dengan lancar. 3.1. Konsep Dalam membuat sebuah aplikasi game tentunya harus diawali dengan proses pembuatan konsep. Pada tahap konsep ini berisi mengenai analisa permasalahan, analisa kebutuhan, deskripsi umum sistem dan alur kerja sistem. 3.1.1. Analisa Masalah Media informasi tentang candi pada saat ini semakin berkembang, namun perkembangan tersebut tidak diikuti dengan pemanfaatan media tersebut. Oleh karena itu informasi tentang candi ini memanfaatkan kemajuan teknologi untuk mempermudah user dalam mencari informasi tentang candi terutama pada candi terpopuler yang berada di jawa tengah. Media informasi tentang ini pada umumnya memanfaatkan media berupa website dan iklan di televisi. Dalam proses pembuatan aplikasi informasi tentang candi ini memang tidak semudah media website maupun iklan di televisi tetapi aplikasi ini lebih praktis dan efisien jika dibandingkan dengan kedua media sebelumnya. Oleh karena itu penulis melakukan analisa permasalahan apa saja dalam membuat aplikasi game puzzle candi Borobudur, perambanan, dan sewu pada telepon seluler berbasis android. 21

22 1. Data apa saja yang diperlukan dalam proses pembuatan aplikasi? 2. Bagaimana cara memberikan suara pada background aplikasi dan menambah animasi agar terlihat lebih menarik? 3. Bagaimana cara merancang navigasi yang mudah digunakan dan antarmuka aplikasi yang menarik pada penggunanya? 3.1.2. Analisa Kebutuhan Perangkat keras yang digunakan penulis untuk melakukan penelitian ini adalah satu set laptop dengan spesifikasi : 1. Prosessor : Intel Core i3 CPU M370 @2.40 GHz 2. Memory RAM : 2.00GB 3. Hardisk : 470 GB 4. Video Graphics Adapter (VGA) : Intel HD Grapichics Family 5. Keyboard : PS/2 devices Sedangkan perangkat lunak yang digunakan penulis untuk melakukan penelitian ini adalah : 1. Windows 7 Ultimate sebagai sistem operasi. 2. Adobe Flash CS6 aplikasi. 3. PhotoScape aplikasi untuk memotong gambar agar 4. CamStudio aplikasi untuk merekam video 5. Adobe AIR untuk menampilkan aplikasi ini pada smartphone. Sedangkan device yang digunakan penulis dalam penelitian ini adalah satu buah Smartphone dengan spesifikasi : 1. Device : Smartfren U 2. Sistem Operasi : Android 4.1 (Jelly Bean) 3. Chipset : Qualcomm Snapdragon MSM8625 chipset 4. Memory : 768 MB

23 3.1.3. Pengumpulan Bahan Pengumpulan bahan atau material penulis membaginya kedalam 2 katagori, yaitu katagori gambar 2D dan katagori file suara, berupa file-file gambar, suara dan tombol navigasi yang diperoleh dengan cara membuat sendiri dan mengambil dari sumber lain, seperti yang tertera pada tabel di bawah ini: Tabel 4.1 Bahan Katagori Gambar 2D No Nama File Tipe Dibuat dengan 1 Tampilan Awal (PUZZLE) 2D Adobe Flash 2 Loading 2D Adobe Flash 3 Menu Utama 2D Adobe Flash 4 Tombol Informasi 2D Adobe Flash 5 Tombol Start Game 2D Adobe Flash 6 Tombol 2D Adobe Flash 7 Tombol 2D Adobe Flash 8 Tombol keluar 2D Adobe Flash 9 Tombol Close 2D Adobe Flash 10 Tombol Pilihan Level 2D Adobe Flash 11 Tombol Play Game 2D Adobe Flash 12 Foto Candi Brobudur JPG www.sridianti.com 13 Foto Candi Prambanan JPG http://tourjogjamasjo.com 14 Foto Candi Sewu JPG http://baratlaut.deviantart. com

24 Tabel 4.2 Bahan Katagori File Suara No Nama File Ukuran File Durasi Tipe 1 Splash Screen 114 KB 00:00:05 Wav 2 Menu Utama 58.5 MB 00:05:48 Wav 3 Game OVER 9.73 KB 00:00:00 Wav 4 Finish 80.7 KB 00:00:03 Wav 5 Tombol 12.7 00:00:03 Wav 3.2 Perancangan Sistem Pada bagian ini akan dijelaskan secara rinci mengenai perancangan Aplikasi game puzzle candi Borobudur, Perambanan, dan Sewu menggunakan Adobe Flash CS6 berdasarkan metode pengembangan luther, Perancangan sistem merupakan Storyboard, 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. 3.2.1. Storyboard 3.2.1.1. Tampilan awal Tampilan awal saat aplikasi terbuka akan tampilan sebuah tulisan Puzzle candi,dan suara pada sebuah tampilan awal. PUZZLE CANDI Gambar 3.1 Tampilan awal

25 3.2.1.2. Tampilan Kedua Dalam tampilan kedua ini akan muncul sebuah loading. Loading Gambar 3.2 Tampilan Kedua 3.2.1.3. Tampilan Ketiga Dalam Tampilan Ketiga adalah tampilan menu utama yang akan menampilkan sebuah tombol Game, Informasi Candi,, Cara bermain, keluar, kembali dan dalam menu utama ini kan ada suara yang terus berjalan saat puzzle ini di mainkan. Profi Gambar 3.3 Tampilan Ketiga

26 3.2.1.4. Tampilan Keempat Tampilan keempat ini adalah tampilan tompol game, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali, dan pilihan level seperti tombol easy, normal, hard, dimana user akan memilih game yang akan di ingin di mainkan oleh user. Easy Normal Hard Gambar 3.4 Tampilan keempat

27 3.2.1.5. Tampilan Kelima Tampilan kelima ini adalah tampilan pilih easy, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali, easy, normal, hard, dan tombol play game dimana user akan memilih game yang akan di ingin di mainkan oleh user. play Puzzle 4x4 play play Puzzle 2x2 Puzzle 3x3 Easy Normal Hard Gambar 3.5 Tampilan kelima

28 3.2.1.6. Tampilan Keenam Tampilan keenam ini adalah tampilan pilih normal, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali, easy, normal, hard, dan tombol play game dimana user akan memilih game yang akan di ingin di mainkan oleh user. play Puzzle 7x7 play Puzzle 5x5 play Puzzle 6x6 Easy Norma Hard Gambar 3.6 Tampilan keenam

29 3.2.1.7. Tampilan Ketujuh Tampilan ketujuh ini adalah tampilan pilih hard, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali, easy, normal, hard, dan tombol play game dimana user akan memilih game yang akan di ingin di mainkan oleh user. play Puzzle 10x10 play play Puzzle 8x8 Puzzle 9x9 Easy Normal Hard Gambar 3.7 Tampilan ketujuh

30 3.2.1.8. Tampilan Kedelapan Tampilan kedelapan ini adalah tampilan pilih puzzle play 2x2, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali kemenu utama, kembali tampilan pilih level, dimana tampilan ini seorang user harus merapikan gambar yang sudah di acak, user harus merapikan potongan gambar dengan waktu yang sudah di tentukan. waktu Gambar Puzzle yang teracak kembali Gambar 3.8 Tampilan kedelapan

31 3.2.1.9. Tampilan Kesembilan Tampilan kesembilan ini adalah tampilan pilih puzzle play 3x3, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali kemenu utama, kembali tampilan pilih level, dimana tampilan ini seorang user harus merapikan gambar yang sudah di acak, user harus merapikan potongan gambar dengan waktu yang sudah di tentukan. waktu Gambar Puzzle yang teracak kembali Gambar 3.9 Tampilan kesembilan

32 3.2.1.10. Tampilan Kesepuluh Tampilan kesepuluh ini adalah tampilan pilih puzzle play 4x4, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali kemenu utama, kembali tampilan pilih level, dimana tampilan ini seorang user harus merapikan gambar yang sudah di acak, user harus merapikan potongan gambar dengan waktu yang sudah di tentukan. waktu Gambar Puzzle yang teracak kembali Gambar 3.10 Tampilan sepuluh

33 3.2.1.11. Tampilan Kesebelas Tampilan kesebelas ini adalah tampilan pilih puzzle play 5x5, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali kemenu utama, kembali tampilan pilih level, dimana tampilan ini seorang user harus merapikan gambar yang sudah di acak, user harus merapikan potongan gambar dengan waktu yang sudah di tentukan. waktu Gambar Puzzle yang teracak kembali Gambar 3.11 Tampilan kesebelas

34 3.2.1.12. Tampilan Kedua Belas Tampilan kedua belas ini adalah tampilan pilih puzzle play 6x6, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali kemenu utama, kembali tampilan pilih level, dimana tampilan ini seorang user harus merapikan gambar yang sudah di acak, user harus merapikan potongan gambar dengan waktu yang sudah di tentukan. waktu Gambar Puzzle yang teracak kembali Gambar 3.12 Tampilan dua belas

35 3.2.1.13. Tampilan Ketiga Belas Tampilan ketiga belas ini adalah tampilan pilih puzzle play 7x7, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali kemenu utama, kembali tampilan pilih level, dimana tampilan ini seorang user harus merapikan gambar yang sudah di acak, user harus merapikan potongan gambar dengan waktu yang sudah di tentukan. waktu Gambar Puzzle yang teracak kembali Gambar 3.13 Tampilan tiga belas

36 3.2.1.14. Tampilan Keempat Belas Tampilan keempat belas ini adalah tampilan pilih puzzle play 8x8, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali kemenu utama, kembali tampilan pilih level, dimana tampilan ini seorang user harus merapikan gambar yang sudah di acak, user harus merapikan potongan gambar dengan waktu yang sudah di tentukan. waktu Gambar Puzzle yang teracak kembali Gambar 3.14 Tampilan empat belas

37 3.2.1.15. Tampilan Kelima Belas Tampilan kelima belas ini adalah tampilan pilih puzzle play 9x9, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali kemenu utama, kembali tampilan pilih level, dimana tampilan ini seorang user harus merapikan gambar yang sudah di acak, user harus merapikan potongan gambar dengan waktu yang sudah di tentukan. waktu Gambar Puzzle yang teracak kembali Gambar 3.15 Tampilan lima belas

38 3.2.1.16. Tampilan Keenam Belas Tampilan keenam belas ini adalah tampilan pilih puzzle play 10x10, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali kemenu utama, kembali tampilan pilih level, dimana tampilan ini seorang user harus merapikan gambar yang sudah di acak, user harus merapikan potongan gambar dengan waktu yang sudah di tentukan. waktu Gambar Puzzle yang teracak kembali Gambar 3.16 Tampilan enam belas

39 3.2.1.17. Tampilan Ketujuh Belas Tampilan ketujuh belas ini adalah tampilan setelah user menyelesaikan sebuah game puzzle, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali kemenu utama, kembali tampilan pilih level, gambar yang sudah tersusun dan suara. waktu Gambar Candi kembali Gambar 3.30 Tampilan tujuh belas Gambar 3.17 Tampilan Ketujuh Belas

40 3.2.1.18. Tampilan Kedelapan Belas Tampilan kedelapan belas ini adalah tampilan setelah user tidak bias menyelesaikan sebuah game puzzle, dalam tampilan ini ada sebuah tombol yaitu tombol Game, Informasi Candi,, Cara bermain, keluar, kembali kemenu utama, kembali tampilan pilih level, gambar (game over ) dan suara. waktu OVER kembali Gambar 3.18 Tampilan delapan belas

41 3.2.1.19. Tampilan Kesembilan Belas Tampilan kesembilan belas ini adalah tampilan informasi tentang candi yaitu tombol kembali ke menu utama, gambar dan informasi tentang candi. Gambar candi Gambar candi Gambar 3.32 Tampilan sembilan belas Gambar candi Gambar 3.19 Tampilan sembilan belas

42 3.2.1.20. Tampilan Kedua puluh Tampilan kedua puluh ini adalah tampilan profil penulis, di dalam tampilan ini ada sebuah tombol game, informasi candi, profil, cara bermain, kembali kemenu utama keluar dari game, dan biodata penulis. profil profile kembali Gambar 3.20 Tampilan kedua puluh

43 3.2.1.21. Tampilan Kedua Puluh Satu Tampilan kedua puluh satu ini adalh tampilan cara bermain, dalam tampilan ini ada sebuah keterangan, gambar dan video, dan tombol kembali ke menu utama Keterangan cara bermain Contoh susunan puzzle yang sudah rapih Puzzle yang sudah rapih gambar Tombol video Gambar 3.21 Tampilan dua puluh satu

44 3.2.2. Pemodelan Diagram Flow chart Bagan alir sistem ( flowchart system) merupakan bagan yang menunjukkan arus pekerjaan secara keseluruhan dari aplikasi Game puzzle ini. Flow Chart merupakan rancangan atau gambaran langkah-langkah dan urutan prosedur suatu program dalam bentuk grafik. Dengan diagram flow chart perancang menjelaskan bagaimana urutan dan prosedur jalannya sebuah sistem. Bagan alir sistem menunjukkan apa yang dikerjakan di aplikasi. Pada tahapan ini akan digambarkan alur proses aplikasi yang dibuat dengan menggunakan flowchart. Aplikasi ini dapat digunakan oleh satu user saja, dimana user tersebut dapat menggunakan aplikasi ini pada perangkat android. Gambar 3.22 Diagram Flowchart