BAB III ANALISA DAN PERANCANGAN

Transkripsi

1 BAB III ANALISA DAN PERANCANGAN Sistem e-learning yang menggunakan modul aplikasi moodle telah digunakan oleh Universitas Mercu Buana sejak tahun Dengan diterapkannya sistem e-learning ini, materi kuliah tidak lagi disampaikan dalam tatap muka antara dosen dan mahasiswa secara penuh, melainkan dengan metode penyampaian materi perkuliahan secara online. Dengan metode ini semua dosen dan mahasiswa yang terlibat harus terhubung dengan internet untuk dapat mengakses sistem e-learning untuk menghadiri proses perkuliahan. Dalam proses e-learning, dosen-dosen berkewajiban untuk memberikan materi perkuliahan dan juga ujian yang biasa disebut dengan quiz untuk mahasiswa-mahasiswanya. Untuk membuat quiz, moodle telah menyediakan fasilitas atau menu yang bisa digunakan oleh dosen-dosen secara online dengan cara mengetik semua soal-soal dan jawaban-jawaban di form-form yang sudah disediakan didalamnya. Selain itu, moodle juga menyediakan fasilitas upload file yang berisi soal-soal beserta jawaban-jawabannya dalam berbagai format. Salah satu formatnya adalah format GIFT. Untuk membuat file dengan format GIFT ini, dosen-dosen harus memiliki pengetahuan tentang tata cara penulisan yang sudah standar sesuai dengan format GIFT. Pada dasarnya aplikasi ini dibangun untuk membantu dosen-dosen dalam membuat soal-soal berikut jawaban-jawaban dengan format GIFT berikut fasilitas Upload file gambar sehingga memudahkan dosen-dosen untuk membuat soal dengan attachment gambar kapanpun dan dimanapun tanpa harus selalu terhubung dengan internet. Dalam bab ini penulis akan menceritakan tentang analisa program, mulai dari identifikasi input hingga output. Juga perancangan aplikasi yang menggambarkan tentang pemodelan DFD, Flowchart dan perancangan User Interface dari aplikasi ini. Berdasarkan uraian sebelumnya, maka struktur penulisan di bab ini dimulai dari pembahasan tentang analisa input, proses hingga output. Kemudian dilanjutkan dengan perancangan tampilan aplikasi. Selanjutnya dilanjutkan 30

2 31 dengan diagram aliran data tentang bagaimana aplikasi ini berjalan dan desain antar muka dari aplikasi ini. 3.1 IDENTIFIKASI KEBUTUHAN INPUT DAN OUTPUT Identifikasi Input Dalam aplikasi pembuatan soal pilihan ganda ini memanfaatkan input dari perangkat keras external, berupa mouse dan keyboard. Aplikasi ini diperuntukkan kepada dosen-dosen yang telah memiliki user account di sistem e-learning Universitas Mercu Buana. Sesaat setelah aplikasi dijalankan user akan langsung dihadapkan pada form input dengan isian berupa: 1. Jenis pertanyaan (Multiple Choice, True/False atau Matching), 2. Uraian pertanyaan, 3. Uraian jawaban (8 jawaban), 4. Persentase bobot nilai dari masing-masing jawaban, 5. Pilihan untuk menentukan bahwa jawaban itu benar atau salah, 6. Uraian pesan notifikasi untuk jawaban yang dipilih, 7. Fasilitas untuk menyisipkan jawaban di antara uraian pertanyaan, 8. Fasilitas untuk menyisipkan gambar di antara uraian pertanyaan, 9. Fasilitas penghitungan persentase bobot nilai dari masing-masing jawaban secara otomatis, 10. Fasilitas manipulasi data soal (buat soal baru, hapus soal dan simpan soal), 11. Fasilitas import file yang berisi soal-soal yang pernah dibuat, 12. Fasilitas export soal yang sudah dibuat ke dalam file dengan format GIFT, 13. Fasilitas upload file gambar yang akan disisipkan dengan terlebih dahulu memverifikasi masukan username dan password yang terdaftar di sistem e-learning, dan 14. Fasilitas verifikasi dan pemroses file hasil upload di sistem e-learning.

