BAB III ANALISA DAN PERANCANGAN

Transkripsi

1 BAB III ANALISA DAN PERANCANGAN 3.1 Analisis Sistem Pembuatan animasi pembelajaran reproduksi manusia bagi mahasiswa kedokteran di rancang berdasarkan beberapa tahap, adapun tahap pertama yang di lakukan adalah tahap analisis. Di dalam tahap analisis ini penulis menganalisa semua kebutuhan dasar yang ada pada sistem yang akan dibuat, yaitu dilakukan dengan cara mempresentasikan suatu masalah, sehingga penulis mendapatkan data spesifikasi kebutuhannya. Pada tugas akhir ini, penulis merancang suatu pembelajaran berbasis multimedia untuk materi pembelajaran reproduksi bagi mahasiswa kedokteran. Adapun materi yang akan dibahas dalam aplikasi ini yaitu sistem reproduksi pada pria, sistem reproduksi pada wanita,perkembangan teknologi reproduksi,kelainan dan penyakit organ pada sistem reproduksi. Aplikasi ini ditujukan sebagai aplikasi pendukung dalam membantu mahasiswa/i kedokteran dalam mempelajari ilmu reproduksi, dimana mahasiswa/i dapat lebih mengerti dan paham akan pelajaran sistem reproduksi. Selain itu di dalam aplikasi ini terdapat beberapa fitur seperti animasi gambar, suara, video serta kamus. Pada tahap pembuatan animasi pembelajaran sistem reproduksi manusia bagi mahasiswa kedokteran ini penulis memasukkan 3 tahapan yaitu Input, Proses dan Output yang merupakan sistem kerja dari aplikasi tersebut, diantaranya sebagai berikut: Pada proses pengambilan gambar. Gambar disimpan terlebih dahulu ke dalam direktori file penyimpanan gambar sebagai masukan lalu dalam tahap proses, terjadi pengambilan gambar tersebut dari berkas penyimpanannya dan langsung tereksekusi yang kemudian gambar tersebut akan muncul pada layar sebagai keluaran. Pada proses pengambilan suara. Suara berformat.mp3 disimpan ke dalam direktori berkas penyimpanan suara sebagai masukan lalu dalam tahap proses terjadi pengaturan sewaktu gambar atau teks keluar yang 38

2 39 kemudian suara tersebut akan tereksekusi lalu munculah keluaran berupa bunyi. Dalam proses penilaian, pertanyaan dan jawaban dibuat lalu diproses oleh sistem, pada tahap proses ini penulis mempunyai lima belas pertanyaan dimana satu pertanyaan bernilai 1, pengguna menjawab pertanyaan yang ada kemudian terjadi pencocokan jawaban, jika jawaban benar maka nilai 1 jika salah maka nilai 0 dan jumlah seluruh nilai dari seluruh pertanyaan sebagai keluaran. 3.2 Konsep Pembuatan animasi pembelajaran sistem reproduksi manusia bagi mahasiswa kedokteran ini merupakan aplikasi yang dibuat secara khusus untuk digunakan oleh mahasiswa kedokteran. Terdapat 5 tahapan yang digunakan pada perancangan aplikasi ini yaitu konsep, perancangan, pengumpulan material, pembuatan, pengujian dan distribusi. Aplikasi pembelajaran ini mempergunakan teks sebagai materi pembelajaran dan penjelasan, gambar sebagai contoh pembelajaran dan animasi sebagai pendukung pemahaman materi sistem reproduksi. Berikut ini adalah deskripsi dari konsep aplikasi ini. Tabel 3.1 Deskripsi Konsep Aplikasi Judul Pengguna Gambar Suara Animasi Pembuatan animasi pembelajaran sistem reproduksi manusia bagi mahasiswa kedokteran Mahasiswa kedokteran Menggunakan file berformat.jpg Menggunakan file.mp3 Animasi pada teks dan gambar dibuat sendiri 3.3 Perancangan Pada Tahap ini akan menjelaskan secara rinci pembuatan animasi pembelajaran reproduksi bagi mahasiswa kedokteran yang meliputi peta navigasi, pemodelan use case diagram, perancangan storyboard,sequence diagram, activity diagram dan perancangan antarmuka.

3 Perancangan Peta Navigasi Peta navigasi dapat memudahkan perancangan aplikasi yang akan dibuat untuk menentukan lokasi pada setiap halaman yang ada. Berikut ini adalah gambar peta navigasi pembuatan animasi pembelajaran sistem reproduksi manusia bagi mahasiswa kedokteran. Intro Menu Utama kamus Menu Materi quis MATERI I MATERI II MATERI III MATERI VI Reproduksi Reproduksi Teknologi Penyakit organ Sub materi Sub materi Sub materi Sub materi Gambar 3.1. Peta navigasi aplikasi pembelajaran sistem reproduksi manusia

