BAB III ANALISA KEBUTUHAN DAN PERANCANGAN SISTEM

Transkripsi

1 BAB III ANALISA KEBUTUHAN DAN PERANCANGAN SISTEM 3.1 Alat dan Bahan Alat Untuk mendukung dalam pembuatan aplikasi pembelajaran membaca Al-Qur an (Tajwid) berbasis android ini, penulis menggunakan beberapa alat perangkat keras dan perangkat lunak yang dibutuhkan antara lain : Perangkat Keras Alat berupa perangkat keras yang dibutuhkan sebagai berikut : 1. Personal Computer dengan spesifikasi RAM 512KB, Prosesor dual core dan dilengkapi VGA, dibutuhkan dalam membuat aplikasi pembelajaran membaca Al-qur an. 2. Smartphone dengan OS android dengan spesifikasi RAM 512 MB dan Prosesor Dual Core 1 Ghz, dibutuhkan dalam menjalankan aplikasi pembelajaran membaca Al-qur an Perangkat Lunak Alat berupa perangkat lunak yang dibutuhkan dalam membuat aplikasi pembelajaran membaca Al-qur an adalah sebagai berikut : 1. Sistem Operasi : Windows 7 Ultimate Microsoft Corporation. 2. Pembuatan dan Editing Gambar : Corel Draw Grapich Suit X5, PhotoShop CS3. 3. Perekaman dan Editing suara : Audacity Perancangan Sistem : Rational Rose Enterprise Edition. 5. Pemrograman Aplikasi : Android Development Tools (ADT) v Tipe Sistem Operasi Android (Smart Phone): Ice Cream Sandwich

2 Bahan Bahan-bahan yang diperlukan untuk membuat dan menjalankan aplikasi pembelajaran membaca Al-Qur an (Tajwid) berbasis android antara lain: 1. Data hukun-hukum bacaan tajwid. 2. Data latihan yang berisi latihan-latihan yang berhubungan dengan hukumhukum tajwid. 3.2 Tahap Pembuatan Aplikasi Skema penelitiannya yang dilakukan untuk proses membuat aplikasi tajwid berbasis android alur proses pembuatanya sebagai berikut : Analisis Perancangan Implementasi dan ujicoba Gambar 3.1 skema penelitian aplikasi 3.3 Analisa Menganalisa aplikasi-aplikasi tajwid yang berbasis android yang sudah ada pada play store kemudian mencari sisi lemah dari beberapa aplikasi yang ada tersebut, dan kelemahannya itu dimasukan kedalam aplikasi tajwid ini yang akan dibuat agar menjadi nilai lebih/unggul dibandingkan dengan aplikasi yang sudah ada. Dari analisa yang didapat dari analisa dijadikan bahan dalam pembuatan aplikasi ini. Berikut aplikasi yang sudah dianalisa :

3 19 Tabel 3.1 Analisa aplikasi 1. Nama Belajar Tajwid Gambar Menyajikan materi per hukum bacaan, contoh berupa gambar dan kelebihan suara, navigasi dan tombol sesuai. kekurangan Tidak ada latihan, tidak ada contoh membaca yang salah, tampilan berupa warna-warna sederhana. 2. Nama E-tajwid Gambar kelebihan Menerangkan secara terperinci, materi dimulai dari dasar, menyajikan contoh salah tapi di bagian tertentu.

4 20 kekurangan Tidak ada contoh membaca yang salah dikeseluruhan, tampilan monoton/sederhana, kurang menjelaskan pada tajwid, tidak ada latihan 3. Nama Belajar tajwid Gambar Menyajikan materi tajwid secara komplit, menyajikan contohcontoh dengan menggunakan gambar dan suara. kelebihan kekurangan Tidak ada latihan, tidak disajikan contoh salah dalam membaca tajwid. 3.4 Perancangan Sistem Proses Bisnis Aplikasi pembelajaran membaca Al-Qur an (Tajwid) berbasis android merupakan aplikasi yang digunakan di mobile phone (Smart Phone) berbasis android. Dalam aplikasi ini pertama akan menyajikan halaman utama dimana pengguna dapat memilih materi yang ada yaitu idhar, iqlab, ikhfa, qolqolah, idghom, waqof, mad dan latihan. Untuk melihat materi yang ada pengguna mengklik pada bagian yang diinginkan, maka materi akan disajikan. Pada materi yang disajikan yaitu berupa teks yang lebih jelas dan contoh-contoh yang bersuara jika dklik. Pengguna bisa mendengar contoh yang salah dan contoh

