BAB III ANALISIS DAN PERANCANGAN. permasalahan secara umum dan analisis perancangan sistem dari aplikasi Iqra ini.

Transkripsi

1 BAB III ANALISIS DAN PERANCANGAN 3.1 Analisis Berdasarkan pada latar belakang masalah dan perumusan masalah yang terdapat pada bab sebelumnya, pada bab ini penulis melakukan analisis berdasarkan pada permasalahan secara umum dan analisis perancangan sistem dari aplikasi Iqra ini Analisis Kondisi Handphone merupakan salah satu media komunikasi yang paling banyak digunakan oleh masyarakat. Baik itu dalam menerima laporan informasi maupun berkomunikasi secara efektif dan efisien, serta dapat menyimpan file dalam bentuk digital dan J2ME merupakan bahasa pemrograman yang mendukung dalam pembuatan aplikasi pada handphone tersebut. 3.2 Analisis Perancangan Pada peerancangan sisitem ini dibangun sebuah Aplikasi Iqra Mobile menggunakan J2ME (Java 2 Micrso Edition) yaitu suatu aplikasi yang membantu dalam pembelajaran Iqra, cara membaca Iqra dan kemudian selanjutnya pembelajaran Alquran dengan bantuan media handphone, dimana Iqra ini disajikan dengan mudah dan praktis dengan rancangan secara interaktif. Sebisa mungkin untuk memberikan fasilitas membaca dan juga terdapat pemilihan Iqra (Jilid), serta cara mengucapkan

2 lafal huruf hijaiyah yang terdapat dalam aplikasi Iqra ini. Adapun perangkat yang digunakan dalam proses perancangan sistem yang dibangun, adalah sebagai berikut : Perangkat Keras Processor Intel Core 2 Duo 2.2 GHz Memory (RAM) 1 GB Harddisk 160 GB Card reader atau kabel data Perangkat Lunak Microsoft Windows XP Profesional version 2002 Service Pack 2 IDE Netbeans 6.0 J2ME Wireless toolkit 2.5 Java Virtual Mechine JDK 1.5 Adobe Photoshop 3.3 Pemodelan Aplikasi Pemodelan sistem aplikasi merupakan cara untuk memudahkan dalam melakukan perancangan perangkat lunak. Tujuan dari pemodelan adalah untuk memahami sistem yang akan dirancang dan menggambarkan sistem aplikasi secara lengkap, sehingga dapat digunakan untuk menyelesaikan cara kerja sistem aplikasi tersebut.

3 3.3.1 Pemodelan Use Case Diagram Use Case Diagram mendeskripsikan interaksi tipikal antara para pengguna sistem dengan sistem itu sendiri, dengan memberi sebuah narasi tentang bagaimana sistem tersebut digunakan (Fowler, 2005:141). Pengguna sistem diwakili oleh pengguna (User) sedangkan sistemnya diwakili oleh use case. Pada gambar dibawah ini digambarkan diagram use case untuk sistem aplikasi iqra. Start Help Gambar 3.1 Use case diagram Menu Utama Aplikasi Iqra Berikut ini adalah penjelasan urutan kegiatan dari masing-masing sebuah use case yang telah dibuat :

4 Tabel 3.1 Spesifikasi Use Case Start 1 Spesifikasi Use case Start Keterangan I Nama Use case START Ii Aktor User Iii Deskripsi Use case ini digunakan untuk menampilkan sebuah Iqra (Jilid) Iiii Basic Flow Sistem menampilkan Form pilihan daftar Iqra (Jilid) yang menampilkan choicegrouop Tabel 3.2 Spesifikasi Use Case About 2 Spesifikasi Use case Help Keterangan I Nama Use case HELP Ii Aktor User Iii Deskripsi singkat Use case ini digunakan untuk menampilkan Form tentang isi/petunjuk program dimana berisi tentang program tersebut Iiii Basic Flow Sistem ini menampilkan menu Help, dimana Form ini berisikan uraian penggunaan dari program tersebut