4 Pemodelan Use Case Diagram Diagram ini menunjukkan fungsionalitas suatu sistem dan bagaimana sistem berinteraksi dengan dunia luar. Aktor memperlihatkan himpunan pengguna use case yang berinteraksi dengan sistem yang akan digunakan. Kita harus mengidentifikasi aktor dan memahami bagaimana aktor akan menggunakan dan berinteraksi dengan sistem. Pada aplikasi pembelajaran sistem reproduksi manusia, dapat diidentifikasikan bahwa aktor utamanya adalah pengguna (pengguna). Dari identifikasi aktor tersebut, maka akan didapatkan satu use case diagram dan beberapa skenario yang memperlihatkan interaksi-interaksi use case dengan aktor. Berikut use case diagram rancang bangun aplikasi pembelajaran sistem reproduksi manusia. halaman materi sub materi kuis mahasiswa kamus Gambar 3.2 Use case Diagram pembuatan animasi pembelajaran reproduksi bagi mahasiswa kedokteran

5 42 Berikut adalah deskripsi Use case yang telah digambarkan pada gambar 3.2 : Tabel 3.2 Use Case Materi Nama Halaman materi Aktor Mahasiswa kedokteran Deskripsi Pengguna dapat memilih menu materi-materi yang berisi dari materi bab 1 sampai IV Skenario 1. Pengguna memilih menu materi bab 2. Sistem masuk ke halaman materi yang didalamnya terdapat sub-sub materi yang dapat dipilih 3. Pengguna memilih submateri yang ada 4. Sistem masuk ke halaman submateri yang dipilih Kondisi Awal 1. Pengguna menerima halaman menu materi yang terdiri dari beberapa materi-materi, yaitu mengenal sistem reproduksi pada pria, mengenal sistem reproduksi pada wanita, perkembangan teknologi reproduksi, kelainan dan penyakit organ reproduksi yang didalam tiap materi tersebut terdapat sub materinya. Kondisi Akhir 1. Pengguna mempelajari menu materi yang telah dipilih

6 43 Tabel 3.3 Use Case Quis Nama Quis Aktor Mahasiswa kedokteran Deskripsi Pengguna memilih menu quis Skenario 1. Pengguna memilih menu quis 2. Sistem masuk ke halaman quis yang berisi soal-soal pilihan ganda 3. Pengguna mengerjakan soal-soal yang disediakan 4. Setelah selesai mengerjakan kemudian sistem mengecek jawaban pengguna dan menampilkan nilai dari hasil pekerjaan pengguna. Kondisi Awal 1. Pengguna menerima halaman quis 2. Pengguna menerima soal-soal pilihan ganda didalam quis Kondisi Akhir 1. Pengguna mengisi jawaban pada soal quis yang disediakan 2. Sistem akan mengecek hasil jawaban pengguna dan menampilkan nilai dari hasil pekerjaan pengguna

7 44 Tabel 3.4 Use Case kamus Nama Halaman kamus Aktor Mahasiswa kedokteran Deskripsi Pengguna dapat memilih kamus Skenario 1. Pengguna memilih menu materi kamus. 2. Sistem masuk ke halaman. 3. Pengguna memilih tombol navigasi A Z. 4.Sistem menampilkan daftar istilah biologi sesuai tombol navigasi abjad yang yang dipilih oleh pengguna. 5. Pengguna memilih daftar istilah-istilah biologi yang tersedia. 6.Sistem menampilkan penjelasan dari istilah yang telah dipilih oleh pengguna. Kondisi Awal 1.Pengguna menerima halaman menu kamus. 2. Pengguna menerima daftar istilah-istilah biologi Kondisi Akhir 1. Sistem menampilkan penjelasan daftar istilah-istilah biologi 2. Pengguna mempelajari istilah biologi yang telah dipilih

8 Perancangan Storyboard Storyboard adalah deskripsi masing-masing tampilan suatu kejadian dari movie yang akan dimainkan dengan mencantumkan semua objek atau elemen multimedia serta komponen-komponen aplikasi yang akan dibuat. Satu kolom storyboard mewakili satu tampilan dilayar monitor. Tabel 3.5 Storyboard Nama Intro Visual Form Name : Intro Link : 1 Ket : Menampilkan halaman Intro

9 46 Tabel 3.5 Storyboard ( lanjutan ) Nama Visual 1 Form Name : Menu Utama. Link : 8, 9, 10 Ket : Menampilkan halaman Menu Utama. 8 Form Name : Menu pilihan Materi. Link : 1 Ket : Menampilkan pilihan materi.

