BAB III ANALISA DAN PERANCANGAN

Transkripsi

1 BAB III ANALISA DAN PERANCANGAN 3.1 Analisa Sistem Analisis sistem yaitu untuk melakukan identifikasi persoalan-persoalan yang muncul pada saat pembuatan aplikasi, hal ini dilakukan agar saat pembuatan aplikasi tidak terjadi kesalahan-kesalahan yang berarti bahwa sistem yang dibuat dapat berjalan dengan baik dan selesai pada waktu yang telah ditentukan, dalam analisis sistem ini, sistem yang akan dianalisa meliputi analisis permasalahan, analisis kebutuhan sistem. A. Analisis Permasalahan Media Pembelajaran Interaktif saat ini semakin lama semakin banyak diperlukan, karena selain menarik juga mudah digunakan. Tetapi, banyak sekali pengguna yang masih sulit mendapatkan media pembelajaran tentang proses enkapsulasi dan dekapsulasi yang bersifat aplikasi offline dimana aplikasi disajikan dengan waktu yang tidak terbatas. Maka dari itulah, peneliti berusaha membuat aplikasi yang saat ini dibutuhkan banyak orang. Penelitian ini menganalisis tentang salah satu proses yang terjadi pada jaringan yaitu proses enkapsulasi dan dekapsulasi yang terjadi pada data saat pengiriman informasi dilakukan dari suatu computer ke computer lainnya dengan menggunakan Adobe Flash CS5. Dengan aplikasi tersebut peneliti mengharapkan agar hasil penelitian dapat maksimal dan diterima oleh banyak pengguna dengan baik, mulai dari pelajar tingkat menengah pertama sampai siapapun yang ingin mengetahui bagaimana proses enkapsulasi dan dekapsulasi berlangsung saat pengiriman informasi. 35

2 36 B. Analisa Kebutuhan Sistem 1. Kebutuhan Fungsional Sistem yang dibangun ini termasuk dalam aplikasi multimedia interaktif yang mana pengguna dapat sepenuhnya mengontrol elemenelemen yang terdapat dalam aplikasi. Dalam aplikasi media pembelajaran ini terdapat komponen grafis seperti warna, garis, bentuk objek yang disesuaikan, kemudian audio dan user interface sebagai tempat dimana semua komponen multimedia ditampilkan didesain sedemikian rupa sehingga content yang ditampilkan dapat disampaikan secara baik, bertahap dan komunikatif. Serta Prosedur yaitu langkahlangkah yang mendefinisikan tentang penggunaan system. 2. Kebutuhan non Fungsional - Laptop/computer PC - Windows 7 Home Premium Operating System - Processor Intel Core i3 CPU - RAM 2.00 Gb - Materi pembelajaran tentang OSI Layer Dalam Aplikasi Pembelajaran Enkapsulasi dan Dekapsulasi Data saat Pengiriman Informasi ini dilakukan tahapan pengenmbangan multimedia menurut Luther (Sutopo, 2002 : 32) yaitu pengembangan aplikasi multimedia dilakukan bedasarkan enam tahap, yaitu konsep (concept), perancangan (design), pengumpulan bahan (material collecting), pembuatan (assembly), pengujian (testing), dan distribusi (distribution). 3.2 Perancangan Multimedia Pada perancangan Aplikasi Pembelajaran Enkapsulasi dan Dekapsulasi Data saat Pengiriman Informasi yaitu berdasarkan pada metode pengenmbangan multimedia itu sendri yang terdiri dari 6 tahap, yaitu :

3 Konsep (Concept) Tujuan dari penelitian ditentukan dalam tahap ini. Output dari tahap konsep biasanya dokumen dengan penulisan yang bersifat naratif untk mengungkapkan tujuan proyek. Dasar aturan untuk perancangan juga ditentukan dalam tahap ini. Adapun konsep yang penulis lakukan adalah : 1. Menetukan tujuan, pada tahap ini ditentukan tujuan dari pembuatan aplikasi, serta pengguna aplikasi ini 2. Deskripsi konsep aplikasi yang akan dibuat dengan menetukan jenis aplikasi (presentasi, interaktif, dan lain-lain) dan spesifikasi umum (judul, pengunjung, dan lain-lain). Pada tahap ini untuk menetukan tujuan, jenis, kegunaan, dan siapa saja yang akan menjadi sasaran dalam pembuatan aplikasi multimedia. Pada penelitan ini penentuan tujuan aplikasi agar isi/konten aplikasi yang disampaikan dapat dikomunikasikan secara penuh kepada audiens yakni siswa dari tingkat menengah pertama sampai siapapun yang ingin menggunakan aplikasi ini. Jenis aplikasi ini merupakan aplikasi pembelajaran, adapun yang menjadi sasaran pengguna yaitu mulai dari siswa tingkat menengah sampai siapapun yang ingin menggunakannya. Untuk lebih jelasnya akan dijelaskan pada deskripsi konsep berikut : Table 3.1 Deskripsi konsep aplikasi Judul Pengguna Durasi Bentuk Aplikasi Aplikasi Pembelajaran Proses Enkapsulasi dan Dekapsulasi Data saat Pengiriman Informasi Siswa Tingkat Menengah atau Umum Tidak terbatas (unlimited) Media Pembelajaran Interaktif

