BAB III KONSEP DAN PERANCANGAN
3.1
KONSEP
APLIKASI
PERMAINAN CONGKLAK BERBASIS
ANDROID Aplikasi ini adalah sebuah aplikasi yang dibuat dengan menggunakan Adobe Flash CS3, sehingga jenis file yang akan dihasilkan nanti adalah berekstensi .SWF. Dalam hal ini penulis akan mengubah jenis file .SWF tersebut agar menjadi file berekstensi .APK. Untuk mengubah file .SWF tersebut menjadi .APK, penulis menggunakan sebuah aplikasi berbasis web yang tersedia di www.swiftapk.com. Setelah file tersebut diubah ekstensinya, barulah kemudian
dapat dioperasikan di smartphone Android. Konsep atau kerja Aplikasi Permainan Congklak Berbasis Android ini adalah dengan menyajikan sebuah permainan tradisional congklak yang merupakan permainan membagi biji ke dalam lubang pemain antara pemain 1 dan pemain 2, siapa yang mengumpulkan biji paling banyak ke dalam lumbungnya maka dialah pemenangnya. Game congklakku ini terdiri dari beberapa menu tampilan utama yang semuanya mengarahkan ke masing-masing menu lainnya yaitu : a. Menu Tampilan Utama Merupakan tampilan awal game yang terdiri dari empat tombol yaitu Mulai, Cara Main, Sejarah dan Profil. b. Menu Mulai Merupakan tampilan sebuah arena permainan game congklakku. c. Menu Cara Main Merupakan tampilan berupa penjelasan singkat tentang petunjuk bagaimana Cara memainkan Game. d. Menu Sejarah Merupakan tampilan berupa informasi singkat tentang sejarah penemuan permainan congklak pertama kali.
25
26
e. Menu Profil Merupakan tampilan tentang profil si pembuat aplikasi congklakku.
3.2
PERANCANGAN DESAIN APLIKASI PERMAINAN CONGKLAK BERBASIS ANDROID Dalam perancangan aplikasi ini penulis menggunakan pemodelan
struktur menu, flowchart, rancangan antarmuka dan storyboard sehingga interaksi yang ada pada sistem bisa terlihat, dan permasalahan yang komplek menjadi sederhana serta mendapat banyak pandangan tentang program yang akan dibangun.
3.2.1 Struktur Menu Struktur Menu dari aplikasi ini adalah sebagai berikut :
RANCANGAN APLIKASI PERMAINAN CONGKLAK BERBASIS ANDROID
MULAI
CARA MAIN
SEJARAH
PROFIL
Gambar 3.1 Struktur Menu Aplikasi Permainan Congklak Berbasis Android
Pada bagian awal terdapat 4 menu utama yaitu “Mulai”, “Cara Main”, “Sejarah”, dan “Profil”. Menu “Mulai” akan menampilkan bagian utama dari aplikasi yaitu Sebuah Arena Permainan Congklak. Menu “Cara Main” akan menampilkan tentang cara bermain dalam permainan ini. Menu “Sejarah” akan menampilkan informasi singkat tentang sejarah penemuan permainan congklak ini.
27
Menu “Profil” digunakan untuk menampilkan profil pembuat aplikasi.Yang terakhir yaitu menu “Keluar” yang berfungsi sebagai tombol untuk mengakhiri berjalannya aplikasi.
28
3.2.2 Diagram Alur (flowchart)
3.2.2.1Diagram Alur Aplikasi Permainan Congklak Berbasis Android Berikut adalah gambaran kasar keseluruhan aplikasi menggunakan diagram alur (flowchart) :
START
INTRO
MENU UTAMA
ya
Pilih Menu 1. Menu Mulai 2. Menu Cara Main 3. Menu Sejarah 4. Menu Profil
tidak
ya
ya
ya
Menu Mulai
Mulai Permainan
tidak
kembali
Menampilkan Cara Main
ya
Permainan Berakhir Menu Cara Main
tidak
Main Lagi ?
ya kembali
Menampilkan Sejarah
Menu Sejarah
tidak
ya kembali
Menampilkan Profil
Menu Profil
Keluar
END
Gambar 3.2 Flowchart Aktivitas Keseluruhan Aplikasi.
ya
29
Gambar 3.2 diatas adalah diagram alur detail yaitu menggambarkan program secara global. Pertama adalah memasuki permainan CONGKLAKKU, setelah itu program akan menampilkan halaman intro baru kemudian program akan menampilkan halaman Menu Utama dari permainan CONGKLAKKU. Jika pemain memilih menu Mulai maka program akan menampilkan sebuah Arena Permainan Congklak kemudian pemain dapat langsung memainkan permainan congklak sampai permainan berakhir, setelah berakhirnya permainan pemain akan di tujukan pada pilihan apakah pemain akan menyelesaikan permainan atau bermain kembali. Jika ya, maka pemain akan memulai permainan dari awal kembali, namun jika tidak maka pemain akan kembali pada Menu Utama. Kemudian pemain dapat pula memilih menu yang diinginkannya seperti menu Cara Main yang menampilkan tentang cara bermain dalam permainan ini, menu Sejarah yang menampilkan informasi singkat tentang awal mula permainan ini ditemukan, serta menu Profil yang menampilkan tentang Profil si pembuat Aplikasi. Kemudian setelah itu keluar untuk menyesaikan memainkan permainan CONGKLAKKU.
30
3.2.2.2Diagram Alur Pada Permainan Congklakku Berikut adalah alur dari Permainan Congklakku:
Gambar 3.3 Flowchart Alur Permainan Congklakku
31
Gambar 3.3 memperlihatkan aktivitas yang dilakukan pada aplikasi saat permainan dijalankan. Berikut penjelasan dari flowchart tersebut : 1. Start, mulai 2. Menampilkan arena permainan, arena permainan muncul 3. Pemain memilih lubang congklak, dimulai dengan pemain 1 memulai membagikan biji congklak dengan memasukan satu persatu ke dalam lubang yang dilewatinya termasuk lumbungnya sendiri tetapi tidak memasukan biji congklak ke lumbung lawan, setelah itu pemain 2. Begitu seterusnya. 4. Jika di lubang terakhir saat menjatuhkan biji congklak masih terdapat biji congklak maka jalankan perintah no 5. Namun jika diperiksa tidak ada biji congklak maka jalankan perintah no 9. 5. Mengambil dan membagikan biji congklak ke lubang lain kembali dengan memasukan satu persatu ke dalam lubang yang dilewatinya termasuk lumbungnya sendiri tetapi tidak memasukan biji congklak ke lumbung lawan. 6. Jika di lubang terakhir tidak terdapat biji congklak jalankan perintah no 7. Dan jika di lubang terakhir tidak terdapat biji congklak kemudian di depan lubang terakhir terdapat sekumpulan biji congklak maka jalankan perintah no 7 dan 8. 7. Mengambil biji congklak terakhir dan memasukannya ke lumbung milik pemain yang sedang aktif kemudian jalankan perintah no 3. 8. Mengambil biji congklak milik lawan dan memasukannya ke lumbung milik pemain yang sedang aktif kemudian jalankan perintah no 3. 9. Papan score akan tampil dengan memberi informasi pemain mana yang memenangkan permainan ini dan akan ada dua opsi, jika kondisi benar maka jalankan perintah no 3. Jika tidak maka selesai 10. End, algoritma permainan berakhir.
32
3.3
Desain Antarmuka (Design Interface) dan Storyboard Desain antarmuka harus dilakukan pada proses pembuatan aplikasi
multimedia. Tujuan dari Desain antarmuka adalah agar aplikasi yang dihasilkan terlihat sederhana, menarik dan mudah dimengerti. Berikut adalah Desain antarmuka dari Aplikasi Permainan CONGKLAKKU.
a.
Desain Tampilan pada Jendela Pembuka
CONGKLAKKU Di buat Oleh : FACHRURROZI TEKNIK INFORMATIKA MERCUBUANA @2013
Gambar 3.4 Storyboard Jendela Pembuka
Pada storyboard jendela Pembuka menggambarkan sebuah halaman pembuka dari permainan CONGKLAKKU. Baru setelah itu akan tampil sebuah Jendela Menu Utama.
33
b.
Desain Tampilan Jendela Menu Utama
MULAI
CARA MAIN
SEJARAH
PROFIL
Gambar 3.5 Storyboard Jendela Utama Pada gambar 3.5 merupakan desain antarmuka pada halaman utama, pada halaman ini terdapat empat buah tombol diantaranya tombol Mulai yang menampilkan sebuah arena permainan dari game CONGKLAKKU ini, tombol Cara Main yang menampilkan tentang bagaimana cara memainkan permainan CONGKLAKKU ini, tombol Sejarah yang menampilkan informasi singkat tentang awal mula permainan Congklak ditemukan, serta tombol Profil yang menampilkan sebuah halaman yang berisi tentang profil si pembuat aplikasi.
34
c.
Desain Tampilan Jendela Mulai
Pemain 2
Pemain 1
KEMBALI
Gambar 3.6 Storyboard jendela Mulai Pada gambar 3.6 merupakan desain antarmuka pada halaman Mulai yang berisi sebuah arena permainan. Pada jendela ini terdapat : -
Tombol Main Baru
: berfungsi untuk memulai permainan dari awal kembali
-
Sisa batu congklak
: menunjukan jumlah sisa batu congklak yang terdapat pada papan permainan.
-
Pemain aktif
: menginformasikan pemain yang sedang aktif.
-
Pemain 1
: pemain satu aktif (sedang dalam permainan)
-
Pemain 2
: pemain dua aktif (sedang dalam permainan)
-
Tombol kembali
: berfungsi untuk kembali ke menu utama.
35
d.
Desain Tampilan Jendela Cara Main
CARA MAIN
TEKS
KEMBALI Gambar 3.7 Storyboard Jendela Cara Main Pada gambar 3.7 merupakan desain antarmuka pada halaman Cara Main yang berisi tentang petunjuk cara bermain congklak serta sebuah tombol kembali untuk kembali menuju menu utama.
e.
Desain Tampilan Jendela Sejarah
SEJARAH
TEKS
KEMBALI Gambar 3.8 Storyboard jendela Sejarah
36
Pada gambar 3.8 merupakan desain antarmuka pada halaman Sejarah yang berisi informasi tentang awal mula penemuan congklak serta sebuah tombol kembali untuk kembali menuju menu utama.
f.
Desain Tampilan Jendela Profil
PROFIL
TEKS
KEMBALI Gambar 3.9 Storyboard jendela Profil Pada gambar 3.9 merupakan desain antarmuka pada halaman Profil yang berisi tentang profil si pembuat aplikasi. Serta sebuah tombol kembali untuk kembali menuju menu utama.