BAB III ANALISA DAN PERANCANGAN

Transkripsi

1 BAB III ANALISA DAN PERANCANGAN Seperti yang telah dijelaskan pada bab sebelumnya, pada bab ini akan dijelaskan tentang perencanaan dan langkah pembuatan dari aplikasi, dari mulai langkah-langkah awal analisa sampai kepada perancangan aplikasi. 3.1 Analisa Pada tahap analisa dan perancangan sistem ini diperlukan tahapan sistematis agar aplikasi yang akan dibuat sesuai dengan kegunaan dan tujuannya, salah satunya adalah menggunakan flowchart. Proses analisis merupakan salah satu tahapan yang harus dilalui rekayasa perangkat lunak karena melalui analisis definisi masalah menjadi lebih jelas, tahap perancangan dimulai dengan melakukan perancangan sistem dan perancangan antarmuka yang akan digunakan untuk diterapkan pada aplikasi. Kebutuhan sistem dapat dispesifikasi sehingga kriteria yang harus dipenuhi sistem dapat ditentukan agar sistem yang dihasilkan nantinya menjadi solusi dari masalah tersebut Flowchart Menu Utama MULAI TAMPIL MENU UTAMA PILIH MENU PILIH DAFTAR DOA 1 PILIH PETUNJUK PETUNJUK APLIKASI PILIH TENTANG TENTANG APLIKASI SELESAI Gambar 3.1 Flowchart Menu Utama 26

2 1.1.2 Flowchart Menu Daftar Doa 1 2 PILIH DOA 1 DOA 1 PILIH DOA 11 DOA 11 PILIH DOA 2 PILIH DOA 3 DOA 2 DOA 3 PILIH DOA 12 PILIH DOA 13 DOA 12 DOA 13 PILIH DOA 4 DOA 4 PILIH DOA 14 DOA 14 PILIH DOA 5 DOA 5 PILIH DOA 15 DOA 15 PILIH DOA 6 DOA 6 PILIH DOA 16 DOA 16 PILIH DOA 7 DOA 7 PILIH DOA 17 DOA 17 PILIH DOA 8 DOA 8 PILIH DOA 18 DOA 18 PILIH DOA 9 DOA 9 PILIH DOA 19 DOA 19 PILIH DOA 10 DOA 10 PILIH DOA 20 DOA 20 2 SELESAI Gambar 3.2 Flowchart Menu Daftar Doa 27

3 3.2 Pemodelan Struktur Navigasi Struktur navigasi adalah urutan alur informasi dari suatu aplikasi multimedia. Dengan menggunakan struktur navigasi yang tepat maka suatu aplikasi mutimedia mempunyai suatu pedoman dan arah informasi yang jelas. Dalam pembuatan aplikasi multimedia penulis menggunakan struktur navigasi, Struktur navigasi yang digunakan pada aplikasi ini adalah struktur navigasi Hierarchi. Penjelasan secara garis besar. Tampilan awal aplikasi dimulai pada menu utama, di menu utama terdapat 3 pilihan yaitu Daftar Doa, Petunjuk, dan Tentang. Setelah user memilih salah satu dari 3 pilihan tersebut maka aplikasi akan menampilkan layar yang dipilih oleh user, misal user memilih Daftar Doa maka aplikasi menampilkan daftar doa harian muslim, kemudian user memilih doa yang ingin dilihat, untuk kembali ke menu utama user cukup tekan tombol back. Sedangkan jika user ingin keluar dari aplikasi cukup dengan menyentuh tombol back pada smartphone-nya dan otomatis user keluar dari aplikasi. Berikut struktur navigasi Hierarchi pada aplikasi ini dilihat pada gambar dibawah ini. 28

4 MENU UTAMA DAFTAR DOA PETUNJUK TENTANG ISI DOA 1 DOA 1 ISI PETUNJUK APLIKASI ISI TENTANG APLIKASI ISI DOA 2 DOA 2 ISI DOA 3 DOA 3 ISI DOA 4 DOA 4 ISI DOA 5 DOA 5 ISI DOA 6 DOA 6 ISI DOA 7 DOA 7 ISI DOA 8 DOA 8 ISI DOA 9 DOA 9 ISI DOA 10 DOA 10 ISI DOA 11 DOA 11 ISI DOA 12 DOA 12 ISI DOA 13 DOA 13 ISI DOA 14 DOA 14 ISI DOA 15 DOA 15 ISI DOA 16 DOA 16 ISI DOA 17 DOA 17 ISI DOA 18 DOA 18 ISI DOA 19 DOA 19 ISI DOA 20 DOA 20 Gambar 3.3 Pemodelan Struktur Navigasi 29

