BAB III ANALISA DAN PERANCANGAN 3.1.Analisa Suatu perancangan dibutuhkan adanya analisa sistem, dikarenakan agar perancangan tersebut dapat dilihat kelebihan maupun kekurangannya. Dengan adanya analisa ini maka perancangan dapat terstruktur dengan baik dan maksimal, baik dalam segi sistemnya maupun perancangan aplikasinya. Analisa tahap pembelajaran ini sangat perlu dilakukan agar tujuan dari pembelajaran aplikasi ini dapat tercapai dengan baik. Tahapan pembelajaran yang akan digunakan pada aplikasi ini disesuaikan dengan teori yang telah di uraikan pada bab sebelumnya. Pengguna aplikasi ini dapat belajar tentang fauna reptil dari beberapa materi yang diberikan, setelah itu pengguna juga dapat melakukan evaluasi beberapa soal tebak gambar yang diberikan untuk hasil yang telah di peroleh pengguna tersebut. 3.2.Perancangan Pada tahap ini penulis melakukan perancangan aplikasi berupa perancangan desain struktur navigasi, hirarki menu, perancangan flowchart, perancangan storyline, dan perancangan storyboard. 3.3.Desain Struktur Navigasi Pada Navigasi ini memudahkan untuk merancang aplikasi yang akan dibuat dalam menentukan lokasi pada setiap halaman yang ada. Berikut ini adalah gambar struktur navigasi dari aplikasi media pembelajaran tentang fauna reptil.
27
http://digilib.mercubuana.ac.id/
28
Apa Itu Reptilia
Materi Reptilia
Pertahanan Reptilia Makanan Dan Mencari Makan Reproduksi Reptilia
Penyu Ordo Chelonia Kura-kura
Kadal Ordo Squamata Ular Ragam Reptilia
Loading Bar
Ordo Crocodilia
Buaya
Ordo Sphenodontia
Tuatara
Menu Utama
Fakta Unik
Latihan Soal
Tentang Aplikasi
Keluar Aplikasi
Gambar : 3.1 Struktur Navigasi Aplikasi Media Pembelajaran Tentang Fauna Reptil.
http://digilib.mercubuana.ac.id/
29
3.4.Hirarki Menu Hierarki menu yang digunakan adalah hierarchial model untuk memberikan gambaran tentang beberapa susunan file yang nantinya akan dibuat. Secara hierarki “Aplikasi Media Pembelajaran Tentang Fauna Reptil” dapat digambarkan sebagai berikut : 3.4.1.
Hirarki Menu Utama
Pada menu utama terdapat beberapa menu diantaranya menu materi reptilia, menu ragam reptilia, menu fakta unik, menu latihan soal, menu tentang aplikasi, dan tombol keluar. Menu Utama
Materi Reptilia
Ragam Reptilia
Fakta Unik
Latihan Soal
Tentang Penulis
Keluar
Gambar : 3.2 Hirarki Menu Utama
3.4.2.
Hirarki Materi Reptilia
Pada menu materi reptilia ini terdapat beberapa materi, diantaranya materi apa itu reptilia?, materi pertahanan reptilia, materi makanan dan mencari makan, materi reprodusi reptilia.
http://digilib.mercubuana.ac.id/
30
Apa itu reptilia
Pertahanan reptilia
Materi Reptilia
Makanan dan mencari makan
Reproduksi reptilia
Gambar : 3.3 Hirarki Menu materi reptilia
3.4.3. Hirarki Ragam Reptilia Pada menu ragam reptilia terdapat 4 kelompok jenis reptil yaitu, Ordo Chelonia, Ordo Squamata, Ordo Crocodilia, Ordo Sphenodontia. Ragam Reptilia
Ordo Chelonia
Penyu
Ordo Crocodilia
Ordo Squamata
Kura-kura
Kadal
Ular
Buaya
Gambar : 3.4 Hirarki Menu ragam reptilia
http://digilib.mercubuana.ac.id/
Ordo Sphenodontia
Tuantara
31
3.4.4. Hirarki Latihan Soal Pada menu soal latihan terdapat soal-soal latihan sesuai dengan teori/materi yang terkait, terdapat dialog kembali ke menu, dan mulai lagi setelah mengklik tombol selesai. Latihan Soal
Score
Mulai Lagi
Kembali ke Menu
Gambar : 3.5 Hirarki Menu Latihan Soal
3.4.5.
Tentang Aplikasi
Pada menu tentang aplikasi ini yaitu menu yang menerangkan profil pembuat, terdapat tombol kembali ke menu, dan tombol keluar aplikasi. About
Kembali ke Menu
Keluar Aplikasi
. Gambar : 3.6 Hirarki Menu Tentang Aplikasi
3.5.Perancangan Bagan Alir (Flowchart) Sistem flowchart menggunakan tahapan proses dari suatu sistem, termasuk sistem multimedia.
http://digilib.mercubuana.ac.id/
32
Perancangan Flowchart Menu Utama Start
Tampilan Splash
Menu Utama : 1.Materi Reptilia 2.Ragam Reptilia 3.Fakta Unik 4.Latihan Soal 5.About
Tidak
Materi Reptilia
Pilihan -1 Ya
Tidak
Ragam Reptilia
Pilihan -2 Ya
Tidak Pilihan -3
Tampilan Layar Fakta Unik Ya
Tidak Tampilan Layar Latihan Soal
Pilihan -4 Ya
Ya
Ya Pilihan -5
Tampilan Layar About
Kembali Ke Menu
Tidak Tidak Tidak EXIT Ya
END
Gambar : 3.7 Rancangan Flowchart Menu Utama
http://digilib.mercubuana.ac.id/
33
Perancangan Flowchart Materi Reptilia
Materi Reptilia
Pilih Menu: 1.Apa itu Reptilia? 2.Pertahanan Reptilia 3.makanan dan mencari makan 4.Reproduksi Reptilia
Ya Tampilan Layar Apa itu Reptil
Pilihan -1
Tidak
Ya Pertahanan Reptilia
Pilihan -2
Tidak
Ya Makanan Dan Mencari Makan
Pilihan -3
Tidak
Ya Pilihan -4
Reproduksi Reptilia
Tidak
Menu Utama
Gambar : 3.8 Rancangan Flowchart Materi Reptilia
http://digilib.mercubuana.ac.id/
34
Perancangan Flowchart Ragam Reptilia Ragam Reptilia
Pilihan : 1.Ordo Chelonia 2.Ordo Squamata 3.Ordo Crocodilia 4.Ordo Sphenodontia Kura-kura
Tidak
Ya Pilihan - 1
Ordo Chelonia
Pilih hewan Penyu
Kadal Tidak
Ya Pilihan - 2
Ordo Squamata
Pilih hewan
Ular
Ya
Tidak Pilihan - 3
Tidak
Ordo Crocodilia
Buaya
Ya Pilihan - 4
Ordo Sphenodontia
END
Gambar : 3.9 Rancangan Flowchart Ragam Reptilia
http://digilib.mercubuana.ac.id/
Tuatara
35
3.6.Perancangan Storyline Dalam proses pembuatan sebuah aplikasi storyline sangat penting untuk menentukan apa saja yang harus dibuat untuk tahap selanjutnya nantinya sesuai dengan informasi yang ingin disampaikan. 3.6.1. Scene Intro Intro atau tampilan judul pembuka yang pertama kali muncul saat program aplikasi dijalankan, scene intro ini menampilkan halaman judul aplikasi, berupa splash yang menuju ke menu utama. 3.6.2. Scene Menu Utama Scene Menu utama ini menampilkan enam tombol button yang berjajar secara horizontal. Pada tiap tombol akan menuju ke masing-masing scene, diantaranya scene materi reptilia, scene ragam reptilia, scene fakta unik, scene latihan soal, scene tentang penulis, dan tombol exit untuk keluar dari aplikasi ini. 3.6.3. Scene Materi Reptilia Pada scene ini, user akan masuk ke halaman materi reptilia. Terdapat beberapa pilihan utama penjelasan materi-materi dasar tentang teori ini, yaitu: 1. Apa itu reptilia? 2. Pertahanan Reptilia 3. Makanan dan mencari makan 4. Reproduksi reptilia 3.6.4. Scene Apa Itu Reptil ? Pada scene pengenalan materi ini berisi berbagai penjelasan materi dasar pengenalan definisi reptilia.
3.6.5. Scene Pertahanan Reptilia Pada scene pengenalan materi ini berisi berbagai penjelasan materi mengenai pertahanan reprilia.
http://digilib.mercubuana.ac.id/
36
3.6.6. Scene Makanan dan Mencari Makan Pada scene pengenalan materi ini berisi berbagai penjelasan materi mengenai makanan dan mencari makan. 3.6.7. Scene Reproduksi Reptilia Pada scene pengenalan materi ini berisi berbagai penjelasan materi mengenai reproduksi reptilian. 3.6.8. Scene Ragam Reptilia Pada scene ragam reptilia ini, berisi beberapa pilihan tautan yang nantinya akan menuju ke penjelasan jenis reptilia. Diantaranya : 1. Ordo Chelonia 2. Ordo Squamata 3. Ordo Crocodila 4. Ordo Sphenodontia 3.6.9.
Scene Ordo Chelonia
Pada scene Ordo Chelonia ini berisi penjelasan dari sub ordo dan juga terdapat gambar dari sub ordo tersebut. Di bawah penjelasan tersebut terdapat dua tombol button, yang salah satunya mengarah ke jenis hewan reptilia tersebut. yaitu : 1) Penyu 2) kura-kura. 3.6.10. Scene jenis hewan reptil [ Penyu ] Pada scene ini terdapat beberapa gambar jenis hewan penyu dalam bentuk grid view. 3.6.11. Scene jenis hewan reptil [ kura-kura ] Pada scene ini terdapat beberapa gambar jenis hewan kura-kura dalam bentuk grid view.
http://digilib.mercubuana.ac.id/
37
3.6.12. Scene Ordo Squamata Pada scene Ordo squamata ini berisi penjelasan dari sub ordo dan juga terdapat gambar dari sub ordo tersebut. Di bawah penjelasan tersebut terdapat dua tombol button, yang salah satunya mengarah ke jenis hewan reptilia tersebut,yaitu: 1) Kadal 2) Ular 3.6.13. Scene jenis hewan reptil [ Kadal ] Pada scene ini terdapat beberapa gambar jenis hewan kadal dalam bentuk grid view. 3.6.1. Scene jenis hewan reptil [ Ular ] Pada scene ini terdapat beberapa gambar jenis hewan ular dalam bentuk grid view.
3.6.14.
Scene Ordo Crocodilia
Pada scene Ordo Crocodilia ini berisi penjelasan dari sub ordo dan juga terdapat gambar dari sub ordo tersebut. Di bawah penjelasan tersebut terdapat tombol button, yaitu : 1) Buaya 3.6.15.
Scene jenis hewan reptil [ Buaya ]
Pada scene ini terdapat beberapa gambar jenis hewan buaya dalam bentuk grid view. Scene Sphenodontia
3.6.16.
Pada scene Ordo Sphenodontia ini berisi penjelasan dari sub ordo dan juga terdapat gambar dari sub ordo tersebut. Di bawah penjelasan tersebut terdapat tombol button, yaitu : 1) Tuatara 3.6.17.
Scene jenis-jenis hewan reptil [ Tuatara ]
Pada scene ini terdapat beberapa gambar jenis hewan tuatara dalam bentuk grid view.
http://digilib.mercubuana.ac.id/
38
3.6.18.
Scene About
Pada scene about ini berisi penjelasan tentang profil dari si pembuat aplikasi tersebut. 3.7.Perancangan Storyboard Storyboard merupakan deskripsi dari masing-masing tampilan dari kejadian yang akan dimainkan. Dengan mencantumkan semua objek serta komponenkomponen aplikasi yang akan dibuat. Dalam satu kolom storyboard mewakili satu tampilan dilayar monitor. Berikut beberapa susunan storyboard yang dibuat:
3.7.1. Halaman Judul Pembuka Halaman judul Pembuka merupakan tampilan awal masuk aplikasi. Pada halaman ini, halaman judul pembuka berupa splash yang akan menampilkan halaman utama aplikasi.
Gambar 3.10 Storyboard Halaman Loading Bar
http://digilib.mercubuana.ac.id/
39
3.7.2.
Halaman Pengantar (Menu Utama) Setelah halaman splash tampil, maka akan masuk ke dalam halaman
menu utama. Pada halaman menu utama, terdapat enam tombol, Tomboltombol tersebut secara terurut terdiri dari “Materi Reptilia”, “Ragam Reptilia”, “Fakta Unik”, “Latihan Soal”, “Tentang Penulis”, dan “Tombol Keluar”.
Gambar 3.11 Storyboard Halaman Pengantar (Menu Utama)
3.7.3. Halaman Menu Materi Reptilia Pada halaman ini, user akan masuk ke halaman pengenalan materi. Saat memilih materi pada halaman menu, di antaranya “Apa Itu Reptil”, “Reptilia-Makanan Dan Mencari Makan”, “Reproduksi Reptil”, “Pertahanan Reptil”. Halaman materi ini menggunakan listview untuk menampilkan pilihan materi, user memilih pilihan materi yang akan dibaca dengan menekan salah satu materi yang terdapat pada listview yang sudah dibuat. Untuk kembali melihat listview materi dari tampilan informasi materi yang telah dibaca, user
http://digilib.mercubuana.ac.id/
40
menggunakan tombol kembali yang terdapat pada ponsel android. Begitu juga untuk kembali ke menu utama, user menggunakan tombol kembali.
Gambar 3.12 Storyboard Halaman Menu Materi Reptilia
Ketika ditekan salah satu listview materi di atas, maka akan menampilkan informasi materi tersebut. Rancangan tampilan halaman informasi materi dapat dilihat pada gambar dibawah ini jika list yang dipilih adalah materi “Apa itu Reptil”.
http://digilib.mercubuana.ac.id/
41
Gambar 3.13 Storyboard Halaman Menu Deskripsi apa itu Reptilia
Untuk
mempermudah
pembuatan
aplikasi,
materi
pembelajaran
tampilannya langsung menggunakan html dan file file html inilah yang dipanggil nanti dari file java. 3.7.4. Halaman Menu Ragam Reptilia Pada halaman ini menu yang dipilih adalah ragam reprilia, berisi empat macam menu kelas reptil, yaitu: menu “Ordo Chelonia”, menu ”Ordo Squamata”, menu “ Ordo Crocodila” , menu “Ordo Sphenodontia”. Berikut adalah tampilan menu ragam reptilia.
http://digilib.mercubuana.ac.id/
42
Gambar 3.14 Storyboard Halaman Menu Ragam Reptilia
Selanjutnya jika mengklik salah satu menu dari ragam reptil di atas akan masuk ke menu deskripsi ragam reptil, berikut adalah tampilannya.
Gambar 3.15 Storyboard Halaman Menu Deskripsi Ragam Reptil
http://digilib.mercubuana.ac.id/
43
Selanjutnya, pada rancangan halaman sebelumnya, jika mengklik tombol jenis-jenis reptil, Maka akan menampilkan halaman menu jenisjenis reptil dalam bentuk gridview maka akan tampak halaman menu seperti pada gambar dibawah ini
Gambar 3.16 Storyboard Halaman Menu jenis-jenis Reptilia
3.7.5. Halaman Menu Fakta Unik Pada halaman menu ini, terdapat beberapa fakta-fakta menarik seputar fauna reptil. Halaman ini di buat menggunakan html agar dapat mempermudah pembuatan aplikasi.
http://digilib.mercubuana.ac.id/
44
Gambar 3.17 Storyboard Halaman Menu Fakta Unik
3.7.6. Halaman Menu Latihan Soal Pada halaman ini pengguna akan masuk ke halaman latihan soal, berisi soal-soal latihan mengenai materi yang terkait untuk menguji sejauh mana user dalam memahami materi. Berikut ini adalah halaman tampilan latihan soal.
Gambar 3.18 Storyboard Halaman Menu Latihan Soal
http://digilib.mercubuana.ac.id/
45
3.7.7. Halaman Menu About Pada halaman ini menu yang dipilih adalah about, berisi tentang penjelasan profil idenditas pembuat. Pada menu tersebut terdapat tombol “menu utama” dan “keluar”.
Gambar 3.19 Storyboard Halaman Menu About
http://digilib.mercubuana.ac.id/