10 47 Tabel 3.5 Storyboard 8 Form Name : Menu materi I sistem reproduksi pria. Link : 1 Ket : Menampilkan halaman materi Alat Reproduksi. 8 Form Name : Menu sub materi I (Spermatogenesis) Link : 8 Ket : Menampilkan halaman materi Spermatogenesis

11 48 Tabel 3.5 Storyboard ( lanjutan ) 8 Form Name : Menu materi II Link : 8 Ket : Menampilkan halaman materi II 8 Form Name : Menu sub materi II (Persalinan & Kehamilan) Link : 8 Ket : Menampilkan halaman materi Persalinan &Kehamilan

12 49 Tabel 3.5 StoryBoard ( lanjutan) 8 Form Name : Menu sub materi II (Asi dan Manfaat) Link : 8 Ket : Menampilkan halaman materi Asi dan Manfaat 8 Form Name : Menu sub materi II (Menstruasi) Link : scene 8 Ket : Menampilkan halaman materi Menstruasi

13 50 Tabel 3.5 StoryBoard ( lanjutan ) 9 Form Name : intro kuis Link : 9 Ket : Menampilkan halaman intro kuis 9 Form Name : Halaman Menu kuis Link Ket : soal berikutnya, scene 1,keluar : Menampilkan halaman soal kuis

14 51 Tabel 3.5 Storyboard ( lanjutan ) 9 Form Name : Halaman hasil nilai kuis Link Ket : scene 9,keluar : Menampilkan Halaman hasil nilai kuis 10 Form Name : Halaman kamus istilah biologi Link : 10, 1 Ket : Menampilkan Halaman kamus

15 Pemodelan Activity Diagram Pengguna Sistem Memilih menu utama Menampilkan halaman menu utama Memilih materi bab Menampilkan halaman materi bab tidak Memilih sub materi Menampilkan submateri Exit Gambar 3.3 Activity Diagram Materi Pada Gambar 3.3 aktifitas dimulai ketika pengguna sudah masuk kedalam halaman menu utama, aktivitas selanjutnya memilih materi, ada IV materi yang dapat dipelajari yaitu mengenal sistem reproduksi pada pria, mengenal sistem reproduksi pada wanita, perkembangan teknologi reproduksi, kelainan dan penyakit organ reproduksi yang dimana di tiap-tiap materi tersebut terdapat sub materi,aktifitas selanjutnya adalah memilih sub materi yang telah disediakan,aktifitas akan selesai ketika sistem menampilkan halaman sub materi

16 53 Pengguna Sistem Memilih menu utama Menampilkan halaman menu utama Memilih menu quis Menampilkan halaman soal quis Menjawab pertanyaan Memeriksa jawaban Benar? Soal =soal+1 Hasil + 1 Hasil + 0 Soal=10 Menampilkan halaman nilai quis Gambar 3.4 Activity Diagram quis Pada Gambar 3.4 aktifitas dimulai ketika pengguna sudah masuk ke dalam menu utama, selanjutnya memilih menu quis, kemudian di dalam menu quis aktifitas selanjutnya adalah memilih soal quis, kemudian pengguna menjawab pertanyaan quis, kemudian sistem akan mengecek jawaban dan jika benar maka nilai jawaban benar bertambah satu, apabila salah maka nilai jawaban benar tidak bertambah, setelah itu sistem menghitung jumlah jawaban benar. aktifitas akan selesai ketika sistem menampilkan nilai quis.

17 54 Pengguna Sistem Memilih menu utama Menampilkan halaman menu utama Memilih menu kamus Menampilkan halaman kamus Memilih objek Menampilkan halaman objek Gambar 3.5 Activity Diagram kamus Pada Gambar 3.5 aktifitas dimulai ketika pengguna sudah masuk ke dalam menu utama, selanjutnya memilih menu kamus, kemudian di dalam menu kamus aktifitas selanjutnya adalah memilih objek, dan aktifitas akan selesai ketika sistem menampilkan objek yang dipilih Perancangan Sequence Diagram Sebuah sequence diagram secara khusus menjabarkan aktivitas sebuah skenario tunggal. Diagram tersebut menunjukkan sejumlah objek contoh dan pesan-pesan yang melewati objek-objek di dalam use case diagram (Fowler, 2005:81).

