BAB III ANALISA DAN PERANCANGAN
Pada bagian ini penulis akan menganalisa kebutuhan – kebutuhan dalam membuat aplikasi ini. Setelah semua kebutuhan selesai dianalisa, maka penulis akan melanjutkan ke tahap perancangan aplikasi. 3.1
ANALISA APLIKASI PERMAINAN ULAR TANGGA BERBASIS ANDROID
Aplikasi ini dibuat menggunakan source code Action Script 2.0 pada aplikasi Adobe Flash CS 3, dengan hasil format SWF.Untuk menjalankan aplikasi di OS Android harus menggunakan file yang berformat APK.karna game Ular Tangga ini harus berjalan di OS Android maka dilakukan Convert file terlebih dahulu, agar format file SWF menjadi APK. Convert file tersebut dilakukan dengan cara bantuan sebuah website. Yaitu www.SwiftAPK.com. Fungsi website ini adalah meng-Convert File SWF menjadi APK dengan sangat mudah dan praktis, hanya tinggal mengisi nama aplikasi yang di inginkan. Untuk menggunakan website ini anda harus terlebih dahulu melakukan Register secara Free
3.2
PERANCANGAN DESAIN APLIKASI PERMAINAN ULAR TANGGA BERBASIS ANDROID
Untuk memudahkan pembuatan Aplikasi Ular Tangga, terlebih dahulu membuat model menggunakan UML ( Unified Model Languange ). Dalam hal ini peneliti membuat diagram Use Case, diagram Activity dan diagram
31
32
Use Case, serta rancangan antarmuka sehingga interaksi yang ada pada system dapat terlihat dan permasalahan yang komplek menjadi sederhana serta mendapat banyak pandangan tentang program atau aplikasi yang akan di bangun.
3.3
DIAGRAM USE CASE
Diagram ini menggambarkan interaksi antar pengguna sistem, berikut adalah Use Case dari aplikasi permainan Ular Tangga berbasis Android
SISTEM
Pemain
Mulai Permainan
Cara Bermain
Profil
Gambar 3.1 usecase aplikasi permainan Ular Tangga Berbasis Android
33
Table 3.1 Skenario Use Case Play Nama Use Case
Mulai
Deskripsi singkat
Pada use case ini aplikasi permainan Ular Tangga akan meampilkan Jumlah Pemian yang akan di inginkan
Actor
Pengguna
Pra kondisi
Aplikasi sudah dijalankan
Tindakan utama
Aplikasi akan menampilkan permainan Ular Tangga Berbasis Android
Pasca kondisi
Apabila use case berhasil dijalankan, maka pengguna dapat memainkan permainan Ular Tangga berbasis Android
Tabel 3.2 Skenario Use Case Petunjuk Main Nama Use Case
Petunjuk Main
Deskripsi singkat
Pada
use
case
ini
aplikasi
akan
menampilkan petunjuk tentang peraturan dan cara bermain Ular Tangga berbasis Android Actor
Pengguna
Pra kondisi
Aplikasi sudah dijalankan
Tindakan utama
Aplikasi akan menampilakan petunjuk tentang peraturan dan cara bermain Ular Tanga
34
Tabel 3.3 Skenario Use Case Profil Nama Use Case
Profil
Deskripsi singkat
Pada
use
case
ini
aplikasi
akan
menampilkan petunjuk tentang data pribadi pembuat permainan Ular Tangga berbasis Android. Actor
Pengguna
Pra kondisi
Aplikasi sudah dijalankan
Tindakan utama
Aplikasi akan menampilakan data pribadi pembuat permainan Ular Tangga berbasis Android.
Pasca kondisi
Apabila use case berhasil dijalankan, maka pengguna dapat melihat informasi data pribadi .
Table 3.4 Skenario Use Case Pilih Pemain Nama Use Case
Mulai
Deskripsi singkat
Menampilkan pilihan 2 pemain sampai 4 pemain
Actor
Pengguna
Pra kondisi
Aplikasi sudah dijalankan
Tindakan utama
Menampilkan pilihan pemain 2 sampai 4
Pasca kondisi
Apabila use case berhasil dijalankan, maka pengguna dapat memainkan permainan Ular Tangga berbasis Android
35
3.4
ACTIVITY DIAGRAM Actibity Diagram menunjukan langkah demi langkah untuk melakukan
komputasi. Setiap langkah adalah sebuah keadaan dalam melakukan sesuatu. Diagram ini menggambarkan langkah mana yang harus dijalankan secara berurutan dan langkah mana yang bias dijalankan secara bersama. Pada gambar 3.2 menjelaskan tentang perancangan activity diagram untuk halaman menu.
Pengguna
Sistem
Menampilkan Halaman Menu
Masuk Aplikasi
Mulai
Profil
Cara Main Menampilkan Halaman Menu yang dipilih
Pilih Jumlah Pemain
Gambar 3.2 Activity Diagram Halaman Menu
36
Aktifitas dimulai ketika pengguna memilih masuk ke aplikasi, kemudian sistem
menampilkan halaman menu, aktifitas selanjutnya adalah memilih menu
yang terdiri dari Mulai, Profil dan Cara Bermain 3.4.1
Perancangan Activity Diagram Untuk Halaman Pilih Pemain Aktifitas dimulai ketika pengguna memilih menu Mulai. Selanjutnya
sistem akan menampilkan halaman Mulai, selanjutnya pengguna dapat menjalankan Aplikasi dengan memilih Jumlah Pemain yang diinginkan.
Gambar 3.3 Activity Diagram Permainan Ular Tangga
37
3.4.2
Perancangan Activity Diagram Untuk Halaman Profil Aktifitas dimulai ketika pengguna memilih menu profil. Selanjutnya
sistem akan menampilkan halaman profil pembuat.
pengguna
sistem
Menampilkan Halaman Aplikasi
Menampilkan Halaman Menu
Memilih menu Profil
Menampilkan Halaman Profil
Gambar 3.4 Activity Diagram Halaman Profil
38
3.4.3
Perancangan Activity Diagram Untuk Halaman Petunjuk Main
Aktifitas dimulai ketika pengguna memilih menu Cara Bermain Selanjutnya sistem akan menampilkan halaman petunjuk main, selanjutnya pengguna dapat melihat aturan dan tata cara peraturan bermain dalam permainan.
pengguna
sistem
Menampilkan Halaman Aplikasi
Memilih menu Cara Bermain
Gambar 3.5
Menampilkan Halaman Menu
Menampilkan Halaman Cara bermain
Activity Diagram Halaman Cara Bermain
39
3.5
SEQUENCE DIAGRAM
Sebuah Sequence Diagram secara khusus menjabarkan aktivitas sebuah skenario tunggal. Diagram tersebut menunjukan sejumlah objek contoh dan pesan-pesen melalui objek-objek didalam use case diagram (Fowler, 2005). Dari bentuk use case yang telah digambarkan sebelumnya, dapat dibuat Sequence Diagram. 3.5.1
Perancangan Sequence Diagram Aplikasi Ular Tangga
Sequence diagram halaman Mulai Permainan menggambarkan skenario dan langkah-langkah yang dilakukukan pengguna. Pertama pengguna masuk halaman menu, lalu klik tombol Mulai lalu pilih jumlah Pemain yang diinginkan.
Gambar 3.6 Sequence Diagram Halaman Mulai Permainan
40
3.5.2
Perancangan Sequence Diagram Untuk Halaman Profil Skenario dari Sequence Diagram pada halaman profil dimulai saat
pengguna masuk ke halaman menu utama dan kemudian memilih menu profil, sistem lalu menampilkan halaman profil
Halaman Menu
Pengguna
1. Masuki halaman Menu 2. Memilih Menu Profil
3. Selesai
Gambar 3.7 Sequence Diagram Halaman Profil
Halaman Profil
41
3.5.3
Perancangan Sequence Diagram Untuk Halaman Pilih Pemain Skenario dari Sequence Diagram pada halaman Play dimulai saat
pengguna masuk ke halaman menu utama dan kemudian memilih menu Jumlah Pemain, sistem lalu menampilkan halaman Jumlah Pemain yang akan dimainkan.
Menampilkan Jumlah Pemain
Halaman Menu
Pengguna
1.Masuki halaman Menu 2
Memilih Jumlah Pemain
3
Selesai
Gambar 3.8 Sequence Diagram Halaman Profil
42
3.5.4
Perancangan Sequance Diagram Untuk Halaman Cara Bermain Sequence Diagram pada halaman petunjuk main digambarkan scenario
dan langkah – langkah yang dilakukan pengguna (user). Pertama diawali dengan pengguna masuk menuju halaman menu dan kemudian memilih menu petunjuk main, kemudian sistem menampilkan petunjuk main serta peraturan yang tertera dalam petunjuk main.
Halaman Menu
Halaman Petunjuk Main
Pengguna
1. Masuki Halaman Menu 2. Memilih Menu Petunjuk
Main 3. Selesai
Gambar 3.9 Sequence Diagram Halaman Cara Bermain
43
3.6
RANCANGAN TAMPILAN ANTAR MUKA (INTERFACE)
Pada bagian ini, penulis akan melakukan perancangan sketsa untuk tampilan antarmuka pada aplikasi Ular Tangga Berbasis Android. Berikut adalah rancangan-rancangan tampilan tersebut:
3.61
Rancangan Tampilan Jendela Awal
Berikut adalah rancangan tampilan jendela awal pada aplikasi Ular Tangga Berbasis Android :
GAMBAR UNIVERSITAS MERCUBUNA FASILKOM Gambar 3.10 Rancangan Tampilan Jendela Awal
3.6.2
Rancangan Tampilan Jendela Menu Utama
Berikut adalah rancangan tampilan jendela awal pada Aplikasi Ular Tangga Berbasis Android : MULAI PROFIL CARA BERMAIN
Gambar 3.11 Rancangan Tampilan Jendela Menu Utama
44
Pada gambar 3.10 menjelaskan jendela tampilan menu utama yang terdapat : -
Tombol Mulai : Berfungsi untuk menjalankan Aplikasi Ular Tangga rBerbasis Android.
-
Tombol Profil : Berfungsi untuk menampilkan jendela Profil
-
Tombol Cara Bermain : Berfungsi menampilkan jendela Cara Bermain
3.6.3 Rancangan Tampilan Mulai Permainan
Kotak yang terdiri dari 1 – 100 Buah, 4 Ular dan 4 Tangga.
DADU TOMBOL JALANKAN AVATAR STATUS PEMAIN PENEMPATAN AWAL AVATAR
MENU UTAMA
Gambar 3.12 Rancangan Tampilan Mulai Permainan Pada Gambar 3.11 jendela Tampilan Mulai Permainan terdapat : -
Dadu : Tombol untuk memutar dadu secara acak.
-
Tombol jalankan Avatar : menjalankan avatar setelah dadu di klik.
-
Status Pemain : Sebuah Teks yang menampilkan giliran pemain.
-
Penempatan Awal Avatar : Posisi Avatar
-
Menu Utama : Tombol untuk kembali ke menu Utama.
45
3.6.4
Rancangan Tampilan Halaman Pemenang
PLAYER x Menang
TRY AGAIN
Gambar 3.13 Rancangan Tampilan Halaman Pemenang
Pada Gambar 3.12 Tampilan Halaman pemenang terdapat : -
Player x menang : x adalah pemenang permainan, kemungkinan bisa pemain 1 sampai dengan 4
-
3.6.5
Try Again : Tombol untuk mencoba permainan dari awal.
Rancangan Tampilan Halaman Profil PROFIL NAMA : NIM : FAKULTAS : EMAIL :
Tombol kembali ke MENU
Gambar 3.14 Rancangan Tampilan Halaman Profil Pada Gambar 3.12 Halaman Profil terdapat : -
Biodata : Indentitas penulis mulai dari Nama, NIM, Fakultas dan E –Mail.
-
Tombol Menu :Tombol untuk kembali ke Menu Utama
46
3.6.6 Rancangan Tampilan Halaman Cara Bermain
CARA BERMAIN DESKRIPSI TENTANG CARA BERMAIN
Tombol kembali ke Menu
Gambar 3.15 Rancangan Tampilan Halaman Cara Bermain
Pada Gambar 3.13 Tampilan Halaman Cara Bermain terdapat : -
Deskripsi : Aturan cara bermain
-
Tombol Menu : Tombol untuk kembali ke menu utama