5 3.3.2 Pemodelan Activity Diagram Activity Diagram menggambarkan berbagai alur aktifitas pada sistem dalam bentuk yang sedang dirancang, bagaimana masing-masing alur berawal, proses yang terjadi, dan bagaimana berakhir. Diagram aktifitas menggambarkan langkah-langkah yang harus dijalankan secara berurutan dan langkah manakah yang bisa dijalankan secara bersamaan. PENGGUNA (USER) SISTEM APLIKASI Start Memilih aplikasi Iqra Menampilkan form aplikasi Iqra Memilih menu Start Memilih menu Help Menampilkan form menu yang dipilih Finish Gambar 3.2 Activity diagram Menu utama

6 Pada gambar diatas aktifitas dimulai jika pengguna (user) handphone sudah memiliki program aplikasi iqra mobile yang sudah diinstall sebelumnya pada handphone. Setelah memilih menu aplikasi maka pengguna dapat memilih menu pada aplikasi tersebut, kemudian apabila setelah selesai memilih pengguna dapat keluar kembali dari aplikasi ini. PENGGUNA (USER) SISTEM APLIKASI Start Memilih menu (Jilid) Iqra Menampilkan menu (Jilid) Iqra Iqra 1 Iqra 2 Iqra 3 Iqra 4 Iqra 5 Iqra 6 Menampilkan form (Jilid) Iqra Finish Gambar 3.3 Activity diagram aplikasi (Jilid) Iqra

7 Pada gambar diatas merupakan aktifitas yang dimulai jika pengguna handphone (User) sudah memulai untuk menggunakan iqra mobile, dimana disaat memasuki menu, pengguna (user) dapat memilih start untuk memulai aplikasi Iqra. Kemudian pilih salah satu (jilid) iqra yang diinginkan, setelah selesai maka pengguna (user) dapat keluar dari aplikasi Iqra ini. PENGGUNA (USER) SISTEM APLIKASI Start Memilih menu Help Menampilkan form Iqra Memilih pilihan kembali Kembali ke menu utama Finish Gambar 3.4 Activity Diagram menu Help Pada gambar diatas dijelaskan menggunakan menu help (cara menjalankan aplikasi Iqra), setelah membuka menu help, maka akan muncul tampilan form tentang bagaimana cara menjalankan aplikasi Iqra, setelah selesai pengguna (user) dapat kembali ke menu utama pada aplikasi Iqra.

8 3.3.3 Pemodelan Sequence Diagram Sebuah Sequence Diagram secara khusus menjabarkan aktivitas sebuah skenario tunggal. Diagram tersebut menunjukkan sejumlah objek contoh dan pesanpesan melalui objek-objek di dalam use case diagram (Fowler, 2005:81). Dari bentuk use case yang telah digambarkan sebelumnya, dapat dibuat Sequence Diagram Sequence Diagram Help Sequence Diagram help menggambarkan skenario dan langkah-langkah yang dilakukan oleh pengguna (user), dan bagaimana langkah user untuk dapat melihat isi atau keterangan tentang aplikasi Iqra. User Form Help 1. Memilih menu Help 2. Menampilkan hasil isi 3. Keterangan pada form Help dari aplikasi Iqra Gambar 3.5 Sequence Diagram menu Help

9 Pada gambar diatas dijelaskan dimana seorang pengguna (user), memilih menu help dan ketika user memilih menu help maka akan tampil form about yang berisi tentang petunjuk atau cara untuk menjalankan apilkasi Iqra Sequence Diagram cari Iqra (jilid) Sequence Diagram cari Iqra (jilid) menggambarkan skenario dan langkahlangkah yang dilakukan pengguna, dan bagaimana langkah untuk dapat melihat jilid suatu Iqra berdasarkan pada pilihan menu jilid. user Form menu utama Form start Form tampilan (Jilid) Iqra User 1.Masuk menu utama 2. Memilih menu Start 3. Tampilkan Jilid 4. Menampilkan Iqra (Jilid) a.iqra 1 b. Iqra 2 c. Iqra 3 d. Iqra 4 e. Iqra 5 f. Iqra 6 Gambar 3.6 Sequence Diagram cari Iqra (Jilid) Pada gambar diatas dijelaskan dimana seorang pengguna (user) memilih jilid Iqra, kemudian muncullah menu jilid iqra dimana user memilih jilid kemudian sistem

