BAB III ANALISA DAN PERANCANGAN 3.1 Analisa Sistem Tahap analisa merupakan tahap awal penulis dalam pembuatan aplikasi perangkat lunak. Dalam membangun program Aplikasi Simulasi Pembelajaran Routing Protocol Dengan Flash / Action Script ini penulis akan menganalisa kebutuhan dasar sistem. Analisa dilakukan terhadap data-data yang mempresentasikan masalah, sehingga dapat diketahui spesifikasi kebutuhan sistem yang akan dibangun. Jaringan saat ini memiliki dampak signifikan pada kehidupan kita, mengubah cara kita hidup, bekerja, dan bermain. Jaringan komputer dalam konteks yang lebih besar, Internet memungkinkan orang untuk berkomunikasi, berkolaborasi, dan berinteraksi dengan cara yang mereka tidak pernah lakukan sebelumnya menggunakan jaringan dalam berbagai cara, termasuk aplikasi web, IP telephony, video conferencing, game interaktif, perdagangan elektronik, pendidikan, dan banyak lagi. Routing Protocol merupakan bagian penting dari jaringan komputer, dan digunakan pada jaringan-jaringan yang besar seperti wan. Routing Protocol juga salah satu materi pembelajaran yang diajarkan disekolah dan perguruan tinggi. Untuk memanfaatkan teknologi informasi sebagai salah satu media pembelajaran yang dapat meningkatkan kualitas dan mutu pendidikan. Salah satu pemanfaatan teknologi informasi adalah membuat aplikasi simulasi pembelajaran routing protocol berbasis multimedia dengan penambahan animasi dan simulasi berjalan sehingga membuat tampilan aplikasi pembelajaran lebih menarik menggunakan Adobe Flash. Aplikasi tersebut dibuat menggunakan Adobe Flash CS3 Profesional. Aplikasi yang dibuat adalah aplikasi yang bisa digunakan untuk menambah pelajaran dan pemahaman secara individu atau mandiri agar mahasiswa/umum mudah mengerti dalam pembelajaran jaringan routing protocol tersebut. Selain itu juga untuk menarik minat 22
23 dan motivasi belajar para mahasiswa/umum yang ingin mengenal protokol routing tersebut. Dalam pembuatan perangkat lunak ini penulis menganalisa komponen dari sistem yang dibangun atau dibuat diantaranya adalah sebagai berikut: 1. Perangkat lunak, yaitu aplikasi simulasi pembelajaran jaringan routing protocol. 2. Materi yang ada dalam aplikasi ini meliputi materi dasar tentang routing protocol, cara kerja, karakteristik, konfigurasi. 3. Perangkat keras, yaitu komputer / laptop. 4. Manusia, yaitu pengguna yang mengakses sistem. 5. Prosedur, yaitu langkah-langkah yang mendefinisikan tentang penggunaan sistem. Dari keseluruhan komponen sistem yang dibangun, maka didapat masukan, proses dan keluaran yaitu: 1. Pada proses pengambilan materi berupa teks dan gambar tentang routing protocol. Semuanya disimpan terlebih dahulu ke dalam direktori data penyimpanan sebagai masukan kemudian dalam tahap proses, terjadi pengambilan materi berupa teks dan gambar tersebut dari direktori berkas penyimpanannya dan langsung tereksekusi kemudian muncul pada layar sebagai keluaran. 2. Pada proses pengambilan suara, suara dengan format.wav dan.mp3 disimpan ke dalam direktori berkas penyimpanan suara sebagai masukan kemudian dalam tahap proses terjadi pengaturan sewaktu teks atau gambar keluar lalu suara tereksekusi kemudian munculah keluaran berupa bunyi. 3.2 Konsep Aplikasi simulasi pembelajaran routing protocol ini merupakan aplikasi yang dibuat untuk membantu mempermudah mahasiswa / umum dalam mempelajari memahami tentang jaringan routing protocol. Aplikasi ini dirancang menggunakan metode pengembangan multimedia dilakukan melalui 5
24 tahap yaitu konsep, perancangan, pengumpulan material, pembuatan dan pengujian. Dalam aplikasi ini terdapat 3 sub menu yaitu materi, simulasi dan profil. Deskripsi konsep aplikasi seperti pada tabel 3.1. Tabel 3.1 Deskripsi konsep aplikasi Judul Pengguna Bentuk Aplikasi Aplikasi Simulasi Pembelajaran Routing Protocol Mahasiswa-Mahasiswi Ilmu Komputer atau Umum Media Pembelajaran Interaktif Gambar Menggunakan file JPEG, GIF dan PNG Suara Menggunakan file berformat MP3 Animasi Animasi pada teks, tombol dan gambar dibuat sendiri Interaktif Menggunakan link berupa tombol untuk pengguna menuju ke halaman yang diinginkan. Berikut penjelasan secara rinci mengenai konsep dasar dari aplikasi simulasi pembelajaran jaringan routing protocol dengan flash / action script yaitu : 1. Materi Pada menu materi ini pengguna dapat membaca definisi atau materi dasar mengenai definisi dan mekanisme kerja tersebut dari karakteristik dan konfigurasi di router.
25 2. Simulasi Pada menu simulasi berisi pilihan simulasi start up, konfigurasi eigrp, convergence dan link down. Pengguna dapat menjalankan simulasi yang dipilih dengan menekan tombol play Aplikasi ini juga dimaksudkan untuk menggantikan pembelajaran yang bersifat manual menjadi digital selain dijadikan pembelajaran secara mandiri juga menggunakannya akan lebih menarik karena kelebihan unsur multimedia yang dapat menarik minat, karena merupakan gabungan antara pandangan, suara, dan gerakan. Aplikasi ini juga membiasakan pengguna untuk terbiasa menggunakan komputer dan mouse yang relevan serta memahami lebih mendalam tentang ilmu jaringan komputer dengan perkembangan zaman. 3.3 Perancangan Pada bab ini penulis melakukan perancangan aplikasi yang terdiri dari perancangan use case diagram dan perancangan activity diagram. 3.3.1 Perancangan Use Case Diagram Use Case mendeskripsikan interaksi tipikal antara para pengguna sistem dengan sistem itu sendiri, dengan memberi sebuah narasi tentang bagaimana sistem tersebut digunakan. Use case diagram menggambarkan fungsionalitas yang diharapkan dari suatu sistem, yang ditekankan adalah apa yang diperbuat sistem dan bukan bagaimana sebuah use case mempresentasikan sebuah interaksi antara aktor dengan sistem. Use case menggambarkan kata kerja seperti login ke sistem, maintenance user dan sebagainya. Dalam bahasan use case, para pengguna disebut sebagai aktor. Seorang (actor) merupakan sebuah peran penting dalam kaitannya dengan sistem untuk melakukan pekerjaan atau aktivitas tertentu. Use case diagram dapat sangat membantu bila kita sedang menyusun requirement sebuah sistem, mengkomunikasikan rancangan dengan klien, dan merancang test case untuk semua feature yang ada pada sistem.
26 Pada aplikasi simulasi pembelajaran routing protocol dapat diketahui bahwa aktor tersebut adalah pengguna. Maka didapatkan suatu Use case diagram dan beberapa skenario yang memperlihatkan interaksiinteraksi Use case diagram dengan aktor Use case diagram dari aplikasi simulasi pembelajaran routing protocol dapat dilihat pada gambar 3.1 Melihat Materi Pengguna Menjalankan Simulasi Gambar 3.1 Use case diagram Simulasi Pembelajaran Routing Protocol Gambar use case diagram diatas mempresentasikan aplikasi simulasi pembelajaran routing protocol dengan flash / actions script Berikut penjelasan gambar : 1. Karakteristik manusia menggambarkan seorang aktor 2. Gambar lingkaran oval mempresentasikan use case 3. Garis-garis mempresentasikan kardinalitas Pada gambar 3.1 dapat dijelaskan bahwa ada seorang aktor atau pengguna yaitu mahasiswa / umum. Use case tersebut adalah use case menu utama dan menu simulasi routing protocol, use case melihat materi pembelajaran dan use case melihat simulasi.
27 Berikut ini merupakan deskripsi Use Case diagram diatas : Tabel 3.2 Use Case Melihat Materi Nama Aktor Deskripsi Skenario Materi Mahasiswa / umum Mahasiswa / umum dapat memilih materi yang ada 1. Mahasiswa / umum memilih menu materi 2. Sistem menampilkan halaman materi 3. Mahasiswa / umum melihat materi Kondisi Awal Kondisi Akhir Mahasiswa / umum menerima halaman materi Mahasiswa / umum dapat melihat mempelajari isi dari setiap materi Tabel 3.3 Use Case Menjalankan Simulasi Nama Aktor Deskripsi Skenario Simulasi Mahasiswa / umum Mahasiswa / umum dapat melihat simulasi 1. Mahasiswa / umum memilih menu simulasi 2. Sistem menampilkan halaman simulasi 3. Mahasiswa / umum menjalankan simulasi yang ada Kondisi Awal Kondisi Akhir Mahasiswa / umum menerima halaman simulasi Mahasiswa / umum dapat melihat simulasi
28 3.3.2 Perancangan Activity Diagram Activity diagram adalah teknik-teknik untuk menggambarkan logika procedural, proses bisnis, dan jalur kerja. Dalam beberapa hal, diagram ini memainkan peran mirip sebuah diagram alir, tetapi perbedaan prinsip antar diagram ini dan notasi diagram alir adalah diagram ini mendukung behavior parallel. Activity diagrams menggambarkan berbagai alir aktivitas dalam sistem yang sedang dirancang, bagaimana masing-masing alir berawal, decision yang mungking terjadi, dan bagaimana mereka berakhir. Diagram ini menggambarkan langkah yang mana dijalankan secara berurutan dan langkah mana yang dijalankan secara bersamaan. Diagram aktifitas dalam pembelajaran simulasi routing protocol ini dapat dilihat pada Gambar 3.2 berikut : Pengguna Sistem Memilih Materi Menampilkan Materi Melihat Materi Gambar 3.2 Activity diagram menu materi
29 Pada gambar 3.2 aktifitas dimulai pada saat mahasiswa atau pengguna sudah masuk kedalam menu utama, selanjutnya aktifitas mahasiswa memilih halaman materi, didalam menu materi aktifitas selanjutnya akan menampilkan halaman materi. Aktifitas selanjutnya mahasiswa melihat materi yang ada Pengguna Sistem Memilih Simulasi Menampilkan Halaman Menu Simulasi Memilih Simulasi Start Up Menampilkan Simulasi Start Up Menjalankan Simulasi Start Up Melihat Simulasi Start Up Gambar 3.3 Activity diagram menu simulasi Start Up Pada gambar 3.3 aktifitas dimulai pada saat mahasiswa atau pengguna sudah masuk kedalam menu utama, selanjutnya aktifitas mahasiswa memilih menu simulasi, didalam menu simulasi aktifitas selanjutnya pengguna memilih menu start up dan akan melihat cara kerja simulasi start up dari routing protocol
30 Gambar 3.4 Activity diagram menu simulasi Konfigurasi Pada gambar 3.4 aktifitas dimulai pada saat mahasiswa atau pengguna sudah masuk kedalam menu utama, selanjutnya aktifitas mahasiswa memilih menu simulasi, didalam menu simulasi aktifitas selanjutnya pengguna memilih menu konfigurasi dan akan melihat cara kerja simulasi konfigurasi dari routing protocol
31 Pengguna Sistem Memilih Simulasi Menampilkan Halaman Menu Simulasi Memilih Simulasi konfigurasi Menampilkan Simulasi konfigurasi Memilih Table Neighbor Menampilkan Simulasi Table Neighbor Menjalankan Simulasi Table Neighbor Melihat Simulasi Table Neighbor Gambar 3.5 Activity diagram menu simulasi Table Neighbor Pada gambar 3.5 aktifitas dimulai pada saat mahasiswa atau pengguna sudah masuk kedalam menu utama, selanjutnya aktifitas mahasiswa memilih menu simulasi, didalam menu simulasi aktifitas selanjutnya pengguna memilih menu table neighbor dan akan melihat cara kerja simulasi table neighbor dari routing protocol
32 Pengguna Sistem Memilih Simulasi Menampilkan Halaman Menu Simulasi Memilih Simulasi Convergence Menampilkan Simulasi Convergence Menjalankan Simulasi Convergence Melihat Simulasi Convergence Gambar 3.6 Activity diagram menu simulasi Convergence Pada gambar 3.6 aktifitas dimulai pada saat mahasiswa atau pengguna sudah masuk kedalam menu utama, selanjutnya aktifitas mahasiswa memilih menu simulasi, didalam menu simulasi aktifitas selanjutnya pengguna memilih menu convergence dan akan melihat cara kerja simulasi convergence dari routing protocol
33 Pengguna Sistem Memilih Simulasi Menampilkan Halaman Menu Simulasi Memilih Simulasi Link Down Menampilkan Simulasi Link Down Menjalankan Simulasi Link Down Melihat Simulasi Link Down Gambar 3.7 Activity diagram menu simulasi Link Down Pada gambar 3.7 aktifitas dimulai pada saat mahasiswa atau pengguna sudah masuk kedalam menu utama, selanjutnya aktifitas mahasiswa memilih menu simulasi, didalam menu simulasi aktifitas selanjutnya pengguna memilih menu link down dan akan melihat cara kerja simulasi link down dari routing protocol
34 Pengguna Sistem Memilih Profil Menampilkan Menu Profil Melihat Profil Gambar 3.8 Activity diagram menu simulasi Profil Pada gambar 3.8 aktifitas dimulai pada saat mahasiswa atau pengguna sudah masuk kedalam menu utama, selanjutnya aktifitas mahasiswa memilih menu profil, dan akan melihat profil pembuat aplikasi simulasi pembelajaran routing protocol 3.3.3 Perancangan Peta Navigasi Peta navigasi ini memudahkan untuk merancang aplikasi yang akan dibuat dengan menetukan lokasi pada setiap halaman yang ada dalam aplikasi simulasi pembelajaran routing protocol. Pada gambar 3.9 merupakan peta navigasi dari simulasi pembelajaran jaringan routing protocol.
35 Intro Halaman Menu Materi Simulasi Profil Start Up Konfigurasi Convergence Link Down Table Neighbor Gambar 3.9 Peta Navigasi Aplikasi Simulasi Pembelajaran Routing Protocol 3.3.4 Perancangan Sequence Diagram Sequence diagram digunakan untuk menggambarkan perilaku pada sebuah skenario. Diagram ini menunjukan sejumlah contoh objek dan message (pesan) yang diletakan diantara obyekobyek ini di dalam use case. Sequence diagram menggambarkan interaksi antar objek di dalam dan disekitar sistem (termasuk pengguna, tampilan, 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 langkah-langkah yang dilakukan sebagai respons dari sebuah event untuk menghasilkan
36 keluaran tertentu. Dari bentuk use case yang telah digambarkan diatas hanya satu aktor yang akan dibuat sequence diagram sesuai dengan use case yang telah dibuat sebelumnya. 1. Sequence Diagram Menu Materi Pada sequence diagram menu materi, pengguna akan mengakses melalui menu utama, pada menu utama pengguna akan memilih menu materi. Setelah itu akan terdapat tampilan beberapa materi yang terdapat pada aplikasi. Menu Utama Menu Profil Pengguna Membuka aplikasi Memilih menu profil Selesai Gambar 3.10 Sequence diagram menu materi
37 2. Sequence Diagram Menu Simulasi Pada sequence diagram menu simulasi, pengguna akan mengakses melalui menu utama, pada menu utama pengguna akan memilih simulasi untuk melihat simulasi. Menu utama Menu simulasi Simulasi Pengguna Membuka aplikasi Memilih menu simulasi Memilih simulasi Menampilkan menu simulasi Selesai Gambar 3.11 Sequence diagram menu simulasi 3. Sequence Diagram Menu Profil Pada sequence diagram menu profil, pengguna akan mengakses melalui menu utama, pada menu utama pengguna akan memilih profil untuk melihat profil pembuat aplikasi.
38 Menu Utama Menu Profil Pengguna Membuka aplikasi Memilih menu profil Selesai Gambar 3.12 Sequence diagram menu profl 3.3.5 Perancangan Storyboard Storyboard adalah deskripsi masing-masing tampilan suatu kejadian dari movie yang dimainkan dengan menampilkan semua objek atau elemen multimedia serta komponen-komponen aplikasi yang akan dibuat. Storyboard digunakan sebagai alat bantu pada tahapan perancangan multimedia. Pada bagian storyboard ini akan menggambarkan rancangan Aplikasi Simulasi Pembelajaran Routing Protocol.
39 1. Storyboard Halaman Awal Aplikasi Aplikasi Pembelajaran Routing Protocol Mulai Keluar Sound Fullscreen Nama Scene : Awal Link Tombol : Mulai : Menuju menu utama Keluar : Keluar dari aplikasi Fullscreen : Layar penuh aplikasi Sound : Menghidupkan dan mematikan suara Keterangan : Halaman awal aplikasi Gambar 3.13 Storyboard awal 2. Storyboard Halaman Menu Utama sound Routing Protocol exit Materi Simulasi Profil Nama Scene : Menu (Menu utama) Link Tombol : Materi : Menuju scene materi Simulasi : Menuju scene menu simulasi Profil : Menuju scene profil Exit : Keluar dari aplikasi Keterangan : Halaman menu utama Gambar 3.14 Storyboard menu utama
40 3. Storyboard Halaman Menu Materi sound Routing Protocol home exit Materi back next Nama Scene : Materi Link Tombol : Home : Menuju scene menu Exit : Keluar dari aplikasi Back : Menuju halaman sebelumnya Next : Menuju halaman berikutnya Keterangan : Halaman menu materi Gambar 3.15 Storyboard menu materi 4. Storyboard Halaman Menu Simulasi sound Routing Protocol home exit Proses Start Up Konfigurasi Convergence Link Down Nama Scene : Menu simulasi Link Tombol : Home : Menuju scene menu Exit : Keluar dari aplikasi Start up : Menuju scene start up Konfigurasi : Menuju scene konfigurasi Convergence : Menuju scene convergence Link down : Menuju scene link down Keterangan : Halaman menu simulasi Gambar 3.16 Storyboard menu simulasi
41 5. Storyboard Halaman Proses Start Up back play pause stop sound Routing Protocol home exit Proses Start up PC2 R2 PC1 R1 R3 PC3 Nama Scene : Start up Link Tombol : Home : Menuju scene menu Exit : Keluar dari aplikasi Back : Kembali ke menu simulasi Play : Jalankan simulasi Keterangan : Halaman Proses start up Gambar 3.17 Storyboard proses start up 6. Storyboard Halaman Konfigurasi back play pause stop sound Routing Protocol home exit Konfigurasi PC2 R2 PC1 R1 R3 PC3 next Nama Scene : Konfigurasi Link Tombol : Home : Menuju scene menu Exit : Keluar dari aplikasi Back : Kembali ke menu simulasi Play : Jalankan simulasi Next : Menuju scene table neighbor Keterangan : Halaman Konfigurasi Gambar 3.18 Storyboard konfigurasi
42 7. Storyboard Halaman Table Neighbor back play pause stop sound Routing Protocol home exit Pencarian Table Neighbor PC2 R2 PC1 R1 R3 PC3 back2 Nama Scene : Table neighbor Link Tombol : Home : Menuju scene menu Exit : Keluar dari aplikasi Back : Kembali ke menu simulasi Play : Jalankan simulasi Back2 : Kembali ke scene Konfigurasi Keterangan : Halaman Table Neighbor Gambar 3.19 Storyboard table neighbor 8. Storyboard Halaman Convergence back play pause stop sound Routing Protocol home exit Convergence PC2 R2 PC1 R1 R3 PC3 Nama Scene : Convergence Link Tombol : Home : Menuju scene menu Exit : Keluar dari aplikasi Back : Kembali ke menu simulasi Play : Jalankan simulasi Keterangan : Halaman Convergence Gambar 3.20 Storyboard convergence
43 9. Storyboard Halaman Link Down back play pause stop sound Routing Protocol home exit Link Down PC2 R2 PC1 R1 R3 PC3 Nama Scene : Link Down Link Tombol : Home : Menuju scene menu Exit : Keluar dari aplikasi Back : Kembali ke menu simulasi Play : Jalankan simulasi Keterangan : Halaman Link Down Gambar 3.21 Storyboard link down 3.4 Pengujian Pengujian aplikasi simulasi pembelajaran routing protocol ini dilakukan untuk memastikan bahwa aplikasi yang telah dirancang dan dibuat ini dapat berfungsi dengan baik dan sesuai dengan rumusan rancangan yang telah ditetapkan sebelumnya. Tanpa adanya pengujian, maka tidak dapat diketahui apakah program aplikasi yang telah dibuat sesuai dengan spesifikasi rancangan program aplikasi. Pengujian ini dilakukan pada komputer dengan spesifikasi perangkat keras dan perangkat lunak yang dijelaskan pada spesifikasi saat sistem dibuat sebelumnya. 3.4.1 Pengujian Blackbox Skenario yang akan dijelaskan oleh penulis yaitu skenario menu, skenario materi, dan skenario simulasi yang dijelaskan pada tabel 3.4
44 Tabel 3.4 Tabel skenario pengujian Skenario Pengujian Keterangan Hasil Awal Klik tombol mulai Menampilkan halaman menu Klik tombol Memperbesar tampilan aplikasi fullscreen Klik tombol sound Menghidupkan dan mematikan sound Klik tombol keluar Keluar dari aplikasi Menu Klik tombol materi Menampilkan halaman materi Klik tombol simulasi Menampilkan halaman menu simulasi Klik tombol profil Menampilkan halaman profil Klik tombol sound Menghidupkan dan mematikan sound Klik tombol exit Keluar dari aplikasi Materi Klik tombol next Menampilkan halaman materi Menu Simulasi Klik tombol back Klik tombol home Klik tombol exit Klik tombol start up Klik tombol konfigurasi Klik tombol convergence Klik tombol link down Klik tombol home Klik tombol exit Menampilkan halaman materi sebelumnya Menampilkan halaman menu Keluar dari aplikasi Menampilkan halaman simulasi start up Menampilkan halaman simulasi konfigurasi Menampilkan halaman simulasi convergence Menampilkan halaman simulasi link down Menampilkan halaman menu Keluar dari aplikasi
45 Lanjutan Tabel 3.4 Tabel skenario pengujian Start up Klik tombol play Memainkan proses simulasi start up Klik tombol pause Menghentikan proses simulasi Klik tombol stop Klik tombol back Klik tombol home Klik tombol exit Menghentikan proses simulasi dan menuju akhir simulasi Menampilkan halaman menu simulasi Menampilkan halaman menu Keluar dari aplikasi Konfigurasi Klik tombol play Memainkan proses simulasi Konfigurasi Klik tombol pause Menghentikan proses simulasi Klik tombol stop Klik tombol back Klik tombol home Menghentikan proses simulasi dan menuju akhir simulasi Menampilkan halaman menu simulasi Menampilkan halaman menu Klik tombol next Klik tombol exit Menampilkan halaman table neighbor Keluar dari aplikasi Table Neighbor Klik tombol play Klik tombol pause Memainkan proses simulasi Table Neighbor Menghentikan proses simulasi
46 Lanjutan Tabel 3.4 Tabel skenario pengujian Klik tombol stop Menghentikan proses simulasi dan menuju akhir simulasi Klik tombol back Menampilkan halaman menu simulasi Klik tombol home Menampilkan halaman menu Klik tombol back2 Menampilkan halaman konfigurasi Klik tombol exit Keluar dari aplikasi Convergence Klik tombol play Memainkan proses simulasi Convergence Klik tombol pause Menghentikan proses simulasi Klik tombol stop Menghentikan proses simulasi dan menuju akhir simulasi Klik tombol back Menampilkan halaman menu simulasi Klik tombol home Menampilkan halaman menu Klik tombol exit Keluar dari aplikasi Link Down Klik tombol play Memainkan proses simulasi Link Down Klik tombol pause Menghentikan proses simulasi Klik tombol stop Menghentikan proses simulasi dan menuju akhir simulasi Klik tombol back Menampilkan halaman menu simulasi Klik tombol home Menampilkan halaman menu Klik tombol exit Keluar dari aplikasi Profil Klik tombol home Menampilkan halaman menu Klik tombol exit Keluar dari aplikasi