Perancangan Sistem Pemodelan Sistem Flowchart

BAB 3 PERANCANGAN APLIKASI

3.1 Perancangan Sistem

Dalam membangun perancangan aplikasi pembelajaran ini, maka terlebih dahulu dirancang struktur dari aplikasi tersebut. Perancangan struktur ini adalah untuk merancang menu-menu apa saja yang akan dibuat didalam aplikasi pembelajaran mengenal jaringan dan subnetting. Dari menu-menu yang telah dirancang tersebut akan ditampilkan halaman-halaman tentang materi pembelajaran, contoh pembelajaran, dan latihan pembelajaran.

3.2 Pemodelan Sistem

Adapun struktur rancangan aplikasi pembelajaran mengenai jaringan dan subnetting tersebut adalah seperti pada Gambar 3.1. Aplikasi Pembelajaran Topologi Jaringan Dan Subnetting Pengenalan Materi 1 Materi 2 Materi 3 Latihan Profil Pembahasan 1 Pembahasan 2 Pembahasan 3 Gambar 3.1 Diagram Pohon Aplikasi Pembelajaran Universitas Sumatera Utara

3.3 Flowchart

Flowchart adalah gambaran dalam bentuk diagram alir dari algoritma dalam suatu program yang menyatakan arah alur program dalam menyelesaikan suatu masalah. Flowchart program dirancang untuk memudahkan struktur menu-menu dan hubungan antar menu dengan submenu serta penjelasan logika dari program yang akan dirancang. Simbol-simbol Flowchart dapat dilihat pada Tabel 3.1 Tabel 3.1 Simbol-simbol Flowchart Simbol Nama Fungsi Terminator Terminal Permulaanakhir program Preparation Persiapan Proses inisialisasipemberian Hargaawal Garis Alir Arah aliran program Proses Proses perhitunganproses pengolahan data Keputusan Perbandingan pernyataan, penyeleksian data yang memberikan pilihan untuk langkah selanjutnya InputOuput Data Proses inputoutput data, parameter, informasi Proses Terdefinisi Permulaan sub programproses menjalankan sub program Penghubung Penghubung bagian-bagian Flowchart yang berada pada satu halaman Penghubung Halaman Penghubung bagian-bagian Flowchart yang berada pada halaman berbeda Universitas Sumatera Utara Pada Gambar 3.2 ditampilkan Flowchart untuk Aplikasi Pembelajaran Topologi Jaringan dan Subnetting. Pada gambar flowchart ini dapat dilihat bahwa pada tampilan menu utama terdapat 3 materi, dan tiap materi terdapat beberapa pembahasan. Start Keluar End Tampilan Menu Utama Pengenalan Materi 1 ? Materi 2 ? Materi 3 ? Latihan ? Profil ? Tampilan Menu Pengenalan Tampilan Menu Materi 1 Animasi 1 Animasi 2 Animasi 3 Animasi 4 Tampilan Menu Materi 2 Tampilan Menu Materi 1 Tampilan Menu Latihan Tampilan Menu Profil Tidak Tidak Tidak Tidak Tidak Tidak Tidak Tidak Tidak Ya Ya Ya Ya Ya Ya Ya Ya Ya Ya Ya Ya Ya Ya Tidak Gambar 3.2 Flowchart Tahap-tahap Penggunaan Aplikasi Keterangan: Pengenalan : Pembahasan untuk pengenalan tentang jaringan komputer Materi 1 : Pembahasan untuk materi topologi jaringan. Materi 2 : Pembahasan untuk materi subnetting. Materi 3 : Pembahasan untuk materi protokol jaringan Universitas Sumatera Utara Pada prosedur latihan akan didefinisikan pada Gambar 3.3 Mulai Masukkan jawaban Cek jawaban Benar? Score = score - 0 Score = 0 Score = score +20 Beri tanda soal yang salah Ada soal selanjutnya Score, Soal yang salah Lihat penyelesaian Halaman penyelesaian Kembali selesai ya tidak ya tidak ya tidak tidak ya Soal Gambar 3.3 Flowchart pada Menu Latihan Keterangan: Latihan dimulai dengan mengidentifikasikan variabel skor bernilai 0. Kemudian soal akan dimunculkan dan user akan memasukkan jawaban dan sistem akan memeriksa jawaban yang dimasukkan user. Apabila jawaban benar, maka skor akan bertambah 20, dan apabila jawaban salah, maka skor akan berkurang 0. Kemudian Universitas Sumatera Utara apabila masih terdapat pertanyan selanjutnya, maka proses akan kembali ke pemunculan soal selanjutnya. Jika tidak ada soal selanjutnya, akan muncul total skor keseluruhan dan keterangan soal-soal yang dijawab dengan benar ataupun salah. Apabila terdapat soal yang dijawab salah, maka akan muncul tombol untuk melihat penyelesaian.

3.4 Perancangan Storyboard Papan Cerita Aplikasi