5 21 yang benar. Pada pilihan latihan ditampilkan latihan per kategori dari materi jika dipilih salah satu maka pengguna di hadapakan halaman pertanyaan berupa multiple choice, setiap soal jika menjawab benar akan mendapat skor dan jika salah skor akan di kurangi. Jika memilih kategori pilihan suara maka user akan dikasih pilihan berupa suara dan untuk menjawab suara yang benar sesuai pada soalnya Fungsional sistem Fungsional System yang terdapat pada aplikasi pembelajaran membaca Al-Qur an (Tajwid) berbasis Android adalah : 1. Dengan menampilkan materi yang terperinci agar memudahkan user untuk memahami materi tajwid. 2. User/pengguna bisa mendengarkan contoh dari hukum-hukum tajwid. 3. User/pengguna bisa melatih kemampuan pengetahuan materi tajwid Use Case Diagram Use case diagram mendefinisikan fitur-fitur yang terdapat dalam aplikasi pembelajaran membaca Al-Qur an (Tajwid) berbasis Android. Use case diagram menunjukkan adanya interaksi antara aktor dengan sistem. Aktor yang berperan adalah User, dan sistem adalah aplikasi pembelajaran membaca Al-Qur an (Tajwid) berbasis Android. Use case diagram dari aplikasi membaca Al-Qur an (Tajwid) berbasis Android dapat dilihat pada gambar 3.2

6 22 Melihat Materi Idhar Melihat Materi iqlab Melihat Matei Ikhfa Melihat Materi Qolqolah user Melihat Materi Idghom Melihat Materi Waqaf Melihat Materi Mad Melakukan Latihan Tajwid Gambar 3.2 Usecase Diagram Aplikasi Berikut tabel usecase diagramnya aplikasi : Tabel 3.2 Tabel Usecase Diagram Aplikasi Aktor : User/pengguna Diskripsi : Use Case : Memilih materi tajwid

7 23 Aktor : User/pengguna User dapat memilih menu materi yaitu idhar, idgom, qolqolah, iqlab, waqaf, ikhfa, mad. Use Case : Aktor : Memilih Latihan User/pengguna User dapat memilih menu latihan yang berisi latihan menurut kategori masingmasing materi antara lain makhroj, idhar, idgom, qolqolah, iqlab, waqaf, ikhfa, mad. Dan terdapat pula campuran yang mensajikan latihan campuran Activity Diagram Activity diagram menggambarkan aktivitas yang secara umum dilakukan tanpa menggambarkan objek yang bertanggung jawab atas aktivitas tersebut. Keadaan pertama yang muncul adalah keadaan pada saat load aplikasi. Setelah keadaan itu terpenuhi, maka aktifitas memilih menu dilakukan oleh user. Berikut ini adalah activity diagram aplikasi pembelajaran interaktif Tajwid dapat dilihat pada gambar 3.4.

8 24 1. Activity Diagram Materi Idhar Jika user akan memilih menu materi seperti Idhar. Pertama dimulai dengan user membuka aplikasi kemudian memilih didalam menu utama selanjutnya memilih Idhar. Apabila sudah memilih materi Idhar tersebut akan ditampilkan yaitu materi Idhar dan contohnya dengan ada suaranya. Activity Diagram Materi Idhar dapat dilihat pada gambar 3.4. user sistem melihat materi idhar menampilkan materi idhar Gambar 3.4 Activity diagram materi Idhar 2. Activity Diagram Materi Idgom Jika user akan memilih menu materi seperti Idgom. Pertama dimulai dengan user membuka aplikasi kemudian memilih didalam menu utama selanjutnya memilih Idgom. Apabila sudah memilih materi Idgom tersebut akan ditampilkan yaitu materi Idhar dan contohnya dengan ada suaranya. Activity Diagram Materi Idgom dapat dilihat pada gambar 3.5

9 25 user sistem melihat materi idgom menampilkan materi idgom Gambar 3.5 Activity Diagram Materi Idgom 3. Activity Diagram Materi Qolqolah Jika user akan memilih menu materi seperti Qolqolah. Pertama dimulai dengan user membuka aplikasi kemudian memilih didalam menu utama selanjutnya memilih Qolqolah. Apabila sudah memilih materi Idgom tersebut akan ditampilkan yaitu materi Qolqolah dan contohnya dengan ada suaranya. Activity Diagram Materi Qolqolah dapat dilihat pada gambar 3.6. user sistem melihat materi qolqolah menampilkan materi qolqolah Gambar 3.6 Activity Diagram Materi Qolqolah