10 akan menampilkan form jilid iqra yang telah user pilih. Kemudian hasil form Iqra tersebut mulailah dipelajari oleh user. 3.4 Perancangan Antarmuka (Interface) Perancangan Antarmuka (interface) dilakukan untuk mendapatkan gambaran tentang aplikasi yang dibuat beserta susunannya dimulai dari tampilan halaman awal sampai dengan tampilan Iqra dan tiap bagian dalam aplikasi Iqra. Aplikasi Iqra memiliki desain tampilan yang akan dijelaskan sebagai berikut Tampilan Halaman Awal Tampilan halaman awal adalah tampilan awal yang terdiri dari cover pembuka, awal memulai pilihan Iqra dan cover petunjuk (about) penggunaan aplikasi ini, berupa gambar yang telah didesain seprti gambar berikut ini. TAMPILAN HALAMAN AWAL IMAGE Gambar 3.7 Tampilan halaman Awal

11 3.4.2 Tampilan Menu Utama Aplikasi Iqra Rancangan desain tampilan ini untuk menampilkan menu utama yang ada dalam aplikasi yang dapat dipilih sesuai dengan keinginan pengguna (user). tampilan menu aplikasi iqra ini dapat dilihat pada gambar berikut ini MENU UTAMA APLIKASI IQRA START HELP Kembali Gambar 3.8 Tampilan menu Utama Apliksai Iqra Tampilan Menu Help Tampilan menu about ini menampilkan form yang dapat dilihat pengguna (user) untuk dapat mengetahui isi atau petunjuk tentang penggunaan program aplikasi Iqra.

12 TAMPILAN MENU HELP IMAGE Kembali Gambar 3.9 Tampilan Menu Help Tampilan Menu Pilihan (Jilid) Iqra Tampilan menu pilihan menu Iqra ini untuk menampilkan Iqra (jilid) dimana pengguna (user) dapat memilih jenis (jilid) Iqra yang diinginkan. Lihat pada gambar berikut ini. TAMPILAN PILIHAN (JILID) iqra IQRA 1 IQRA 2 IQRA 3 IQRA 4 IQRA 5 IQRA 6 Kembali Gambar 3.10 Tampilan Menu Pilihan (Jilid) Iqra

13 Keterangan : Memilih Kembali : Untuk kembali ke menu utama aplikasi Iqra Memilih pilihan Iqra : Untuk menampilkan Iqra (Jilid) yang telah dipilih oleh pengguna (user) Tampilan Menu Iqra (Jilid) Tampilan form Iqra (jilid) ini untuk menampilkan Iqra (Jilid) yang telah dipilih oleh pengguna (User). TAMPILAN IQRA (JILID) IMAGE Keterangan : Kembali Selanjutnya Se Gambar 3.11 Tampilan Menu Iqra (Jilid) Memilih selanjutnya : Untuk melanjutkan kembali contoh Iqra. Memilih kemballi : Untuk kembali ke menu tampilan pilihan Iqra (Jilid)

14 3.5 Perancangan Program Program aplikasi Iqra yang dirancang terdiri dari MIDlet, dimana terdiri dari beberapa metode yang harus ada seperti constructor(), protected void StartApp(), protected void PauseApp() dan lain sebagainya. Adapun program ini diberi nama MIDlet Iqra memiliki struktur direktori sebagai berikut : src Folder ini berfungsi untuk menyimpan source code untuk MIDlet dan kelas lainnya yang diperlukan. Serta folder ini juga berfungsi untuk menyimpan yang dibutuhkan MIDlet, seperti gambar (png), suara (wav), text (txt). dist Folder ini berfungsi untuk menyimpan lib, file JAR, JAD, dan file manifest berisi komponen MIDlet