BAB IV
RANCANGAN SISTEM
Faktor yang dipertimbangkan sebelum merancang sebuah sistem adalah mempersiapkan bahan materi yang akan digunakan dalam pengembangan sistem. Pengembangan sistem multimedia harus mengikuti tahapan pengembangan sistem multimedia, yaitu tahap konsep, tahap perancangan, tahap pengumpulan materi, tahap pembuatan, tahap pengujian dan tahap distribusi.
A. TAHAP KONSEP
Tujuan dibuatnya media pembelajaran proses pembuatan beras organik adalah untuk mempermudah siswa – siswi dalam memahami materi beras organik. Dalam aplikasi yang akan dibuat terdapat halaman utama, materi, latihan – latihan soal, serta contoh pembuatan beras organik.
1. Deskripsi konsep
Dalam tahap ini dilakukan perancangan terhadap konsep konten yang akan dibuat seperti teks, gambar, suara dan animasi agar hasilnya sesuai dengan yang diharapkan.
Table 4.1 Deskripsi Konsep
No Object Keterangan
1 Judul Media pembelajaran pembuatan beras organik SMK Diponegoro.
2 Tujuan Membangun suatu aplikasi media pembelajaran untuk membantu siswa – siswi dalam
memahami materi beras organik. 3 Audiens Siswa - siswi SMK Diponegoro
4 Image Gambar menggunakan format file.jpg dan.png yang dibuat dengan Corel dan Photoshop 5 Audio Menggunakan instrumen dari koleksi mp3 dan
audio yang telah direkam dan di edit menggunakan Cool Edit Pro
Macromedia Flash 8. 2. Kebutuhan menentukan personil
Dalam membuat proyek ini, beberapa keahlian yang dibutuhkan dalam penyelesaian proyek tersebut, yaitu:
a. Storyboard artis yaitu perancangan alur cerita atau jalannya (sketsa) urutan program yang dimulai dari awal sampai akhir.
b. Editor audio yaitu proses pengeditan suara / dubing (audio) untuk pengiring suara dalam penjelasan beberapa materi. Dalam hal ini rekaman suara / dubing (audio) menggunakan mp4 player yang selanjutnya diedit menggunakan Cool Edit Pro.
c. Animator yaitu orang yang melakukan proses pembuatan animasi. 3. Kebutuhan fungsional
Kebutuhan fungsional merupakan kebutuhan yang berkaitan dengan fungsi pokok dari media pembelajaran proses pembuatan beras organik, yaitu:
a. Dapat menampilkan materi beras organik dan contoh penerapan materi tersebut
b. Dapat menampilkan evaluasi yang sesuai materi pada mata pelajaran beras organik.
4. Kebutuhan non – fungsional
Kebutuhan ini merupakan kebutuhan tambahan yang dapat mendukung kebutuhan fungsional, yaitu user interface dibuat semuda mungkin agar user tidak kebingungan saat menjalankannya dan animasi dibuat semenarik mungkin agar menarik minat siswa – siswi kelas XI di SMK Diponegoro.
Spesifikasi komputer yang dapat menjalankan software Macromedia dan Cool Edit Pro serta alat tambahan berupa microphone dan speker.
B. TAHAP DESAIN 1. Struktur Navigasi
Struktur navigasi yang digunakan adalah model hierarki. Tambahan pada perancangan model dapat dilihat pada penggunaan scene 1 (splash pembuka) yang dihubungkan dengan scene 2 (menu utama). Kemudian scene 2 menuju scene 3 (silabus), scane 4 (materi), scane 5 (evaluasi), scane 6 (profil) atau scane7 (keluar).
Gambar 4.1 Struktur Menu Program Keterangan
a. Splash Pembuka
Pada splash pembuka merupakan awalan tampilan dari Media pembelajaran
b. Menu Utama
Di dalam menu utama terdapat tombol menu yang berisi lima tombol yaitu Silabus, Materi, Evaluasi, Profil dan Keluar, bila memilih silabus akan muncul silabus, jika memilih materi akan memunculkan Keluar Menu
utama
Silabus Materi Evaluasi Profil
materi, jika memilih evaluasi akan memunculkan tampilan evaluasi, jika akan memilh profil maka muncul profil pembuat Media pembelajaran, jika ingin keluar maka klik pada tombol keluar.
c. Silabus
Menu silabus bagian dari menu utama setelah dipilih maka akan menampilkan silabus mata pelajaran beras organik kelas XI.
d. Menu Materi
Menu ini berisikan Materi-materi mengenai mata pelajaran beras organik.
e. Menu Evaluasi
Menu Kuis berisikan soal – soal yang berhubungan dengan materi yang ada dalam program.
f. Menu profil
Jika pengguna memilih menu profil maka profil akan ditampilkan. Setelah profil ditampilkan pengguna dapat kembali ke menu utama. Jika tidak memilih menu ini, pengguna dapat memilih menu lainnya.
g. Menu Keluar
Jika pengguna tidak memilih salah satu dari kedua menu yang ada, maka pengguna dapat memilih keluar dari program, dan program akan menutup.
2. UML Media Pembelajaran
Alat bantu yang digunakan dalam merancang alur program digunakan pemodelan sistem berbasis orientasi objek dengan alat bantu Unified Modelling Language (UML). UML ini dibuat dengan menggunakan bantuan program / software Rational Rose 2000.
Diagram – diagram UML yang digunakan dalam rancangan program ini antara lain :
silabus
evaluasi user
profil
materi bab 1
materi bab 2 materi
Gambar 4.2 Diagram Use Case Media Pembelajaran Keterangan :
b. Diagram Sequence
Skenario user pada saat memilih menu silabus dapat dilihat pada gambar 4.3
Gambar 4.3 Diagram Sequence User memilih silabus
Keterangan :
Skenario user pada saat memilih menu materi dapat dilihat pada gambar 4.4
Gambar 4.4 Diagram Sequence User masuk menu Materi
Keterangan :
Skenario user pada saat memilih menu BAB I dapat dilihat pada gambar 4.5
Gambar 4.5 Diagram Sequence User masuk menu BAB I
Keterangan :
Skenario user pada saat memilih menu BAB II dapat dilihat pada gambar 4.6
Gambar 4.6 Diagram Sequence User masuk menu BAB II
Keterangan :
Skenario user pada saat memilih menu evaluasi dapat dilihat pada gambar 4.7
Gambar 4.7 Diagram Sequence User memilih evaluasi
Keterangan :
User memilih evaluasi maka tampil form evaluasi.
Skenario user pada saat memilih menu profil dapat dilihat pada gambar 4.8
Gambar 4.8 Diagram Sequence User memilih profil
Keterangan :
c. Diagram Activity
Skenario user pada saat memilih menu Silabus dapat dilihat pada gambar 4.10
Gambar 4.10 Diagram Activity Silabus
Keterangan :
Skenario user pada saat memilih menu Materi dapat dilihat pada gambar 4.11
Gambar 4.11 Diagram Activity materi Keterangan :
Skenario user pada saat memilih menu BAB I dapat dilihat pada gambar 4.12
Gambar 4.12 Diagram Activity BAB I
Keterangan :
User memilih BAB I, kemudian akan tampil halaman BAB I, di dalam BAB I terdapat beberapa pilihan menu. Jika memilih menu penyiapan lahan maka akan masuk ke form penyiapan lahan, jika memilih menu penyiapan benih dan bibit maka akan masuk ke form penyiapan benih dan bibit, jika memilih menu pemupukan maka akan masuk ke form pemupukan.
Skenario user pada saat memilih menu BAB II dapat dilihat pada gambar 4.13
Gambar 4.13 Diagram Activity BAB II Keterangan :
Skenario user pada saat memilih menu Evaluasi dapat dilihat pada gambar 4.14
Gambar 4.14 Diagram Activity Evaluasi
Keterangan :
Skenario user pada saat memilih menu Profil dapat dilihat pada gambar 4.15
Gambar 4.15 Diagram Activity Profil
Keterangan :
User memilih profil, kemudian akan tampil halaman profil, user dapat melihat halaman profil.
3. Desain Storyboard
a. Form Storyboard Proses Pembuatan Beras Organik
Gambar 4.15 Gambar Storyboard Proses Pembuatan Beras Organik
Keterangan :
Nama File : materi.swf materi2.swf
Merupakan gambar proses pembuatan beras organik. Notes :
Tahapan proses pembuatan beras organik.
Proses Pengolahan Lahan Proses Pemilihan Benih/Bibit Proses Pemupukan
Proses Menanam
Proses Pengendalian Penyakit Tanaman dengan Predator Proses Pengendalian Penyakit
Tanaman dengan Pengairan Proses Mengairi
Proses Pelaksanaan Panen dengan Mengeringkan Gabah
4. Desain Interface
Desain interface menggambarkan bagaimana perangkat lunak atau aplikasi berkomunikasi dalam dirinya sendiri, dengan sistem yang berinteroperasi dengannya dan dengan manusia yang menggunakannya. Untuk memberikan gambaran secara umum kepada user, pada tahap ini digunakan rancangan antar muka (interface) program dalam bentuk Lembar Kerja Tampilan (LKT).
a. Splash Pembuka
Gambar 4.16 LKT Splash Pembuka
Keterangan :
Splash Pembuka berisi gambar, background, dan tombol masuk.
No 1
SELAMAT DATANG DI MEDIA PEMBELAJARAN PROSES PEMBUATAN BERAS ORGANIK
Keterangan : Splash pembuka menggunakan Font Victoria Let dengan ukuran 31- 44 font.
b. Menu Utama
Gambar 4.17 LKT Menu Utama Keterangan :
Menu Utama berisikan: 1. Silabus
Menu silabus bagian dari menu utama setelah dipilih maka akan menampilkan silabus dari mata pelajaran beras organik. Setelah silabus ditampilkan pengguna dapat kembali ke menu utama. Jika tidak memilih menu ini, pengguna dapat memilih menu lainnya. 2. Menu Materi
Menu ini berisikan materi – materi mengenai mata pelajaran beras organik di SMK Diponegoro Kelas XI. Setelah materi ditampilkan pengguna dapat kembali ke menu utama. Jika tidak memilih menu ini, pengguna dapat memilih menu lainnya.
3. Menu Evaluasi
Menu evaluasi berisikan soal – soal latihan yang berhubungan dengan materi yang ada dalam program. Setelah evaluasi
No 2
Keterangan :
Font menggunakan Rockwell Extra Bold dengan ukuran 31 font. Menu silabus akan menuju ke LKT no 3, Materi menuju ke LKT no4 , Menu evaluasi akan menuju LKT no 5, Menu profil akan menuju LKT no 6, dan menu kembali untuk kembali ke LKT sebelumnya.
ditampilkan pengguna dapat mengerjakan soal – soal dan mengetahui nilai akhirnya kemudian dapat kembali ke menu utama. Jika tidak memilih menu ini, pengguna dapat memilih menu lainnya. 4. Menu profil
Jika pengguna memilih menu profil maka akan ditampilkan profil pembuat media pembelajan. Setelah profil ditampilkan pengguna dapat kembali ke menu utama. Jika tidak memilih menu ini, pengguna dapat memilih menu lainnya.
5. Menu Keluar
Jika pengguna tidak memilih salah satu dari menu yang ada, maka pengguna dapat memilih keluar dari aplikasi untuk menutup program.
c. Silabus
A
Gambar 4.18 LKT Silabus
Keterangan :
No. 3
Keterangan :
Judul menggunakan font Arial dengan ukuran font 25, text menggunakan font Arial ukuran font 25, Tombol next digunakan untuk menuju ke form berikutny dan tombol back digunakan untuk menuju ke form sebelumnya
ISI SILABUS
SILABUS BERAS ORGANIK
Menu silabus bagian dari menu utama setelah dipilih menggunakan tombol next dan back, maka akan menampilkan silabus dari media pembelajaran beras organik untuk SMK Diponegoro kelas XI. Di dalam menu silabus terdapat tombol kembali yang berfungsi untuk kembali ke menu utama.
d. Menu Materi
Gambar 4.19 LKT Materi dan Gambaran
Keterangan :
Di dalam menu materi terdapat BAB I dan BAB II jika user memilih salah satu maka akan tampil materi pada BAB tersebut. Dan tombol kembali untuk menuju pada form sebelumnya.
No 4
MATERI Petunjuk :
1. Tombol menu Traditional Arabic ukuran font 25. Form Menampilkan materi yang terdiri dari BAB I dan BAB II, jika user memilih BAB I maka akan menuju LKT ke 5 dan jika user memilih BAB II maka akan menuju LKT ke 6.
No 5
1. BAB I
Gambar 4.20 LKT Materi dan Gambaran
Keterangan :
Di dalam menu materi BAB I yang terdiri dari Menyiapkan Lahan, Menyiapkan Benih / Bibit, dan Memupuk jika user memilih salah satu maka akan tampil materi sesuai dengan yang dipilih tersebut, dan tombol kembali untuk menuju pada form sebelumnya.
MATERI BAB I Petunjuk :
1. Tombol menu kembali
digunakan untuk kembali ke form sebelumnya. menuju ke form. sebelumnya.
Keterangan :
Judul menggunakan font Victoria Let dengan ukuran font 25, text menggunakan font Traditional Arabic ukuran font 25. Form Menampilkan materi BAB I yang terdiri dari Menyiapkan Lahan, Menyiapkan Benih / Bibit, Memupuk, jika user memilih salah satu menu yang di inginkan.
No 6
2. Menyiapkan Lahan
Gambar 4.21 LKT Materi dan Gambaran Keterangan :
Di dalam menu materi BAB I yang terdiri dari Menyiapkan Lahan, Menyiapkan Benih / Bibit, dan Memupuk jika user memilih salah satu maka akan tampil materi sesuai dengan yang dipilih tersebut, dan tombol kembali untuk menuju pada form sebelumnya.
Petunjuk :
1. Tombol menu kembali digunakan untuk kembali ke form sebelumnya.
2. Tombol next digunakan untuk menuju ke form yang berikutnya dan menu back digunakan untuk kembali ke form yang sebelumnya.
Keterangan :
Judul menggunakan font Victoria Let dengan ukuran font 25, text menggunakan font Traditional Arabic ukuran font 25. Form Menampilkan materi Menyiapkan Lahan.
Materi
Kembali
No 7
3. BAB II
Gambar 4.22 LKT Materi dan Gambaran Keterangan :
Di dalam menu materi BAB II yang terdiri dari Menanam, Mengendalikan Gulma dan Hama, Mengendalikan Penyakit Tanaman, Mengairi dan Melaksanakan Panen, jika user memilih salah satu maka akan tampil materi sesuai dengan yang dipilih tersebut, dan tombol kembali untuk menuju pada form sebelumnya.
MATERI BAB II Petunjuk :
1. Tombol menu kembali
digunakan untuk kembali ke form sebelumnya. 2. Tombol menu
Menanam, Mengendalikan Gulma & Hama, Mengendalikan untuk menuju ke form
sebelumnya. Keterangan :
Judul menggunakan font Victoria Let dengan ukuran font 25, text menggunakan font Traditional Arabic ukuran font 25. Form Menampilkan materi BAB II yang terdiri dari Menanam, Mengendalikan Gulma dan Hama, Mengendalikan Penyakit Tanaman, Mengairi dan Melaksanakan Panen, jika user memilih salah satu menu yang di inginkan.
TANDA TANDA ISIM
No 9
4. Menanam
Gambar 4.23 LKT Materi dan Gambaran
Keterangan :
Di dalam menu materi BAB II yang terdiri dari Menanam, Mengendalikan Gulma dan Hama, Mengendalikan Penyakit Tanaman, Mengairi dan Melaksanakan Panen, jika user memilih salah satu menu maka akan tampil materi sesuai dengan yang dipilih tersebut, dan tombol kembali untuk menuju pada form sebelumnya.
MENANAM Petunjuk :
1. Tombol menu kembali digunakan untuk kembali ke form sebelumnya.
2. Tombol next digunakan untuk menuju ke form yang berikutnya dan menu back digunakan untuk kembali ke form yang sebelumnya.
Keterangan :
Judul menggunakan font Victoria Let dengan ukuran font 25, text menggunakan font Traditioanal Arabic ukuran font 25. Form Menampilkan materi Menanam.
Materi
e. Menu Evaluasi
Gambar 4.24 LKT Menu Evaluasi
Keterangan :
Menu Evaluasi berisikan pertanyaan – pertanyaan tentang materi – materi yang sudah diberikan ada pada program. Pertanyaan dari menu evaluasi ini akan secara otomatis melanjut ke pertanyaan berikutnya apabila user menjawab pertanyaan demi pertanyaan.
No 10
Petunjuk : 1. User diminta
memilih pilihan ganda yang tersedia dalam soal.
Keterangan :
Judul menggunakan font Rockwell Extra Bold dengan ukuran font 25, text menggunakan Calibri ukuran font 36,
Setelah semua soal selesai dikerjakan, maka akan menuju form nilai yaitu LKT No 25
Soal – soal
f. Form Nilai
Gambar 4.21 LKT Form Nilai
Keterangan :
Menu nilai berisikan nilai – nilai yang berasal dari LKT no 5 di mana di sana juga terdapat tombol evaluasi untuk kembali ke evaluasi dan yang terakhir tombol keluar untuk kembali ke menu utama.
No 11
Petunjuk : 1. Tombol keluar
untuk keluar dari form nilai dan menuju menu utama (LKT 2)
Keterangan :
Font menggunakan Andalusdengan ukuran 48 font. Form nilai berisikan nilai dari soal-soal yang telah dikerjakan pada menu soal (LKT 5)
Nilai
g. Menu Profil
Gambar 4.22 LKT Menu Profil
Keterangan :
Menu profil berisikan tentang profil pembuat aplikasi dan di dalam menu profil terdapat tombol keluar untuk kembali ke menu utama.
No 12
Petunjuk : 1. Tombol
keluar untuk keluar dari menu profil
Keterangan :
Judul menggunakan Victoria Let dengan ukuran font 25, text menggunakan font Traditional Arabic ukuran font 25. Berisikan foto profil serta data diri pembuat aplikasi
C. PENGUMPULAN MATERIAL
Pengumpulan bahan dilakukan pada tahap pembuatan agar bahan – bahan yang dikumpulkan sesuai dengan kebutuhan desain dan terarah dengan tujuan pembuatan media pembelajaran. Tahap pengumpulan bahan menjadi sangat penting karena mendukung kelancaran dan kematangan proses pembuatan sehingga diharapkan menghasilkan produk yang kompeten di bidangnya. Pada tahap ini dilakukan pengumpulan bahan seperti gambar dan audio yang telah dibuat dan sebagian diambil dari Internet serta materi – materi dari SMK Diponegoro yang berkaitan dengan materi. Di bawah ini terdapat nama gambar, nama sound dan yang diperlukan untuk tahap berikutnya.
Tabel 4.1 Material Collecting
No Jenis bahan materi Nama File
1 Gambar. Jpg Logo Beras Organik
2 Gambar. Jpg Gambar Backgroung
4 Gambar. Jpg Gambar Background
5 Profil
6 Audio Materi.wav
Evaluasi.mp3 Profil.mp3
splash pembuka.mp3serta audio pendukung lainya
7 Text Judul (Victoria Let)
Materi dan Evaluasi (Victoria Let, Arial, Traditional Arabic, Andalus, Rockwell Extra Bold)
Splash Pembuka (Victoria Let)