10 26 4. Activity Diagram Materi Iqlab Jika user akan memilih menu materi seperti Iqlab. Pertama dimulai dengan user membuka aplikasi kemudian memilih didalam menu utama selanjutnya memilih Iqlab. Apabila sudah memilih materi Iqlab tersebut akan ditampilkan yaitu materi Iqlab dan contohnya dengan ada suaranya. Activity Diagram Materi Iqlab dapat dilihat pada gambar 3.7. user sistem melihat materi iqlab menampilkan materi iqlab Gambar 3.7 Activity Diagram Materi Iqlab 5. Activity Diagram Materi Waqaf Jika user akan memilih menu materi seperti Waqaf. Pertama dimulai dengan user membuka aplikasi kemudian memilih didalam menu utama selanjutnya memilih Waqaf. Apabila sudah memilih materi Waqaf tersebut akan ditampilkan yaitu materi Waqaf dan contohnya dengan ada suaranya. Activity Diagram Materi Waqaf dapat dilihat pada gambar 3.8

11 27 user sistem melihat materi waqaf menampilkan materi waqaf Gambar 3.8 Activity Diagram Materi Waqaf 6. Activity Diagram Materi Ikhfa Jika user akan memilih menu materi seperti Ikhfa. Pertama dimulai dengan user membuka aplikasi kemudian memilih didalam menu utama selanjutnya memilih Ikhfa. Apabila sudah memilih materi Ikhfa tersebut akan ditampilkan yaitu materi Ikhfa dan contohnya dengan ada suaranya. Activity Diagram Materi Ikhfa dapat dilihat pada gambar 3.8. user sistem melihat materi ikhfa menampilkan materi ikfa Gambar 3.9 Activity Diagram Materi Ikhfa

12 28 7. Activity Diagram Materi Mad Jika user akan memilih menu materi seperti Mad. Pertama dimulai dengan user membuka aplikasi kemudian memilih didalam menu utama selanjutnya memilih Mad. Apabila sudah memilih materi Mad tersebut akan ditampilkan yaitu materi Mad dan contohnya dengan ada suaranya. Activity Diagram Materi Mad dapat dilihat pada gambar 3.9. user sistem melihat materi mad menampilkan materi mad gambar 3.10 Activity Diagram Materi Mad Sequence Diagram Sequence Diagram ini menggambarkan interaksi antar objek dalam proses penggunaan sistem aplikasi ini. User saat membuka aplikasi akan melihat tampilan 8 menu utama yaitu idhar, idgom, qolqolah, iqlab, waqaf, ikhfa, mad dan latihan. Ketika User memilih menu idhar, idgom, qolqolah, iqlab, waqaf, ikhfa, mad maka akan menampilkan materi-materi tersebut dan contohnya yang berupa suara. Jika memilih menu latihan maka akan ditampilkan latihan yang dikategorikan menurut materi dan terdapat juga latihan campuran yang berisi latihan dari semua materi yang ada.

13 29 1. Sequence Diagram Idhar Pada Sequence ini dijelaskan hubungan user yang terjadi pada menu idhar. User saat membuka menu idhar akan melihat tampilan materi idhar yang berupa teks dan contoh gambar. Ketika User memilih salah satu contoh maka akan berbunyi suara. : User : view : control h_idharr() : model Materi Idhar gambar 3.11 Sequence Diagram Diagram Materi Idhar 2. Sequence Diagram Iqlab Pada Sequence ini dijelaskan hubungan user yang terjadi pada menu Iqlab. User saat membuka menu idhar akan melihat tampilan materi Iqlab yang berupa teks dan contoh gambar. Ketika User memilih salah satu contoh maka akan berbunyi suara. Seperti terlihat pada gambar 3.11.

14 30 : User : view : control h_iqlab() : model Materi Iqlab gambar 3.12 Sequence Diagram Materi Iqlab 3. Sequence Diagram Ikhfa Pada Sequence ini dijelaskan hubungan user yang terjadi pada menu Ikhfa. User saat membuka menu Ikhfa akan melihat tampilan materi Ikhfa yang berupa teks dan contoh gambar. Ketika User memilih salah satu contoh maka akan berbunyi suara. Seperti terlihat pada gambar 3.13.

15 31 : User : view : control h_ikhfa() : model Materi Ikhfa gambar 3.13 Sequence Diagram Diagram Materi Ikhfa 4. Sequence Diagram Idghom Pada Sequence ini dijelaskan hubungan user yang terjadi pada menu Idghom. User saat membuka menu Idghom akan melihat tampilan materi Idghom yang berupa teks dan contoh gambar. Ketika User memilih salah satu contoh maka akan berbunyi suara. Seperti terlihat pada gambar 3.14.

16 32 : User : view : control : model h_idghom() Materi Idghom gambar 3.14 Sequence Diagram Materi Idghom 5. Sequence Diagram Qolqolah Pada Sequence ini dijelaskan hubungan user yang terjadi pada menu Qolqolah. User saat membuka menu Qolqolah akan melihat tampilan materi Qolqolah yang berupa teks dan contoh gambar. Ketika User memilih salah satu contoh maka akan berbunyi suara. Seperti terlihat pada gambar 3.15.