4 38 Gambar Suara Animasi Interaktif Menggunakan file JPEG, GIF dan PNG yang dibuat sebagai image dan animasi Instrument musik menggunakan file berformat MP3 dan WAV Animasi pada teks, tombol dan gambar dibuat sendiri Menggunakan link berupa tombol untuk pengguna menuju ke halaman yang diinginkan. Tombol menu utama untuk kembali ke menu utama, previous untuk ke halaman sebelumnya, next untuk ke halaman selanjutnya, dan go untk menjalankan simulasi Perancangan (Design) Tahap perancangan (design) adalah membuat spesifikasi secara rinci mengenai aplikasi yang akan dibuat, serta gaya dan kebutuhan material untuk aplikasi tersebut. Spesifikasi yang akan dibuat berdasarkan pada langkah berikut : a. Perancangan storyboard b. Desain struktur navigasi berupa hirarki menu c. Perancangan bagan alir (flowchart) d. Perancangan activity diagram e. Perancangan sequence diagram f. Perancangan peta navigasi aplikasi Desain ataupun perancangan merupakan tahap pembuatan spesifikasi mengenai arsitektur program yang akan dibuat termasuk gaya, tampilan, dan kebutuhan material/bahan untuk program. Untuk spesifikasi dibuat rinci sehingga pada tahap berikutnya yaitu pengumpulan materi (material

5 39 collecting) dan pembuatan (assembly) pengambilan keputusan baru tidak diperlukan lagi. Tahap ini peneliti menggunakan story board untuk menggambarkan deskripsi tiap Scene dan juga flowchart untuk menggambarkan aliran dari satu Scene ke Scene lain. Scene disini bisa disebut sebagai halaman untuk menyimpan isi menu yang akan ditampilkan kemudian juga pada Scene yaitu terdapat masing-masing Frame yang juga dapat menampung setiap isi menu. Berikut adalah StoryBoard ringkasnya : Scene 1 Scene 1, Frame 9 Scene 1, Frame 10 Scene 1, Frame 19 Scene 1, Frame 20 Table 3.2 Storyboard Ringkas Halaman Awal, Tampilan Menu Tampilan Menu untuk Simulasi Skema Layer OSI Tampilan Menu untuk Kuis Tampilan Menu untuk Materi Scene 1, Frame Penjelasan Enkapsulasi dan Dekapsulasi Scene 1, Frame Teori Pengenalan alat-alat penghubung pada jaringan komputer. Scene 1, Frame Scene 2 Scene 3 Scene 4 Pejelasan tentanh Header, dll Halaman Kuis Simulasi LAN Simulasi WAN

6 Pengumpulan Bahan (Material Collecting) Pada tahap ini dilakukan pengumpulan bahan seperti layout, informasi tentang jaringan komputer, informasi tentang proses enkapsulasi dan dekapsulasi, image, audio. Bahan-bahan diperoleh dari berbagai sumber seperti buku-buku dan literature perpustakaan maupun media internet. Tahap ini merupakan pengumpulan sekaligus persiapan semua materi yang diperlukan dalam proses pembuatan aplikasi yaitu termasuk gambar, audio, dan lain-lain sesuai dengan kebutuhan dapat diperoleh secara gratis atau bisa melalui pemesanan kepada pihak lain sesuai dengan rancangan. Untuk pengumpulan materi disini peneliti mengunduh secara gratis melalui internet termasuk gambar animasi dalam bentuk format.gif, dan juga.jpeg dan audio dalam format.wav dan.mp Pembuatan (assembly) Tahap pembuatan (assembly) merupakan tahap dimana proyeksi perspektif denah dan seluruh obyek multimedia dibuat. Pembuatan aplikasi yang telah ditentukan sebelumnya dalam storyboard, flowchart, use case diagram, activity diagram, maupun peta navigasi yang berasal dari tahap desain. Pada tahap ini software yang digunakan adalah Adobe Flash CS5. Pada tahap ini proses pembuatan aplikasi sesuai dengan diagram alir melalui flowchart ataupun storyboard yang dibuat sebelumnya, bahasa pemograman untuk pembuatan Aplikasi yaitu menggunakan action script 3.0 pada Adobe Flash CS5.

