BAB III PEMBAHASAN - repository.bsi.ac.id · sholat, dzikir sesudah sholat, doa sesudah sholat,...

of 141 /141
BAB III PEMBAHASAN 1.1. Analisis Kebutuhan Sistem Analisis sistem menjelaskan tentang berbagai analisis yang berhubungan dengan aplikasi yang akan di buat. Tahap analisis ini bertujuan untuk memperoleh informasi-informasi yang dibutuhkan dan memperoleh konsep aplikasi yang akan dibuat. Ditahap ini, penelitian di awali dengan melakukan observasi terhadap informasi-informasi yang dibutuhkan di dalam pembuatan aplikasi. Informasi tersebut antara lain materi dan kebutuhan pembuatan aplikasi. Materi aplikasi mencakup tentang proses panduan berwudhu, tuntunan sholat, dzikir sesudah sholat, doa sesudah sholat, yang ditampilkan di dalam aplikasi panduan sholat tersebut. Hal di dalam penelitian ini mencakup tentang analisis aplikasi sejenis, aplikasi yang akan di buat, analisisis kebutuhan fungsional dan analisis kebutuhan non-fungsional. 1.1.1. Kebutuhan Fungsional Kebutuhan fungsional adalah jenis kebutuhan yang berisi tentang proses- proses apa saja yang nantinya dilakukan oleh sistem. Kebutuhan fungsional juga berisikan tentang informasi-informasi apa saja yang harus ada dan dihasilkan oleh sistem. Berikut ini adalah kebutuhan fungsional dari perancangan aplikasi yang akan dibuat adalah sebagai berikut: 19

Embed Size (px)

