BAB III ANALISIS DAN DESAIN SISTEM

Transkripsi

1 BAB III ANALISIS DAN DESAIN SISTEM III.1. AnalisaMasalah Pengembangan aplikasi permainan tes buta warna untuk penggunaan perangkat mobile phone Android bertujuan untuk memberikan jenis permainan yang menarik.analisa masalah ini berfungsi untuk menjelaskan perancangan yang telah dibangun menjadi sebuah aplikasi permainan tes buta warna.aplikasi ini hanya dapat diakses menggunakan mobile phone android yang dirancang menggunakan emulator dari perangkat komputer.dalam perancangan juga terdapat beberapa proses yang dilakukan oleh pengguna,dimana pengguna dapat menebak angka yang ditunjukan pada gambar isihara(gambar tes buta warna) yang ditampilkan pada layar.dengan memiliih tombol yang telah disediakan, setiap jawaban benar memiliki score dan pengguna dapat menebak teks yang ditampilkan pada gambar. Desain menu untuk aplikasi permainan tes buta warna dapat dijelaskan sebagai berikut. 1. Start Game, yang berfungsi untuk memulai permainan. 2. Help, merupakan informasi tentang bantuan penggunaan aplikasi. 3. About,merupakan informasi tentang perancangan aplikasi. 4. Exit, untuk menutup penggunaan aplikasi. 26

2 27 III.2. SpesifikasiPerangkat Dalam perancangan aplikasi untuk perangkat mobile android ini penulis menggunakan beberapa perangkat agar aplikasi berjalan dengan baik dan sesuai dengan yang diharapkan, yaitu sebagai berikut : 1. PerangkatLunak (Software) a. Operating System, OS yang digunakan dalam perancangan dan tes untuk adalah Windows 7 dan OS Android pada perangkat mobile. b. JDK Java 1.7,sebagai bahasa program dan compiler Java. c. Eclipse, sebagai editor source code Java. 2. PerangkatKeras (Hardware) a. Komputer yang setara Core i3. b. Smartphone Android dengan OS 4.1 atau diatasnya. c. Mouse, keyboard, dan Monitor. III.2.1. Teknik Pemecahan Masalah Adapun teknik pemecahan masalah tentang perancangan aplikasi dari permainan tes buta warna yang dibuat terdiri dari beberapa poin yaitu sebagai berikut: 1. Untuk langkah awal analisa terhadap perancangan yang akan dibangun terutama tentang tes buta warna yang menggunakan perangkat android. 2. Menentukan perangkat yang dibutuhkan dalam membangun aplikasi seperti perangkat keras maupun perangkat lunak. 3. Merancang sistem yang nantinya akan di implementasikan pada aplikasi yang akan dibangun.

3 28 4. Terakhir proses uji coba terhadap inputan, proses ataupun output aplikasi, apakah sudah sesuai dengan perancangan yang telah direncanakan sebelumnya. III.3. DesainSistem Pada proses perancangan ini akan dijelaskan mengenai beberapa rancangan aplikasi yang akan dikerjakan yang menggunakan perangkat android yaitu sebagai berikut: III.3.1. Use Case Diagram Use case diagram berfungsi untuk menggambarkan kegiatan aktor atau pengguna aplikasi, adapun use case diagram aplikasi yang dirancang dapat dilihat pada gambar III.1 berikut. Gambar III.1. Use CaseDiagram Dari gambar use case diagram diatas, pengguna memulai aplikasi dan memilih jawaban yang benar dari gambarnya isihara yang ditampilkan secara acak. Setelah pengguna selesai maka pemain mendapatkan score dari hasil jawaban yang telah diselesaikan sesuai dengan durasi waktu.

4 29 III.3.2. Activity Diagram Pada activity diagram dibawah ini menggambarkan proses yang berjalan pada aplikasi android terdapat beberapa menu yang ditampilkan.proses yang berlangsung terjadi setelah pengguna menjalankan aplikasi, yang dapat dilihat pada gambar III.2 berikut. Gambar III.2. Activity Diagram Android

5 30 Dari gambar Activty diagram diatas, proses aplikasi merupakan tahapan yang disajikan terhadap permainan yang telah dimainkan dan penilaian merupakan proses yang diperoleh pemain dalam memainkan game test buta warna tersebut. III.3.3. SquenceDiagram Sequence diagram yang digunakan untuk menggambarkan system pada sebuah adegan untuk proses penggunaan aplikasi. Berikut ini adalah Sequence diagram yang dirancang 1. Sequnce Diagram Strart Aplikasi, untuk diagram proses start aplikasi dapat dilihat pada gambar III.3 dibawah ini. Android Start Aplikasi Sistem 1.[Membuka Form Mulai] 2.[Load Proces] 3.[Tampilkan] Gambar III.3. Squence Diagram Start Aplikasi 2. Sequnce Diagram menampilkan isihara, untuk diagram proses menampilkan isihara dapat diliha pada gambar III.4 dibawah ini.