7 Pengujian (Testing) Tahap pengujian (Testing) ini adalah pengujian terhadap aplikasi yang telah selesai dilakukan. Proses pengujian difokuskan pada logika dalam program dari piranti lunak untuk memastikan bahwa semua kode aplikasi telah diuji. Tujuan dilaksanakannya pengujian ini untuk menemukan kesalahan dan juga untuk memastikan bahwa piranti lunak yang telah dibuat telah sesuai dengan yang diinginkan. Tahap testing yaitu dilakukan setelah tahap pembuatan dengan menjalankan aplikasi dan melihatnya apakah ada kesalahan atau tidak, kemudian dilakukan pengujian blackbox dalam menguji beberapa fungsi yang salah atau hilang, desain interface, kesalahan performa atau lainnya Distribusi (Distribution) Pada tahap ini akan dilakukan implementasi serta evaluasi terhadap aplikasi multimedia dan setelah semuanya selesai aplikasi ini akan ditunjukkan kepada pengguna. Beberapa tahap implementasi dan evaluasi yang penulis lakukan adalah : Spesifikasi perangkat keras dan lunak yang dibutuhkan untuk mengeksekusi aplikasi Cara pengoperasian aplikasi Menjelaskan tampilan Evaluasi aplikasi Pada tahap ini aplikasi yang selesai dibuat akan disimpan dalam bentuk file.swf, tahap ini belum bisa menjadi tahap akhir apabila masih terdapat pengembangan produk untuk menjadi lebih baik lagi. Dan sekaligus menjadi evaluasi untuk pengembangan produk dikemudian hari.

8 42 Dari keseluruhan komponen sistem yang dibangun, maka didapat masukan, proses dan keluaran yaitu: 1. Pada proses pengambilan materi berupa teks, gambar dan soal-soal latihan tentang enkapsulasi dan dekapsulasi, semuanya disimpan terlebih dahulu ke dalam direktori data penyimpanan sebagai masukan kemudian dalam tahap proses, terjadi pengambilan materi berupa teks, gambar dan soal-soal latihan 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.3 Desain Sistem Tujuan utama dari desain sistem adalah memberikan gambaran perancangan sistem yang akan dibangun atau dikembangkan, serta untuk memahami alur informasi dan proses dalam sistem. Adapun langkah-langkah dalam desain sistem yakni rancangan struktur navigasi, flow chart, dan rancangan antar muka Peta Navigasi Gambar 3.1 Peta Navigasi

9 43 Peta navigasi ini memudahkan untuk merancang aplikasi yang akan dibuat dengan menetukan lokasi pada setiap halaman yang ada dalam aplikasi Flowchart Sistem Gambar 3.2 Flowchart Aplikasi Pada flowchart ini hampir semua proses dilakukan oleh komputer dimana user hanya memutuskan ingin mengerjakan apa dan lalu komputer yang menjalankannya. Saat awal dimulai dengan start lalu user akan langsung ke halaman Menu yang kemudian akan ada tiga submenu lainnya yaitu, Materi, Simulasi, dan Kuis. Pertama-tama apabila user memilih submenu Materi maka, komputer akan menampilkan submenu lainnya yang termasuk ke dalam pilihan-pilihan menu dalam Materi. Tentang layer berisi penjelasan teori tentang layer, Tentang Header