Transcript of BAB III PEMBAHASAN - repository.bsi.ac.id · sholat, dzikir sesudah sholat, doa sesudah sholat,...

  • 19

    BAB III

    PEMBAHASAN

    1.1. Analisis Kebutuhan Sistem

    Analisis sistem menjelaskan tentang berbagai analisis yang berhubungan

    dengan aplikasi yang akan di buat. Tahap analisis ini bertujuan untuk memperoleh

    informasi-informasi yang dibutuhkan dan memperoleh konsep aplikasi yang akan

    dibuat. Ditahap ini, penelitian di awali dengan melakukan observasi terhadap

    informasi-informasi yang dibutuhkan di dalam pembuatan aplikasi. Informasi

    tersebut antara lain materi dan kebutuhan pembuatan aplikasi.

    Materi aplikasi mencakup tentang proses panduan berwudhu, tuntunan

    sholat, dzikir sesudah sholat, doa sesudah sholat, yang ditampilkan di dalam

    aplikasi panduan sholat tersebut. Hal di dalam penelitian ini mencakup tentang

    analisis aplikasi sejenis, aplikasi yang akan di buat, analisisis kebutuhan

    fungsional dan analisis kebutuhan non-fungsional.

    1.1.1. Kebutuhan Fungsional

    Kebutuhan fungsional adalah jenis kebutuhan yang berisi tentang proses-

    proses apa saja yang nantinya dilakukan oleh sistem. Kebutuhan fungsional juga

    berisikan tentang informasi-informasi apa saja yang harus ada dan dihasilkan oleh

    sistem.

    Berikut ini adalah kebutuhan fungsional dari perancangan aplikasi yang

    akan dibuat adalah sebagai berikut:

    19

  • 20

    1. Aplikasi Panduan Sholat ini nenampilkan Splash screen.

    2. Pada tampilan dashboard atau menu terdapat tombol mulai, keluar dan

    pengaturan yang di dalamnya terdapat tombol lagi yaitu (music play, music

    stop)

    a. Tombol mulai berfungsi untuk menampilkan layout menu panduan sholat

    yang terdiri dari berwudhu, tuntunan sholat, dzikir sesudah sholat, dan

    doa sesudah sholat.

    1) Berwudhu, berfungsi untuk menampilkan panduan cara berwudhu.

    2) Tuntunan Sholat, berfungsi untuk menampilkan panduan sholat.

    3) Dzikir Sesudah Sholat, berfungsi untuk menampilkan bacaan dzikir

    sesudah sholat.

    4) Doa Sesudah Sholat, berfungsi untuk menampilkan doa-doa sesudah

    sholat.

    b. Tombol Keluar berfungsi menampilkan gambar layout konfirmasi keluar.

    c. Tombol Pengaturan untuk menampilkan tombol pilihan.

    d. Music Play, berfungsi untuk mengaktifkan suara.

    e. Music Stop, berfungsi mematikan suara.

    3.1.2. Kebutuhan Non-Fungsional

    Analisa kebutuhan non-fungsional merupakan analisa yang dibutuhkan

    untuk menentukan spesifikasi kebutuhan sistem. Spesifikasi non-fungsional juga

    meliputi elemen atau komponen-komponen apa saja yang dibutuhkan mulai dari

    sistem dibangun sampai diimplementasikan. Pada analisis kebutuhan non-

  • 21

    fungsional dijelaskan analisis kebutuhan perangkat keras, perangkat lunak, dan

    juga analisis pengguna diantaranya sebagai berikut:

    1. Perangkat Lunak (Software)

    Perangkat lunak (software) yang diperlukan dalam pembuatan aplikasi

    mobile “Panduan Sholat” untuk Android Phone ini adalah sebagai berikut:

    a. Microsoft Windows 8 (64-bit)

    b. Construct 2

    c. Android Software Development Kit (Android SDK)

    d. PhoneGap

    e. Photoshop

    2. Perangkat Keras (Hardware)

    a. Komputer

    Spesifikasi perangkat keras yang digunakan untuk membuat aplikasi

    ”Panduan Sholat” adalah sebagai berikut:

    1) Prosesor Core 2 Duo (TM) cpu @ 2.1 GHz

    2) Memory : 4 GB

    3) HDD : 500 GB

    4) VGA : Intel(R) HD Graphics

    b. Perangkat Android

    Spesifikasi minimal perangkat Android yang dibutuhkan untuk

    menjalankan aplikasi ini adalah sebagai berikut:

    1) Ponsel : ponsel berbasis Android

    2) OS : OS 4.0 Android (Jelly Bean), Ice Cream Sandwich (Crosswalk),

    Kitkat dan Lollipop.

  • 22

    3) Prosesor : 528 Mhz, Qualcomm MSM 7225 chipset

    4) Memory : 512 MB ROM, 256 MB RAM.

    c. Perangkat Windows

    Spesifikasi perangkat Windows yang digunakan untuk menjalankan

    aplikasi ini adalah sebagai berikut:

    1) Laptop : OS Windows.

    2) OS : OS Windows 32/64 bit (XP, VISTA, 7, 8 dan Windows 10).

    3) Aplikasi Browser : Google Chorome versi 9.0 dan Frifox versi

    3.6.13.

    1.2. Perancangan Perangkat Lunak

    3.2.1.Rancangan Storyboard

    Tabel III.1. Storyboard Splash Screen

    VISUAL SKETSA AUDIO

    Dalam frame ini terdapat

    Loading 7 detik untuk

    masuk ke menu utama.

    Tidak ada

    Gambar Animasi

    Loading

  • 23

    Tabel III.2. Storyboard Halaman Utama

    VISUAL SKETSA AUDIO

    Dalam frame ini terdapat

    tiga tombol yang dapat

    dipilih yaitu: Mulai,

    Keluar dan Pengaturan.

    Instrumen.wav

    Klik.wav

    Judul Aplikasi

    Mulai

    Keluar

  • 24

    Tabel III.3. Storyboard Halaman Panduan Sholat

    VISUAL SKETSA AUDIO

    Dalam frame ini berisi

    Panduan Sholat dan

    terdapat 7 tombol yang

    dapat dipilih yaitu:

    Tuntunan Sholat,

    Berwudhu, Doa Sesudah

    Sholat, Dzikir Sesudah

    Sholat, Undo, Informasi,

    Home.

    Klik.wav

    Tuntunan

    Sholat

    Panduan Sholat

    Berwudhu

    Dzikir

    Sesudah

    Sholat

    Doa

    Sesudah

    Sholat

    Informasi

  • 25

    Tabel III.4. Storyboard Halaman Panduan Berwudhu

    VISUAL SKETSA AUDIO

    Dalam frame ini berisi

    gambar berwudhu dan

    terdapat 12 tombol yang

    dapat dipilih yaitu:

    1.Telapak Tangan,

    2.Mulut, 3.Hidung,

    4.Muka, 5.Tangan,

    6.Rambut, 7.Telinga,

    8.Kaki, Doa Sesudah

    Wudhu, Yang

    Membatalkan Wudhu,

    Undo, dan Home.

    Klik.wav

    1.Telapak Tangan

    Gambar

    Berwudhu

    2.Mulut

    3.Hidung

    4.Muka

    5.Tangan

    6.Rambut

    7.Telinga

    8.Kaki

    Doa Sesudah Wudhu

    Yang Membatalkan

  • 26

    Tabel III.5. Storyboard Halaman Tuntunan Sholat

    VISUAL SKETSA AUDIO

    Dalam frame ini berisi

    gambar Tuntunan Sholat

    dan terdapat 10 tombol

    yang dapat dipilih yaitu:

    Sholat Subuh, Sholat

    Dzuhur, Sholat Ashar,

    Sholat Maghrib, Sholat

    Isya, Syarat-syarat

    Sholat, Rukun Sholat,

    Yang Membatalkan

    Sholat, Undo, dan

    Home.

    Klik.wav

    SHOLAT SUBUH

    Gambar Tuntunan

    Sholat

    SHOLAT DZUHUR

    SHOLAT ASHAR

    SHOLAT MAGHRIB

    SHOLAT ISYA

    SYARAT-SYARAT SHOLAT

    RUKUN SHOLAT

    YANG MEMBATALKAN

    SHOLAT

  • 27

    Tabel III.6. Storyboard Halaman Dzikir Sesudah Sholat

    VISUAL SKETSA AUDIO

  • 28

    Dalam frame ini berisi

    gambar Dzikir Sesudah

    Sholat dan terdapat 15

    tombol yang dapat

    dipilih yaitu: Dzikir 1,

    Dzikir 2, Dzikir 3, Dzikir

    4, Dzikir 5, Dzikir 6,

    Dzikir 7, Dzikir 8, Dzikir

    9, Dzikir 10, Dzikir 11,

    Dzikir 12, Dzikir 13,

    Undo, dan Home.

    Klik.wav

    Tabel III.7. Storyboard Halaman Doa Sesudah Sholat

    DZIKIR 1

    Gambar Dzikir

    Sesudah Sholat

    DZIKIR 2

    DZIKIR 3 DZIKIR 4

    DZIKIR 5

    DZIKIR 7

    DZIKIR 9 DZIKIR 10

    DZIKIR 6

    DZIKIR 8

    DZIKIR 13

    DZIKIR 12 DZIKIR 11

  • 29

    VISUAL SKETSA AUDIO

    Dalam frame ini berisi

    Gambar Doa Sesudah

    Sholat dan terdapat 19

    tombol yang dapat

    dipilih yaitu: Doa 1, Doa

    2, Doa 3, Doa 4, Doa 5,

    Doa 6, Doa 7, Doa 8,

    Doa 9, Doa 10, Doa 11,

    Doa 12, Doa 13, Doa 14,

    Doa 15, Doa 16, Doa 17,

    Undo, dan Home.

    Klik.wav

    Tabel III.8. Storyboard Halaman Panduan Berwudhu (1.Telapak Tangan)

    DOA 1

    Gambar Doa

    Sesudah Sholat

    DOA 2

    DOA 3

    DOA 4

    DOA 5

    DOA 6

    DOA 7

    DOA 8

    DOA 9

    DOA 10

    DOA 11

    DOA 12

    DOA 14

    DOA 15

    DOA 16

    DOA 17

    DOA 13

  • 30

    VISUAL SKETSA AUDIO

    Dalam frame ini berisi

    Nama Halaman dan

    terdapat 7 tombol yang

    dapat dipilih yaitu: Play,

    Pause, Stop, Panah Kiri,

    Panah Kanan, Undo, dan

    Home.

    Bismillah.wav

    Klik.wav

    Tabel III.9. Storyboard Halaman Panduan Berwudhu (2.Mulut)

    Gambar Mencuci Kedua

    Belah Tangan

    1.Telapak Tangan

    Penjelasan

    Arabic

    Latin

    Arti

  • 31

    VISUAL SKETSA AUDIO

    Dalam frame ini berisi

    Nama Halaman dan

    terdapat 4 tombol yang

    dapat dipilih yaitu:

    Panah Kiri, Panah

    Kanan, Undo, dan

    Home.

    Klik.wav

    Gambar Berkumur

    2.Mulut

    Penjelasan

  • 32

    Tabel III.10. Storyboard Halaman Panduan Berwudhu (3.Hidung)

    VISUAL SKETSA AUDIO

    Dalam frame ini berisi

    Nama Halaman dan

    terdapat 4 tombol yang

    dapat dipilih yaitu:

    Panah Kiri, Panah

    Kanan, Undo, dan

    Home.

    Klik.wav

    Gambar Mencuci Lubang

    Hidung

    3.Hidung

    Penjelasan

  • 33

    Tabel III.11. Storyboard Halaman Panduan Berwudhu (4.Muka)

    VISUAL SKETSA AUDIO

    Dalam frame ini berisi

    Nama Halaman dan

    terdapat 7 tombol yang

    dapat dipilih yaitu: Play,

    Pause, Stop, Panah Kiri,

    Panah Kanan, Undo,

    dan Home.

    Niatwudhu.wav

    Klik.wav

    Gambar Mencuci muka

    4.Muka

    Penjelasan

    Arabic

    Latin

    Arti

  • 34

    Tabel III.12. Storyboard Halaman Panduan Berwudhu (5.Tangan)

    VISUAL SKETSA AUDIO

    Dalam frame ini berisi

    Nama Halaman dan

    terdapat 4 tombol yang

    dapat dipilih yaitu:

    Panah Kiri, Panah

    Kanan, Undo, dan

    Home.

    Klik.wav

    Gambar Mencuci Kedua

    Belah Tangan

    5.Tangan

    Penjelasan

  • 35

    Tabel III.13. Storyboard Halaman Panduan Berwudhu (6.Rambut)

    VISUAL SKETSA AUDIO

    Dalam frame ini berisi

    Nama Halaman dan

    terdapat 4 tombol yang

    dapat dipilih yaitu:

    Panah Kiri, Panah

    Kanan, Undo, dan

    Home.

    Klik.wav

    Gambar Membasahi Rambut

    6.Rambut

    Penjelasan

  • 36

    Tabel III.14. Storyboard Halaman Panduan Berwudhu (7.Telinga)

    VISUAL SKETSA AUDIO

    Dalam frame ini berisi

    Nama Halaman dan

    terdapat 4 tombol yang

    dapat dipilih yaitu:

    Panah Kiri, Panah

    Kanan, Undo, dan

    Home.

    Klik.wav

    Gambar Mencuci Kedua

    Belah Telinga

    7.Telinga

    Penjelasan

  • 37

    Tabel III.15. Storyboard Halaman Panduan Berwudhu (8.Kaki)

    VISUAL SKETSA AUDIO

    Dalam frame ini berisi

    Nama Halaman dan

    terdapat 4 tombol yang

    dapat dipilih yaitu:

    Panah Kiri, Panah

    Kanan, Undo, dan

    Home.

    Klik.wav

    Gambar Mencuci Kedua

    Belah Kaki

    8.Kaki

    Penjelasan

  • 38

    Tabel III.16.Storyboard Halaman Panduan Berwudhu (Doa Sesudah Wudhu)

    VISUAL SKETSA AUDIO

  • 39

    Dalam frame ini berisi

    Nama Halaman dan

    terdapat 7 tombol yang

    dapat dipilih yaitu: Play,

    Pause, Stop, Panah Kiri,

    Panah Kanan, Undo, dan

    Home.

    Doawudu.wav

    Klik.wav

    Tabel III.17. Storyboard Halaman Panduan Berwudhu (Yang Membatalkan)

    Doa Sesudah

    Wudhu

    Penjelasan

    Arabic

    Latin

    Arti

  • 40

    VISUAL SKETSA AUDIO

    Dalam frame ini berisi

    Nama Halaman dan

    terdapat 4 tombol yang

    dapat dipilih yaitu:

    Panah Kiri, Panah

    Kanan, Undo, dan

    Home.

    Klik.wav

    Yang Membatalkan

    Penjelasan

  • 41

    Tabel III.18. Storyboard Halaman Panduan Sholat (1.Niat)

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan Panduan Sholat

    yang terdiri dari Gambar

    dan penjelasan rakaat,

    rukun sholat,

    menampilkan animasi

    gerakan sholat,

    penjelasan dari gerakan

    sholat, bacaan niat sholat

    berupa tulisan arab, latin

    dan artinya. Terdapat

    juga beberapa tombol

    yaitu: Play, Pause, Stop,

    Undo, Home.

    Niatsholat.wav

    Klik.wav

    1.Niat Sholat

    Gambar dan

    Penjelasan Rakaat

    Jumlah

    Rakaat

    Objek

    Animasi

    Penjelasan

    Arabic

    Arti

    Latin

  • 42

    Tabel III.19. Storyboard Halaman Panduan Sholat (2.Takbiratul Ikhram)

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan Panduan Sholat

    yang terdiri dari Rukun

    Sholat, menampilkan

    animasi gerakan sholat,

    penjelasan dari gerakan

    sholat, bacaan takbir

    sholat berupa tulisan

    arab, latin dan artinya.

    Terdapat juga beberapa

    tombol yaitu: Play,

    Pause, Stop, Undo,

    Home.

    Takbir.wav

    Klik.wav

    2.Takbiratul

    Ikhram

    Objek

    Animasi

    Penjelasan

    Arabic

    Arti

    Latin

  • 43

    Tabel III.20. Storyboard Halaman Panduan Sholat (3.Iftitah)

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan Panduan Sholat

    yang terdiri dari

    menampilkan animasi

    gerakan sholat,

    penjelasan dari gerakan

    sholat, bacaan iftitah

    berupa tulisan arab, latin

    dan artinya. Terdapat

    juga beberapa tombol

    yaitu: Play, Pause, Stop,

    Undo, Home.

    Iftitah.wav

    Klik.wav

    3.Iftitah

    Objek

    Animasi

    Penjelasan

    Arabic

    Arti

    Latin

  • 44

    Tabel III.21. Storyboard Halaman Panduan Sholat (4.Al-Fatihah)

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan Panduan Sholat

    yang terdiri dari

    menampilkan animasi

    gerakan sholat,

    penjelasan dari gerakan

    sholat, bacaan al-fatihah

    berupa tulisan arab, latin

    dan artinya. Terdapat

    juga beberapa tombol

    yaitu: Play, Pause, Stop,

    Undo, Home.

    Al-fatihah.wav

    Klik.wav

    4.Al-Fatihah

    Objek

    Animasi

    Penjelasan

    Arabic

    Arti

    Latin

  • 45

    Tabel III.22.

    Storyboard Halaman Panduan Sholat (5.Bacaan Setelah Al-Fatihah)

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan Panduan Sholat

    yang terdiri dari

    menampilkan animasi

    gerakan sholat,

    penjelasan dari gerakan

    sholat. Terdapat juga

    beberapa tombol yaitu:

    Play, Pause, Stop, Undo,

    Home.

    Klik.wav

    5.Bacaan Setelah

    Al-Fatihah

    Objek

    Animasi

    Penjelasan

  • 46

    Tabel III.23. Storyboard Halaman Panduan Sholat (6.Ruku)

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan Panduan Sholat

    yang terdiri dari

    menampilkan animasi

    gerakan sholat,

    penjelasan dari gerakan

    sholat, bacaan Ruku

    berupa tulisan arab, latin

    dan artinya. Terdapat

    juga beberapa tombol

    yaitu: Play, Pause, Stop,

    Undo, Home.

    Ruku.wav

    Klik.wav

    6.Ruku

    Objek

    Animasi

    Penjelasan

    Arabic

    Arti

    Latin

  • 47

    Tabel III.24. Storyboard Halaman Panduan Sholat (7.Bangkit dari Ruku)

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan Panduan Sholat

    yang terdiri dari

    menampilkan animasi

    gerakan sholat,

    penjelasan dari gerakan

    sholat, bacaan bangkit

    dari ruku berupa tulisan

    arab, latin dan artinya.

    Terdapat juga beberapa

    tombol yaitu: Play,

    Pause, Stop, Undo,

    Home.

    Bangkit.wav

    Klik.wav

    7.Bangkit dari

    Ruku

    Objek

    Animasi

    Penjelasan

    Arabic

    Arti

    Latin

  • 48

    Tabel III.25. Storyboard Halaman Panduan Sholat (8.I`tidal)

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan Panduan Sholat

    yang terdiri dari

    menampilkan animasi

    gerakan sholat,

    penjelasan dari gerakan

    sholat, bacaan I`tidal

    berupa tulisan arab, latin

    dan artinya. Terdapat

    juga beberapa tombol

    yaitu: Play, Pause, Stop,

    Undo, Home.

    I`tidal.wav

    Klik.wav

    8.I`tidal

    Objek

    Animasi

    Penjelasan

    Arabic

    Arti

    Latin

  • 49

    Tabel III.26. Storyboard Halaman Panduan Sholat (9.Doa Qunut)

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan Panduan Sholat

    yang terdiri dari

    menampilkan animasi

    gerakan sholat,

    penjelasan dari gerakan

    sholat, bacaan doa qunut

    berupa tulisan arab, latin

    dan artinya. Terdapat

    juga beberapa tombol

    yaitu: Play, Pause, Stop,

    Undo, Home.

    Qunut.wav

    Klik.wav

    9.Doa Qunut

    Objek

    Animasi

    Penjelasan

    Arabic

    Arti

    Latin

  • 50

    Tabel III.27. Storyboard Halaman Panduan Sholat (10.Sujud)

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan Panduan Sholat

    yang terdiri dari

    menampilkan animasi

    gerakan sholat,

    penjelasan dari gerakan

    sholat, bacaan sujud

    berupa tulisan arab, latin

    dan artinya. Terdapat

    juga beberapa tombol

    yaitu: Play, Pause, Stop,

    Undo, Home.

    Sujud.wav

    Klik.wav

    10.Sujud

    Objek

    Animasi

    Penjelasan

    Arabic

    Arti

    Latin

  • 51

    Tabel III.28.

    Storyboard Halaman Panduan Sholat (11. Duduk Antara 2 Sujud)

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan Panduan Sholat

    yang terdiri dari

    menampilkan animasi

    gerakan sholat,

    penjelasan dari gerakan

    sholat, bacaan duduk

    antara 2 sujud berupa

    tulisan arab, latin dan

    artinya. Terdapat juga

    beberapa tombol yaitu:

    Play, Pause, Stop, Undo,

    Home.

    2Sujud.wav

    Klik.wav

    11.Duduk Antara

    2 Sujud

    Objek

    Animasi

    Penjelasan

    Arabic

    Arti

    Latin

  • 52

    Tabel III.29. Storyboard Halaman Panduan Sholat (12.Tasyahud Awal)

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan Panduan Sholat

    yang terdiri dari

    menampilkan animasi

    gerakan sholat,

    penjelasan dari gerakan

    sholat, bacaan tasyahud

    awal berupa tulisan arab,

    latin dan artinya.

    Terdapat juga beberapa

    tombol yaitu: Play,

    Pause, Stop, Undo,

    Home.

    Awal.wav

    Klik.wav

    12.Tasyahud

    Awal

    Objek

    Animasi

    Penjelasan

    Arabic

    Arti

    Latin

  • 53

    Tabel III.30. Storyboard Halaman Panduan Sholat (13.Tasyahud Akhir)

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan Panduan Sholat

    yang terdiri dari

    menampilkan animasi

    gerakan sholat,

    penjelasan dari gerakan

    sholat, bacaan tasyahud

    akhir berupa tulisan arab,

    latin dan artinya.

    Terdapat juga beberapa

    tombol yaitu: Play,

    Pause, Stop, Undo,

    Home.

    Akhir.wav

    Klik.wav

    13.Tasyahud

    Akhir

    Objek

    Animasi

    Penjelasan

    Arabic

    Arti

    Latin

  • 54

    Tabel III.31. Storyboard Halaman Panduan Sholat (14.Salam)

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan Panduan Sholat

    yang terdiri dari

    menampilkan animasi

    gerakan sholat,

    penjelasan dari gerakan

    sholat, bacaan salam

    berupa tulisan arab, latin

    dan artinya. Terdapat

    juga beberapa tombol

    yaitu: Play, Pause, Stop,

    Undo, Home.

    Salam.wav

    Klik.wav

    14.Salam

    Objek

    Animasi

    Penjelasan

    Arabic

    Arti

    Latin

  • 55

    Tabel III.32. Storyboard Halaman Dzikir Sesudah Sholat

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan dzikir-dzikir

    sesudah sholat yang

    terdiri dari bacaan

    dzikir-dzikir berupa

    tulisan arab, latin dan

    artinya. Terdapat juga

    beberapa tombol yaitu:

    Play, Pause, Stop, Undo,

    Home.

    Dzikir.wav

    Klik.wav

    Gambar Dzikir

    Arabic

    Arti

    Latin

  • 56

    Tabel III.33. Storyboard Halaman Doa Sesudah Sholat

    VISUAL SKETSA AUDIO

    Dalam frame ini

    berisikan doa-doa

    sesudah sholat yang

    terdiri dari bacaan doa

    sesudah sholat yang

    berupa tulisan arab, latin

    dan artinya. Terdapat

    juga beberapa tombol

    yaitu: Play, Pause, Stop,

    Undo, Home

    Doa.wav

    Klik.wav

    Gambar Doa

    Arabic

    Arti

    Latin

  • 57

    3.2.2.Rancangan Antarmuka

    Menjelaskan rancangan antarmuka (interface) yang terdapat pada aplikasi

    “panduan sholat”.

    1. Rancangan Antarmuka Splash Screen

    Tampilan ini menampilkan gambar loading selama 7 detik untuk masuk ke

    menu utama.

    Gambar III.1.Rancangan Antarmuka Splash Screen

    LOADING

  • 58

    2. Rancangan Antarmuka Menu Utama

    Pada frame ini berisikan judul aplikasi, tombol “Mulai” untuk masuk ke

    menu panduan sholat, tombol “Keluar” untuk menampilkan konfirmasi

    keluar dengan pilihan ya atau tidak, tombol “pengaturan” untuk

    menampilkan pilihan seperti audio on dan audio off. Tombol “audio on”

    untuk

    menghidupkan audio, tombol “audio off” untuk mematikan audio.

    Keluar

    Mulai

    Judul Aplikasi

    Pengatura

    n

    Pengatura

    n

    Audio

    off

    Audio

    on

  • 59

    Gambar III.2.Rancangan Antarmuka Menu Utama

    3. Rancangan Antarmuka Panduan Sholat

    Dalam frame ini berisi Panduan Sholat dan terdapat 7 tombol yang dapat

    dipilih yaitu tombol ”Tuntunan Sholat” untuk masuk ke layout tuntunan

    sholat, tombol “Berwudhu” untuk masuk ke layout panduan berwudhu,

    tombol “Doa Sesudah Sholat” untuk masuk ke layout doa sesudah sholat,

    tombol “Dzikir Sesudah Sholat” untuk masuk ke layout dzikir-dzikir

    sesudah sholat, tombol ”Undo” untuk kembali ke layout menu utama,

    tombol “Informasi” untuk menampilkan tujuan pembuatan aplikasi, tombol

    “Home”untuk kembali ke menu utama.

  • 60

    Gambar III.3.Rancangan Antarmuka Panduan Sholat

    4. Rancangan Antarmuka Panduan Berwudhu

    Dalam frame ini berisi gambar berwudhu dan terdapat 12 tombol yang

    dapat dipilih yaitu: tombol 1.Telapak Tangan berfungsi untuk masuk ke

    layout telapak tangan, 2.Mulut berfungsi untuk masuk ke layout mulut,

    3.Hidung berfungsi untuk masuk ke layout hidung , 4.Muka berfungsi untuk

    masuk ke layout muka, 5.Tangan berfungsi untuk masuk ke layout tangan,

    6.Rambut berfungsi untuk masuk ke layout rambut, 7.Telinga berfungsi

    Tuntunan

    Sholat

    Panduan Sholat

    Berwudhu

    Dzikir

    Sesudah

    Sholat

    Doa

    Sesudah

    Sholat

    Informasi

  • 61

    untuk masuk ke layout telinga, 8.Kaki berfungsi untuk masuk ke layout

    kaki, Doa Sesudah Wudhu berfungsi untuk masuk ke layout doa sesudah

    wudhu, Yang Membatalkan Wudhu berfungsi untuk masuk ke layout

    membatalkan wudhu, Undo berfungsi untuk kembali ke menu panduan

    sholat, dan Home berfungsi untuk kembali ke menu utama.

    1.Telapak Tangan

    Gambar

    Berwudhu

    2.Mulut

    3.Hidung

    4.Muka

    5.Tangan

    6.Rambut

  • 62

    Gambar III.4.Rancangan Antarmuka Panduan Berwudhu

    5. Rancangan Antarmuka Tuntunan Sholat

    Dalam frame ini berisi gambar Tuntunan Sholat dan terdapat 10 tombol

    yang dapat dipilih yaitu: Sholat Subuh, Sholat Dzuhur, Sholat Ashar, Sholat

    Maghrib, Sholat Isya, Syarat-syarat Sholat, Rukun Sholat, Yang

  • 63

    Membatalkan Sholat, tombol tersebut berfungsi untuk masuk ke masing-

    masing layout yang sesuai dengan tombol yang di pilih, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

    Gambar III.5.Rancangan Antarmuka Tuntunan Sholat

    6. Rancangan Antarmuka Dzikir Sesudah Sholat

    Dalam frame ini berisi gambar Dzikir Sesudah Sholat dan terdapat 15

    tombol yang dapat dipilih yaitu: Dzikir 1, Dzikir 2, Dzikir 3, Dzikir 4,

    SHOLAT SUBUH

    Gambar Tuntunan

    Sholat

    SHOLAT DZUHUR

    SHOLAT ASHAR

    SHOLAT MAGHRIB

    SHOLAT ISYA

    SYARAT-SYARAT SHOLAT

    RUKUN SHOLAT

    YANG MEMBATALKAN

    SHOLAT

  • 64

    Dzikir 5, Dzikir 6, Dzikir 7, Dzikir 8, Dzikir 9, Dzikir 10, Dzikir 11, Dzikir

    12, Dzikir 13, tombol tersebut berfungsi untuk masuk ke masing-masing

    layout yang sesuai dengan tombol yang di pilih, Undo untuk kembali ke

    panduan sholat, dan Home untuk kembali ke menu utama.

    DZIKIR 1

    Gambar Dzikir

    Sesudah Sholat

    DZIKIR 2

    DZIKIR 3 DZIKIR 4

  • 65

    Gambar III.6.Rancangan Antarmuka Dzikir Sesudah Sholat

    7. Rancangan Antarmuka Doa Sesudah Sholat

  • 66

    Dalam frame ini berisi Gambar Doa Sesudah Sholat dan terdapat 19

    tombol yang dapat dipilih yaitu: Doa 1, Doa 2, Doa 3, Doa 4, Doa 5, Doa 6,

    Doa 7, Doa 8, Doa 9, Doa 10, Doa 11, Doa 12, Doa 13, Doa 14, Doa 15,

    Doa 16, Doa 17, tombol tersebut berfungsi untuk masuk ke masing-masing

    layout yang sesuai dengan tombol yang di pilih, Undo untuk kembali ke

    menu panduan sholat, dan Home untuk kembali ke menu utama.

    DOA 1

    Gambar Doa

    Sesudah Sholat

    DOA 2

    DOA 3

    DOA 4

  • 67

    Gambar III.7.Rancangan Antarmuka Doa Sesudah Sholat

    8. Rancangan Antarmuka Panduan Berwudhu (1.Telapak Tangan)

  • 68

    Dalam frame ini berisi Nama Halaman dan terdapat 7 tombol yang dapat

    dipilih yaitu: tombol Play untuk memutar audio, Pause untuk menghentikan

    audio sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total,

    Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk kembali ke

    menu panduan berwudhu, dan Home untuk kembali ke menu utama.

    Gambar III.8.

    Rancangan Antarmuka Panduan Berwudhu (1.Telapak Tangan)

    Gambar Mencuci Kedua

    Belah Tangan

    1.Telapak Tangan

    Penjelasan

    Arabic

    Latin

    Arti

  • 69

    9. Rancangan Antarmuka Panduan Berwudhu (2.Mulut)

    Dalam frame ini berisi Nama Halaman dan terdapat 4 tombol yang dapat

    dipilih yaitu: Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk

    kembali ke menu panduan berwudhu, dan Home untuk kembali ke menu

    utama.

    Gambar III.9.Rancangan Antarmuka Panduan Berwudhu (2.Mulut)

    Gambar Berkumur

    2.Mulut

    Penjelasan

  • 70

    10. Rancangan Antarmuka Panduan Berwudhu (3.Hidung)

    Dalam frame ini berisi Nama Halaman dan terdapat 4 tombol yang dapat

    dipilih yaitu: Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk

    kembali ke menu panduan berwudhu, dan Home untuk kembali ke menu

    utama.

    Gambar III.10.Rancangan Antarmuka Panduan Berwudhu (3.Hidung)

    Gambar Mencuci Lubang

    Hidung

    3.Hidung

    Penjelasan

  • 71

    11. Racangan Antarmuka Panduan Berwudhu (4.Muka)

    Dalam frame ini berisi Nama Halaman dan terdapat 7 tombol yang dapat

    dipilih yaitu: tombol Play untuk memutar audio, Pause untuk menghentikan

    audio sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total,

    Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk kembali ke

    menu panduan berwudhu, dan Home untuk kembali ke menu utama.

    Gambar Mencuci muka

    4.Muka

    Penjelasan

    Arabic

    Latin

    Arti

  • 72

    Gambar III.11.Rancangan Antarmuka Panduan Berwudhu (4.Muka)

    12. Rancangan Antarmuka Panduan Berwudhu (5.Tangan)

    Dalam frame ini berisi Nama Halaman dan terdapat 4 tombol yang dapat

    dipilih yaitu: Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk

    kembali ke menu panduan berwudhu, dan Home untuk kembali ke menu

    utama.

    Gambar III.12.Rancangan Antarmuka Panduan Berwudhu (5.Tangan)

    Gambar Mencuci Kedua

    Belah Tangan

    5.Tangan

    Penjelasan

  • 73

    13. Rancangan Antarmuka Panduan Berwudhu (6.Rambut)

    Dalam frame ini berisi Nama Halaman dan terdapat 4 tombol yang dapat

    dipilih yaitu: Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk

    kembali ke menu panduan berwudhu, dan Home untuk kembali ke menu

    utama.

    Gambar III.13.Rancangan Antarmuka Panduan Berwudhu (6.Rambut)

    Gambar Membasahi Rambut

    6.Rambut

    Penjelasan

  • 74

    14. Rancangan Antarmuka Panduan Berwudhu (7.Telinga)

    Dalam frame ini berisi Nama Halaman dan terdapat 4 tombol yang dapat

    dipilih yaitu: Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk

    kembali ke menu panduan berwudhu, dan Home untuk kembali ke menu

    utama.

    Gambar Mencuci Kedua

    Belah Telinga

    7.Telinga

    Penjelasan

  • 75

    Gambar III.14.Rancangan Antarmuka Panduan Berwudhu (7.Telinga)

    15. Rancangan Antarmuka Panduan Berwudhu (8.Kaki)

    Dalam frame ini berisi Nama Halaman dan terdapat 4 tombol yang dapat

    dipilih yaitu: Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk

    kembali ke menu panduan berwudhu, dan Home untuk kembali ke menu

    utama.

    Gambar Mencuci Kedua

    Belah Kaki

    8.Kaki

    Penjelasan

  • 76

    Gambar III.15.Rancangan Antarmuka Panduan Berwudhu (8.Kaki)

    16. Rancangan Antarmuka Panduan Berwudhu (Doa Sesudah Wudhu)

    Dalam frame ini berisi Nama Halaman dan terdapat 7 tombol yang dapat

    dipilih yaitu: tombol Play untuk memutar audio, Pause untuk menghentikan

    audio sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total,

    Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk kembali ke

    menu panduan berwudhu, dan Home untuk kembali ke menu utama.

    Doa Sesudah

    Wudhu

    Penjelasan

    Arabic

  • 77

    Gambar III.16

    Rancangan Antarmuka Panduan Berwudhu (Doa Sesudah Wudhu)

    17. Rancangan Antarmuka Panduan Berwudhu (Yang Membatalkan)

    Dalam frame ini berisi Nama Halaman dan terdapat 4 tombol yang dapat

    dipilih yaitu: Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk

    kembali ke menu panduan berwudhu, dan Home untuk kembali ke menu

    utama.

    Yang Membatalkan

    Penjelasan

  • 78

    Gambar III.17

    Rancangan Antarmuka Panduan Berwudhu (Yang Membatalkan)

    18. Rancangan Antarmuka Panduan Sholat (1.Niat Sholat)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari Gambar dan

    penjelasan rakaat, rukun sholat, menampilkan animasi gerakan sholat,

    penjelasan dari gerakan sholat, bacaan niat sholat berupa tulisan arab, latin

    dan artinya. Terdapat juga beberapa tombol yaitu tombol Play untuk

    memutar audio, Pause untuk menghentikan audio sesaat dan dapat di

    lanjutkan kembali, Stop untuk menghentikan total, Undo untuk kembali ke

    menu panduan sholat, dan Home untuk kembali ke menu utama.

  • 79

    1.Niat Sholat

    Gambar dan

    Penjelasan Rakaat

    Jumlah

    Rakaat

    Objek

    Animasi

    Penjelasan

    Arabic

    Latin

  • 80

    Gambar III.18.Rancangan Antarmuka Panduan Sholat (1.Niat Sholat)

    19. Rancangan Antarmuka Panduan Sholat (2.Takbiratul Ikhram)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari penjelasan

    rakaat, rukun sholat, menampilkan animasi gerakan sholat, penjelasan dari

    gerakan sholat, bacaan takbiratul ikhram berupa tulisan arab, latin dan

    artinya. Terdapat juga beberapa tombol yaitu tombol Play untuk memutar

    audio, Pause untuk menghentikan audio sesaat dan dapat di lanjutkan

    kembali, Stop untuk menghentikan total, Undo untuk kembali ke menu

    panduan sholat, dan Home untuk kembali ke menu utama.

  • 81

    2.Takbiratul

    Ikhram

    Objek

    Animasi

    Penjelasan

    Arabic

  • 82

    Gambar III.19.

    Rancangan Antarmuka Panduan Sholat (2.Takbiratul Ikhram)

    20. Rancangan Antarmuka Panduan Sholat (3.Iftitah)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan iftitah berupa

    tulisan arab, latin dan artinya. Terdapat juga beberapa tombol yaitu tombol

  • 83

    Play untuk memutar audio, Pause untuk menghentikan audio sesaat dan

    dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

    3.Iftitah

  • 84

    Gambar III.20.Rancangan Antarmuka Panduan Sholat (3.Iftitah)

    Objek

    Animasi

  • 85

    21. Rancangan Antarmuka Panduan Sholat (4.Al-Fatihah)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan al-fatihah

    berupa tulisan arab, latin dan artinya. Terdapat juga beberapa tombol yaitu

    tombol Play untuk memutar audio, Pause untuk menghentikan audio sesaat

    dan dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

  • 86

    Gambar III.21.Rancangan Antarmuka Panduan Sholat (4.Al-Fatihah)

    4.Al-Fatihah

    Objek

    Animasi

    Penjelasan

    Arabic

    Latin

    Arti

  • 87

    22. Rancangan Antarmuka Panduan Sholat (5.Bacaan Setelah Al-Fatihah)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan setelah al-

    fatihah berupa tulisan arab, latin dan artinya. Terdapat juga beberapa tombol

    yaitu tombol Play untuk memutar audio, Pause untuk menghentikan audio

    sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo

    untuk kembali ke menu panduan sholat, dan Home untuk kembali ke menu

    utama.

  • 88

    5.Bacaan Setelah

    Al-Fatihah

    Objek

    Animasi

    Penjelasan

    Arabic

    Latin

    Arti

  • 89

    Gambar III.22.

    Rancangan Antarmuka Panduan Sholat (5.Bacaan Setelah Al-Fatihah)

    23. Rancangan Antarmuka Panduan Sholat (6.Ruku)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan ruku berupa

    tulisan arab, latin dan artinya. Terdapat juga beberapa tombol yaitu tombol

    Play untuk memutar audio, Pause untuk menghentikan audio sesaat dan

    dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

  • 90

    6.Ruku

    Objek

    Animasi

    Penjelasan

    Arabic

    Latin

    Arti

  • 91

    Gambar III.23.Rancangan Antarmuka Panduan Sholat (6.Ruku)

    24. Rancangan Antarmuka Panduan Sholat (7.Bangkit dari Ruku)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan bangkit dari

    ruku berupa tulisan arab, latin dan artinya. Terdapat juga beberapa tombol

    yaitu tombol Play untuk memutar audio, Pause untuk menghentikan audio

    sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo

    untuk kembali ke menu panduan sholat, dan Home untuk kembali ke menu

    utama.

  • 92

    7.Bangkit dari

    Ruku

    Objek

    Animasi

    Penjelasan

    Arabic

    Latin

  • 93

    Gambar III.24.

    Rancangan Antarmuka Panduan Sholat (7.Bangkit dari Ruku)

    25. Rancangan Antarmuka Panduan Sholat (8.I`tidal)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan i`tidal berupa

    tulisan arab, latin dan artinya. Terdapat juga beberapa tombol yaitu tombol

    Play untuk memutar audio, Pause untuk menghentikan audio sesaat dan

    dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

  • 94

    8.I`tidal

    Objek

    Animasi

    Penjelasan

    Arabic

  • 95

    Gambar III.25.Rancangan Antarmuka Panduan Sholat (8.I`tidal)

    26. Rancangan Antarmuka Panduan Sholat (9.Doa Qunut)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan doa qunut

    berupa tulisan arab, latin dan artinya. Terdapat juga beberapa tombol yaitu

    tombol Play untuk memutar audio, Pause untuk menghentikan audio sesaat

  • 96

    dan dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

    9.Doa Qunut

    Objek

    Animasi

  • 97

    Gambar III.26.Rancangan Antarmuka Panduan Sholat (9.Doa Qunut)

    27. Rancangan Antarmuka Panduan Sholat (10.Sujud)

  • 98

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan sujud berupa

    tulisan arab, latin dan artinya. Terdapat juga beberapa tombol yaitu tombol

    Play untuk memutar audio, Pause untuk menghentikan audio sesaat dan

    dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

  • 99

    Gambar III.27.Rancangan Antarmuka Panduan Sholat (10.Sujud)

    10.Sujud

    Objek

    Animasi

    Penjelasan

    Arabic

    Latin

    Arti

  • 100

    28. Rancangan Antarmuka Panduan Sholat (11.Duduk Antara 2 Sujud)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan duduk antara

    2 sujud berupa tulisan arab, latin dan artinya. Terdapat juga beberapa

    tombol yaitu tombol Play untuk memutar audio, Pause untuk menghentikan

    audio sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total,

    Undo untuk kembali ke menu panduan sholat, dan Home untuk kembali ke

    menu utama.

  • 101

    11.Duduk Antara

    2 Sujud

    Objek

    Animasi

    Penjelasan

    Arabic

    Latin

    Arti

  • 102

    Gambar III.28

    Rancangan Antarmuka Panduan Sholat (11.Duduk Antara 2 Sujud)

    29. Rancangan Antarmuka Panduan Sholat (12.Tasyahud Awal)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan tasyahud

    awal berupa tulisan arab, latin dan artinya. Terdapat juga beberapa tombol

    yaitu tombol Play untuk memutar audio, Pause untuk menghentikan audio

    sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo

    untuk kembali ke menu panduan sholat, dan Home untuk kembali ke menu

    utama.

  • 103

    12.Tasyahud

    Awal

    Objek

    Animasi

    Penjelasan

    Arabic

    Latin

    Arti

  • 104

    Gambar III.29.Rancangan Antarmuka Panduan Sholat (12.Tasyahud Awal)

    30. Rancangan Antarmuka Panduan Sholat (13.Tasyahud Akhir)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan tasyahud

    akhir berupa tulisan arab, latin dan artinya. Terdapat juga beberapa tombol

    yaitu tombol Play untuk memutar audio, Pause untuk menghentikan audio

    sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo

    untuk kembali ke menu panduan sholat, dan Home untuk kembali ke menu

    utama.

  • 105

    13.Tasyahud

    Akhir

    Objek

    Animasi

    Penjelasan

    Arabic

    Latin

    Arti

  • 106

    Gambar III.30.Rancangan Antarmuka Panduan Sholat (13.Tasyahud Akhir)

    31. Rancangan Antarmuka Panduan Sholat (14.Salam)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan salam berupa

    tulisan arab, latin dan artinya. Terdapat juga beberapa tombol yaitu tombol

    Play untuk memutar audio, Pause untuk menghentikan audio sesaat dan

    dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

  • 107

    14.Salam

    Objek

    Animasi

    Penjelasan

    Arabic

  • 108

    Gambar III.31.Rancangan Antarmuka Panduan Sholat (14.Salam)

    32. Rancangan Antarmuka Panduan Sholat Dzikir Sesudah Sholat

    Dalam frame ini berisikan dzikir-dzikir sesudah sholat yang terdiri dari

    bacaan dzikir-dzikir berupa tulisan arab, latin dan artinya. Terdapat juga

    beberapa tombol yaitu tombol Play untuk memutar audio, Pause untuk

    menghentikan audio sesaat dan dapat di lanjutkan kembali, Stop untuk

  • 109

    menghentikan total, Undo untuk kembali ke menu panduan sholat, dan

    Home untuk kembali ke menu utama.

  • 110

    Gambar III.32.

    Rancangan Antarmuka Panduan Sholat Dzikir Sesudah Sholat

    33. Rancangan Antarmuka Panduan Sholat Doa Sesudah Sholat

    Gambar Dzikir

    Arabic

    Arti

    Latin

  • 111

    Dalam frame ini berisikan doa-doa sesudah sholat yang terdiri dari bacaan

    doa-doa berupa tulisan arab, latin dan artinya. Terdapat juga beberapa

    tombol yaitu tombol Play untuk memutar audio, Pause untuk menghentikan

    audio sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total,

    Undo untuk kembali ke menu panduan sholat, dan Home untuk kembali ke

    menu utama.

  • 112

    Gambar III.33.

    Rancangan Antarmuka Panduan Sholat Doa Sesudah Sholat

    3.3. Implementasi dan Pengujian Unit

    Gambar Doa

    Arabic

    Arti

    Latin

  • 113

    3.3.1.Implementasi

    1. Implementasi Tampilan Splash Screen

    Tampilan ini menampilkan gambar loading selama 7 detik untuk masuk ke

    menu utama.

    Gambar III.34.Implementasi Tampilan Splash Screen

  • 114

    2. Implementasi Tampilan Menu Utama

    Pada frame ini berisikan judul aplikasi, tombol “Mulai” untuk masuk ke

    menu panduan sholat, tombol “Keluar” untuk menampilkan konfirmasi

    keluar dengan pilihan ya atau tidak, tombol “pengaturan” untuk

    menampilkan pilihan seperti audio on dan audio off. Tombol “audio on”

    untuk menghidupkan audio, tombol “audio off” untuk mematikan audio.

    Gambar III.35.Implementasi Tampilan Menu Utama

  • 115

    3. Implementasi Tampilan Panduan Sholat

    Dalam frame ini berisi Panduan Sholat dan terdapat 7 tombol yang dapat

    dipilih yaitu tombol ”Tuntunan Sholat” untuk masuk ke layout tuntunan

    sholat, tombol “Berwudhu” untuk masuk ke layout panduan berwudhu,

    tombol “Doa Sesudah Sholat” untuk masuk ke layout doa-doa sesudah

    sholat, tombol “Dzikir Sesudah Sholat” untuk masuk ke layout dzikir-dzikir

    sesudah sholat, tombol ”Undo” untuk kembali ke menu utama, tombol

    “Informasi” untuk menampilkan tujuan pembuatan aplikasi, tombol

    “Home”untuk kembali ke menu utama.

    Gambar III.36.Implementasi Tampilan Panduan Sholat

  • 116

    4. Implementasi Tampilan Panduan Berwudhu

    Dalam frame ini berisi gambar berwudhu dan terdapat 12 tombol yang

    dapat dipilih yaitu: tombol 1.Telapak Tangan berfungsi untuk masuk ke

    layout telapak tangan, 2.Mulut berfungsi untuk masuk ke layout mulut,

    3.Hidung berfungsi untuk masuk ke layout hidung , 4.Muka berfungsi untuk

    masuk ke layout muka, 5.Tangan berfungsi untuk masuk ke layout tangan,

    6.Rambut berfungsi untuk masuk ke layout rambut, 7.Telinga berfungsi

    untuk masuk ke layout telinga, 8.Kaki berfungsi untuk masuk ke layout

    kaki, Doa Sesudah Wudhu berfungsi untuk masuk ke layout doa, Yang

    Membatalkan Wudhu berfungsi untuk masuk ke layout membatalkan

    wudhu, Undo berfungsi untuk kembali ke menu panduan sholat, dan Home

    berfungsi untuk kembali ke menu utama.

    Gambar III.37.Implementasi Tampilan Panduan Berwudhu

  • 117

    5. Implementasi Tampilan Tuntunan Sholat

    Dalam frame ini berisi gambar Tuntunan Sholat dan terdapat 10 tombol

    yang dapat dipilih yaitu: Sholat Subuh, Sholat Dzuhur, Sholat Ashar, Sholat

    Maghrib, Sholat Isya, Syarat-syarat Sholat, Rukun Sholat, Yang

    Membatalkan Sholat, tombol tersebut berfungsi untuk masuk ke masing-

    masing layout yang sesuai dengan tombol yang di pilih, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

    Gambar III.38.Implementasi Tampilan Tuntunan Sholat

  • 118

    6. Implementasi Tampilan Dzikir Sesudah Sholat

    Dalam frame ini berisi gambar Dzikir Sesudah Sholat dan terdapat 15

    tombol yang dapat dipilih yaitu: Dzikir 1, Dzikir 2, Dzikir 3, Dzikir 4,

    Dzikir 5, Dzikir 6, Dzikir 7, Dzikir 8, Dzikir 9, Dzikir 10, Dzikir 11, Dzikir

    12, Dzikir 13, tombol tersebut berfungsi untuk masuk ke masing-masing

    layout yang sesuai dengan tombol yang di pilih, Undo untuk kembali ke

    menu panduan sholat, dan Home untuk kembali ke menu utama.

    Gambar III.39.Implementasi Tampilan Dzikir Sesudah Sholat

  • 119

    7. Implementasi Tampilan Doa Sesudah Sholat

    Dalam frame ini berisi Gambar Doa Sesudah Sholat dan terdapat 19

    tombol yang dapat dipilih yaitu: Doa 1, Doa 2, Doa 3, Doa 4, Doa 5, Doa 6,

    Doa 7, Doa 8, Doa 9, Doa 10, Doa 11, Doa 12, Doa 13, Doa 14, Doa 15,

    Doa 16, Doa 17, tombol tersebut berfungsi untuk masuk ke masing-masing

    layout yang sesuai dengan tombol yang di pilih, Undo untuk kembali ke

    menu doa panduan sholat, dan Home untuk kembali ke menu utama.

    Gambar III.40.Implementasi Tampilan Doa Sesudah Sholat

  • 120

    8. Implementasi Tampilan Panduan Berwudhu (1.Telapak Tangan)

    Dalam frame ini berisi Nama Halaman dan terdapat 7 tombol yang dapat

    dipilih yaitu: tombol Play untuk memutar audio, Pause untuk menghentikan

    audio sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total,

    Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk kembali ke

    menu panduan berwudhu, dan Home untuk kembali ke menu utama.

    Gambar III.41.

    Implementasi Tampilan Panduan Berwudhu (1.Telapak Tangan)

  • 121

    .9. Implementasi Tampilan Panduan Berwudhu (2.Mulut)

    Dalam frame ini berisi Nama Halaman dan terdapat 4 tombol yang dapat

    dipilih yaitu: Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk

    kembali ke menu panduan berwudhu, dan Home untuk kembali ke menu

    utama.

    Gambar III.42.Implementasi Tampilan Panduan Berwudhu (2.Mulut)

  • 122

    10. Implementasi Tampilan Panduan Berwudhu (3.Hidung)

    Dalam frame ini berisi Nama Halaman dan terdapat 4 tombol yang dapat

    dipilih yaitu: Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk

    kembali ke menu panduan berwudhu, dan Home untuk kembali ke menu

    utama.

    Gambar III.43.Implementasi Tampilan Panduan Berwudhu (3.Hidung)

  • 123

    11. Implementasi Tampilan Panduan Berwudhu (4.Muka)

    Dalam frame ini berisi Nama Halaman dan terdapat 7 tombol yang dapat

    dipilih yaitu: tombol Play untuk memutar audio, Pause untuk menghentikan

    audio sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total,

    Panah Kiri, Panah Kanan untuk pindah halaman, Undo untuk kembali ke

    menu panduan berwudhu, dan Home untuk kembali ke menu utama.

    Gambar III.44.Implementasi Tampilan Panduan Berwudhu (4.Muka)

  • 124

    12. Implementasi Tampilan Panduan Berwudhu (5.Tangan)

    Dalam frame ini berisi Nama Halaman dan terdapat 4 tombol yang dapat

    dipilih yaitu: Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk

    kembali ke menu panduan berwudhu, dan Home untuk kembali ke menu

    utama.

    Gambar III.45.Implementasi Tampilan Panduan Berwudhu (5.Tangan)

  • 125

    13. Implementasi Tampilan Panduan Berwudhu (6.Rambut)

    Dalam frame ini berisi Nama Halaman dan terdapat 4 tombol yang dapat

    dipilih yaitu: Panah Kiri, Panah Kanan untuk pindah halaman, Undo untuk

    kembali ke menu panduan berwudhu, dan Home untuk kembali ke menu

    utama.

    Gambar III.46.Implementasi Tampilan Panduan Berwudhu (6.Rambut)

  • 126

    14. Implementasi Tampilan Panduan Berwudhu (7.Telinga)

    Dalam frame ini berisi Nama Halaman dan terdapat 4 tombol yang dapat

    dipilih yaitu: Panah Kiri, Panah Kanan untuk pindah halaman, Undo untuk

    kembali ke menu berwudhu, dan Home untuk kembali ke menu utama.

    Gambar III.47.Implementasi Tampilan Panduan Berwudhu (7.Telinga)

  • 127

    15. Implementasi Tampilan Panduan Berwudhu (8.Kaki)

    Dalam frame ini berisi Nama Halaman dan terdapat 4 tombol yang dapat

    dipilih yaitu: Panah Kiri, Panah Kanan, untuk pindah halaman, Undo untuk

    kembali ke menu berwudhu, dan Home untuk kembali ke menu utama.

    Gambar III.48.Implementasi Tampilan Panduan Berwudhu (8.Kaki)

  • 128

    16. Implementasi Tampilan Panduan Berwudhu (Doa Sesudah Wudhu)

    Dalam frame ini berisi Nama Halaman dan terdapat 7 tombol yang dapat

    dipilih yaitu: tombol Play untuk memutar audio, Pause untuk menghentikan

    audio sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total,

    Panah Kiri, Panah Kanan untuk pindah halaman, Undo untuk kembali ke

    menu panduan berwudhu, dan Home untuk kembali ke menu utama.

    Gambar III.49

  • 129

    Implementasi Tampilan Panduan Berwudhu (Doa Sesudah Wudhu)

    17. Implementasi Tampilan Panduan Berwudhu (Yang Membatalkan)

    Dalam frame ini berisi Nama Halaman dan terdapat 4 tombol yang dapat

    dipilih yaitu: Panah Kiri, Panah Kanan untuk mengatur arah, Undo untuk

    kembali ke menu panduan berwudhu, dan Home untuk kembali ke menu

    utama.

    Gambar III.50.

  • 130

    Implementasi Tampilan Panduan Berwudhu (Yang Membatalkan)

    18. Implementasi Tampilan Panduan Sholat (1.Niat Sholat)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari Gambar dan

    penjelasan rakaat, rukun sholat, menampilkan animasi gerakan sholat,

    penjelasan dari gerakan sholat, bacaan niat sholat berupa tulisan arab, latin

    dan artinya. Terdapat juga beberapa tombol yaitu tombol Play untuk

    memutar audio, Pause untuk menghentikan audio sesaat dan dapat di

    lanjutkan kembali, Stop untuk menghentikan total, Undo untuk kembali ke

    menu panduan sholat, dan Home untuk kembali ke menu utama.

  • 131

    Gambar III.51.Implementasi Tampilan Panduan Sholat (1.Niat Sholat)

    19. Implementasi Tampilan Panduan Sholat (2.Takbiratul Ikhram)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari penjelasan

    rakaat, rukun sholat, menampilkan animasi gerakan sholat, penjelasan dari

    gerakan sholat, bacaan takbiratul ikhram berupa tulisan arab, latin dan

    artinya. Terdapat juga beberapa tombol yaitu tombol Play untuk memutar

    audio, Pause untuk menghentikan audio sesaat dan dapat di lanjutkan

  • 132

    kembali, Stop untuk menghentikan total, Undo untuk kembali ke menu

    panduan sholat, dan Home untuk kembali ke menu utama.

    Gambar III.52.

    Implementasi Tampilan Panduan Sholat (2.Takbiratul Ikhram)

    20. Implementasi Tampilan Panduan Sholat (3.Iftitah)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan iftitah berupa

    tulisan arab, latin dan artinya. Terdapat juga beberapa tombol yaitu tombol

    Play untuk memutar audio, Pause untuk menghentikan audio sesaat dan

  • 133

    dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

    Gambar III.53.Implementasi Tampilan Panduan Sholat (3.Iftitah)

    21. Implementasi Tampilan Panduan Sholat (4.Al-Fatihah)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan al-fatihah

    berupa tulisan arab, latin dan artinya. Terdapat juga beberapa tombol yaitu

  • 134

    tombol Play untuk memutar audio, Pause untuk menghentikan audio sesaat

    dan dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

    Gambar III.54.Implementasi Tampilan Panduan Sholat (4.Al-Fatihah)

    22. Implementasi Tampilan Panduan Sholat (5.Bacaan Setelah Al-Fatihah)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan setelah al-

  • 135

    fatihah berupa tulisan arab, latin dan artinya. Terdapat juga beberapa tombol

    yaitu tombol Play untuk memutar audio, Pause untuk menghentikan audio

    sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo

    untuk kembali ke menu panduan sholat, dan Home untuk kembali ke menu

    utama.

    Gambar III.55

    Implementasi Tampilan Panduan Sholat (5.Bacaan Setelah Al-Fatihah)

    23. Implementasi Tampilan Panduan Sholat (6.Ruku)

  • 136

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan ruku berupa

    tulisan arab, latin dan artinya. Terdapat juga beberapa tombol yaitu tombol

    Play untuk memutar audio, Pause untuk menghentikan audio sesaat dan

    dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

    Gambar III.56.Implementasi Tampilan Panduan Sholat (6.Ruku)

  • 137

    24. Implementasi Tampilan Panduan Sholat (7.Bangkit dari Ruku)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan bangkit dari

    ruku berupa tulisan arab, latin dan artinya. Terdapat juga beberapa tombol

    yaitu tombol Play untuk memutar audio, Pause untuk menghentikan audio

    sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo

    untuk kembali ke menu panduan sholat, dan Home untuk kembali ke menu

    utama.

    Gambar III.57.

    Implementasi Tampilan Panduan Sholat (7.Bangkit dari Ruku)

  • 138

    25. Implementasi Tampilan Panduan Sholat (8.I`tidal)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan i`tidal berupa

    tulisan arab, latin dan artinya. Terdapat juga beberapa tombol yaitu tombol

    Play untuk memutar audio, Pause untuk menghentikan audio sesaat dan

    dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

    Gambar III.58.Implementasi Tampilan Panduan Sholat (8.I`tidal)

  • 139

    26. Implementasi Tampilan Panduan Sholat (9.Doa Qunut)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan doa qunut

    berupa tulisan arab, latin dan artinya. Terdapat juga beberapa tombol yaitu

    tombol Play untuk memutar audio, Pause untuk menghentikan audio sesaat

    dan dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

    Gambar III.59.Implementasi Tampilan Panduan Sholat (9.Doa Qunut)

  • 140

    27. Implementasi Tampilan Panduan Sholat (10.Sujud)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan sujud berupa

    tulisan arab, latin dan artinya. Terdapat juga beberapa tombol yaitu tombol

    Play untuk memutar audio, Pause untuk menghentikan audio sesaat dan

    dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

    Gambar III.60.Implementasi Tampilan Panduan Sholat (10.Sujud)

  • 141

    28. Implementasi Tampilan Panduan Sholat (11.Duduk Antara 2 Sujud)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan duduk antara

    2 sujud berupa tulisan arab, latin dan artinya. Terdapat juga beberapa

    tombol yaitu tombol Play untuk memutar audio, Pause untuk menghentikan

    audio sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total,

    Undo untuk kembali ke menu panduan sholat, dan Home untuk kembali ke

    menu utama.

    Gambar III.61.

  • 142

    Implementasi Tampilan Panduan Sholat (11.Duduk Antara 2 Sujud)

    29. Implementasi Tampilan Panduan Sholat (12.Tasyahud Awal)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan tasyahud

    awal berupa tulisan arab, latin dan artinya. Terdapat juga beberapa tombol

    yaitu tombol Play untuk memutar audio, Pause untuk menghentikan audio

    sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo

    untuk kembali ke menu panduan sholat, dan Home untuk kembali ke menu

    utama.

  • 143

    Gambar III.62.Implementasi Tampilan Panduan Sholat (12.Tasyahud Awal)

    30. Implementasi Tampilan Panduan Sholat (13.Tasyahud Akhir)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan tasyahud

    akhir berupa tulisan arab, latin dan artinya. Terdapat juga beberapa tombol

    yaitu tombol Play untuk memutar audio, Pause untuk menghentikan audio

    sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo

  • 144

    untuk kembali ke menu panduan sholat, dan Home untuk kembali ke menu

    utama.

    Gambar III.63.Implementasi Tampilan Panduan Sholat (13.Tasyahud Akhir)

    31. Implementasi Tampilan Panduan Sholat (14.Salam)

    Dalam frame ini berisikan Panduan Sholat yang terdiri dari menampilkan

    animasi gerakan sholat, penjelasan dari gerakan sholat, bacaan salam berupa

    tulisan arab, latin dan artinya. Terdapat juga beberapa tombol yaitu tombol

    Play untuk memutar audio, Pause untuk menghentikan audio sesaat dan

  • 145

    dapat di lanjutkan kembali, Stop untuk menghentikan total, Undo untuk

    kembali ke menu panduan sholat, dan Home untuk kembali ke menu utama.

    Gambar III.64.Implementasi Tampilan Panduan Sholat (14.Salam)

    32. Implementasi Tampilan Panduan Sholat Dzikir Sesudah Sholat

    Dalam frame ini berisikan dzikir-dzikir sesudah sholat yang terdiri dari

    bacaan dzikir-dzikir berupa tulisan arab, latin dan artinya. Terdapat juga

    beberapa tombol yaitu Panah Kiri, Panah Kanan berfungsi untuk pindah

  • 146

    halaman, tombol Play untuk memutar audio, Pause untuk menghentikan

    audio sesaat dan dapat di lanjutkan kembali, Stop untuk menghentikan total,

    untuk pindah halaman, Undo untuk kembali ke menu panduan sholat, dan

    Home untuk kembali ke menu utama.

    Gambar III.65.

    Implementasi Tampilan Panduan Sholat Dzikir Sesudah Sholat

    33. Implementasi Tampilan Panduan Sholat Doa Sesudah Sholat

    Dalam frame ini berisikan tampilan doa sesudah sholat yang terdiri dari

    bacaan doa sesudah sholat berupa tulisan arab, latin dan artinya. Terdapat

    juga beberapa tombol yaitu tombol Play untuk memutar audio, Pause untuk

  • 147

    menghentikan audio sesaat dan dapat di lanjutkan kembali, Stop untuk

    menghentikan total, Panah kiri, Panah kanan, untuk pindah halaman, Undo

    untuk kembali ke menu panduan sholat, dan Home untuk kembali ke menu

    utama.

    Gambar III.66.Implementasi Tampilan Panduan Sholat Doa Sesudah Sholat

    3.3.2. Pengujian Unit

    1. Blackbox Testing

  • 148

    Pengujian terhadap program yang dibuat menggunakan blackbox testing

    yang fokus terhadap proses masukan dan keluaran program.

    Pengujian Unit :

    Tabel III.34

    Hasil Pengujian Black Box Testing

    Input/Even Proses Output/Next

    Stage

    Hasil

    Pengujian

    Tombol

    “Mulai”

    Menampilkan

    Tampilan

    Panduan

    Sholat

    Sesuai

    Tombol

    “Keluar”

    Menampilkan

    Tampilan

    Konfirmasi

    Keluar

    Sesuai

    Tombol

    “Setting”

    Menampilkan

    Tampilan

    Tombol

    Pilihan

    Sesuai

    Tabel III.34

  • 149

    Hasil Pengujian Black Box Testing (Lanjutan 1)

    Input/Even Proses Output/Next

    Stage

    Hasil

    Pengujian

    Tombol

    “Panah Kiri

    dan Kanan”

    Untuk

    menggeser

    tampilan

    selanjutnya

    atau

    sebelumnya

    Sesuai

    Tombol

    “Home”

    Kembali

    kemenu

    Utama

    Sesuai

  • 150

    Tabel III.34

    Hasil Pengujian Black Box Testing (Lanjutan 2)

    Input/Even Proses Output/Next

    Stage

    Hasil

    Pengujian

    Tombol

    “Undo”

    Untuk

    kembali

    kemenu

    sebelumnya

    Sesuai

    Tombol

    ”Informasi”

    Menampilkan

    Tujuan

    Pembuatan

    Aplikasi

    Sesuai

    Tombol

    “Berwudhu

    Menampilkan

    Panduan

    Berwudhu

    Sesuai

  • 151

    Tabel III.34

    Hasil Pengujian Black Box Testing (Lanjutan 3)

    Input/Even Proses Output/Next

    Stage

    Hasil

    Pengujian

    Tombol

    “Tuntunan

    Sholat”

    Menampilkan

    Panduan

    Sholat

    Sesuai

    Tombol

    “Dzikir”

    Menampilkan

    Panduan

    Dzikir

    Sesuai

    Tombol

    “Doa

    Sesudah

    Sholat”

    Menampilkan

    Panduan Doa

    Sesudah

    Sholat

    Sesuai

  • 152

    Tabel III.34

    Hasil Pengujian Black Box Testing (Lanjutan 4)

    Input/Even Proses Output/Next

    Stage

    Hasil

    Pengujian

    Tombol

    “Membatal

    kan

    Wudhu”

    Menampilkan

    Penjelasan

    yang

    Membatalkan

    Wudhu

    Sesuai

    Tombol

    “Doa

    Sesudah

    Wudhu”

    Menampilkan

    Halaman Doa

    Sesudah

    Wudhu

    Sesuai

    Tombol

    “Doa1”

    Menampilkan

    Halaman

    Doa-doa

    Sesudah

    Sholat

    Sesuai

  • 153

    Tabel III.34

    Hasil Pengujian Black Box Testing (Lanjutan 5)

    Input/Even Proses Output/Next

    Stage

    Hasil

    Pengujian

    Tombol

    “Dzikir1”

    Menampilkan

    Halaman

    Dzikir-dzikir

    Sesudah Sholat

    Sesuai

    Tombol

    “Play”

    Untuk

    Memutar

    Audio

    Sesuai

    Tombol

    “Pause”

    Untuk

    Menghentikan

    Audio

    Sementara

    Sesuai

  • 154

    Tombol

    “Stop”

    Untuk

    Mematikan

    Audio

    Sesuai

    2. Penerimaan User Terhadap Aplikasi “Panduan Sholat”

    Pertanyaan Kuesioner dan grafiknya :

    Tabel III.35

    Pengujian Kuesioner

    KUESIONER

    APLIKASI “PANDUAN SHOLAT”

    Untuk Mengetahui Penerimaan User Terhadap Aplikasi “Panduan Sholat”

    Kami sangat berterima kasih apabila berkenan untuk meluangkan waktu

    mengisi kuesioner ini.

    Profesi : Pelajar ( ) Mahasiswa ( ) Karyawan (

    )

    Umur :

    Jenis Kelamin : ( ) Laki-Laki ( ) Perempuan

    Berilah tanda Centang (v) pada kolom di masing-masing pertanyaan di

    bawah ini yang menurut anda sesuai dengan yang anda rasakan setelah

    mencoba menggunakan aplikasi “Panduan Sholat”.

    STS :

    TS :

    S :

    SS :

    N Pertanyaan ST TS S SS

  • 155

    o S

    Tampilan Aplikasi

    1 Tampilan aplikasi "Panduan Sholat" sangat

    menarik untuk digunakan?

    2 Warna pada aplikasi "Panduan Sholat" tidak

    membosankan?

    3 tampilan aplikasi "Panduan Sholat" mudah

    dipahami dan mudah untuk digunakan?

    Tujuan Aplikasi

    4 Dengan aplikasi "Panduan Sholat" sangat

    membatu anak-anak dan pemula untuk

    mempelajari sholat?

    5 Dengan aplikasi "Panduan Sholat" dapat

    meningkatkan keingin tahuan dalam pendidikan

    agama?

    6 Dengan aplikasi "Panduan Sholat" sangat

    mempermudah untuk anak-anak dan pemula untuk

    menghafal doa-doa?

    Kemudahan Pengguna (User Frindly)

    7 Bentuk tombol pada aplikasi "Panduan Sholat"

    mudah di pahami?

    8 Aplikasi "Panduan Sholat" mudah untuk

    dioprasikan?

    9 Aplikasi "Panduan Sholat" tidak berat saat di

    jalankan?

    10 Secara keseluruhan saya puas dengan aplikasi ini?

    Tabel III.36

    Rekapitulasi Jawaban Kuesioner

    No Responden

    Pertanyaan

    Tampilan Tujuan Kemudahan

    1 2 3 4 5 6 7 8 9 10

    1 Responden 1 4 3 4 4 4 3 4 3 4 4

    2 Responden 2 4 4 4 3 4 3 4 4 4 4

    3 Responden 3 3 4 3 4 4 4 3 4 4 4

    4 Responden 4 4 4 4 4 4 4 4 3 4 4

  • 156

    5 Responden 5 4 3 4 4 3 3 4 4 4 3

    6 Responden 6 4 4 3 4 4 4 3 4 3 4

    7 Responden 7 3 4 4 3 4 4 4 4 4 4

    8 Responden 8 4 3 4 4 4 4 4 4 4 4

    9 Responden 9 2 4 3 3 4 3 3 4 3 3

    10 Responden 10 4 4 3 4 4 4 3 4 4 4

    Tampilan Tujuan Aplikasi Kemudahan

    TST TS S SS TST TS S SS TST TS S SS

    0 1 9 20 0 0 8 22 0 0 10 30

    Total Jawaban

    "Sangat tidak

    setuju=1"

    0

    Total Jawaban

    "Tidak setuju=2"

    1

    Total Jawaban

    "Setuju=3"

    27

    Total Jawaban

    "Sangat setuju=4"

    72

    Tabel III.37

    Tampilan Grafik Kuesioner

    10

    9

    8

    7

    6

    5

    4

  • 157

    Dari hasil jawaban responden pada kuesioner penerimaan user terhadap

    aplikasi panduan sholat di uji menggunakan kuesioner dengan 10 pertanyaan dari

    10 orang responden. Pada kategori tampilan pertanyaan 1 mendapat respon baik

    70% pengguna merasa aplikasi menarik untuk digunakan, pada pertanyaan 2

    responden merespon 70% sangat setuju warna pada aplikasi tidak membosankan,

    dan pertanyaan 3 responden merespon baik 60% tampilan pada aplikasi mudah

    untuk digunakan, kemudian kategori tujuan aplikasi pada pertanyaan 4 responden

    merespon baik 70% responden sangat setuju aplikasi dapat membantu anak-anak

    dan pemula untuk mempelajari sholat, pada pertanyaan 5 respon 90% responden

    sangat setuju aplikasi panduan sholat dapat meningkatkan keingin tahuan dalam

    pendidikan agama, dan pada pertanyaan 6 respon 60% responden sangat baik

    aplikasi panduan sholat sangat mempermudah untuk anak-anak dan pemula untuk

    menghafal doa-doa. Dan pada kategori kemudahan penggunaan pertanyaan 7

  • 158

    respon 60% responden merasa bentuk tombol pada aplikasi panduan sholat mudah

    di pahami sehingga fungsi dari aplikasi dinilai baik, pada pertanyaan 8 respon

    80% dari responden setuju bahwa aplikasi mudah untuk dioprasikan, pada

    pertanyaan 9 respon 80 % responden sangat setuju bahwa aplikasi tidak berat pada

    saat di jalankan, dan pada pertanyaan 10 respon 80% dari responden secara

    keseluruhan puas dengan aplikasi panduan sholat.

    3.3.3. Kompilasi Aplikasi

    Setelah pembuatan aplikasi dengan Construct 2 agar bisa digunakan pada gadget

    Android, maka file harus berextensi Apk. Sebelum kita konversi ke file Apk

    project yang telah kita buat pada Construct 2 kita export ke library Cordova

    terlebih dahulu.

    Caranya sebagai berikut:

    1. Pilih menu file- export project - pilih library Cordova - pilih next.

    2. Setelah itu buat folder baru yang akan menyimpan file game yang akan kita

    export-setelah selesai membuat folder-pilih next.

    3. Pada bagian menu export audio files for - centang di bagian IOS, Windows

    Phone (.m4a) dan centang pada bagian - Android, any other platform(.ogg)

    bagian ini untuk mengatur format audio game yang kita buat baik

    IOS,Windows maupun Android.

    4. Pada bagian menu minimum supported OSs - pilih 7.0+ pada minimum

    IOS, untuk batas OS minimum game yang akan bisa dimainkan pada IOS

    dan pada bagian minimum Android - pilih 4.0+ untuk batas OS minimum

    game yang bisa dimainkan pada gadget Android.

  • 159

    5. Setelah melakukan pengisian pada bagian menu export - selanjutnya pilih

    export dan tunggu export selesai sampai tampil konfirmasi export sukses.

    6. File yang telah kita export akan berformat Jscript Script file dan XML

    dokumen. Pada tahap ini belum bisa dikatakan selesai file yang telah di

    export tadi akan kita upload lagi ke aplikasi Intel XDK untuk menjadikan

    file berextensi Apk.

    7. Buka aplikasi Intel XDK- pilih menu Import your HTML5 Code Base.

    8. Pada bagian Import From – pilih folder aplikasi yang di export tadi - setelah

    itu pilih “Continue” - setelah itu tampil konfigurasi pilih library Cordova -

    pilih “Continue” akan tampil konfigurasi sukses.

    9. Setelah konfigurasi selesai maka akan tampil beberapa tab menu, pilih tab

    menu “Build”. Kita tinggal pilih file berextensi apa yang kita ingin jadikan

    game tersebut, klik icon IOS, Windows ataupun Android.

    10. Kita pilih Icon Android - pada buil setting isi data-data tentang aplikasi

    yang kita buat dan Mengantur jenis aplikasi yang bisa di main kan di gadget

    landscape atau portrait. Setelah selesai pilih “Done”.

    11. Pada icon Android centang icon tersebut dan pilih icon gembok untuk

    membuka proses upload file dan isi password yang kita daftar pada aplikasi

    Intel XDK setelah itu pilih “Start Builds” untuk meng-comfile game tersebut

    menjadi Apk - dan tunggu proses upload file selesai.

    12. Setelah upload selesai, download Apk game tersebut dan instal ke gadget

    Android, aplikasi tersebut sudah bisa dimainkan pada smartphone.