32 3.1 Analisis
Pada tahap ini penulis akan menganalisa apa saja yang dibutuhkan oleh sistem dalam pembuatan perangkat lunak. Karena dengan analisis penulis dapat mengetahui apa saja yang dibutuhkan oleh sistem dalam pembuatan perangkat lunak.
Dizaman sekarang orang-orang lebih senang menggunakan komputer untuk segala aktivitasnya bahkan anak-anak yang masih berusia sekitar 6 sampai 8 tahun keatas sudah bisa mengoperasikan komputer. Semakin banyaknya pengguna komputer menjadi alasan utama penulis berkeinginan membuat aplikasi pembelajaran baca iqro’ berbasis multimedia., karena dengan adanya aplikasi tersebut bisa digunakan untuk membantu pembelajaran baca iqro’. Aplikasi tersebut dibuat menggunakan Adobe Flash CS3. Aplikasi yang dibuat adalah aplikasi yang bisa digunakan untuk menambah pembelajaran secara individu atau mandiri agar siswa mudah mengerti dalam pembelajaran. Aplikasi yang dibuat hendaknya menarik dan tidak membosankan agar siswa atau anak senang memakainya.
Dalam pembuatan perangkat lunak ini penulis menganalisa komponen dari sistem yang dibangun atau dibuat diantaranya adalah sebagai berikut:
1. Perangkat lunak, yaitu aplikasi pembelajaran baca iqro’ berbasis multimedia
2. Perangkat keras, yaitu komputer
4. Prosedur yaitu langkah-langkah yang mendefinisikan tentang penggunaan sistem.
Dari keseluruhan komponen sistem yang dibangun, maka didapat masukan, proses dan keluaran yaitu:
1. Pada proses pembuatan huruf iqro’.Gambar disimpan terlebih dahulu ke dalam direktori file penyimpanan gambar sebagai masukan kemudian dalam tahap proses, terjadi pengambilan gambar tersebut dari direktori berkas penyimpanannya dan langsung tereksekusi kemudian muncul pada layar sebagai keluaran.
2. Pada proses pengambilan suara. Suara berformat “.wav” dan “.mp3” disimpan ke dalam direktori berkas penyimpanan suara sebagai masukan kemudian dalam tahap proses terjadi pengaturan sewaktu gambar atau teks keluar lalu suara tereksekusi kemudian munculah keluaran berupa bunyi. 3. Pada proses penilaian, pertanyaan dan jawaban dibuat kemudian diproses
oleh sistem, pada proses ini penulis mempunyai sepuluh pertanyaan satu pertanyaan bernilai “1”, siswa (user) menjawab pertanyaan yang ada kemudian terjadi pencocokan jawaban, jika jawaban benar maka nilai “1” jika salah maka nilai “0” dan jumlah seluruh nilai dari seluruh pertanyaan sebagai keluaran.
3.2 Konsep
Aplikasi pembelajaran baca iqro’ berbasis multimedia ini merupakan aplikasi yang dibuat untuk digunakan oleh anak 6 tahun keatas atau anak yang sudah berumur membaca dan menulis. Aplikasi ini dirancang menggunakan metode pengembangan multimedia dilakukan melalui 6 tahap yaitu konsep, perancangan, pengumpulan material, pembuatan, pengujian dan distribusi. Aplikasi ini menggunakan teks untuk pembelajaran dan penjelasan, suara sebagai pembelajaran pelafalan, gambar sebagai pembelajaran, dan animasi supaya pengguna tidak bosan.
Berikut penjelasan secara rinci mengenai konsep dasar dari rancang bangun aplikasi pembelajaran baca iqro 1-6 berbasis multimedia, yaitu:
1. Aplikasi ini mempunyai menu yang bisa digunakan untuk memilih menu pengenalan huruf hijiayah, menu pemilihan iqro’ yaitu kita dapat memilih iqro’ berapa yang ingin kita pelajari, dan menu ujian dalam bentuk pilihan ganda.
2. Materi digunakan untuk mengenal dan mempelajari huruf-huruf hijayah, contoh-contoh huruf yang ada didalam iqro’ 1 sampai 6, disertakan tulisan agar pengguna mahir dalam pengucapan.
3. Pada menu latihan berisi pengujian yang digunakan untuk mengasah pembelajaran yang ada pada halaman materi, pada halaman materi penulis membuat sebuah tombol untuk masuk ke halaman latihan, dibagian halaman latihan penulis membuat pertanyaan pilihan ganda disetiap iqro’.
4. Pada menu ujian berisi test dan hasil belajar, pertanyaan yang diajukan 20 pertanyaan yang berupa pilihan ganda. Tahap ini dilakukan untuk mengetahui bagaimana hasil belajar kita ditampilkan dalam bentuk nilai atau skor.
Aplikasi ini juga dimaksudkan untuk menggantikan buku iqro’ menjadi iqro’ digital yang dapat mengurangi penggunaan kertas, dan bisa dijadikan pembelajaran secara mandiri tanda memanggil seorang guru mengaji. Aplikasi ini bisa digunakan pada komputer atau laptop sehingga tidak perlu mengakses internet.
3.3 Perancangan
Dalam hal ini penulis akan melakukan perancangan aplikasi yang terdiri dari perancangan use case diagram, perancangan activity diagram, dan perancangan sequence diagram.
3.3.1 Perancangan Aplikasi
Use case mendeskripsikan interaksi tipikal antara para pengguna sistem dengan sistem itu sendiri, dengan memberi sebuah narasi tentang bagaimana sistem tersebut digunakan. Use case diagram mengambarkan fungsionaliatas yang diharapkan dari suatu sistem, yang ditekankan adalah “apa” yang diperbuat sistem dan bukan “bagaimana” sebuah use case mempresentasikan sebuah interaksi antara aktor dengan sistem. Use case mengambarkan kata kerja seperti Login ke sistem, maintenance user dan sebagainya. Dalam bahasan use case, para pengguna disebut sebagai aktor. Seorang (aktor) merupakan sebuah peran penting dalam kaitannya dengan sistem untuk melakukan pekerjaan atau aktivitas tertentu. Use case diagram dapat sangat membantu bila kita sedang menyusun requirement sebuah sistem, mengkomunikasikan rancangan dengan klien, dan merancang test case untuk semua feature yang ada pada sistem.
Pada aplikasi pembelajaran baca iqro’ dapat diketahui bahwa aktor tersebut adalah pengguna. Maka didapatkan suatu Use case diagram dan beberapa skenario yang memperlihatkan interaksi-interaksi Use case diagram dengan aktor Use case diagram dari apliaksi pembelajaran baca iqro’ dapat dilihat pada Gambar 3.1 berikut:
Actor1 Memilih materi iqro' Memelih pengenalan huruf hijaiyah Memilih about Memilih iqro' 1-6 Melihat about
Memilih latihan Menjawab pertanyaan Memilh ujian
kenaikan level iqro'
«extends» «extends» «extends» «extends» Menjawab pertanyaan «extends» «extends»
Gambar use case diagram diatas mempresentasikan aplikasi pembelajaran baca iqro’.
Berikut penjelasan gambar :
1. Karikatur manusia mangambarkan seorang aktor
2. Gambar lingkaran oval merepresentasikan use case 3. Garis-garis merepresentasikan kardinaliatas.
Pada gambar 3.1 dapat dijelaskan bahawa ada seorang aktor atau pengguna adalah Anak yang sudah berumur 6 tahun ke atas atau anak yang sudah bisa membaca dan menulis. Use case tersebut adalah use case memilih menu pengenalan huruf hijaiyah, use case memilih materi iqro, use case iqro’ 1, use case latihan, use case latihan, use case menjawab pertanyaan pilihan ganda, use case iqro’ 2, use case iqro’ 3, use case iqro’ 4, use case iqro’5, use case iqro’ 6, use case memilih ujian, use case menjawab pertanyaan, use case memilih about. Berikut adalah table yang berisi penjelasan dari masing-masing use case, yang dapat di lihat pada tabel 3.1, tabel 3.2, tabel 3.3, tabel 3.4, tabel 3.5, tabel 3.6, tabel 3.7
Tabel 3.1 use case pengenalan huruf hijaiyah
Nama Use case Pengenalan huruf hijaiyah
Deskripsi singkat Use case ini memungkinkan pengguna untuk mempelajari dasar dari huruf Hijaiyah.
Aktor Anak yang sudah berumur 6 tahun ke atas atau anak yang sudah bisa membaca dan menulis. Pra kondisi Disarankan terinstal perangkat lunak Adobe Flash
CS3 di PC atau laptop dan mempunyai perangkat lunak dari aplikasi pembelajaran tersebut.
Tindakan Utama - Sistem menampilkan menu utama - Pengguna memilih menu Hijaiyah - Tampil pembelajaran huruf Hijaiyah
Tabel 3.1 use case pengenalan huruf hijaiyah (lanjutan) Nama Use case Pengenalan huruf hijaiyah Tindakan Alternatif
-Pasca Kondisi Pengguna dapat mengetahui bentuk huruf hijaiyah dan bagaimana cara mengucapkannya
Tabel 3.2 use case memilih materi iqro’
Nama Use case Latihan pengenalan huruf hijaiyah
Deskripsi singkat Use case ini memungkinkan pengguna untuk memilih materi iqro’ yang diinginkan.
Aktor Anak yang sudah berumur 6 tahun ke atas atau anak yang sudah bisa membaca dan menulis.
Pra kondisi Disarankan terinstal perangkat lunak Adobe Flash CS3 di PC atau laptop dan mempunyai perangkat lunak dari aplikasi pembelajaran tersebut.
Tindakan Utama - sistem menampilkan menu utama - pengguna memilih menu materi iqro’ - sistem menampilkan menu pemilihan iqro’ - pengguna memilih iqro’ yang diinginkan
Tindakan alternatif
Tabel 3.3 use case memilh iqro’ 1 - 6
Nama Use case Menjawab pertanyaan tebak suara
Deskripsi singkat Use case ini memungkinkan pengguna untuk mempelajari materi.
Aktor Anak yang sudah berumur 6 tahun ke atas atau anak yang sudah bisa membaca dan menulis.
Pra kondisi Disarankan terinstal perangkat lunak Adobe Flash CS3 di PC atau laptop dan mempunyai perangkat lunak dari aplikasi pembelajaran tersebut.
Tindakan Utama - sistem menampilkan menu utama - pengguna memilih iqro’ 1 - 6
- sistem menampilkan materi yang ada diiqro’ 1 - 6
- pengguna mempelajari materi
Tindakan alternatif
-Pasca Kondisi - Pengguna akan latihan menjawab soal pilihan ganda.
- Pengguna akan ujian kenaikan level iqro’
Tabel 3.4 use case memilih latihan
Nama Use case Pengenalan kosakata bahasa Arab
Deskripsi singkat Use case ini memungkinkan pengguna menjawab latihan.
Aktor Anak yang sudah berumur 6 tahun ke atas atau anak yang sudah bisa membaca dan menulis.
Pra kondisi Disarankan terinstal perangkat lunak Adobe Flash CS3 di PC atau laptop dan mempunyai perangkat lunak dari aplikasi pembelajaran tersebut.
Tabel 3.4 use case memilih latihan(lanjutan)
Nama Use case Pengenalan kosakata bahasa Arab Tindakan Utama - sistem menampilkan menu utama
- pengguna memilih menu latihan - sistem menampilkan soal-sool latihan - pengguna menjawab pertanyaan Tindakan alternatif
-Pasca kondisi Pengguna akan menjawab pertanyaan pilihan ganda
Tabel 3.5 use case menjawab pertanyaan pilihan ganda
Nama Use case Latihan pengenalan kosakata bahasa Arab Deskripsi singkat Use case ini memungkinkan pengguna untuk
menjawab pertanyaan berupa pilihan ganda. Aktor Anak yang sudah berumur 6 tahun ke atas atau
anak yang sudah bisa membaca dan menulis.
Pra kondisi Disarankan terinstal perangkat lunak Adobe Flash CS3 di PC atau laptop dan mempunyai perangkat lunak dari aplikasi pembelajaran tersebut.
Tindakan Utama - sistem menampilkan menu utama - pengguna memilih menu
- sistem menampilkan menu latihan - pengguna menjawab pertanyaan Tindakan alternatif
-Pasca Kondisi Pengguna akan menjawab pertanyaan dari menu latihan berupa pilihan ganda dan mengetahui nilai yang didapat oleh pengguna
Tabel 3.6 use case memilih ujian kenaikan level iqro’ 1-6
Nama Use case Latihan menjawab pertanyaan tebak gambar Deskripsi singkat Use case ini memungkinkan pengguna untuk
menjawab pertanyaan berupa pilihan ganda.
Aktor Anak yang sudah berumur 6 tahun ke atas atau anak yang sudah bisa membaca dan menulis. Pra kondisi Disarankan terinstal perangkat lunak Adobe Flash
CS3 di PC atau laptop dan mempunyai perangkat lunak dari aplikasi pembelajaran tersebut.
Tindakan Utama - sistem menampilkan menu utama - pengguna memilih menu ujian - sistem menampilkan ujian - pengguna menjawab latihan soal
Tindakan alternatif
-Pasca Kondisi Pengguna akan menjawab pertanyaan pilihan ganda dan mendapatkan laporan kenaikan level iqro’
Tabel 3.7 use case memilih about
Nama Use case Pengenalan angka dan nama hari bahasa Arab Deskripsi singkat Use case ini memungkinkan pengguna untuk bisa
melihan pembuat aplikasi
Aktor Anak yang sudah berumur 6 tahun ke atas atau anak yang sudah bisa membaca dan menulis. Pra kondisi Disarankan terinstal perangkat lunak Adobe Flash
CS3 di PC atau laptop dan mempunyai perangkat lunak dari aplikasi pembelajaran tersebut.
Tindakan Utama - sistem menampilkan menu utama - pengguna memilih menu about - sistem menampilkan about Tindakan alternatif
-Tabel 3.7 use case memilih about(lanjutan)
Nama Use case Pengenalan angka dan nama hari bahasa Arab Deskripsi singkat Use case ini memungkinkan pengguna untuk bisa
melihan pembuat aplikasi
3.3.2 Perancangan activity diagram
Activity diagram adalah teknik untuk menggambarkan logika procedural, proses bisnis, dan jalur kerja. Dalam beberapa hal, diagram ini memainkan peran mirip sebuah diagram alir, tetapi perbedaan prinsip antar diagram ini dan notasi diagram alir adalah diagram ini mendukung behavior parallel. (Fowler, 2005)
Activity diagrams menggambarkan berbagai alir aktivitas dalam sistem yang sedang dirancang, bagaimana masing-masing alir berawal, decision yang mungkin terjadi, dan bagaimana mereka berakhir.
1. Perancangan Activity Diagram Pengenalan Huruf Hijaiyah Pengguna Sistem
Memilih pengenalan huruf hijaiyah
Memilih salah satu huruf hijaiyah
Menampilkan halaman huruf hijaiyah
Menampilkan suara sesuai huruf yang dipilih
Pada gambar 3.2 diatas menjelaskan bahwa aktifitas terjadi setelah pengguna menjalankan aplikasi setelah itu memilih pengenalan huruf hijaiyah, setelah itu sistem menampilkan huruf hijayah, lalu pengguna memilih salalah satu huruf hijah, dan sistem mengeluarkan suara huruf yang dipilih
2. Perancangan Activity Memilih materi iqro’
Pengguna Sistem
Memilih materi iqro'
Menampilkan menu iqro' 1
Menampilkan menu iqro' 2
Menampilkan menu iqro' 3 Menampilkan menu iqro' 4 Menampilkan menu iqro' 5 Menampilkan menu iqro' 6
Memilih salah satu menu iqro' Menampilkan menu yang dipilih
Gambar 3.3 Actifity diagram Memilih materi iqro’
Pada gambar 3.3 diatas menjelaskan bahwa aktifitas terjadi setelah pengguna memilih menu materi iqro, lalu sistem menampilkan pilhan menu materi iqro’ 1 sampai 6, setelah pengguna memilih salah satu menu materi iqro sistem menampilkan menu yang telah dipilih.
3. Perancangan Activity Diagram Memilih Iqro’ Pengguna Sistem
Memilih iqro
Menampilkan menu materi iqro'
Menampilka halaman iqro'
Memilih lembar selanjutya
Memilih lembar sebelumnya
Memilih latihan
Menampilkan yang dipilih
Gambar 3.4 Actifity diagram Memilih Iqro’
Pada gambar 3.4 diatas menjelaskan bahwa aktifitas terjadi setelah sistem manampilkan menu materi iqro’ kemudian pengguna memilih dapat memilih lembar selanjutnya, memilih lembar sebelumnya atau memilih menu latihan kemudian sistem akan menampilkan menu yang dipilih oleh pengguna.
4. Perancangan Activity Diagram Memilih latihan Pengguna Sistem
Memilih Latihan
Menampilkan halaman latihan
Menampilkan soal Menjawab latihan
Tampilan notifikasi jawaban Benar Tampilan notifikasi jawab Salah Benar/Salah
Soal=10
Menampilkan nilai Menampilkan menu utama
Mengecek jawaban
Tidak Benar Salah
Menyimpan jawaban
Memilih menu utama
Menampilkan menu utama
Gambar 3.5 Activity diagram memilih latihan
Pada gambar 3.5 diatas menjelaskan bahwa aktifitas terjadi setelah pengguna memilih menu latihan, lalu sistem menampilkan pertanyaan pilihan ganda, setelah itu pengguna menjawab pertanyaan dari no 1 sampai 10,bila pengguna menjawab salah akan muncul notifikasi jawaban salah dan bila pengguna menjawab benar mucuk notifikasi jawaban benar setelah soal sama dengan 10 sistem menampilkan nilai atau skor yang didapatkan oleh pengguna dan
menampilkan menu kembali kemenu utama, lalu pengguna memilih menu utama, dan sistem menampilkan menu utama
5. Perancangan Activity Diagram Memilih ujian Pengguna Sistem
Memilih Ujian
Menampilkan halaman ujian
Random soal
Menampilkan soal Menjawab ujian
Menyimpan jawaban
Tampilan notifikasi belum menjawab Iya/tidak
Soal=20
Jawaban benar ≥ 16
Notifikasi lulus
Notifikasi mau ujian lagi
Ya/tidak Mengecek jawaban Ya Tidak Iya Tidak Tidak Ya Ya Tidak
Gambar 3.6 Actifity diagram Memilih ujian
Pada gambar 3.6 diatas menjelaskan bahwa aktifitas terjadi setelah pengguna memilih menu ujian, lalu sistem menampilkan
halaman ujian setelah itu sistem mengacak soal, setelah itu sistem menampilkan soal berupa pertanyaan pilihan ganda 1-20 dan pengguna menjawab soal ujian tersebut, setelah itu sistem mengecek jawaban pengguna bila jawaban belum diisi tampil notifikasi belum menjawab jika jawaba sudah ada sistem menyimpan jawaban tersebut dan menampilkan soal selanjutnya, soal berjumlah 20, jika jawab benar lebih besar atau sama dengan 16 maka pengguna akan mendapakan notifikasi lulus jika tidak sistem menampilkan notifikasi tidak lulus dan memberi pilihan untuk ujian lagi atau tidak jika iya sistem akan menampilkan halaman soal dari awal.
6. Perancangan ActivityDiagram Menjawab Pertanyaan Pengguna Sistem Memilih jawaban A Memilih jawaban B Memilih jawaban C Menampilkan pertanyaan Menyiapkan jawaban Menampilkan hasil
Gambar 3.7 Actifity diagram Menjawab pertanyaan
Pada gambar 3.7 diatas menjelaskan bahwa aktifitas terjadi setelah sistem manampilkan menu pertanyaan berupa pilihan ganda kemudian pengguna memilih jawaban A, jawaban B, atau jawaban C.
Setelah itu sistem akan mengoreksi hasil jawaban pengguna, dan sistem menampilkan hasil yang didapat oleh pengguna.
7. Perancangan Activity Diagram Menu About
Pengguna Sistem
Memilih About
Menampilkan halaman about
Menampilkan kemenu utama
Memilih menu utama
Menampilkan menu utama
Gambar 3.8 Activity diagram Menampilkan About Pada gambar 3.8 diatas menjelaskan bahwa aktifitas terjadi setelah pengguna memilih menu about, lalu sistem menampilkan halaman about, setelah itu terdapat pula tombol kembali kemenu utama yang berfungsi untuk kembali kemenu utama, setelah pengguna memilih menu utama, sistem menampilkan menu utama
3.3.3 Perancangan sequence diagram
Sequence diagram digunakan untuk mengambarkan perilaku pada sebuah skenario. Diagram ini menunjukan sejumlah contoh objek dan message (pesan) yang diletakan diantara obyek-obyek ini di dalam use case.
Sequence diagram menggambarkan interaksi antar objek di dalam dan disekitar sistem (termasuk pengguna, display, dan sebagainya) berupa pesan yang digambarkan terhadap waktu. Sequence diagram terdiri atas dimensi waktu dan objek-objek yang terkait. Sequence diagram biasa digunakan untuk menggambarkan skenario atau rangkaian langkah-langkah yang dilakukan sebagai respons dari sebuah event untuk menghasilkan keluaran tertentu.Dari bentuk use case yang telah digambarkan diatas hanya satu aktor yang akan dibuat sequence diagram sesuai dengan use case yang telah dibuat sebelumnya.
Pengguna aplikasi Menu utama Menu Pengenalan huruf
hidayah Huruf - huruf hijayah
Memilih pengenalan huruf hujayah Menjalankan aplikasi
Memilih huruf hijayah
Gambar 3.9 Sequence diagram Pengenalan huruf hijaiyah
Pada sequence diagram pengenalan huruf hijaiyah dapat diketahui bahwa kegiatan yang pertama kali terjadi adalah pengguna membuka aplikasi lalu memilih menu pengenalan huruf hijaiyah, di halaman pengenalan huruf hijaiyah pengguna bisa memilih huruf hijayah dari alif sampai ya
Pengguna aplikasi Menu iqro' Iqro' 1 Iqro' 2
Memilih iqro' 1 Memilih menu iqro'
Memilih Iqro' 3 Memilih Iqro' 2
Iqro' 3 Iqro' 4 Iqro' 5 Iqro' 6
Memilih iqro' 4 Memilih iqro' 5
Memilih iqro' 6
Gambar 3.10 Sequence diagram Memilih iqro’
Pada sequence memilih iqro kegiatan yang pertama terjadi adalah pengguna dapat memilih menu untuk mendapatkan materi yang ada di iqro’ 1 sampai iqro’6
Pengguna aplikasi Menu iqro' Menu latihan Menu jawaban
Memilih menu latihan Memilih menu iqro'
Memilih jawaban
Soal = 5
Memilih kembali kemenu utama
Menu utama
Loop
Gambar 3.11 Sequence diagram Latihan menu iqro’
Pada sequence diagram latihan menu iqro’ pengguana sudah memilih satah satu dari menu iqro, kemudian memilih menu latihan, lalu pengguna mejawab 5 soal pilihan ganda, setelah selesai pengguna dapat melihat nilai lalu kembali kemunu utama. Berikut sequence memilih menu ujian
Pengguna aplikasi Menu menu ujian Menu pertanyaan Menu jawaban
Menjawab pertannyaan Memilih menu ujian
Memilih jawaban
Soal = 10
Memilih kembali kemenu utama
Menu utama
Loop
Gambar 3.12 Sequence diagram memilih menu ujian
Pada sequence diagram memilih menu ujian pengguna sudah memilih menu ujian, kemudian pengguna menjawab soal dari no 1 sampai no 10, setelah selesai pengguna bisa melihat nilai atau skor yang mereka dapat dan kembali kemenu utama. Berikut sequence ujian
Pengguna aplikasi Menu latihan Menu pertanyaan Jawaban A Jawaban B Jawaban C
Jawaban C Jawaban B Jawaban A Menjawab pertanyaan
Memilih menu latihan
Gambar 3.13 Sequence diagram menu latihan
Pada sequence diagram latihan kegiatan yang pertama terjadi adalah pengguna memilih menu latihan, setelah tampil menu pertanyaan pengguna menjawab soal dengan cara memilih jawaban A, jawaban B, atau jawaban C
3.3.4 Perancangan antar muka
Pada bagian desain antarmuka (interface desain) ini akan digambarkan mengenai bagian-bagian yang akan ditampilkan pada aplikasi pembelajaran Baca iqro’ berbasis multimedia.
1. Tampilan antar muka menu utama aplikasi
Gambar 3.14 perancangan antarmuka Menu Utamaaplikasi Pada tampilan aplikasi ini terdapat 4 buah tombol yaitu:
Tombol Pengenalan huruf hijaiyah berfungsi untuk masuk kedalam halaman huruf-hurf hijaiyah
Tombol masuk materi iqro’ berfungsi untuk masuk kehalaman menu pemilihan materi materi iqro
Tombol Video berfungsi untuk masuk kedalam halaman video
Tombol keluar berfungsi untuk keluar dari aplikasi Keluar Masuk Materti iqro’ Pengenalan huruf hijaiyah Video
2. Tampilan antarmuka Pengenalan huruf Hijaiyah:
Gambar 3.15 Perancangan antarmuka Huruh hijaiyah
Pada tampilan berikut ini terdapat huruf hijaiyah berupa tombol. Bila pengguna memilih salah satu huruf hijaiyah maka akan keluar out put berupa suara dan tulisan yang diletakkann di pojok kiri bawah, dan Tombol menu utama dipojok kanan yang berfungsi untuk kembali kemenu utama
3. Tampilan antarmuka Menu Memilih Iqro’
Gambar 3.16 Perancangan antarmuka Menu Memilih Iqro’
Pada tampilan Menu memilih iqro terdapat 8 buah tombol. Beriku penjelasan dan fungsi dari tombol tersebut.
Tombol Home berfungsi untuk kembali kemenu utama Tombol Iqro’1 berfungsi untuk masuk kedalam materi
iqro’1 ح خ د ذ ر ج ث ت ب ا ح خ د ذ ر ج ث ت ب ا Out put Menu Utama Iqro’1 Iqro’2 Iqro’3 Iqro’6 Iqro’5 Iqro’4 Home Keluar
Tombol Iqro’2 berfungsi untuk masuk kedalam materi iqro’2
Tombol Iqro’3 berfungsi untuk masuk kedalam materi iqro’3
Tombol keluar berfungsi untuk menutup aplikasi
Tombol Iqro’4 berfungsi untuk masuk kedalam materi iqro’4
Tombol Iqro’5 berfungsi untuk masuk kedalam materi iqro’5
Tombol Iqro’6 berfungsi untuk masuk kedalam materi iqro’6
4. Tampilan antarmuka menu materi iqro’1-6
Gambar 3.17 Perancangan antar menu materi iqro’
Pada tampilan materi iqro’ ini sebuah buku yang terdapat ditengah halaman dan didalamnya terdapat materi materi iqro’ yang menjadi sebuah tombol,bila tombol tersebut ditekan maka akan keluar
Huruf huruf (Materi) Yang ada di iqro Out put Next Kembali Home Latihan Ujian
out put berupa suara dan tulisan latin yang diletakkan diatas buku, Dimenu ini juga terdapat bermacam2 tombol. Berikut penjelasaanya:
Tombol next berfungsi untuk lanjut kemateri beriku, Tombol kembali berfungsi untuk kembali kemateri
sebelumnya,
Tombol latihan berfungsi untuk masuk kedalam halaman latihan
Tombol ujian berfungsi untuk masuk kedalam halaman ujian
Tombol Hame berfungsi untuk kembali kemenu utama 5. Tampilan antarmuka Latihan
Gambar 3.18 Perancangan antarmuka menjawab Latihan
Pada tampilan halaman latihan ini terdapat soal yang terdiri dari 10 soal, pengguna menjawab pertanyaan yang berupa pilihan ganda, jawaban tersebut berupa tombol yaitu jawaban A, jawaban B, dan jawaban C. Setelah menjawab pengguna dapat melihat skor yang didapat. Di halaman ini pula terdapat satu tombol yaitu tombol materi yang berfungsi untuk kembali kehalaman materi yang telah dipelajari
Judul Soal Jawaban A A Jawaban B A Jawaban C A Skor Materi
6. Perancangan antar muka menjawab ujian
Gambar 3.19 Perancangan antar muka menjawab ujian
Pada tampilan halaman ujian ini terdapat soal yang terdiri dari 25 soal berupa pilihan ganda, tetapi hanya 20 soal yang harus dijawab oleh pengguna secara acak (random). Pengguna menjawab soal dengan cara memilih Jawaban A,Jawaban B,atau Jawaban C lalu muncul out put jawaban yang telah dipilih dipojok bawah kiri, jawaban yang telah dipilih bias diganti sebelum pengguna memilih menu lanjut soal, menu lanjut soal berfungsi untuk maju kesoal berikut,dan berfungsi juga untuk mengacak (random) soal supaya soal yang keluar selalu berbeda-beda.
Judul Soal Jawaban A A Jawaban B A Jawaban C A Lanjut soal Out put jawaban
7. Perancangan antar muka pemberitahuan lulus ujian
Gambar 3.20 Perancangan antar muka lulus ujian
Pada tampilan halaman permberitahuan lulus ujian ini terdapat pemberi tahuan bahwa pengguna telah lulus ujian dan mendapatkan nilai lebih tinggi atau sama dengan 8, pada halaman ini juga terdapat beberapa tombul,berikut ini penjelasan dan fungsi dari tombol-tombolnya:
Tombol Halaman Utama berfungsi untuk kembali kehalaman utama
Tombol kembali kemateri iqro’ berfungsi untuk kembali kehalama materi yang sudah dipelajari
Tombol materi iqro selanjutnya berfungsi untuk masuk kedalam halaman materi iqro’ yang levelnya lebih tinggi
Pemberi tahuan lulus ujian
Out put nilai ujian yang didapat Materi iqro’ selanjutnya Halaman Utama Kembali kemateri iqro’
8. Tampilan antarmuka tidak lulus ujian
Gambar 3.21 Perancangan antar mukan tidak lulus ujian Pada tampilan halaman permberitahuan tidak lulus ujian ini terdapat pemberi tahuan bahwa pengguna belum lulus ujian dan mendapatkan nilai lebih tinggi atau sama dengan 7,5, pada halaman ini juga terdapat beberapa tombul,berikut ini penjelasan dan fungsi dari tombol-tombolnya:
Tombol halaman utama berfungsi untuk kembali kehalaman utama
Tombol kembali kemateri iqro’ berfungsi untuk kembali mengulang pelajaran materi iqro’
Pemberi tahuan Tidak lulus ujian
Out put nilai ujian yang didapat Halaman Utama Kembali kemateri iqro’
