BAB IV IMPLEMENTASI
4.3 Implementasi User Interface
Setelah perancangan desain antarmuka yang dilakukan pada bab sebelumnya selesai, maka pada bab ini akan diimplementasikan desain antarmuka yang telah dibuat pada bab sebelumnya. Dimana dalam perancangan dijelaskan ada 3 menu utama dan 3 menu tambahan yang disediakan dalam aplikasi ini yang dapat dipilih oleh user selain menu utama juga terdapat beberapa menu lain yang disediakan dalam aplikasi ini yaitu menu setting yang di dalamnya user dapat mengatur tampilan yang diinginkan oleh user, diantaranya adalah sebagai berikut:
1. Halaman Judul akan tampil pertama kali dilayar handphone ketika aplikasi ini dijalankan sebagai awal untuk masuk dalam aplikasi ini. 2. Halaman Menu Galeri Binatang yang di antaranya menu Galeri, menu
Test, about, dan exit. Menu tersebut terdapat dalam satu form dimana
user dapat memilih salah satu menu.
3. Halaman menu Galeri dimana pada menu tersebut terdapat banyak pilihan hewan berdasarkan habitatnya.
4. Halaman menu Test dimana pada menu tersebut terdapat beberapa pilihan tes menurut gambar dan tulisan
5. Pada aplikasi ini juga terdapat fitur tambahan untuk pengucapan ejaan dan suara hewan yang bisa kita dengar.
4.3.1 Tampilan Icon Aplikasi Galeri Binatang Pada Device
Pada Halaman handphone ini dapat dilihat bahwa icon Galeri Binatang ada, berarti aplikasi sudah terinstal pada device tersebut
Gambar 4.1 Tampilan Icon Galeri Binatang
Untuk dapat menggunakan aplikasi tersebut user hanya butuh untuk meng-klik 2 kali pada icon maka aplikasi Galeri Binatang android ini sudah dapat digunakan dan user dapat menerjemakan sesuai dengan menu yang dipilh user yang terdapat pada aplikasi Galeri Binatang
4.3.2 Tampilan Awal Aplikasi Galeri Binatang
Tampilan awal pada Aplikasi Galeri Binatang setelah memilih icon dalam Galeri Binatang.
Gambar 4.2 Tampilan Awal Aplikasi
Halaman ini merupakan halaman awal dimana halaman ini akan muncul setelah user menekan pada icon Galeri Binatang akan tampilan informasi nama hewan atau project yang dibuat kemudian apabila ingin lanjut klik satu kali pada background.
4.3.3 Halaman Menu
Halaman Utama Menu dari Aplikasi Galeri Binatang Berdasarkan Hewan pada umumnya yang terdapat empat pilihan menu.
Gambar 4.3 Halaman Menu
Halaman menu pada aplikasi Galeri Binatang android ini sebenarnya terdapat dalam satu form dengan menu yang lain, yaitu menu Galeri, Test, About, dan exit. Namun jika dipilih salah satu maka menu – menu tersebut akan memiliki fungsi yang berbeda. Pada menu ini user harus klik salah satu sesuai dengan ke inginan.
4.3.4 Halaman Menu Galeri
Halaman Galeri yang ada setelah user memilih menu Galeri sehingga di munculkan sesuai pilihan.
Gambar 4.4 Halaman Menu Galeri
Menu Galeri ini untuk menampilkan isi – isi hewan berdasarkan klasifikasi hewan apa saja yang ada di aplikasi Galeri Hewan yakni ikan, unggas, reptil, amfibi, mamalia, serangga kemudian apabila user ingin memilih salah satu Hewan tinggal di klik satu kali , setelah itu user akan di berikan display atau output hewan
.
Kemudian di dalam display terdapat fitur yakni audio yang memberikan
voice agar kita bisa mendengar Hewan yang berdasarkan kasifikasinya
Gambar 4.6 Fitur Audio
Gambar diatas adalam menu button untuk membantu user dalam menjalankan audionya
4.3.5 Halaman Menu Test
Menu ini berbeda dengan menu Galeri, namun pada menu ini user akan di berikan tes sesuai yang ada di aplikasi tersebut. Kemudian apabila user ingin memilih salah satu tinggal di klik satu kali ,setelah itu user akan output pilihan yakni test dan highscore.
Kemudian apabila user ingin memilih salah satu test atau highscore tinggal di klik satu kali. Misalkan user memilih test akan tampak pilihan 2 yaitu test gambar dan test berdasarkan huruf.
Gambar 4.8 Halaman setelah click Test
Gambar diatas adalah tampilan hasil dari halaman menu test pilihan yang telah user pilih menu tersebut. Setelah user memilih test ,user juga harus memilih pilihan gambar atau huruf. Misalkan user memilih gambar sistem akan munculkan tentang gambar sebagai berikut.
Gambar 4.9 Halaman setelah memilih Gambar
Gambar diatas adalah tampilan hasil dari test gambar pilihan yang telah user pilih menu tersebut. Setelah user memilih test gambar sistem akan memberi pertanyaan 10 soal gambarnya. Kemudian user memilih satu test lagi yaitu test huruf ,perhatikan gambar dibawa ini.
Gambar diatas adalah tampilan hasil dari test huruf pilihan yang telah user pilih menu tersebut. Setelah user memilih test huruf sistem akan memberi pertanyaan 3 soal.
Setelah user mencoba test diatas semua sampai selesai sistem akan melakukan penyimpanan setelah user memasukan nama di dalam kolom tersebut. Berikut gambar pada saat menyimpan data setelah tes selesai.
Gambar 4.11 Halaman setelah melakukan tes dan memasukan nama Setelah di masukan nama lalu di klik ok ,tampilan berikutnya akan melaju ke tampilan highscore berikut gambarnya.
Gambar 4.12 Tampilan highscore Aplikasi Galeri Binatang
Setelah melakukan beberapa test diatas ini adalah tampilan highscorenya. Kemudian setelah melihat nilai ada tombol home, lalu klick akan kembali ketampilan awal.
4.3.6 Tampilan About Aplikasi
Dari halaman menu about akan di beri tampilan atau output tentang informasi dan juga profil.
Gambar 4.13 Tampilan About Aplikasi Galery Hewan
Desain antar muka sistem aplikasi Galeri Hewan android untuk menu
about ini sangat sederhana, jika memilih menu ini hanya akan menampilkan profil singkat dari aplikasi kamus android.