commit to user 17 BAB III
ANALISA KEBUTUHAN DAN PERANCANGAN SISTEM
3.1 Alat dan Bahan 3.1.1 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 :
3.1.1.1 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.
3.1.1.2 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 2.0.5
4. Perancangan Sistem : Rational Rose Enterprise Edition.
5. Pemrograman Aplikasi : Android Development Tools (ADT) v22.3.0- 887826.
6. Tipe Sistem Operasi Android (Smart Phone): Ice Cream Sandwich 4.4.2
commit to user 3.1.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 hukum- hukum tajwid.
3.2 Tahap Pembuatan Aplikasi
Skema penelitiannya yang dilakukan untuk proses membuat aplikasi tajwid berbasis android alur proses pembuatanya sebagai berikut :
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 :
Analisis Perancangan Implementasi
dan ujicoba
commit to user
Tabel 3.1 Analisa aplikasi
1. Nama Belajar Tajwid
Gambar
kelebihan Menyajikan materi per hukum bacaan, contoh berupa gambar dan 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.
commit to user
kekurangan Tidak ada contoh membaca yang salah dikeseluruhan, tampilan monoton/sederhana, kurang menjelaskan pada tajwid, tidak ada latihan
3. Nama Belajar tajwid
Gambar
kelebihan Menyajikan materi tajwid secara komplit, menyajikan contoh- contoh dengan menggunakan gambar dan suara.
kekurangan Tidak ada latihan, tidak disajikan contoh salah dalam membaca tajwid.
3.4 Perancangan Sistem 3.4.1 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
commit to user
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.
3.4.2 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.
3.4.3 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
commit to user
Melihat Materi Idhar
Melakukan Latihan Tajwid Melihat Materi iqlab
Melihat Matei Ikhfa
Melihat Materi Qolqolah
Melihat Materi Idghom
Melihat Materi Waqaf user
Melihat Materi Mad
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
commit to user
Aktor : User/pengguna
User dapat memilih menu materi yaitu idhar, idgom, qolqolah, iqlab, waqaf, ikhfa, mad.
Use Case : Memilih Latihan
Aktor : User/pengguna
User dapat memilih menu latihan yang berisi latihan menurut kategori masing- masing materi antara lain makhroj, idhar, idgom, qolqolah, iqlab, waqaf, ikhfa, mad.
Dan terdapat pula campuran yang mensajikan latihan campuran.
3.4.4 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.
commit to user 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.
melihat materi idhar
menampilkan materi idhar
sistem user
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
commit to user
melihat materi idgom
menampilkan materi idgom
sistem user
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.
melihat materi qolqolah
menampilkan materi qolqolah
sistem user
Gambar 3.6 Activity Diagram Materi Qolqolah
commit to user 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.
melihat materi iqlab
menampilkan materi iqlab
sistem user
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
commit to user melihat materi
waqaf
menampilkan materi waqaf
sistem user
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.
melihat materi ikhfa
menampilkan materi ikfa
sistem user
Gambar 3.9 Activity Diagram Materi Ikhfa
commit to user 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.
melihat materi mad
menampilkan materi mad
sistem user
gambar 3.10 Activity Diagram Materi Mad
3.4.5 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.
commit to user 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
Materi Idhar : model
OnCreate()
OnClickListener()
h_idharr() OnClickListener()
OnCreate()
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.
commit to user
: User : view : control
Materi Iqlab : model
OnCreate()
OnClickListener()
h_iqlab() OnClickListener()
OnCreate()
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.
commit to user
: User : view : control
Materi Ikhfa : model
OnCreate()
OnClickListener()
h_ikhfa() OnClickListener()
OnCreate()
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.
commit to user
: User : view : control
Materi Idghom : model
OnCreate()
OnClickListener()
h_idghom() OnClickListener()
OnCreate()
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.
commit to user
: User : view : control
Materi Qolqolah : model
OnCreate()
OnClickListener()
h_qolqolah() OnClickListener()
OnCreate()
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.
commit to user
: User : view : control
Materi Waqaf : model OnCreate()
OnClickListener()
h_waqaf() OnClickListener()
OnCreate()
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.
commit to user
: User : view : control
Materi Madf : model
OnCreate()
OnClickListener()
h_mad() OnClickListener()
OnCreate()
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.
commit to user
: User : view : control
latihan : model
OnCreate()
OnClickListener()
getNomor() OnClick()
OnCreate()
gambar 3.18 Sequence Diagram Latihan
3.4.6 Class Diagram
Gambar 3.19 Class diagram aplikasi
commit to user 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
3.4.7 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
commit to user
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
commit to user 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.
Gambar 3.22 Perancangan Menu Materi
Isi materi
contoh
commit to user 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.
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.
LATIHAN
waqaf iqlab
mad idghom qolqolah
idhar
Ikhfa’