6 31 Android View Image Sistem 1.[View Isihara] 2.[Load Proces] 3.[Tampilkan] Gambar III.4. Squence Diagram Menampilkan Isihara 3. Sequnce Diagram memilih jawaban, untuk diagram proses memilih jawaban dapat dilihat pada gambar III.5 dibawah ini. User PilihJawaban Jawab Sistem 1.[View Isihara] 2.[Load Proces] 1.[Jawab] 3.[Tampilkan] 2.[Cek Jawaban] 3.[Respon] Gambar III.5. Squence Diagram Memilih Jawaban 4. Sequnce Diagram proses score, untuk diagram proses score dapat dilihat pada gambar III.6 dibawah ini.

7 32 Android DurasiWaktu Proses Score Sistem 1.[Durasi Waktu] 2.[Load Proces] 3.[Tampilkan] 1.[Score] 2.[CekJawaban] 3.[Tampilkan] Gambar III.6. Squence Diagram Proses Score III.4. DesainInterface Padarancangan aplikasi android terdiri dari bebarapa tampilan dan menu yang dapat digunakan, rancangan tampilan yang ada pada aplikasi android adalah sebagai berikut. 1. RancanganSplash Rancangan layar splash merupakan rancangan awal pembuka aplikasi, Yang dapat dilihat pada gambar III.7. SPLASH IMAGE Gambar III.7. Rancangan Form Splash

8 33 2. RancanganMenu Rancangan menu adalah menu yang ada setelah pengguna masuk ke aplikasi.yang dapat dilihat pada gambar III.8 berikut. Game Test ButaWarna Start Game Help About Exit Gambar III.8. Rancangan Menu Pada gambar diatas terdapat beberapa menu yang dapat dijelaskan antara lain sebagai berikut : a. Start Game, merupakan menu untuk rancangan form permainan yaitu menebak teks yang ditampilkan pada gambar isihara yang ditampilkan gambarnya. b. About, Tentang aplikasi yang merupakan menu yang menyajikan informasi tentang informasi. c. Help, yang merupakan menu untuk menyajikan informasi mengenai cara penggunaan aplikasi. d. Exit, untuk pengguna menutup aplikasi.

9 34 3. RancanganSplash Play Form ini berfungsi untuk tampilan awal pengguna sebelum masuk kepermainan. Yang dapatdilihat pada gambar III.9 berikut. Game Test ButaWarna Informasi Cara Bermain Play Game Gambar III.9. Rancangan Splash Play 4. RancanganPapanPermainan Form ini berfungsi untuk menampilkan rancangan permainan dalam game tes buta warna yang ada di gambar. Yang dapat dilihat pada gambar III.10 berikut.

10 35 Game Test ButaWarna Jawab 0 HH:mm:ss Level 0 Score 0 Isihara Image Pilihan 1 Pilihan 2 Pilihan 3 Gambar III.10. Rancangan Papan Permainan Pada gambar diatas terdapat fitur-fitur selama selama pemain menjalankan aplikasi yang diantaranya adalah sebagai berikut : a. Form yang menampilkan gambar isihara merupakan untuk ditebak oleh pengguna. b. Durasi waktu yang merupakan waktu yang berjalan mundur yang apabila hitungannya telah habis maka permaianan akan selesai. c. Selain itu terdapat juga tiga button yang merupakan pilihan jawaban yang berisikan teks dari gambar isihara tersebut. Selama pemain menjawab terdapat penilaian yang apabila pemain dapat menjawab dengan benar atau salah maka muncullah form yang menilai jawaban pemain tersebut selain itu setiap jawaban yang benar

11 36 mendapatkan nilai yang nantinya akan dihitung secara keseluruhan otomatis yang hasilnya dapat dilihat diakhir permainan. 5. RancanganForm Help Form ini menampilkan informasi tentang penggunaan aplikasi game tes buta warna, yang dapat dilihat pada gambar III.11 berikut. Game Test ButaWarna Form Help Gambar III.11.RancanganForm Help 6. RancanganForm About Form ini berfungsi untuk menampilkan informasi tentang cara bermain aplikasi ini, dapat dilihat pada gambar III.12 berikut. Absensi Form About Gambar III.12. Rancangan Form About