3 Analisa Kebutuhan dan Sistem yang Diharapkan Aplikasi pembuatan soal pilihan ganda ini dapat menghasilkan output berupa file soal-soal e-learning dalam format GIFT sehingga dapat dibaca oleh sistem e-learning Universitas Mercu Buana. Selain itu aplikasi ini juga dapat menyimpan dan membuka file yang berisi soal-soal yang sudah pernah dibuat sebelumnya. 3.2 PERANCANGAN APLIKASI Perancangan untuk aplikasi pembuatan soal pilihan ganda ini meliputi perancangan dengan pemodelan DFD, flowchart dan perancangan User Interface Pemodelan DFD DFD untuk aplikasi pembuatan soal pilihan ganda ini dibagi menjadi 2, yaitu DFD level 0 dan DFD level DFD Level 0 User (Dosen) Form Soal dan Jawaban File GIFT A Membuat Soal dan Jawaban File Gambar B Upload File Gambar File Soal Sistem e Learning Gambar 3.1 DFD Level 0

4 33 2. DFD Level 1 Form Soal dan Jawaban A.2 Konversi Soal dan Jawaban Data SoaldanJawaban A.1 Rekam Soal dan Jawaban File GIFT A.3 Simpan Soal dan Jawaban Data Soal dan Jawaban A.4 Buka dan Baca Data File File Soal Data File Gambar 3.2 DFD Level 1 Proses A

5 34 File Gambar B.1 Konversi Gambar Ke Binary B.3 Baca Data HTTP Response Data HTTP Response Status Hasil Upload B.2 Buat Data HTTP Request Data Binary Gambar Sistem e Learning Data HTTP Response Data HTTP Request Data HTTP Request Gambar 3.3 DFD Level 1 Proses B Flowchart 1. Membuat soal baru Simpan Soal Terlebih Dahulu? Simpan Soal Kosongkan Semua Textbox Gambar 3.4 Flowchart proses membuat soal baru

6 35 2. Perancangan form soal Multiple Choice Tampilkan Textbox Jawaban, Textbox Persentase dan Checkbox Jawaban Benar/Salah Dari 1 s/d 4, Tampilkan tombol Sisipkan Jawaban, Tombol Sisipkan Gambar, Tombol Hitung Persen dan Tombol Navigasi Antar Jawaban dan Sembunyikan Checkbox Soal Benar/Salah dan Textbox Jawaban Matching Dari 1 s/d 4 Gambar 3.5 Flowchart form soal Multiple Choice 3. Perancangan form soal True/False Sembunyikan Textbox Jawaban, Textbox Persentase, Checkbox Jawaban Benar/Salah dan Textbox Jawaban Matching Dari 1 s/d 4, Sembunyikan tombol Sisipkan Jawaban, Tombol Sisipkan Gambar, Tombol Hitung Persen dan Tombol Navigasi Antar Jawaban dan Tampilkan Checkbox Soal Benar/Salah Gambar 3.6 Flowchart form soal True/False

7 36 4. Perancangan form soal Matching Sembunyikan Textbox Jawaban, Textbox Persentase, Checkbox Jawaban Benar/Salah Dari 1 s/d 4 dan Checkbox Soal Benar/Salah, Sembunyikan tombol Sisipkan Jawaban, Tombol Sisipkan Gambar, Tombol Hitung Persen dan Tombol Navigasi Antar Jawaban dan Tampilkan Textbox Jawaban Matching dari 1 s/d 4 Gambar 3.7 Flowchart form soal Matching 5. Menyisipkan jawaban ke dalam soal Cari Posisi Cursor Terakhir Di Textbox Pertanyaan Tambahkan Kode Sisipan Jawaban Setelah Cursor Gambar 3.8 Flowchart menyisipkan jawaban ke dalam soal

8 37 6. Menyisipkan gambar ke dalam soal Direktori Gambar Buat Direktori Gambar Ada Pilih File Gambar Copy File Gambar Ke Direktori Gambar Cari Posisi Cursor Terakhir Di Textbox Pertanyaan Tambahkan Kode Sisipan Gambar Setelah Cursor Gambar 3.9 Flowchart menyisipkan gambar ke dalam soal