5 3.3 Rancangan Storyboard Aplikasi Doa Harian Muslim Setiap halaman yang ada dirancangan aplikasi doa harian muslim ini saling terhubung satu sama lain. Sub-sub halaman dari opsi menu utama hanya dapat diakses melalui subsub halaman menu masuk. Pada saat user mengakses menu Daftar Doa, Petunjuk Aplikasi dan Tentang Aplikasi maka aplikasi akan menampilkan layout halaman tersebut dan halaman tersebut hanya terhubung dengan Menu Utama APLIKASI DOA HARIAN MUSLIM DOA SEBELUM TIDUR APLIKASI DOA HARIAN MUSLIM DOA SEBELUM TIDUR DOA SUSAH TIDUR DOA BANGUN TIDUR DOA BANGUN TIDUR DAFTAR DOA TENTANG APLIKASI PETUNJUK APLIKASI PETUNJUK TENTANG TEKS TEKS Gambar 3.4 Storyboard Aplikasi Doa Harian Muslim 30

6 3.4 Rancangan Storyline Menu Utama Tabel 3.1 Storyline Menu Utama Rancangan Menu Utama APLIKASI DOA HARIAN MUSLIM DAFTAR DOA 1. Menu utama akan muncul ketika user mengklik aplikasi Doa Harian Muslim pada application drawer smartphone mereka. 2. Menu utama terdiri dari 3 tombol yakni :Daftar Doa, Petunjuk, dan Tentang. 3. User dapat memilih menu yang ingin mereka lihat dengan mengklik salah satu dari pilihan di menu utama. PETUNJUK TENTANG 31

7 3.4.1 Rancangan Storyline Menu Daftar Doa Tabel 3.2 Storyline Menu Daftar Doa Rancangan Menu Daftar Doa APLIKASI DOA HARIAN MUSLIM DOA SEBELUM TIDUR DOA SUSAH TIDUR DOA BANGUN TIDUR DOA BANGUN TIDUR 1. Tampilan di samping akan muncul bila tombol Daftar Doa pada menu utama diklik 2. Dalam Menu Daftar Doa terdapat 20 tombol piihan doa yakni : Doa Sebelum Tidur, Doa Susah Tidur, Doa Bangun Tidur, Doa Sebelum Makan, Doa Setelah Makan, Doa Sebelum Belajar, Doa Setelah Belajar, Doa Keluar Rumah, Doa Masuk Rumah, Doa Masuk Toilet, Doa Keluar Toilet, Doa Niat Wudhu, Doa Setelah Wudhu, Doa Masuk Masjid, Doa Keluar Masjid, Doa Setelah Adzan, Doa Naik Kendaraan Doa untuk Orangtua. Doa Ketika Tertimpa Musibah, Doa Ketika Turun Hujan. 3. User akan memilih salah satu dari doa tersebut, kemudian aplikasi akan menampilkan doa yang dipilih oleh user 32

8 Rancangan Storyline Doa Sebelum Tidur Tabel 3.3 Storyline Doa Sebelum Tidur Sebelum Tidur DOA SEBELUM TIDUR tombol Doa Sebelum Tidur pada menu 2. Doa Sebelum Tidur ini menampilkan Rancangan Storyline Doa Susah Tidur Tabel 3.4 Storyline Doa Susah Tidur Susah Tidur DOA SUSAH TIDUR tombol Doa Susah Tidur pada menu 2. Doa Susah Tidur ini menampilkan 33

9 Rancangan Storyline Doa Bangun Tidur Tabel 3.5 Storyline Doa Bangun Tidur Bangun Tidur DOA BANGUN TIDUR tombol Doa Bangun Tidur pada menu 2. Doa Bangun Tidur ini menampilkan Rancangan Storyline Doa Sebelum Makan Tabel 3.6 Storyline Doa Sebelum Makan Sebelum Makan DOA SEBELUM MAKAN 1.Tampilan disamping akan muncul bila tombol Doa Sebelum Makan pada menu 2. Doa Sebelum Makan ini menampilkan 34

10 Rancangan Storyline Doa Setelah Makan Tabel 3.7 Storyline Doa Setelah Makan Setelah Makan DOA SETELAH MAKAN tombol Doa Setelah Makan pada menu 2. Doa Bangun Tidur ini menampilkan Rancangan Storyline Doa Sebelum Belajar Tabel 3.8 Storyline Doa Sebelum Belajar Sebelum Belajar DOA SEBELUM BELAJAR 1.Tampilan disamping akan muncul bila tombol Doa Sebelum Belajar pada menu 2. Doa Sebelum Belajar ini menampilkan 35

11 Rancangan Storyline Doa Setelah Belajar Tabel 3.9 Storyline Doa Setelah Belajar Setelah Belajar DOA SETELAH BELAJAR 1.Tampilan disamping akan muncul bila tombol Doa Setelah Belajar pada menu 2.Doa Setelah Belajar ini menampilkan Rancangan Storyline Doa Keluar Rumah Tabel 3.10 Storyline Doa Keluar Rumah Keluar Rumah DOA KELUAR RUMAH 1.Tampilan disamping akan muncul bila tombol Doa Keluar Rumah pada menu 2. Doa Keluar Rumah ini menampilkan 36