10 44 berisi penjelasan teori yang berhubungan dengan header, OSI Model berisi gambar animasi tentang OSI Model beserta sedikit penjelasan tentang layer-layer OSI, dan Enkapsulasi dan Dekapsulasi berisi tentang penjelasan proses enkapsulasi dan dekapsulasi yang terjadi. Dan setelah selesai user dapat langsung ke Menu dan dapat langsung mengakhiri aplikasi jika tidak ingin melanjutkan ke menu yang berikutnya. Berikutnya adalah menu Simulasi, disini semua simulasi tentang proses pengiriman data pada jaringan LAN dan WAN berjalan. Saat user kembali ke Menu setelah mempelajari Materi, apabila user memilih Simulasi maka akan terdapat submenu lainnya yaitu, LAN dan WAN setelah user memilih salah satunya maka user akan diminta untuk mengklik GO pada aplikasi agar simulasinya berjalan. Dan ini berlaku pada kedua pilhannya baik LAN maupun WAN. Setelah itu user dapat kembali ke menu dan mengkhiri aplikasi atau dapat melanjutkannya ke menu Kuis. Dalam menu terakhir terdapat menu Kuis yang berisi soal-soal yang dapat dikerjakan langsung oleh user setelah memilih menu Kuis dan kemudia mengklik tombol GO. Disini setipa soal bernilai 10 maka apbila user dapat menjawab semua akan mendapat nilai 100. Dan pada menu ini user dapat langsung mengkahirinya ataupun dapat mengulangi menu Materi atau Simulasi. Bentuk Termination yang terakhir adalah untuk mengakhiri segala proses flowchart yang terdapat pada aplikasi nantinya 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. (Fowler, 2005) Activity diagrams menggambarkan berbagai alir aktivitas dalam sistem yang sedang dirancang, bagaimana masing-masing alir berawal, decision yang mungkin terjadi, dan bagaimana mereka berakhir. Diagram ini menggambarkan langkah yang mana dijalankan secara berurutan dan langkah mana yang dijalankan secara bersamaan.

11 45 Gambar 3.3 Activity Diagram Materi Pada aplikasi ini user memulai dengan memilih Materi lalu aplikasi akan menampilkan submenu Tentang Layer, Tentang Header, OSI Layer, dan juga Enkapsulasi dan Dekapsulasi. Pada submenu-submenu tersebut berisi penjelasan yang sesuai dengan pilihan yang dipilih oleh user. Dan saat user selesai untuk mempelajari Materi maka user dapat mengakhirinya.

12 46 Gambar 3.4 Activity Diagram Simulasi Simulasi berisi runtutan kejadian pada proses pengiriman informasi. Disini terlihat Simulasi memiliki dua submenu yaitu, LAN dan WAN dimana keduanya akan bergantian saat user memilih salah satunya dan mengharuskan user untuk kembali ke submenu untuk memilih simulasi yang akan berjalan kemudian. Dan setelah selesai maka user dapat mengakhirinya.

13 47 Gambar 3.5 Activity Diagram Kuis Kuis berisi soal-soal evaluasi bagi user untuk mengetahui seberapa jauh ia memahami materi dan simulasi dari aplikasi ini. Disini user dapat memulai nya dengan memilih submenu mulai dan apabila belum puas dengan hasil akhirnya dapat mengulangi soal-soal tersebut kembali. Apabila user telah selesai menggunakannya maka user dapat mengakhirinya Sequence Diagram Sequence diagram digunakan untuk menggambarkan perilaku pada sebuah skenario. Diagram ini menunjukan sejumlah contoh objek dan message (pesan) yang diletakan diantara obyek-obyek ini di dalam use case. Sequence diagram menggambarkan interaksi antar objek di dalam dan disekitar sistem (termasuk pengguna, display, dan sebagainya) berupa

14 48 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 respons dari sebuah event untuk menghasilkan keluaran tertentu. Gambar 3.6 Sequence Diagram menu Materi

15 Gambar 3.7 Sequence Diagram menu Simulasi 49

16 50 Gambar 3.8 Sequence Diagram menu Kuis Rancangan Antar Muka 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.

17 51 1. Halaman Awal Nama Scene : Scene 1, Frame 1 Link Tombol :MATERI : menuju ke menu materi SIMULASI : menuju ke menu simulasi KUIS : menuju ke menu kuis Keterangan : halaman awal aplikasi Audio : Download Blackberry 2013 ringtones to your cell phone 2013 blackberry z _ Zedge.mp3 Gambar 3.9 Rancangan Antar Muka Halaman Awal

18 52 2. Halaman Awal Materi Nama Scene Link Tombol Keterangan Audio : Scene_1 : Tentang Layer : menuju ke penjelasan tentang layer Tentang Header : menuju ke penjelasan tentang header OSI Model : menuju ke skema OSI Model Enkapsulasi dan Dekapsulasi : menuju ke penjelasan tentang enkapsulasi dan dekapsulasi LAN dan WAN : menuju teori tentang LAN dan WAN Main Menu : menuju ke menu awal : halaman submenu Materi : jackhammer-01.wav Gambar 3.10 Rancangan Antar Muka Halaman Materi