17 33 : User : view : control : model h_qolqolah() Materi Qolqolah gambar 3.15 Sequence Diagram Materi Qolqolah 6. Sequence Diagram Waqaf Pada Sequence ini dijelaskan hubungan user yang terjadi pada menu Waqaf. User saat membuka menu Waqaf akan melihat tampilan materi Waqaf yang berupa teks dan contoh gambar. Ketika User memilih salah satu contoh maka akan berbunyi suara. Seperti terlihat pada gambar 3.16.

18 34 : User : view : control h_waqaf() : model Materi Waqaf gambar 3.16 Sequence Diagram Materi Waqaf 7. Sequence Diagram Mad Pada Sequence ini dijelaskan hubungan user yang terjadi pada menu Mad. User saat membuka menu Mad akan melihat tampilan materi Mad yang berupa teks dan contoh gambar. Ketika User memilih salah satu contoh maka akan berbunyi suara. Seperti terlihat pada gambar 3.17.

19 35 : User : view : control h_mad() : model Materi Madf gambar 3.17 Sequence Diagram Materi mad 8. Sequence Diagram Latihan Pada Sequence ini dijelaskan hubungan user yang terjadi pada menu Latihan. User saat membuka menu Latihan akan melihat tampilan kategori Latihan. Ketika User memilih salah satu kategori maka akan langsung menampilkan soal latihannya. Seperti terlihat pada gambar 3.18.

20 36 : User : view : control : model OnClick() getnomor() latihan gambar 3.18 Sequence Diagram Latihan Class Diagram Gambar 3.19 Class diagram aplikasi

21 37 Keterangan : Terdapat item method yaitu Oncreate() yang digunakan untuk menampilkan dan juga Onclick() untuk memilih sedangkan untuk gettext() digunakan untuk memanggil teks untuk ditampilakan dan getimage() untuk memanggil gambar untuk ditampilakan. Pada controller/menu utama terdapat menu yaitu Idhar, iqlab, ikhfa, idghom, qolqolah, waqaf, mad dan latihan Perancangan Interface Pada pembuatan aplikasi membaca Al-Qur an (Tajwid) berbasis android ini diperlukan perancangan interface yang baik sangat mempengaruhi aplikasi yang dibuat, karena user atau pengguna akan melihat dari sisi tampilan ini. Berikut ini adalah perancangan tampilan yang akan dibuat : a. Perancangan Splash Screen Splash Screen adalah suatu kondisi yang digunakan untuk menggambarkan image atau gambar yang muncul pada saat sebuah aplikasi atau program dalam proses loading. Splash Screen ini digunakan pada aplikasi sebagai feedback bahwa aplikasi tersebut masih dalam proses loading. Image dalam Splash Screen ini akan segera menghilang begitu jendela aplikasi utama ini muncul. Perancangan Splash Screen dapat dilihat pada gambar 3.13

22 38 Gambar 3.20 Perancangan Splash Screen b. Perancangan Menu Utama Ketika masuk aplikasi pembelajaran membaca alqur an (Tajwid) maka akan ditampilkan menu utama yaitu button yang menampilkan judul materi yang telah di pilih. Gambar 3.21 Perancangan Menu Utama

23 39 c. Perancangan menu materi Ketika user memilih menu materi yaitu idhar, idgom, qolqolah, iqlab, waqaf, ikhfa atau mad maka akan menampilkan materi yang telah diinginkan oleh user. Isi materi contoh Gambar 3.22 Perancangan Menu Materi

24 40 d. Perancangan menu latihan Halaman ini muncul ketika user memilih untuk latihan yang menampilkan latihan yang disajikan per kategori dan terdapat latihan campuran yang isinya berupa semua dari materi-materi yang disediakan. LATIHAN idhar iqlab Ikhfa qolqolah idghom waqaf mad Gambar 3.23 Perancangan Menu Latihan 3.5 Tahap Uji Coba Pada tahap uji coba dalam terdapat proses yaitu dimana debugging dari apliaksi pembelajaran yang telah dibuat, diuji coba dan diperbaiki apabila terdapat error. Kemudian juga dilakukan pengujian untuk mengetahui spesifikasi hardware minimum dengan menguji aplikasi pada beberapa device tertentu dengan platform android, serta pengujian terhadap user untuk mengetahui respon mengenai aplikasi yang dibuat. Sehingga nantinya akan didapatkan hasil yang telah sesuai dengan yang diharapkan dan penulis dapat mengetahui spesifikasi yang tepat mengenai aplikasi pembelajaran tajwid berbasis android ini.