12 Rancangan Storyline Doa Masuk Rumah Tabel 3.11 Storyline Doa Masuk Rumah Masuk Rumah DOA MASUK RUMAH tombol Doa Masuk Rumah pada menu 2. Doa Masuk Rumah ini menampilkan Rancangan Storyline Doa Masuk Toilet Tabel 3.12 Storyline Doa Masuk Toilet Masuk Toilet DOA MASUK TOILET 1.Tampilan disamping akan muncul bila tombol Doa Masuk Toilet pada menu 2. Doa Masuk Toilet ini menampilkan 37

13 Rancangan Storyline Doa Keluar Toilet Tabel 3.13 Storyline Doa Keluar Toilet Keluar Toilet DOA KELUAR TOILET tombol Doa Keluar Toilet pada menu 2. Doa Keluar Toilet ini menampilkan Rancangan Storyline Doa Niat Berwudhu Tabel 3.14 Storyline Doa Niat Berwudhu Niat Berwudhu DOA NIAT BERWUDHU 1. Tampilan disamping akan muncul bila tombol Doa Niat Berwudhu pada menu 2. Doa Niat Berwudhu ini menampilkan 38

14 Rancangan Storyline Doa Setelah Berwudhu Tabel 3.15 Storyline Doa Setelah Berwudhu Setelah Berwudhu DOA SETELAH BERWUDHU tombol Doa Setelah Berwudhu pada menu 2. Doa Setelah Berwudhu ini menampilkan Rancangan Storyline Doa Masuk Masjid Tabel 3.16 Storyline Doa Masuk Masjid Masuk Masjid DOA MASUK MASJID 1.Tampilan disamping akan muncul bila tombol Doa Masuk Masjid pada menu 2. Doa Masuk Masjid ini menampilkan 39

15 Rancangan Storyline Doa Keluar Masjid Tabel 3.17 Storyline Doa Keluar Masjid Keluar Masjid DOA KELUAR MASJID 1.Tampilan disamping akan muncul bila tombol Doa Keluar Masjid pada menu 2.Doa Keluar Masjid ini menampilkan Rancangan Storyline Doa Setelah Adzan Tabel 3.18 Storyline Doa Setelah Adzan Setelah Adzan DOA SETELAH ADZAN tombol Doa Setelah Adzan pada menu 2. Doa Setelah Adzanini menampilkan 40

16 Rancangan Storyline Doa Naik Kendaraan Tabel 3.19 Storyline Doa Naik Kendaraan Naik Kendaraan DOA NAIK KENDARAAN tombol Doa Naik Kendaraan pada menu 2. Doa Naik Kendaraan ini menampilkan Rancangan Storyline Doa untuk Orangtua Tabel 3.20 Storyline Doa Untuk Orangtua untuk Orangtua DOA UNTUK ORANGTUA 1.Tampilan disamping akan muncul bila tombol Doa untuk Orangtua pada menu 2. Doa untuk Orangtua ini menampilkan 41

17 Rancangan Storyline Doa Ketika Tertimpa Musibah Tabel 3.21 Storyline Doa Ketika Tertimpa Musibah Ketika Tertimpa Musibah DOA KETIKA TERTIMPA MUSIBAH tombol Doa Ketika Tertimpa Musibah pada menu 2. Doa Ketika Tertimpa Musibah ini menampilkan gambar yang memvisualisasikan doa, teks animasi arab dan audio doa Rancangan Storyline Doa Ketika Turun Hujan Tabel 3.22 Storyline Doa Ketika Turun Hujan Ketika Turun Hujan DOA KETIKA TURUN HUJAN 1. Tampilan disamping akan muncul bila tombol Doa Ketika Turun Hujan pada menu 2. Doa Ketika Turun Hujan ini menampilkan gambar yang memvisualisasikan doa, teks animasi arab dan audio doa. 42

18 3.4.2 Rancangan Storyline Petunjuk Aplikasi Tabel 3.23 Storyline Petunjuk Aplikasi Petunjuk Aplikasi PETUNJUK APLIKASI TEKS 1. Tampilan disamping akan muncul bila tombol Petunjuk pada Menu Utama diklik oleh user. 2. Petunjuk Aplikasi menjelaskan cara penggunaan aplikasi Doa Harian Muslim tersebut Rancangan Storyline Tampilan Tentang Aplikasi Tabel 3.24 Storyline Tentang Aplikasi Tentang Aplikasi TENTANG APLIKASI TEKS 1. Tampilan disamping akan muncul bila tombol Tentang pada Menu Utama diklik oleh user. 2. Tentang Aplikasi berisi informasi tentang pembuat aplikasi Doa Harian Muslim tersebut. 43