9 38 7. Menghitung persentase jawaban I = 0, J = 0 Benar = 0 I 7 N Jawaban Ke I Kosong? I = 0 J = J + 1 I = I + 1 I < J N I = I + 1 Jawaban Ke I Benar? Jawaban Ke I Benar? Benar = Benar + 1 Persen = 100 / Benar Persen = 0 (100 / (J Benar)) Gambar 3.10 Flowchart menghitung persentase jawaban

10 39 8. Memasukkan pesan yang akan ditampilkan jika jawaban dipilih Tombol Ditekan = F1 Masukkan Isi Pesan Isi Pesan Kosong? N Hapus Data Isi Pesan Simpan/Update Data Isi Pesan Gambar 3.11 Flowchart memasukkan pesan

11 40 9. Navigasi antar-jawaban Tombol Halaman 5 s/d 8 Ditekan Tampilkan Box Jawaban 5 s/d 8 Tombol Halaman 1 s/d 4 Ditekan Tampilkan Box Jawaban 1 s/d 4 Gambar 3.12 Flowchart navigasi antar-jawaban 10. Menyimpan soal dan jawaban Simpan/Update Soal dan Jenis Soal Ke Dalam File I = 0 I 7 I = I + 1 Simpan/Update Jawaban Ke I Ke Dalam File Gambar 3.13 Flowchart menyimpan soal dan jawaban

12 Menghapus soal dan jawaban Hapus Soal dan Jenis Soal Dari Dalam File I = 0 I 7 Navigasi Soal I = I + 1 Hapus Jawaban Ke I Dari Dalam File Gambar 3.14 Flowchart menghapus soal dan jawaban 12. Membuka file yang berisi soal-soal yang pernah dibuat Pilih File Nama File Kosong? N Navigasi Soal Gambar 3.15 Flowchart membuka file

13 Export soal-soal ke dalam file dengan format GIFT OK? Ada Gambar? Upload Gambar? Upload I = 0 I < N Soal I = I + 1 J = 0 Tulis A Ke File A = Soal + Jawaban J < N Jawaban J = J + 1 Jawaban = Jawaban + Jawaban J Gambar 3.16 Flowchart export soal ke dalam file GIFT

14 Navigasi antar-soal I = Soal Ke A = Ambil Data Soal Ke I Dari File B = Ambil Jumlah Total Soal Dari File Print Soal Ke I Dari B Isi textbox Soal = A J = 0 J 7 J = J + 1 C = Ambil Data Jawaban Ke J Dari File D = Ambil Data Bobot Jawaban Ke J Dari File E = Ambil Data Pesan Jawaban Ke J Dari File Isi textbox Jawaban Ke J = C Isi textbox Bobot Ke J = D Isi tooltip textbox Jawaban Ke J = E Gambar 3.17 Flowchart navigasi antar-soal

15 Upload file gambar Connection.Open? Connection.Close A = Extract URL Halaman Web A.Host Kosong? Host Kosong Upload Berhasil Upload Gagal N D = OK? B = Convert File Gambar Ke Binary C = POST + A.URI + A.Query + Host: + A.Host + Content Type: multipart/form data, boundary= + B + Content Length: + PanjangKarakter(B) Load Complete? D = Connection.GetData Ambil Response Dari Web Server A.Port = 0 A.Port = 80 Proses Request Oleh Web Server Connection.SendData(C) Connection.Open Connection.Remote Port = A.Port Connection.Remote Host = A.Host Connection.Protocol = scktcpprotocol Gambar 3.18 Flowchart upload file gambar

16 Perancangann User Interface Perancangan User Interface dari aplikasi ini dibagi menjadi 3 (tiga), yaitu form untuk pengisiann soal multiple choice, form untuk pengisian soal true/false dan form untuk pengisian soal matching. Adapun contoh perancangannya adalah sebagai berikut: 1. Form pengisian soal multiple choice Gambar 3.19 Form pengisian soal multiple choice

17 46 2. Form pengisian soal true/false Gambar 3.20 Form pengisian soal true/false

18 47 3. Form pengisian soal matching Gambar 3.21 Form pengisian soal matching