18 55 Sequence diagram menggambarkan interaksi antar objek di dalam dan disekitar sistem (termasuk pengguna, display, dan sebagainya) berupa pesan yang digambarkan terhadap waktu. Sequence diagram terdiri atas dimensi waktu dan objek-objek yang terkait. Sequence diagram biasa digunakan untuk menggambarkan skenario atau rangkaian langkahlangkah yang dilakukan sebagai respon dari sebuah event untuk menghasilkan keluaran tertentu. Dari bentuk use case yang telah digambarkan, dapat dibuat sequence diagram sesuai dengan use case yang telah dibuat sebelumnya Gambar 3.6 Sequence Diagram Materi Gambar 3.6 Pertama pengguna masuk ke menu utama, kemudian memilih menu materi kemudian sistem menampilkan halaman menu materi, selanjutnya pengguna dapat memilih menú sub materi yaitu mengenal sistem reproduksi pada pria, mengenal sistem reproduksi pada wanita, perkembangan teknologi reproduksi, kelainan dan penyakit organ reproduksi kemudian pengguna kembali ke halaman menu yang dipilih, dan sistem menampilkan halaman menu yang dipilih.

19 56 Gambar 3.7 Sequence Diagram quis Gambar 3.7 Pertama pengguna masuk ke menu utama kemudian memilih menú quis, sistem akan menampilkan halaman quis, pengguna menjawab quis, sistem mengecek jawaban, menampilkan jawaban.

20 57 Gambar 3.8 Sequence Diagram kamus Gambar 3.8 Pertama pengguna masuk ke menu utama kemudian memilih menú kamus, sistem akan menampilkan halaman kamus, pengguna memilih objek dan sistem menampilkan objek, Perancangan Antarmuka Pada bagian ini penulis membuat antarmuka dari aplikasi yang akan dibuat dan akan menunjukan dimana letak tombol satu dan lainnya untuk memulai proses pembuatan animasi pembelajaran reproduksi bagi mahasiswa kedokteran. 1. Rancangan Tampilan Pembuka atau Intro Halaman intro adalah tampilan awal pembuka sebelum memasuki halaman utama (menu utama) dari aplikasi ini, sebuah intro biasanya menampilkan gambar, logo, animasi text, bahkan ada yang menampilkan animasi yang berhubungan dengan objek tersebut. Hal ini dimaksudkan untuk menarik perhatian pengguna pada saat melihat aplikasi ini. Tautan yang ada pada halaman ini berupa button mulai ke menu utama. Pada halaman ini, pengguna dapat langsung mengoperasikan aplikasi ini.

21 58 Gambar 3.9 Tampilan Intro 2. Rancangan Tampilan Menu Utama Halaman menu utama merupakan tampilan utama program sebelum memasuki halaman menu materi. Ada tiga tautan navigasi yang ada program ini yaitu button navigasi kuis, materi, menu dan kamus yang akan menggeser kotak ditengah layar yang sudah diberikan efek animasi dengan teknik masking, dan kemudian pada kotak ditengah layar terdapat tombol yang mengarahkan pengguna ke scene yang dituju. Selain itu terdapat pula animasi teks dan tombol untuk keluar aplikasi. Gambar 3.10 Tampilan Menu Utama

22 59 3. Rancangan Tampilan Menu Pilih Materi Halaman menu materi ini adalah tampilan combobox yang berisikan pilihan materi-materi pelajaran, terdapat 4 bab materi yang masing-masing bab mempunyai sub materi. Halaman ini juga dilengkapi oleh tombol kembali ke menu utama Gambar 3.11 Tampilan Menu pilih materi 4. Rancangan Tampilan Materi Halaman materi adalah halaman selanjutnya dari halaman menu pilih materi, pada halaman ini terdapat beberapa sub materi dimana akan membawa pengguna menuju ke halaman sub-materi yang dipilih oleh pengguna, halaman ini juga dilengkapi dengan button menu yang akan menuju ke halaman menu materi pelajaran, dan navigasi next dan back untuk mengganti halaman materi karena pada satu sub-materi terdapat materi lagi.

23 60 Gambar 3.12 Tampilan Menu materi 5. Rancangan Tampilan Quis Pada halaman Quis, saat pengguna masuk ke halaman quis kemudian pengguna dapat mengisi soal-soal pilihan ganda yang ditampilkan. Setelah itu, pengguna akan dapat melihat nilai yang diperoleh dari hasil mengisi soal. Gambar 3.13 Halaman Soal Quis

24 61 Gambar 3.14 Tampilan Nilai 6. Rancangan Tampilan Kamus Halaman kamus merupakan halaman yang berisikan istilah-istilah biologi pada halaman ini terdapat tombol navigasi berupa huruf A- Z yang akan menuju pada keterangan istilah biologi,tombol menu akan menuju kembali ke halaman menu utama. Gambar 3.15 Tampilan halaman kamus