19 53 3. Halaman Awal Simulasi Nama Scene : Scene_1 Link Tombol : LAN : menuju simulasi pengiriman data LAN Keterangan Audio WAN : menuju simulasi pengiriman data WAN Main Menu : menuju ke menu awal : halaman submenu pada menu simulasi : jackhammer-01.wav Gambar 3.11 Rancangan Antar Muka Halaman Simulasi 4. Halaman Awal Kuis Nama Scene Link Tombol Keterangan Audio : Scene_1 : GO : menuju soal-soal evaluasi Main Menu : menuju ke menu awal : halaman menu kuis : jackhammer-01.wav Gambar 3.12 Rancangan Antar Muka Halaman Kuis

20 54 5. Halaman Simulasi Enkapsulasi Nama Scene Link Tombol Keterangan Audio : Scene_5 : Tombol pause : untuk menghentikan simulasi Tombol play : untuk memulai simulasi kembali : halaman simulasi saat enkapsulasi dengan jaringan LAN : Depapepe_Harvest.mp3 Gambar 3.13 Rancangan Antar Muka Simulasi Enkapsulasi

21 55 6. Halaman Simulasi Dekapsulasi Nama Scene Link Tombol Keterangan Audio : Scene_6 : Tombol pause : untuk menghentikan simulasi Tombol play : untuk memulai simulasi kembali : halaman simulasi saat dekapsulasi di computer tujuan : Depapepe_Harvest.mp3 Gambar 3.14 Rancangan Antar Muka Simulasi Enkapsulasi 3.4 Pengujian Aplikasi Setelah dilakukan perancangan aplikasi, tibalah saatnya untuk melakukan pengujian terhadap aplikasi yang telah dibuat. Pengujian aplikasi dilakukan oleh peneliti secara pribadi di computer apakah aplikasi ini berjalan sesuai dengan kemauan dari peneliti maupun dosen pembimbing dari peneliti. Spesifikasi komputer pada pengujian tahap awal ini menggunakan: - Intel Core I3 dengan system operasi Windows 7 - Ram 2Gb - Dan memiliki Adobe Flash Professional CS5 dan juga Flash Player

22 56 Dari pengujian awal ini, peneliti belum dapat membuat sinkronisasi antar scene sehingga ketika scene 1 ingin menuju ke scene 3, di kolom compiler errors selalu terdapat tulisan yang menjelaskan bahwa scene 3 tidak dapat ditemukan di scene 1 yang tentu saja itu dikarenakan perintah coding yang belum sesuai dan belum dimengerti oleh computer. Dengan menggunakan Actionscript 3.0 menjadi agak sulit bagi penel1ti untuk mencari tutorial baik di literature maupun secara online, karena kebanyakan hanya menjelaskan Actionscript 1.0 dan 2.0. Namun, peneliti tidak menyerah dengan berusaha menyelesaikan scene 1, 2, dan 3 terlebih dahulu dengan tidak lupa juga berusaha terus mencari coding yang sesuai dengan Actionscript 3.0. Dan sambil berjalan keduanya peneliti juga mulai berekspresi dengan menambahkan audio yang juga beberapa kali tidak sesuai dengan sinkronisasi antar frame. Pada akhirnya peneliti menemukan paduan yang baik antara efek suara, music latar dan juga perpindahan dari frame ke frame Pengujian Blackbox Skenario yang akan dijelaskan oleh penulis yaitu skenario awal skenario materi, skenario simulasi, dan skenario kuis. Table 3.3 Skenario Pengujian Blackbox Skenario Pengujian Hasil yang diharapakan Awal Materi Klik tombol Materi Klik tombol Simulasi Klik tombol Kuis Klik tombol Tentang Header Klik tombol Tentang Layer Menampilkan halaman Materi Menampilkan halaman Simulasi Menampilkan halaman Kuis Menampilkan halaman penjelasan tentang header dan jaringan LAN dan WAN Menampilkan halaman penjelasan tentang layer-layer

23 57 Simulasi Kuis Klik tombol Enkapsulasi dan Dekapsulasi Klik tombol OSI Model Klik tombol Next Klik tombol Previous Klik tombol Main Menu Klik tombol LAN Klik tombol WAN Klik tombol Main Menu Klik tombol Go Klik tombol Main Menu Klik tombol Ulangi Menampilkan halaman penjelasan tentang enkapulasi dan dekapsulasi serta alat-alat pengirim data Menampilkan skema OSI Model Layer Menampilkan halaman selanjutnya Menampilkan halaman sebelumnya Menampilkan halaman Awal Menampilkan simulasi pengiriman data pada jaringan LAN Menampilkan simulasi pengiriman data pada jaringan WAN Menampilkan halaman Awal Menampilkan halaman soal-soal evaluasi Menampilkan halaman Awal Menampilkan kembali halaman soal-soal evaluasi