pembuatan aplikasi pembelajaran materi pengolahan citra...
TRANSCRIPT
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN
CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS
MULTIMEDIA
(Studi Kasus: Program Studi Teknik Informatika Fakultas Sains &
Teknologi UIN Syarif Hidayatullah Jakarta)
Skripsi
Sebagai Salah Satu Syarat Untuk Meraih Gelar Sarjana Komputer
Oleh :
Nur Ulfah Sam
105091002847
PROGRAM STUDI TEKNIK INFORMATIKA
FAKULTAS SAINS DAN TEKNOLOGI
UNIVERSITAS ISLAM NEGERI
SYARIF HIDAYATULLAH
JAKARTA
2010
ii
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN
CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS
MULTIMEDIA
(Studi Kasus: Program Studi Teknik Informatika Fakultas Sains &
Teknologi UIN Syarif Hidayatullah Jakarta)
Skripsi Sebagai Salah Satu Syarat Untuk Memperoleh Gelar
Sarjana Komputer Fakultas Sains dan Teknologi
Universitas Islam Negeri Syarif Hidayatullah Jakarta
Oleh
Nur Ulfah Sam
105091002847
Menyetujui,
Pembimbing 1
Victor Amrizal, M.Kom NIP. 150411288
Pembimbing 2
Qurrotul Aini, MT NIP. 197303252009012001
Mengetahui, Ketua Program Studi Teknik Informatika
Yusuf Durrachman, MSc, MIT NIP. 197105222006041002
iii
PENGESAHAN UJIAN Skripsi yang berjudul “Pembuatan Aplikasi Pembelajaran Materi Pengolahan Citra dengan Menggunakan Teknik Konvolusi Berbasis Multimedia, Studi Kasus : Program Studi Teknik Informatika UIN Syarif Hidayatullah Jakarta”, telah diuji dan dinyatakan lulus dalam Sidang Munaqosah Fakultas Sains dan Teknologi Universitas Islam Negeri Syarif Hidayatullah Jakarta, pada hari Selasa, 31 Agustus 2010. Skripsi ini telah diterima sebagai salah satu syarat untuk memperoleh gelar Sarjana Komputer pada Program Studi Teknik Informatika.
Jakarta, 31 Agustus 2010
Menyetujui,
Mengetahui,
Penguji I
Arini, MT NIP. 197601312009012001
Pembimbing II
Qurrotul Aini, MT NIP. 197303252009012001
Pembimbing I
Victor Amrizal, M.Kom NIP. 150411288
Penguji II
Ria Hari Gusmita, M.Kom NIP. 198208172009122002
Dekan Fakultas Sains Dan Teknologi
DR. Syopiansyah Jaya Putra, M.Sis NIP. 19681172001121001
Ketua Program Studi Teknik Informatika
Yusuf Durrachman, MSc.MIT NIP. 197105222006041002
iv
PERNYATAAN
DENGAN INI SAYA MENYATAKAN BAHWA SKRIPSI INI ADALAH
HASIL KARYA SENDIRI YANG BELUM PERNAH DIAJUKAN SEBAGAI
SKRIPSI ATAU KARYA ILMIAH PADA PERGURUAN TINGGI ATAU
LEMBAGA MANAPUN.
Jakarta, Agustus 2010
Nur Ulfah Sam 105091002847
v
ABSTRAK
Nur Ulfah Sam (105091002847). Pembuatan Aplikasi Pembelajaran Materi Pengolahan Citra dengan Menggunakan Teknik Konvolusi Berbasis Multimedia, Studi Kasus: Program Studi Teknik Informatika Fakultas Sains dan Teknologi UIN Syarif Hidayatullah Jakarta, dibimbing oleh Victor Amrizal, M.Kom dan Qurrotul Aini, MT.
Media pembelajaran berbasis multimedia dapat digunakan dalam dunia pendidikan, salah satunya pada kegiatan perkuliahan materi pengolahan citra di Program Studi Teknik Informatika. Dalam silabus mata kuliah pengolahan citra, teknik konvolusi merupakan materi awal yang diajarkan dalam topik kuliah Konvolusi & Transformasi Fourier. Berdasarkan analisis kuesioner awal penelitian diperoleh data sebanyak 65,22% atau 30 dari 46 mahasiswa yang belum mengerti materi teknik konvolusi ini. Teknik Konvolusi merupakan salah satu teknik pada pengolahan citra yang bertujuan untuk memperbaiki kualitas suatu citra atau gambar (Image Enhancement). Metode pengumpulan data yang dilakukan pada penelitian ini yaitu dengan cara studi pustaka dan penelitian sejenis, observasi, wawancara dan kuesioner. Adapun metode pengembangan aplikasi yang digunakan yaitu metode menurut Vaughan (2004) yang terdiri dari 4 tahap yaitu perencanaan dan pembiayaan, disain dan produksi, pengujian dan yang terakhir adalah pengiriman. Dalam pembuatannya aplikasi ini menggunakan software Macromedia Flash Professional 8, Adobe Photoshop CS 2, Matlab Simulink 2009, Ulead Video Studio 10 dan Camtasia Studio 7. Berdasarkan hasil pengujian yang telah dilakukan dan berdasarkan evaluasi hasil penelitian diperoleh peningkatan yaitu sebelum adanya aplikasi jumlah mahasiswa yang mengerti sebesar 65,22%, setelah diberikan aplikasi Pembelajaran Materi Pengolahan Citra dengan Menggunakan Teknik Konvolusi ini persentase jumlah mahasiswa yang mengerti menjadi 80%. Pada akhirnya output yang dihasilkan dari pembuatan aplikasi ini yaitu dalam bentuk CD-Interaktif pembelajaran dengan kapasitas file 219 MB. Untuk pengembangan berikutnya dapat ditambahkan teknik transformasi fourier untuk melanjutkan materi dari teknik konvolusi pada materi pengolahan citra tersebut. Kata Kunci: Multimedia, pembelajaran, Vaughan, konvolusi, citra digital.
vi
KATA PENGANTAR
بسم اهللا الرحمن الر حیم
Puji syukur kehadirat Allah SWT yang selalu memberikan rahmat dan
nikmat sehat kepada hambanya, sehingga penelitian skripsi ini dapat terselesaikan
dengan baik dan lancar, karena tanpa segala rahmat dan kenikmatan dari Nya lah
segala sesuatu tidak akan berawal.
Skripsi yang berjudul “Pembuatan Aplikasi Pembelajaran Materi
Pengolahan Citra Dengan Menggunakan Teknik Konvolusi Berbasis
Multimedia, Studi Kasus: Program Studi Teknik Informatika UIN Syarif
Hidayatullah Jakarta” ini merupakan salah satu syarat kelulusan dalam
menempuh pendidikan jenjang Strata-1 (S1) di Universitas Islam Negeri Syarif
Hidayatullah Jakarta.
Peneliti menyadari bahwa penelitian dan penyusunan skripsi ini tidak
dapat terselesaikan dengan baik tanpa bantuan dan bimbingan dari semua pihak.
Pada kesempatan ini, perkenankan peneliti mengucapkan terimakasih kepada :
1. Bapak Ir. Syopiansah Jaya Putra, M.Sis selaku Dekan Fakultas Sains dan
Teknologi UIN Jakarta. Bapak Yusuf Durrachman, MSc.MIT selaku
Ketua Program Studi Teknik Informatika.
2. Bapak Victor Amrizal, M.Kom dan Ibu Qurrotul Aini, MT selaku dosen
pembimbing yang banyak memberikan bimbingan dan petunjuk,
pengetahuan, keilmuan serta semangat kepada peneliti selama
melaksanakan proses penelitian dan pembuatan skripsi ini.
vii
3. Kedua orangtua peneliti, M.Sami’in dan Mu’alifah, yang telah
memberikan dukungan baik moril maupun materil, dan juga do’a yang
tiada hentinya serta adik peneliti Ninis Khoirunnisa, terimakasih telah
mengisi kebersamaan selama menyusun skripsi ini.
4. Yusuf dan teman-teman yang telah memberi semangat dan mengisi hari-
hari peneliti.
5. Teman-teman seperjuangan TI-B 2005, Ahmed, Titi, Neni, Irfan, Aby, IiL,
Tabkang, Imam, Irzal dan semua teman-teman yang membantu peneliti.
Terimakasih telah menjadi teman-teman terbaik bagi peneliti dan
kebersamaannya yang selalu dijaga.
6. K’Restu (2003), K’Tanta (2003), Kautsarina (2004) dan teman-teman SI-
05, terimakasih untuk ide, saran dan referensi yang sangat membantu
peneliti.
Akhir kata peneliti mohon kritik dan saran yang dapat membangun demi
kesempurnaan dalam penelitian di masa yang akan datang.
Jakarta, Agustus 2010 Peneliti
(NurUlfah.S) 105091002847
viii
DAFTAR ISI
Halaman judul ............................................................................................. i
Lembar Persetujuan Pembimbing ............................................................... ii
Lembar Pengesahan Ujian .......................................................................... iii
Lembar Pernyataan .................................................................................... iv
Abstrak ...................................................................................................... v
Kata Pengantar ............................................................................................ vi
Daftar Isi ...................................................................................................... viii
Daftar Gambar ............................................................................................ xiii
Daftar Tabel ................................................................................................ xviii
Daftar Lampiran .......................................................................................... xix
Daftar Istilah ............................................................................................... xx
BAB I PENDAHULUAN ....................................................................... 1
1.1. Latar Belakang ............................................................................. 1
1.2. Perumusan Masalah ....................................................................... 3
1.3. Pembatasan Masalah ..................................................................... 3
1.4. Tujuan Penelitian ........................................................................... 4
1.5. Manfaat Penelitian ........................................................................ 4
1.6. Metode Penelitian ......................................................................... 5
Halaman
ix
1.6.1 Metode Pengumpulan Data ............................................... 5
1.6.2 Metode Pengembangan Aplikasi Multimedia ................... 7
1.7. Sistematika Penulisan .................................................................... 7
BAB II LANDASAN TEORI ................................................................... 9
2.1. Pengertian Pembuatan .................................................................. 9
2.2. Pengertian Aplikasi ....................................................................... 9
2.3. Konsep Dasar Pembelajaran .......................................................... 10
2.3.1. Pengertian Belajar ............................................................ 10
2.3.2. Pengertian Media Pembelajaran ....................................... 11
2.3.3. Fungsi Media Pembelajaran .............................................. 12
2.4. Pembelajaran Multimedia ............................................................. 14
2.5. Pembelajaran dalam Perkuliahan ................................................... 15
2.6. Sejarah Multimedia ...................................................................... 16
2.7. Pengertian Multimedia ................................................................. 16
2.7.1. Elemen Multimedia .......................................................... 18
2.7.2. Objek Multimedia ............................................................. 21
2.8 Syarat Multimedia Interaktif .......................................................... 37
2.9 Flowchart ..................................................................................... 38
2.10 State Transition Diagram (STD) .................................................. 40
2.11 Storyboard .................................................................................... 41
2.12 Metode Pengembangan Multimedia Menurut Vaughan ................. 41
2.12.1 Perencanaan dan Pembiayaan .......................................... 41
x
2.12.2 Desain dan Produksi ........................................................ 47
2.12.3 Pengujian ......................................................................... 47
2.12.4 Pengiriman ...................................................................... 47
2.13 Struktur Navigasi .......................................................................... 48
2.14 Pengolahan Citra Digital ............................................................. 50
2.14.1 Citra ................................................................................. 50
2.14.2 Definisi Pengolahan Citra ................................................ 50
2.14.3 Tujuan Pengolahan Citra .................................................. 51
2.14.4 Citra Digital ...................................................................... 51
2.14.4.1 Representasi citra Digital ................................. 52
2.14.4.2 Format Citra Bitmap ........................................ 53
2.14.4.3 Elemen-elemen Citra Digital ........................... 55
2.14.5 Operasi Pengolahan Citra Digital ...................................... 57
2.14.6 Teknik Pengolahan Citra .................................................. 59
2.14.7 Matriks ............................................................................ 59
2.15 Image Enhancement (Perbaikan Citra) ......................................... 60
2.15.1 Operasi Spasial (Filtering) ................................................ 61
2.15.2 Kernel .............................................................................. 61
2.15.3 Konvolusi (Convolution) ................................................. 62
2.15.4 Aras Komputasi ............................................................... 68
2.15.5 Kernel Konvolusi ............................................................. 69
2.16 Macromedia Flash Professional 8 ................................................ 74
2.17 Adobe Photoshop CS 2 ................................................................ 75
xi
2.18 Matlab Simulink R2009a ............................................................. 76
2.19 Cool Edit Pro 2.1 ......................................................................... 77
2.20 Ulead Video Studio 10 ................................................................ 78
2.21 Camtasia Studio 7 ........................................................................ 79
BAB III METODE PENELITIAN ........................................................... 80
3.1. Metode Pengumpulan Data ........................................................... 80
3.1.1. Studi Lapangan ................................................................... 80
3.1.1.1 Observasi ............................................................ 80
3.1.1.2 Wawancara .......................................................... 81
3.1.1.3 Kuesioner ............................................................ 81
3.1.2. Studi Penelitian Sejenis ..................................................... 82
3.2. Metode Pengembangan Aplikasi Multimedia ................................ 85
3.2.1. Perencanaan dan Pembiayaan.............................................. 85
3.2.2. Desain dan Produksi ........................................................... 85
3.2.3. Pengujian ........................................................................... 86
3.2.4. Pengiriman.......................................................................... 86
BAB IV PEMBAHASAN ........................................................................... 87
4.1. Profil Program Studi Teknik Informatika ........................................ 87
4.2. Visi, Misi dan Tujuan Pendidikan ................................................... 88
4.2.1. Visi ..................................................................................... 88
4.2.2. Misi .................................................................................... 88
xii
4.2.3. Tujuan Pendidikan .............................................................. 89
4.3. Kurikulum Program Studi TI UIN Syarif Hidayatullah ................... 91
4.4. Analisa Awal ................................................................................. 92
4.4.1. Observasi ............................................................................ 92
4.4.2. Wawancara ......................................................................... 92
4.4.3. Kuesioner .......................................................................... 92
4.4.4. Studi Pustaka ...................................................................... 93
4.4.5. Studi Penelitian Sejenis ....................................................... 93
4.5. Metode Pengembangan Aplikasi Multimedia ................................. 99
4.5.1. Perencanaan dan Pembiayaan.............................................. 99
4.5.2. Desain dan Produksi ........................................................... 107
4.5.3. Pengujian (Testing) ............................................................ 139
4.5.3.1 Alpha Testing ..................................................... 139
4.5.3.2 Beta Testing ........................................................ 143
4.5.3.3 Evaluasi .............................................................. 147
4.5.4. Pengiriman ......................................................................... 149
BAB V KESIMPULAN DAN SARAN ..................................................... 150
5.1. Kesimpulan ................................................................................... 150
5.2. Saran .............................................................................................. 151
DAFTAR PUSTAKA .................................................................................. 152
LAMPIRAN
xiii
DAFTAR GAMBAR
Halaman
Gambar 2.1 Teks Tercetak dalam Bentuk Poster (a) dan Teks Buku (b) ........ 22
Gambar 2.2 Scanned Text .............................................................................. 22
Gambar 2.3 Contoh Teks Elektronik (Word art) ............................................ 22
Gambar 2.4 Format Hypertext ....................................................................... 23
Gambar 2.5 Grafik Berbasis Bitmap (a), Grafik Berbasis Vektor (b)
dan Proses Perubahan Gambar Bitmap ke Vektor ...................... 24
Gambar 2.6 Clipart ...................................................................................... 25
Gambar 2.7 Digitized Picture MRI (a) dan Pencitraan Satelit (b) .................. 25
Gambar 2.8 Hyperpicture ............................................................................. 26
Gambar 2.9 Cell Animation ........................................................................... 33
Gambar 2.10 Frame Animation ....................................................................... 33
Gambar 2.11 Sprite Animation ........................................................................ 34
Gambar 2.12 Path Animation .......................................................................... 34
Gambar 2.13 Spline Animation ........................................................................ 35
Gambar 2.14 Vector Animation ....................................................................... 35
Gambar 2.15 Character Animation ................................................................. 36
Gambar 2.16 Computational Animation .......................................................... . 36
Gambar 2.17 Morphing Animation .............................................................. . 37
Gambar 2.18 Simbol State .............................................................................. 40
xiv
Gambar 2.19 Simbol Transition State ............................................................. 40
Gambar 2.20 Simbol Kondisi dan Aksi .......................................................... 40
Gambar 2.21 Form Storyboard yang Mengandung Sebuah Frame .................. 41
Gambar 2.22 Struktur Navigasi Linear ............................................................ 48
Gambar 2.23 Struktur Navigasi Hirarki ......................................................... 48
Gambar 2.24 Struktur Navigasi Non Linear ................................................... 49
Gambar 2.25 Struktur Navigasi Composit (Campuran) ................................... 49
Gambar 2.26 Representasi Citra Digital ......................................................... 52
Gambar 2.27 Representasi Matriks pada Citra Digital .................................... 53
Gambar 2.28 Citra Biner dengan Representasi bit 0 (hitam) dan 1 (putih)
(a) dan Citra Asli dalam Bentuk Hitam Putih (b) ....................... 54
Gambar 2.29 Contoh Citra Grayscale 8-bit .................................................... 54
Gambar 2.30 Citra Warna Asli (true color) .................................................... 55
Gambar 2.31 Contoh kernel (a)-(b) Berturut-turut kernel berukuran 2x2
dan 3x3 (sel dengan warna abu-abu menyatakan pusat
koordinat {0,0})……………............ ......................................... 61
Gambar 2.32 (a) Citra Input (b) Kernel 2 x 3 .................................................. 62
Gambar 2.33 Ilustrasi Hitung Konvolusi ....................................................... 64
Gambar 2.34 Gambar sebuah citra Lena sebelum (a) dan sesudah
(b) Penajaman Citra (image sharpening) ................................. 65
Gambar 2.35 Representasi Matriks dan Kurva dengan High-Pass Filter ......... 66
Gambar 2.36 Gambar sebuah citra Lena sebelum (a) dan sesudah
(b) Pelembutan Citra (image smoothing) ................................. 67
xv
Gambar 2.37 Tapis Low-pass ........................................................................ 70
Gambar 2.38 Contoh Tapis Mean adalah Tapis Low-Pass ............................. 70
Gambar 2.39 Tapis High-Pass 3 x 3 .............................................................. 72
Gambar 2.40 Contoh Filter Laplacian ........................................................... 73
Gambar 2.41 Antarmuka Macromedia Flash Professional 8 .......................... 75
Gambar 2.42 Antarmuka Adobe Photoshop CS 2 ........................................... 76
Gambar 2.43 Antarmuka MATLAB Simulink R2009a ..................................... 77
Gambar 2.44 Antarmuka CoolEdit Pro 2.1 ..................................................... 78
Gambar 2.45 Antarmuka Ulead Video Studio 10 ............................................ 79
Gambar 2.46 Antarmuka Camtasia Studio 7................................................... 79
Gambar 4.1 Struktur Organisasi FST ............................................................ 90
Gambar 4.2 Gedung Fakultas Sains & Teknologi ........................................ 90
Gambar 4.3 Grafik Hubungan Media & Pembelajaran ................................. 95
Gambar 4.4 Grafik Efektifitas Media dalam Kelas Perkuliahan ................... 96
Gambar 4.5 Grafik Persentase Pertanyaan 1 ................................................ 97
Gambar 4.6 Grafik Persentase Pertanyaan 2 ................................................ 98
Gambar 4.7 Buku Referensi Materi Pengolahan Citra .................................. 102
Gambar 4.8 Pembuatan Layout Utama dan Pemberian Efek pada Gambar .... 102
Gambar 4.9 Pemilihan Tipe Brush Tool ....................................................... 103
Gambar 4.10 Pembuatan Header Layar Aplikasi ............................................ 103
Gambar 4.11 Pembuatan Tombol-tombol Navigasi ........................................ 104
Gambar 4.12 Pembuatan Animasi dengan Macromedia Flash
Professional 8 .......................................................................... 104
xvi
Gambar 4.13 Pengolahan Efek Suara atau Audio .......................................... 105
Gambar 4.14 Pembuatan Video Tutorial ...................................................... 106
Gambar 4.15 Pembuatan Video dengan Ulead Video Studio 10 ................... 106
Gambar 4.16 Flowchart Layar Intro ............................................................ 117
Gambar 4.17 Flowchart Halaman Menu Utama .......................................... 118
Gambar 4.18 Flowchart Halaman Home ...................................................... 119
Gambar 4.19 Flowchart Halaman Petunjuk .................................................. 120
Gambar 4.20 Flowchart Halaman Profile ..................................................... 121
Gambar 4.21 Flowchart Halaman Quiz ........................................................ 121
Gambar 4.22 Desain Arsitektur Navigasi ..................................................... 122
Gambar 4.23 Rancangan STD Menu Utama ................................................. 122
Gambar 4.24 Rancangan STD Menu Home .................................................. 123
Gambar 4.25 Rancangan STD Menu Kuliah................................................. 123
Gambar 4.26 Rancangan STD Menu Konvolusi ........................................... 124
Gambar 4.27 Rancangan STD Menu Quiz .................................................... 124
Gambar 4.28 Rancangan STD Menu Petunjuk ............................................. 125
Gambar 4.29 Rancangan Layar Intro............................................................ 126
Gambar 4.30 Rancangan Layar Halaman Menu Utama ................................ 126
Gambar 4.31 Rancangan Menu Home ......................................................... 127
Gambar 4.32 Rancangan Menu Petunjuk ...................................................... 128
Gambar 4.33 Rancangan Menu Kuliah ......................................................... 128
Gambar 4.34 Rancangan Menu Konvolusi ................................................... 129
Gambar 4.35 Rancangan Menu Quiz ............................................................ 129
xvii
Gambar 4.36 Rancangan Menu Profile......................................................... 130
Gambar 4.37 Rancangan Menu Exit ............................................................. 130
Gambar 4.38 Pembuatan Layar Intro............................................................ 131
Gambar 4.39 Pembuatan Halaman Menu Utama .......................................... 132
Gambar 4.40 Pembuatan Halaman Menu Home ........................................... 132
Gambar 4.41 Pembuatan Halaman Isi Menu Kuliah ..................................... 133
Gambar 4.42 Pembuatan Halaman Menu Filter Konvolusi .......................... 134
Gambar 4.43 Pembuatan Halaman Menu Olah Citra .................................... 135
Gambar 4.44 Pembuatan Content Video ....................................................... 136
Gambar 4.45 Pembuatan Halaman Menu Matlab & Pengolahan Citra .......... 136
Gambar 4.46 Pembuatan Halaman Menu Quiz ............................................. 137
Gambar 4.47 Pembuatan Script Soal Quiz dengan XML ............................. 137
Gambar 4.48 Pembuatan Isi Materi Soal Quiz ............................................. 137
Gambar 4.49 Pembuatan Halaman Menu Petunjuk ....................................... 138
Gambar 4.50 Pembuatan Halaman Menu Profile ........................................... 138
Gambar 4.51 Pembuatan Halaman Menu Exit ............................................... 139
Gambar 4.52 Pengujian Aplikasi pada PC Desktop ...................................... 140
Gambar 4.53 Sampul CD Aplikasi ................................................................ 149
xviii
DAFTAR TABEL
Halaman
Tabel 2.1 Simbol-simbol Program Flowchart ........................................... 39
Tabel 3.1 Studi Penelitian Sejenis ............................................................ 84
Tabel 4.1 Hasil Perhitungan Pernyataan 1 ................................................ 95
Tabel 4.2 Hasil Perhitungan Pernyataan 2 ............................................... 96
Tabel 4.3 Pertanyaan 1 ............................................................................ 97
Tabel 4.4 Pertanyaan 2 ............................................................................ 97
Tabel 4.5 Tahap Perencanaan Awal ......................................................... 100
Tabel 4.6 Pembiayaan ............................................................................. 107
Tabel 4.7 Uji Aplikasi pada PC Berbeda ................................................. 140
Tabel 4.8 Uji Aplikasi dari Sisi Pembelajaran Teknik Konvolusi ............. 142
Tabel 4.9 Beta Testing oleh End User ...................................................... 143
Tabel 4.10 Beta Testing dari Sisi Pembelajaran Teknik Konvolusi ............. 146
Tabel 4.11 Beta Testing dengan Kesesuaian Syarat Interaktif Multimedia . 147
Tabel 4.12 Kuesioner Evaluasi Penelitian................................................... 148
xix
DAFTAR LAMPIRAN
Halaman
Lampiran 1 Form Wawancara ................................................................... L1
Lampiran 2 Kuisioner Skala Media Pembelajaran ..................................... L3
Lampiran 3 Hasil Perhitungan Analisa Kuisioner Awal Penelitian ............ L6
Lampiran 4 Tabel Pengumpulan Data ...................................................... L18
Lampiran 5 Kuesioner Evaluasi ................................................................ L20
Lampiran 6 Listing Program ..................................................................... L21
xx
DAFTAR ISTILAH
Animasi Kumpulan image yang di-display dengan cepat untuk
menciptakan perubahan visual sepanjang waktu.
Animasi Cell Metode overlaying layer dari image dengan
mengurutkannya ke dalam sebuah animasi.
Antarmuka Pengguna Perpaduan elemen grafis sebuah proyek dengan sistem
navigasinya.
Bitdepth Jumlah data yang dipergunakan untuk merepresentasikan
sampel digital.
Bitmap Matriks dari piksel individu yang membentuk sebuah
image.
BMP Format file image bitmap Windows; didesain dengan
ekstensi file .bmp.
CD-I (Interactive) Format CD awal yang didesain untuk memainkan suara
dan gambar pada player level konsumen yang
dikoneksikan ke televisi.
CD-ROM Medium penyimpanan compact disc read-only memory
yang hanya bisa dibaca oleh komputer; biasanya
menyimpan sekitar 700 MB data atau video full-screen
atau suara 80 menit.
Cell Lembar seluloid bening untuk menggambar masing-
masing frame dalam sebuah animasi.
Clip Art Seni atau elemen media lain yang diperoleh dari koleksi.
Dot Per Inch (dpi) Deskripsi resolusi layar atau printer.
Elemen Multimedia Teks, grafis, animasi, suara, dan video.
xxi
Filter Digunakan oleh perangkat lunak editing image untuk
efek khusus.
Flash Sistem authoring multimedia berbasis waktu dari
Macromedia yang sering digunkan untuk membangun
halaman web.
Format wave (WAV) Format file untuk menyimpan data suara, asli bawaan
sistem operasi windows.
Frame Dalam animasi dan video digital, satu persatu dalam
urutan image grafis.
GIF Graphic Interchage Format; format image bitmap
proprietary yang terbatas pada palet 256 warna dan
banyak digunkan di web.
GUI Graphical User Interface; koleksi elemen multimedia
yang di-display dalam sebuah layar komputer untuk
interaksi pengguna.
Hierarki Struktur multimedia di mana pengguna bernavigasi
sepanjang cabang dari sebuah struktur pohon yang
dibentuk oleh logika isi yang natural.
Hyperlink Mengoneksikan pengguna ke bagian lain dokumen atau
program atau pada program atau situs web berbeda.
Hypermedia Struktur dari elemen yang di-link dimana pengguna
dapat bernavigasi.
Hypertext Kata yang dikunci atau diindeks untuk mengaitkannya
dengan kata dan atau isi lain.
Interaktif Kemampuan sistema atau program yang bisa
menanyakan sesuatu pada pengguna (mengadakan tanya
jawab), kemudian mengambil berdasarkan respon
tersebut.
xxii
JPEG Joint Photographic Experts Group; jenis format file
image bitmap yang banyak digunakan di web untuk
image foto realistik didesain oleh ekstensi file .jpg
Keyframe Frame pertama dan terakhir dalam sebuah aksi.
Komposit Struktur multimedia dimana pengguna dapat bernavigasi
dengan bebas, namun biasanya terbatas pada presentasi
linier.
Kuantisasi Membulatkan nilai dari masing-masing sampel suara
pada bilangan bulat (integer) terdekat.
Linier Dimulai dari awal dan berjalan sampai akhir.
MIDI Musical Instrument Digital Interface; sistem untuk
membuat musik berbasis instruksi.
Morphing Perpaduan halus dua image sehingga satu image tampak
melebur dengan yang lain.
.MP3 Format file untuk menyimpan data suara yang
menggunakan skema kompresi yang dikembangkan oleh
Motion Picture Experts Group (MPEG).
MPEG Standar format file dan spesifikasi kompresi untuk data
video dan audio.
Multimedia Kombinasi teks, seni, suara, animasi, dan video apapun
yang dikirimkan oleh komputer atau peralatan elektronik
atau manipulasi digital lainnya.
Multimedia Interaktif Pengguna akhir atau pemirsa mengontrol dan dalam hal
apa urutan elemen multimedia dikirimkan.
Multimedia Linier Sebuah struktur multimedia dimana pengguna
bernavigasi sesuai urutan, dari satu frame atau bite
informasi ke yang lainnya.
xxiii
Objek Elemen konstruksi dasar dari banyak sistem authoring
multimedia.
Piranti Authoring Piranti yang didesain untuk mengelola dan memanipulasi
masing-masing elemen multimedia dan menyediakan
interaksi pengguna.
Pixel Picture elements; titik-titik kecil yang menyusun sebuah
image pada sebuah monitor komputer.
PNG Portable Network Graphic; format file image bitmap
dibuat sebagai alternatif bebas bayaran untuk format
GIF.
Prototipe Karya uji coba dari gagasan kreatif dan teknis.
RAM Random Access Memory; chip memori utama dalam
sebuah komputer; memori hilang ketika power padam.
ROM Read-only Memory; chip yang dibuat untuk tujuan
khusus; memori tidak pernah hilang.
RGB Red, Green, dan Blue; dikombinasikan dalam metode
warna aditif untuk menciptakan warna khusus.
Scene Kumpulan objek yang disusun dalam layout 3-D.
Scripting Kerangka isi dari suatu proyek menggunakan kata-kata.
Shockwave Piranti dari Macromedia untuk meluncurkan dan
memainkan proyek Director dan Flash.
Sprite Objek grafis dalam suatu sistem authoring multimedia,
sering dianimasikan.
Storyboard Kerangka grafis dan teks yang mendeskripsikan masing-
masing bagian dari sebuah proyek dalam detail yang
tepat.
xxiv
Tekstur Warna, pola, dan image bitmap yang diterapkan pada
permukaan sebuah objek untuk membuat objek tampak
lebih realistik.
TIFF Tagged Interchange File Format; format image bitmap
universal.
Tweening Menggambar serangkaian frame diantara frame pertama
dan terakhir dari suatu aksi.
Vector Garis yang digambar yang dideskripsikan oleh lokasi
dari dua ujungnya.
VGA Video Graphics Array; standar display/ monitor 640x480
pixel (dengan 256 warna) untuk komputer kompatibel
IBM.
ABSTRAK
Nur Ulfah Sam (105091002847). Pembuatan Aplikasi Pembelajaran Materi Pengolahan Citra dengan Menggunakan Teknik Konvolusi Berbasis Multimedia, Studi Kasus: Program Studi Teknik Informatika Fakultas Sains dan Teknologi UIN Syarif Hidayatullah Jakarta, dibimbing oleh Victor Amrizal, M.Kom dan Qurrotul Aini, MT.
Media pembelajaran berbasis multimedia dapat digunakan dalam dunia pendidikan, salah satunya pada kegiatan perkuliahan materi pengolahan citra di Program Studi Teknik Informatika. Dalam silabus mata kuliah pengolahan citra, teknik konvolusi merupakan materi awal yang diajarkan dalam topik kuliah Konvolusi & Transformasi Fourier. Berdasarkan analisis kuesioner awal penelitian diperoleh data sebanyak 65,22% atau 30 dari 46 mahasiswa yang belum mengerti materi teknik konvolusi ini. Teknik Konvolusi merupakan salah satu teknik pada pengolahan citra yang bertujuan untuk memperbaiki kualitas suatu citra atau gambar (Image Enhancement). Metode pengumpulan data yang dilakukan pada penelitian ini yaitu dengan cara studi pustaka dan penelitian sejenis, observasi, wawancara dan kuesioner. Adapun metode pengembangan aplikasi yang digunakan yaitu metode menurut Vaughan (2004) yang terdiri dari 4 tahap yaitu perencanaan dan pembiayaan, disain dan produksi, pengujian dan yang terakhir adalah pengiriman. Dalam pembuatannya aplikasi ini menggunakan software Macromedia Flash Professional 8, Adobe Photoshop CS 2, Matlab Simulink 2009, Ulead Video Studio 10 dan Camtasia Studio 7. Berdasarkan hasil pengujian yang telah dilakukan dan berdasarkan evaluasi hasil penelitian diperoleh peningkatan yaitu sebelum adanya aplikasi jumlah mahasiswa yang mengerti sebesar 65,22%, setelah diberikan aplikasi Pembelajaran Materi Pengolahan Citra dengan Menggunakan Teknik Konvolusi ini persentase jumlah mahasiswa yang mengerti menjadi 80%. Pada akhirnya output yang dihasilkan dari pembuatan aplikasi ini yaitu dalam bentuk CD-Interaktif pembelajaran dengan kapasitas file 219 MB. Untuk pengembangan berikutnya dapat ditambahkan teknik transformasi fourier untuk melanjutkan materi dari teknik konvolusi pada materi pengolahan citra tersebut. Kata Kunci: Multimedia, pembelajaran, Vaughan, konvolusi, citra digital.
1
BAB I
PENDAHULUAN
1.1 Latar Belakang
Belajar merupakan suatu proses yang kompleks yang terjadi pada semua
orang dan berlangsung seumur hidup, sejak masih bayi hingga ke liang lahat
nanti. (Sadiman, 1993: 1)
Perkuliahan merupakan suatu proses kegiatan belajar secara akademis dan
sistematis yang dilakukan oleh mahasiswa. Proses pembelajaran dalam dunia
perkuliahan bila dikaitkan dengan istilah komunikasi sederhananya merupakan
suatu proses belajar yang dilakukan di dalam kelas atau ruang dengan dosen
sebagai sumber pesan dan mahasiswa sebagai penerima pesan.
Pengolahan citra merupakan salah satu mata kuliah yang termasuk dalam
silabus perkuliahan di Program Studi Teknik Informatika UIN Syarif Hidayatullah
Jakarta yang dapat diambil oleh mahasiswa yang duduk di semester lima. Mata
kuliah ini merupakan mata kuliah peminatan yang mulai ditawarkan kepada
mahasiswa angkatan 2006 dan seterusnya pada bidang peminatan multimedia.
Berdasarkan silabus mata kuliah pengolahan citra, teknik konvolusi
merupakan materi awal dalam topik materi Konvolusi & Transformasi Fourier.
Namun sebagai bahasan awal teknik konvolusi ini peneliti pilih karena diperlukan
untuk memahami landasan awal materi-materi pengolahan citra selanjutnya.
Selama ini proses belajar mata kuliah pengolahan citra di dalam kelas
perkuliahan yang dilakukan oleh dosen dengan mahasiswa terlihat masih
2
menggunakan media verbal dan tertulis dalam menyampaikan materi kuliah
tersebut, tetapi tidak jarang pula menggunakan media lainnya sebagai alat bantu
perkuliahan. Hal ini bisa saja tidak sepenuhnya dapat dipahami oleh seluruh
mahasiswa di dalam kelas dikarenakan media penyampaian informasi dalam hal
ini alat dan materi perkuliahannya yang mungkin kurang menarik di mata
mahasiswa.
Berdasarkan hasil observasi yang telah dilakukan, materi teknik konvolusi
mengandung ilustrasi gambar dan perhitungan yang menjelaskan teori dari teknik
konvolusi tersebut, dan setelah dilakukan analisa menggunakan kuesioner awal
penelitian kepada 46 mahasiswa diperoleh persentase sebesar 65,22%
(ditunjukkan pada Tabel 4.7 Lampiran L4) yang menjawab materi teknik
konvolusi ini masih sulit untuk dimengerti.
Atas dasar latar belakang itulah, maka peneliti ingin membuat sebuah
“APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA
DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS
MULTIMEDIA” Studi Kasus pada “Program Studi Teknik Informatika
Fakultas Sains dan Teknologi UIN Syarif Hidayatullah Jakarta” yang dapat
menjadi sebuah aplikasi untuk membantu antara proses penyampaian materi
kuliah pengolahan citra yang disampaikan oleh dosen kepada mahasiswa.
Untuk membuat aplikasi tersebut maka peneliti memilih multimedia
sebagai bentuk pengembangan media pembelajaran yang dapat menggabungkan
antara media komunikasi dalam bentuk verbal, teks, cetak (textbook) dan
penggambaran objek fisik atau benda sesungguhnya.
3
1.2 Perumusan Masalah
Dengan didasari oleh latar belakang tersebut, maka didapati perumusan
masalah sebagai berikut:
1. Bagaimana membuat sebuah aplikasi pembelajaran materi pengolahan
citra, pada operasi filter smoothing, sharpening dan laplacian dalam
teknik konvolusi dengan objek citra grayscale berbasis multimedia ini
menjadi media yang interaktif dan dapat digunakan di perkuliahan untuk
membantu mahasiswa dan dosen dalam mata kuliah pengolahan citra?
2. Bagaimana teknik konvolusi pada citra grayscale dapat diwujudkan/
diimplementasikan ke dalam bentuk ilustrasi animasi dua dimensi (2D)?
1.3 Pembatasan Masalah
Untuk mempersempit objek penelitian, maka dalam perancangan
perangkat ajar media pembelajaran materi pengolahan citra pada operasi teori
konvolusi berbasis multimedia ini, peneliti membatasi masalah sebagai berikut:
1. Citra uji atau gambar yang dibahas dan digunakan pada penelitian adalah
berupa still image (gambar diam) yang berformat bitmap dengan aras atau
level keabuan/ grayscale.
2. Operasi matematis yang digunakan dan dibahas adalah hanya pada teknik
konvolusi pengolahan citra dan tidak membandingkan dengan teknik yang
lainnya.
3. Ilustrasi yang digambarkan dalam bentuk animasi hanya dibatasi pada
teknik konvolusi citra grayscale.
4
4. Output yang dihasilkan adalah dalam bentuk CD interaktif.
1.4 Tujuan Penelitian
Tujuan yang ingin dicapai oleh peneliti dari penelitian ini adalah:
a. Membuat sebuah aplikasi media pembelajaran dengan menggabungkan
elemen multimedia yaitu teks, animasi, video, audio dan gambar.
b. Membuat penerapan teknik konvolusi dengan ilustrasi animasi dengan
dipadukan elemen multimedia di dalamnya.
1.5 Manfaat Penelitian
1.5.1 Bagi Dosen
Manfaat yang dapat diambil oleh dosen dari adanya media pembelajaran
materi pengolahan citra dengan operasi teori konvolusi ini adalah:
a. Dapat mempermudah dalam menjelaskan teori konvolusi pada pengolahan
citra kepada mahasiswa.
b. Dapat menjadi alat bantu yang dapat mengilustrasikan rumus atau
perhitungan matematis secara lebih interaktif.
1.5.2 Bagi Mahasiswa
Sedangkan manfaat yang dapat diambil oleh mahasiswa Program Studi
Teknik Informatika UIN Syarif Hidayatullah Jakarta adalah:
a. Mempermudah dalam memahami materi yang disampaikan secara audio
visual.
b. Dapat menjadi media tambahan belajar dalam proses perkuliahan.
5
c. Membantu menimbulkan minat belajar mahasiswa untuk mendalami teori
pengolahan citra lebih lanjut.
1.6 Metode Penelitian
Metode penelitian diperlukan untuk mengetahui tentang urutan kerja apa
yang harus dilakukan dalam melaksanakan penelitian, alat-alat apa yang
digunakan dalam mengukur ataupun mengumpulkan data dan bagaimana
melaksanakan penelitian tersebut. Oleh karena itu peneliti menggunakan metode
penelitian yaitu:
1.6.1 Metode Pengumpulan Data
A. Studi Lapangan
1. Observasi
Pengumpulan data dengan observasi langsung atau dengan pengamatan
langsung adalah cara pengambilan data dengan menggunakan mata tanpa
menggunakan alat standar lain untuk keperluan tersebut. (Nazir, 2003:
175)
2. Wawancara
Wawancara merupakan proses interaksi antara pewawancara dan
responden. (Nazir, 2003: 194) Dalam penelitan ini wawancara merupakan
bagian dari proses pengumpulan data primer untuk penelitian. Uraian
selengkapnya mengenai metode wawancara dapat dilihat pada Bab III, Sub
bab 3.1.3.
6
3. Kuesioner
Di samping dua proses pengumpulan data di atas, alat lain untuk
mengumpulkan data adalah dengan daftar pertanyaan atau yang secara
umum disebut dengan kuesioner. Alat ini digunakan untuk mendapatkan
jawaban-jawaban yang logis dari sebuah set pertanyaan yang diajukan
yang berhubungan dengan masalah penelitian. Uraian selengkapnya
mengenai metode kuesioner dapat dilihat pada Bab III, Sub bab 3.1.4.
B. Studi Pustaka dan Penelitian Sejenis
Studi kepustakaan dilakukan dengan mencari sumber data sekunder baik
melalui perpustakaan dengan memilih referensi dari buku-buku yang
berkaitan dengan topik penelitian dan mencari studi penelitian sejenis yang
berkaitan dengan topik penelitian sebagai dasar pengembangan dari
aplikasi yang akan dibuat selanjutnya dan juga untuk mengetahui sampai
sejauh mana ilmu yang berhubungan dengan penelitian telah berkembang,
sehingga diperoleh pembatasan masalah atau objek penelitian yang dapat
dikembangkan berikutnya. Selain itu melalui media internet studi pustaka
juga dilakukan untuk menambah/ melengkapi data sekunder yang
diperlukan.
1.6.2 Metode Pengembangan Aplikasi Multimedia
Untuk memudahkan pengembangan aplikasi multimedia maka diperlukan
metode pengembangan yang dapat mengatur tahapan-tahapan dari aplikasi yang
dibuat. Peneliti menggunakan metode pengembangan aplikasi multimedia
menurut Vaughan (2004) dalam Binanto (2010: 264) yaitu perencanaan dan
7
pembiayaan, desain dan produksi, pengujian dan tahap akhir adalah pengiriman.
Keempat tahapan ini dijelaskan pada Bab III Sub bab 3.2 Metode Pengembangan
Aplikasi Multimedia.
1.7 Sistematika Penulisan
Dalam skripsi ini, peneliti menjabarkan penelitian Aplikasi Pembelajaran
Materi Pengolahan Citra dengan Menggunakan Teknik Konvolusi Berbasis
Multimedia ini ke dalam 5 Bab, yaitu:
BAB I PENDAHULUAN
Bab ini berisi pengantar berupa latar belakang dilakukannya
penelitian, perumusan masalah, pembatasan masalah,
tujuan penelitian, manfaat penelitian, metode penelitian
yang dilakukan serta sistematika dari penulisan skripsi ini.
BAB II LANDASAN TEORI
Bab ini berisi pembahasan teori-teori yang dijadikan
sebagai landasan terkait dengan aplikasi yang dibuat serta
digunakan sebagai panduan dasar dalam perancangan
aplikasi media pembelajaran pengolahan citra berbasis
multimedia ini.
BAB III METODE PENELITIAN
Bab ini berisi metode penelitian yang dilakukan mulai dari
proses pengumpulan data terkait dengan materi penelitian
8
sampai kepada metode pengembangan aplikasi multimedia
pembelajaran yang dibuat.
BAB IV PEMBAHASAN
Pada bab ini dibahas proses analisis terhadap permasalahan
yang ada dilanjutkan dengan implementasi pembuatan
aplikasi yang telah di konsep sebelumnya sampai dengan
proses akhir pembuatan aplikasi dan evaluasi akhir dari
pembuatan multimedia pembelajaran ini.
BAB V KESIMPULAN DAN SARAN
Bab ini merupakan bab penutup yang berisi kesimpulan
dari penelitian yang peneliti lakukan serta saran yang dapat
membantu pengembangan Aplikasi Media Pembelajaran
Materi Pengolahan Citra dengan Menggunakan Teknik
Konvolusi Berbasis Multimedia ini selanjutnya.
9
BAB II
LANDASAN TEORI
2.1 Pengertian Pembuatan
Dalam kamus besar Bahasa Indonesia online, pembuatan berasal dari kata
buat yang berarti kerjakan, lakukan. Sedangkan arti dari pembuatan yaitu proses,
cara, perbuatan membuat.
2.2 Pengertian Aplikasi
Menurut Kamus Besar Bahasa Indonesia, aplikasi mempunyai arti yaitu
penggunaan, penerapan. (http://pusatbahasa.diknas.go.id/kbbi/index.php)
Menurut Jhonsen (2004: 250), aplikasi adalah suatu subkelas perangkat
lunak komputer yang memanfaatkan kemampuan komputer langsung untuk
melakukan suatu tugas yang diinginkan pengguna. Biasanya dibandingkan dengan
perangkat lunak sistem yang mengintegrasikan berbagai kemampuan komputer,
tapi tidak secara langsung menerapkan kemampuan tersebut untuk mengerjakan
suatu tugas yang menguntungkan pengguna. Contoh dari sebuah aplikasi misalnya
adalah Aplikasi pengenalan sidik jari sebagai alat bantu absensi karyawan yang
pada zaman sekarang ini banyak digunkan dengan memanfaatkan teknologi
komputer.
10
2.3 Konsep Dasar Pembelajaran
Kata pembelajaran merupakan padanan dari kata bahasa Inggris
instruction. Kata instruction mempunyai pengertian yang lebih luas daripada
pengajaran. Jika kata pengajaran ada dalam konteks guru-murid di kelas (ruang)
formal, pembelajaran atau instruction mencakup pula kegiatan belajar mengajar
yang tak dihadiri oleh guru secara fisik. Oleh karena itu instruction atau
pembelajaran adalah yang ditekankan pada proses belajar, yaitu usaha-usaha yang
terencana dalam memanipulasi sumber-sumber belajar agar terjadi proses belajar
dalam diri siswa. (Sadiman dkk, 1993: 7)
2.3.1 Pengertian Belajar
Belajar merupakan kebutuhan hidup yang “self generating” yang
mengupayakan dirinya sendiri, karena sejak lahir manusia memiliki dorongan
untuk melangsungkan hidup, menuju tujuan tertentu sadar atau tidak sadar. Jadi
manusia belajar terus-menerus untuk mampu mencapai kemandirian dan sekaligus
mampu beradaptasi terhadap berbagai perubahan lingkungan. (Semiawan, 2008:
1)
Berikut pengertian belajar menurut beberapa ahli:
Belajar menurut Klien dalam (Semiawan, 2008: 4) adalah “proses
eksperiensial (pengalaman) yang menghasilkan perubahan perilaku yang
relatif permanen dan yang tidak dapat dijelaskan dengan keadaan
sementara kedewasaan atau tendensi alamiah”.
11
Menurut (Sadiman dkk, 1993: 1), “belajar adalah suatu proses yang
kompleks yang terjadi pada semua orang dan berlangsung seumur hidup,
sejak masih bayi hingga ke liang lahat nanti”.
Menurut Hakim dalam bukunya Belajar Secara Efektif (2002) (dalam
Fathurrohman, 2007: 6), ”belajar adalah suatu proses perubahan di dalam
kepribadian manusia, dan perubahan tersebut ditampakkan dalam bentuk
peningkatan kualitas dan kuantitas tingkah laku seperti peningkatan
kecakapan, pengetahuan, sikap, kebiasaan, pemahaman, keterampilan,
daya pikir, dan lain-lain kemampuannya”.
Menurut Morgan dalam Introduction to Psycology (1962) (dalam
Fathurrohman, 2007: 6) “belajar dapat diartikan sebagai suatu proses yang
dilakukan oleh individu untuk memperoleh perubahan perilaku baru secara
keseluruhan, sebagai hasil dari pengalaman individu itu sendiri dalam
berinteraksi dengan lingkungannya”.
Berdasarkan pengertian di atas maka dapat disimpulkan bahwa belajar
adalah perubahan serta peningkatan kualitas dan kuantitas tingkah laku seseorang
di berbagai bidang yang terjadi akibat melakukan interaksi terus menerus dengan
lingkungannya.
2.3.2 Pengertian Media Pembelajaran
Kata media berasal dari bahasa Latin dan merupakan bentuk jamak dari
kata medium yang secara harfiah berarti perantara atau pengantar. Media adalah
perantara atau pengantar pesan dari pengirim ke penerima pesan. Menurut
Asosiasi Teknologi dan Komunikasi Pendidikan (Association of Education and
12
Communication Technology/ AECT), media merupakan segala bentuk dan saluran
yang digunakan orang untuk menyalurkan pesan/ informasi. (Sadiman dkk, 1993:
6)
Berdasarkan pengertian media di atas dapat dipahami bahwa media
pembelajaran adalah segala sesuatu yang dapat menyampaikan dan menyalurkan
pesan dari sumber secara terencana sehingga tercipta lingkungan belajar yang
kondusif dimana penerimanya dapat melakukan proses belajar secara efisien dan
efektif. (Munadi, 2008: 8)
2.3.3 Fungsi Media Pembelajaran
Pada dasarnya fungsi utama media pembelajaran adalah sebagai sumber
belajar. Adapun lima fungsi media pembelajaran yang didasarkan pada medianya
dan didasarkan pada penggunanya yaitu:
1. Media pembelajaran berfungsi sebagai sumber belajar.
Menurut Edgar Dale (dalam Rohani, 1997: 102), bahwa sumber belajar
adalah pengalaman-pengalaman yang pada dasarnya sangat luas, yakni
seluas kehidupan yang mencakup segala sesuatu yang dapat dialami, yang
dapat menimbulkan peristiwa belajar.
2. Media pembelajaran berfungsi sebagai fungsi semantik
Berfungsi sebagai kemampuan media dalam menambah perbendaharaan
kata (simbol verbal) yang makna/ maksudnya benar-benar dipahami anak
didik (tidak verbalistik).
13
3. Fungsi Manipulatif
Yakni didasarkan pada ciri-ciri (karakteristik) umum yang dimilikinya,
yaitu mengatasi batas-batas ruang dan waktu dan mengatasi keterbatasan
inderawi.
4. Fungsi psikologis
a. Fungsi atensi: yaitu meningkatkan perhatian (attention) siswa terhadap
perangkat ajar.
b. Fungsi afektif: yaitu menggugah perasaan, emosi dan tingkat
penerimaan/ penolakan terhadap sesuatu.
c. Fungsi kognitif: yaitu belajar melalui media pembelajaran akan
memperoleh dan menggunakan bentuk-bentuk representasi yang
mewakili objek-objek yang dihadapi, baik objek itu berupa orang,
benda atau kejadian/ peristiwa.
d. Fungsi imajinatif: media pembelajaran dapat meningkatkan dan
mengembangkan imajinasi.
e. Fungsi motivasi: yaitu mendorong siswa untuk terdorong melakukan
kegiatan belajar sehingga tujuan pembelajaran tercapai.
5. Fungsi Sosiokultural
Yakni mengatasi hambatan sosio-kultural antar peserta komunikasi
pembelajaran, karena media pembelajaran memiliki kemampuan dalam
memberikan rangsangan yang sama, mempersamakan pengalaman dan
menimbulkan persepsi yang sama. (Munadi, 2008: 17)
14
2.4 Pembelajaran Multimedia
Dalam kaitannya dengan pembelajaran, pembelajaran dengan multimedia
mencakup tiga proses kognitif penting (Mayer, 1997: 2). Pertama, selecting
(menyeleksi). Diaplikasikan pada informasi verbal berbasis teks dan juga
informasi visual yang menyediakan image/ gambar. Kedua, organizing
(mengorganisasikan). Diaplikasikan untuk membuat model berbasis verbal dan
model berbasis visual dari menjadi sebuah penjelasan. Ketiga, integrating
(mengintegrasikan). Pembelajar membangun hubungan antara corresponding
events dalam model berbasis verbal dan model berbasis visual.
Lima prinsip utama bagaimana pemanfaatan multimedia dapat membantu
pembelajar mengerti penjelasan ilmiah menurut Mayer (1997: 2) dengan berbagai
eksperimennya yaitu:
1. Multiple Representation Principle
Prinsip pertama adalah lebih baik mempresentasikan penjelasan dengan 2
mode penyajian dibanding hanya satu mode. Pembelajar yang membaca sebuah
bacaan yang mengandung materi ilustrasi visual di dekat materi teks menyerap
sekitar 65% informasi dibanding hanya membaca teks saja. Prinsip ini juga
disebut dengan multimedia effects.
2. Contiguity Principle
Prinsip ini menjelaskan bahwa pembelajar lebih dapat mengerti penjelasan
dengan materi verbal & visual yang disajikan pada waktu yang bersamaan
daripada pada waktu terpisah. Pembelajar yang mendengarkan penjelasan
bersamaan dengan presentasi visual menyerap 50% informasi lebih banyak
15
dibanding pembelajar yang melihat materi visual tidak bersamaan dengan materi
verbal.
3. Split Attention Principle
Prinsip ini menjelaskan bahwa kata-kata lebih baik disajikan secara audio
daripada visual. Pembelajar yang melihat materi visual sambil mendengarkan
narasi audio menyerap 50% informasi lebih banyak daripada pembelajar yang
melihat materi visual dengan membaca teks pada layar.
4. Individual Differences Principle
Prinsip ini menjelaskan bahwa multimedia effects, contiguity effects dan
split attention effects tergantung dari perbedaan individual dari tiap-tiap
pembelajar. Pada dasarnya pembelajar dengan tingkat pengetahuan tinggi dapat
menyerap informasi lebih banyak dari pembelajar dengan tingkat pengetahuan
lebih rendah.
5. Coherence Principles
Prinsip ini menjelaskan bahwa pembelajar lebih dapat menyerap informasi
dari sebuah materi logis yang merupakan kesimpulan dari materi verbal dan visual
daripada versi panjang materi tersebut.
2.5 Pembelajaran dalam Perkuliahan
Dalam perkuliahan, pendidik adalah dosen sedangkan peserta didik adalah
mahasiswa. Dapat dikatakan secara singkat bahwa pembelajaran dalam
perkuliahan merupakan suatu proses transfer informasi dari dosen kepada
mahasiswa.
16
Proses belajar mengajar pada hakikatnya adalah proses komunikasi, yaitu
proses penyampaian pesan dari sumber pesan melaui saluran/ media tertentu ke
penerima pesan. Pesan, sumber pesan, saluran/ media dan penerima pesan adalah
komponen-komponen proses komunikasi. Pesan yang akan dikomunikasikan
adalah isi ajaran ataupun didikan yang ada dalam kurikulum, sumber pesannya
adalah siswa atau juga guru. (Ayyun, 2008: 20)
2.6 Sejarah Multimedia
Istilah multimedia berawal dari teater bukan dari komputer. Pertunjukan
yang memanfaatkan lebih dari satu medium yang sering disebut pertunjukan
multimedia. Pertunjukan multimedia mencakup video dan karya seni manusia
sebagai bagian dari pertunjukan. Sistem multimedia dimulai pada akhir tahun
1980 dengan diperkenalkannya hypercard oleh APPEL pada tahun 1987 dan
pengumuman oleh IBM pada tahun 1989 mengenai perangkat lunak Audio Visual
Connection (AVC) dan Video Adapter Card. Sejak permulaan tersebut, hampir
setiap pemasok perangkat keras dan lunak beralih ke multimedia. (Suyanto, 2003:
19)
2.7 Pengertian Multimedia
Pada awal tahun 1990, multimedia berarti kombinasi dari teks dengan
dokumen image. Suatu komputer multimedia adalah komputer yang mempunyai
alat output seperti biasanya, yaitu alat display dan hardcopy, dengan rekaman
17
audio berkualitas tinggi, image berkualitas tinggi, animasi dan rekaman video.
(Sutopo, 2003: 3)
Adapun definisi multimedia lain menurut beberapa ahli yaitu: (dalam Suyanto,
2003: 20)
1. Menurut Rosch (1996), multimedia adalah kombinasi dari komputer dan
video.
2. Menurut McCormick (1996), multimedia secara umum merupakan
kombinasi tiga elemen, yaitu suara, gambar dan teks.
3. Menurut Turban dkk (2002), kombinasi paling sedikit dua media input
atau output dari data, media ini dapat audio (suara, musik), animasi, video,
teks, grafik dan gambar.
4. Menurut Robin dan Linda (2001), multimedia merupakan alat yang dapat
menciptakan presentasi yang dinamis dan interaktif yang
mengkombinasikan teks, grafik, animasi, audio dan gambar video.
5. Sedangkan menurut Hofstetter (2001), multimedia adalah pemanfaatan
komputer untuk membuat dan menggabungkan teks, grafik, audio, gambar
bergerak (video dan animasi) dengan menggabungkan link dan tool yang
memungkinkan pemakai melakukan navigasi, berinteraksi, berkreasi dan
berkomunikasi.
Dari pengertian menurut para ahli diatas dapat disimpulkan bahwa
multimedia dapat diartikan sebagai penggunaan beberapa media yang berbeda
untuk menggabungkan dan menyampaikan informasi dalam bentuk teks, audio,
grafik, animasi dan video.
18
2.7.1 Elemen Multimedia
Menurut Sutopo (2003: 4), aplikasi multimedia memerlukan penanganan
yang terintegrasi, user dapat memotong sebagian dari semua atau salah satu
komponen multimedia, kemudian menggunakannya pada dokumen atau aplikasi
lain. Beberapa macam elemen yang dapat digolongkan dalam definisi multimedia,
yaitu:
a. Faksimil
Transmisi faksimil pada awalnya menggunakan standar CCIT Group 3
dengan nama run-length encoding. Kepadatan pixel pada faksimil dengan standar
ini sebesar 100 sampai 200 dpi (pixel/inch). Resolusi sebesar 200 dpi cukup
memadai untuk presentasi jika dibandingkan dengan cetakan menggunakan laser
printer sebesar 400 dpi. Resolusi yang lebih tinggi diperlukan untuk memperjelas
dokumen yang menggunakan ukuran font kecil.
b. Image Dokumen
Image dokumen dengan resolusi 300 dpi dan ukuran 1/5 inch x 11 inch,
tanpa menggunakan kompresi memerlukan penyimpanan lebih dari 1 Mbyte.
Dengan komposisi CCIT Group 3 ukuran file berkurang menjadi 300 Kbyte,
sedangkan dengan CCIT Group 4 berkurang menjadi 75 Kbyte. Image dokumen
yang di-scan dengan resolusi tinggi memerlukan teknologi kompresi dan
dekompresi yang baik.
19
c. Image Foto
Image foto banyak digunakan seperti identifikasi pribadi, kartu fingerprint,
kartu tanda tangan bank, riwayat medis pasien dan lain-lain. Kehalusan dan
ketepatan image foto lebih besar dibandingkan dengan image dokumen.
d. Peta Sistem Informasi Geografis
Dua macam teknologi dapat digunakan untuk menyimpan dan
menampilkan peta geografis. Penyimpanan raster dapat menampilkan peta pada
sistem display, seperti pada aplikasi GUI (graphical user interface) lainnya.
Contoh aplikasi ini adalah peta jalan yang digunakan pada sistem perjalanan, atau
peta area yang dapat memberikan informasi sumber daya natural.
e. Voice Command
Voice command (suara perintah) terutama merupakan suara yang dikenali
dengan voice recognition. Perintah suara yang singkat merupakan input untuk
komputer, sehingga tidak menggunakan keyboard. Pengenalan suara memerlukan
teknik khusus dan kemampuan pemrosesan untuk membedakan tekanan, aksen
dan modulasi yang dimiliki oleh user.
f. Voice Syntesis
Voice syntesis lebih mudah diterima daipada voice recognition.
Penyimpanan dilakukan secara keseluruhan dari apa yang diucapkan oleh
seseorang. Konsistensi dengan kata yang diucapkan dalam suatu pesan dapat
menghasilkan pesan yang lebih jelas. Pendekatan lain dilakukan dengan cara
menurunkan pesan seluruhnya dalam bentuk berbasis fonetik.
20
g. Audio Message
Audio message (pesan audio) menggantikan pesan dalam bentuk teks.
Komputer yang dilengkapi dengan mikrofon dapat merekam audio dan
menyertakannya pada electronic mail. Audio message memerlukan penyimpanan
dengan ukuran besar, sehingga diperlukan teknik kompresi yang baik.
h. Video Message
Video message dapat merupakan suatu gambar atau serangkaian gambar
bergerak (video clip). Penyimpanan dan playback pada video message lebih
kompleks, karena harus menyimpan setiap gambar. Pada umumnya, penyimpanan
video message dilakukan di server dan ditampilkan pada workstation bila
diperlukan.
i. Full Motion dan Live Video
Teknologi CD-ROM melengkapi basis untuk pengembangan full-motion
video. Aplikasi utama dalam CD-ROM adalah game, manual pelatihan, video
conferencing, video karaoke system dan lain-lain. Full-motion video memerlukan
bandwidth yang besar untuk media komunikasi, berikut penyimpanan dan
teknologi kompresi yang baik.
j. Holographic Image
Holography didefinisikan sebagai pembuatan image foto yang unik tanpa
menggunakan lensa. Perekaman foto dari image disebut hologram. Pola dari garis
tidak dikenali, tetapi bila dipancarkan sinar dengan sinar laser akan membentuk
penyajian objek yang asli.
21
k. Fractal
Adalah objek teratur dengan perubahan derajat bentuk yang teratur pula.
Fractal merupakan hasil dari format yang menggunakan algoritma aritmatik untuk
menentukan perulangan pola.
2.7.2 Objek Multimedia
Setiap objek multimedia memerlukan cara penanganan tersendiri, dalam
hal kompresi data, penyimpanan dan pengambilan kembali untuk digunakan.
Terdapat 6 jenis objek dalam penggunaan multimedia (Suyanto, 2003: 255) yaitu
teks, grafik, bunyi, video dan animasi seperti dijelaskan di bawah ini:
a. Teks
Teks merupakan dasar dari pengolahan kata dan informasi berbasis
multimedia. (Sutopo, 2003: 8)
Teks merupakan elemen dasar paling sederhana dalam penyampaian
informasi yang membutuhkan ruang penyimpanan yang kecil. Dengan
menggunakan teks, informasi lebih mudah disampaikan dan dimengerti oleh
pengguna. Teks adalah data dalam bentuk karakter. Menurut Suyanto (2003: 256-
259), secara umum ada 4 macam teks yaitu:
1. Teks cetak
Teks tercetak seperti teks yang ada pada buku-buku atau dokumen. (Gambar
2.1)
22
2. Teks hasil scan
Teks cetak yang dikonversi sehingga menjadi format teks yang terbaca oleh
mesin dan menghasilkan scanned text. (Gambar 2.2)
3. Electronic text
Jenis teks yang dapat dibaca oleh komputer dan dapat dikirim secara
elektronis melalui jaringan. (Gambar 2.3)
(a) (b) Gambar 2.1 Teks Tercetak dalam Bentuk Poster (a) dan Teks buku (b)
Gambar 2.3 Contoh Teks Elektronik (Word art)
Gambar 2.2 Scanned Text
23
4. Hypertext
Merupakan kata lintas linking yang diorganisasikan tidak hanya pada kata lain,
tetapi juga pada image, video klip, suara, dan pertunjukan lain yang
bersangkutan, hypertext sering hanya menjadi fitur tambahan dalam
keseluruhan desain multimedia (Vaughan, 2006: 80). (Gambar 2.4)
b. Grafik
Grafik atau gambar dalam multimedia digunakan karena lebih menarik
perhatian dan dapat mengurangi kebosanan dibandingkan dengan teks. Gambar
dapat meringkas dan menyajikan data kompleks dengan cara yang baru dan lebih
berguna.
1. Gambar vektor (vector images)
Gambar vektor disimpan dalam sebuah gambar, tetapi tersimpan sebagai
serangkaian instruksi yang digunkan untuk membuat suatu gambar yang
dinamakan algoritma, yang menentukan bentuk kurva, garis dan berbagai
bangun dengan gambar (picture). Vector images memiliki 3 kelebihan
dibanding bitmap yaitu: Pertama, bersifat scalable artinya bisa
menggunakan program grafis untuk memperbesar atau memperkecil
Gambar 2.4 Format Hypertext
24
ukuran image tanpa mengubah kualitasnya atau tidak bergantung pada
resolusinya. Kedua, biasanya mempunyai ukuran file lebih kecil dibanding
grafis dalam format bitmap, gambar vektor yang besar dapat dikodekan
dengan instruksi yang lebih kecil atau lebih ringkas, maka vektor bisa di-
download lebih cepat di internet. Ketiga, gambar vektor dapat diubah
dalam berbagai tampilan 3 dimensi. (Gambar 2.5)
2. Gambar bitmap (bitmap images)
Merupakan rekonstruksi dari gambar asli yang tersimpan sebagai
rangkaian pixel (titik-titik) yang memenuhi bidang titik-titik di layar
komputer. Seluruh informasi gambar dinyatakan dengan pixel.
Kelemahannya, resolusinya tidak dapat diperbesar atau diperkecil, karena
resolusi bergantung pada gambar asli dan jika dikompresi kualitasnya akan
turun. Kelebihannya, pengolahannya minimal dan lebih cepat untuk
ditampilkan, karena dapat ditransfer secara langsung dari file ke layar
monitor. (Gambar 2.5)
(a) (b) (b) (a)
Gambar 2.5 Grafik Berbasis Bitmap (a), Grafik Berbasis Vektor (b) dan
Proses perubahan gambar bitmap ke vektor
25
Gambar 2.6 Clipart
3. Clip art
Membuat grafis dengan tangan tentunya sangat menyita waktu. Clip art
yang tersedia pada koleksi (library) clip art dapat digunakan untuk
menambah objek multimedia seperti foto, ikon, animasi, backround title,
button dan bullet. (Gambar 2.6)
4. Digitized Picture
Video capture board (capture card) memungkinkan pengguna untuk
menyambungkan komputer dengan video camera,VCR, video disc player,
atau live video feed dan langsung menjadikan frame-frame gambar tersebut
menjadi bitmap yang dapat digunakan dalam aplikasi multimedia. Video
digitizer bisa menerima sinyal video sebagai inputnya, maka video
digitizer bisa mendigitalkan segala yang ditangkap video camera.
(Gambar 2.7)
(a) (b) Gambar 2.7 Digitized Picture MRI (a) dan Pencitraan Satelit (b)
26
5. Hyperpicture
Sebagaimana halnya suatu kata bisa menjadi pemicu di sebuah hypertext,
begitu pula dengan bagian dari suatu gambar. Hyperpicture merupakan
gambar yang bisa digunakan untuk memicu sebuah multimedia event yang
lain.
Gambar 2.8 Hyperpicture (Sumber: www.kompas.com)
4. Format file grafik
Diantara Format file grafik yang ada dan dapat digunakan pada aplikasi
multimedia yaitu: Acrobat TouchUp Image (*.PDF, *.AI, *.PDP), BMP
(*.BMP, *.RLE), Photoshop (*.PSD, *.PDD), Pothoshop DPS/DCS (*.EPS),
CompuServ GIF (*.GIF), JPEG (*.JPG, *.JPE), PICT file (*.PIC, *.PCT),
PNG (*.PNG), PSD, Raw (*.RAW), Scitex CT (*.SCT), Targa (*.TGA,
*.VDA, *.ICB, *.VST) dan TIFF (*.TIF).
PICT: format file default macintosh yang tersedia untuk setiap aplikasi grafik
yang dijalankan pada sebuah platform Macintosh. Karakteristik kunci dari tipe
27
file ini adalah kemampuannya untuk memuat objek yang digambar secara
bitmap maupun vektor.
BMP: format file default windows yang paling populer pada platform
windows, format ini mendukung RGB, Indexed Color, Grayscale dan bitmap
color mode.
JPEG: JPEG bertanggung jawab terhadap pengembangan standar dan format
pemetaan gambar yang digunakan secara luas di seluruh dunia. Ukuran file
JPEG relatif kecil dan merupakan format grafik yang terkompresi sehingga
dapat digunakan untuk menampilkan foto dan gambar secara kontinyu dan
juga dapat mengendalikan kedalaman warna.
GIF: format file terkompresi yang dikembangkan oleh CompuServ untuk
digunakan di internet.
TIFF: format file terkompresi yang biasa digunakan di paket desktop
publishing dan merupakan format file bagi perusahaan percetakan. Kekuatan
format file ini adalah lebih fleksibel dari format gambar bitmap yang didukung
secara ritual oleh seluruh point, image editing dan aplikasi kedalaman layout.
EPS: digunakan dalam photoshop dapat memuat baik gambar vektor maupun
grafik dan didukung secara luas oleh program grafik, ilustrasi dan layout
halaman. Format EPS digunakan untuk mentransfer artwork bahasa postscript
antara aplikasi.
PNG: sebuah format file terkompresi untuk menampilkan gambar pada World
Wide Web. PNG mempunyai kemampuan merepresentasikan gambar 24 bit
dan menghasilkan latar belakang secara transparan.
28
PSD: format yang digunakan potoshop untuk menyimpan file yang telah
dibuat dan dimanipulasi. File PSD tidak dikompresi dan memuat informasi
tentang berbagai graphic layer yang ada tanpa sebuah file.
c. Bunyi (Audio)
Suara adalah sesuatu yang dihasilkan oleh getaran yang berasal dari benda
yang mengalami getaran sehingga menghasilkan gelombang yang berada di udara.
(Daryanto, 2005: 9)
Penyajian audio merupakan cara lain untuk lebih memperjelas pengertian
suatu informasi. Suara dapat lebih menjelaskan karakteristik suatu gambar,
misalnya musik dan suara efek (sound effect). Kemampuan dasar bunyi yang
harus dimiliki PC multimedia adalah:
Membuat dan mensintesis bunyi.
Menangkap bunyi dari dunia luar, dari yang didengar dan dari CD.
Mengendalikan bunyi yang dibuat dari instrument elektronik, misalnya
MIDI.
Memainkan kembali bunyi tersebut lewat speaker atau sejenisnya.
Ada tiga belas jenis objek bunyi yang bisa digunakan dalam produksi
multimedia, yakni format waveform audio, aiff, dat, ibf, mod, rmi, sbi, snd, voc,
au, MIDI sound track, compact disc audio dan MP3 file. Beberapa diantaranya
dijelaskan di bawah ini.
Waveform audio: merupakan format file audio yang berbentuk digital,
dapat dimanipulasi dengan perangkat lunak PC multimedia. Kualitas
produksi waveform audio bergantung pada sampling rate (banyaknya
29
sampel per detik) waveform audio disebut juga pulse code modulator
(PCM) audio.
MIDI: Musical Instrument Digital Interface merupakan format yang dapat
merekam performance information yang diperlukan chip suara pada
komputer agar musik bisa dimainkan.
MP3: MPEG Audio Layer 3, merupakan format file audio yang
menggunakan suatu codec untuk melakukan encoding (compressing) dan
decoding (decompressing) suatu rekaman musik. MP3 dapat memadatkan
audio track dalam CD menjadi file berukuran sangat kecil dengan
bandwith lebih sedikit dan dapat ditransfer melalui internet tanpa
mengurangi kualitas suara aslinya.
d. Video
Video adalah teknologi untuk menangkap, merekam, memproses,
mentransmisikan dan menata ulang gambar bergerak. Biasanya menggunakan film
seluloid, sinyal elektronik, atau media digital. (Rachmat dan Roswanto, 2006)
Video merupakan elemen multimedia paling kompleks karena
penyampaian informasi yang lebih komunikatif dibandingkan gambar biasa,
walaupun terdiri dari elemen-elemen yang sama seperti grafik, suara dan teks,
namun bentuk video berbeda dengan animasi. (Suyanto, 2003: 279)
Perbedaan terletak pada penyajiannya, dalam video informasi disajikan
dalam kesatuan utuh dari objek yang dimodifikasi sehingga terlihat saling
mendukung dan penggambaran seakan terlihat hidup.
30
I. Macam Video
Ada empat macam video yang dapat digunakan sebagai objek link dalam
aplikasi multimedia yaitu:
1. Live Video Feed
Menyediakan objek-objek link multimedia yang menarik dan real-time.
Saluran televisi atau live camera feed menjadi objek sebuah link. Webcam
memungkinkan pengguna untuk melihat video feed dari seluruh dunia.
2. Videotape
Merupakan objek link multimedia juga, tetapi medium ini mempunyai
keterbatasan yaitu pertama, bersifat linier informasi tersimpan dalam pita
gulungan dan untuk mengaksesnya harus menunggu karena harus mempercepat
(fast-forward) atau menggulung balik (rewind), untuk sampai pada spot yang
diinginkan. Kedua, kebanyakan video tape player tidak dikontrol lewat komputer,
ini berarti pengguna harus menekan tombol play, stop, fast-forward atau rewind
secara manual ketika menggunakan videotape dalam presentasi multimedia.
3. Videodisc
Videodisc memiliki random access sangat cepat dan hanya menempati
sedikit saja sumber daya komputer multimedia. Ada 2 format videodisc yang
paling banyak diproduksi yaitu CAV dan CLV.
4. Digital Video
Digital video dapat disimpan dalam file-file hardisk, CD-ROM atau DVD.
Karena video itu menjadi digital, sehingga dapat disajikan lewat jaringan
komputer, yang dapat mengurangi kebutuhan akan videotape player maupun
31
videodisc player. Digital video dapat diakses secara acak berdasarkan frame, yang
memungkinkan pengguna dapat memainkan klip tertentu.
II. Format File Video
Format file dalam video merupakan hal penting, beberapa format file
tersebut diantaranya yaitu:
1. Quick Time (MOV)
Merupakan sebuah sistem multimedia tambahan pada komputer
Machintosh dan Windows, yang menyediakan lintas platform, sinkronisasi
waktu video digital, audio digital, dan lingkungan 3D virtual reality,
dikembangkan oleh Apple Computer. Quick Time menggunakan ekstensi
.mov dan digunakan dalam berbagai aplikasi multimedia, misalnya CD-
ROM dan produksi video broadcast serta mempunyai kemampuan
melakukan kompresi-dekompresi melintasi berbagai platform.
2. MPEG (Motion Picture Expert Group)
Adalah skema kompresi & spesifikasi format file video digital yang
dikembangkan oleh group ini. MPEG merupakan salah satu dari rich
media yang mendukung web.
3. AVI (Audio Video Interleave)
Avi merupakan format video dan animasi yang digunakan video untuk
Windows dan berekstensi “.avi”. Sebagian besar authoring pada windows
mendukung format AVI dan didukung oleh Netscape.
32
4. Real Video
Dikembangkan oleh Real Media. Video yang disimpan dala format Real
Video mempunyai ekstensi .rm atau .ram. Format ini memungkinkan
adanya aliran video (online video, internet TV) pada bandwith yang
rendah, sebab prioritas bandwith yang rendah maka kualitas dapat
dikurangi.
5. Shockwave (Flash)
Dikembangkan oleh Macromedia. Format shockwave membutuhkan
sebuah komponen tambahan untuk memainkan. Video disimpan dalam
format shockwave mempunyai ekstensi .swf. (Suyanto, 2003: 284)
e. Animasi
Animasi berarti gerakan image atau video, seperti gerakan orang yang
sedang melakukan suatu kegiatan dan lain-lain. Konsep dari animasi adalah
menggambarkan sulitnya menyajikan informasi dengan satu gambar saja, atau
sekumpulan gambar. Animasi seperti halnya film, dapat berupa frame-based
animation (animasi berbasis frame) yaitu dibuat dengan merancang setiap frame
tersendiri sehingga mendapatkan tampilan akhir. (Sutopo, 2003: 12)
Animasi yang kedua dapat berupa cast-based animation (animasi berbasis
cast) mencakup pembuatan kontrol dari masing-masing objek (kadang-kadang
disebut cast member atau actor) yang bergerak melintasi background.
Terdapat 9 jenis atau macam animasi yang dapat digunakan dalam
multimedia yaitu:
33
1. Animasi Sel (cell animation)
Kata ”cell” berasal dari kata ”celluloid”, yang merupakan material yang
digunakan untuk membuat film gambar bergerak pada saat awal. Sekarang
material film dibuat dari asetat (acetate), bukan celluloid. Sel animasi
biasanya merupakan lembaran-lembaran yang membentuk sebuah frame
animasi tunggal. (Gambar 2.9)
2. Animasi Frame (frame animation)
Adalah bentuk animasi yang paling sederhana. Animasi frame merupakan
susunan frame yang disusun secara berurutan dan digerakkan secara cepat,
sehingga seolah-olah menampilkan gambar yang bergerak. (Gambar 2.10)
Gambar 2.9 Cell Animation
Gambar 2.10 Frame Animation
34
3. Animasi Sprite (sprite animation)
Merupakan animasi dari objek yang diletakkan dan dianimasikan pada
bagian puncak grafik dengan latar belakang diam. Sprite beranimasi dan
bergerak sebagai objek yang mandiri. Sprite dapat dianimasikan dalam
satu tempat, seperti halnya planet berputar atau burung bergerak sepanjang
garis lurus. (Gambar 2.11)
3. Animasi Lintasan (path animation)
Adalah animasi dari objek yang bergerak sepanjang garis kurva yang
ditentukan sebagai lintasan.(Gambar 2.12)
Gambar 2.11 Sprite Animation
Gambar 2.12 Path Animation
35
4. Animasi Spline
Spline adalah representasi matematis dari kurva. Program animasi
komputer memungkinkan pengguna untuk membuat animasi dengan
lintasan garis berbentuk kurva. (Gambar 2.13)
Gambar 2.13 Spline Animation
5. Animasi Vektor (vector animation)
Sebuah vektor merupakan garis yang memiliki ujung pangkal, arah dan
panjang. Animasi vektor menjadikan objek bergerak dengan
memvariasikan ketiga parameter ujung-pagkal, arah dan panjang pada
segmen-segmen garis yang menentukan objek. (Gambar 2.14)
Gambar 2.14 Vector Animation
36
6. Animasi Karakter (character animation)
Merupakan sebuah cabang khusus animasi. Animasi ini berbeda dengan
animasi lainnya, misalnya grafik bergerak, animasi logo yang melibatkan
bentuk organik yang komplek dengan penggandaan yang banyak dan
gerakan yang hirarkis.(Gambar 2.15)
7. Computational Animation
Animasi yang menggunakan koordinat x dan y untuk memposisikan suatu
objek pada layar.(Gambar 2.16)
Gambar 2.15 Character Animation
Gambar 2.16 Computational Animation
37
8. Morphing
Artinya mengubah satu bentuk menjadi bentuk lain dengan menampilkan
serangkaian frame yang menciptakan gerakan halus begitu bentuk pertama
mengubah dirinya menjadi bentuk yang lain. (Gambar 2.17)
2.8. Syarat Multimedia Interaktif
Menurut Thorn (1995) dalam (Ouda Teda Ena, 2001) mengajukan enam
kriteria untuk menilai multimedia interaktif yaitu:
1. Kemudahan navigasi
Sebuah program harus dirancang sesederhana mungkin sehingga
pembelajar bahasa tidak perlu belajar komputer lebih dahulu.
2. Kandungan kognisi
Bersifat memperoleh pengetahuan dan memanipulasi pengetahuan melalui
aktifitas mengingat, menganalisis, memahami, menilai, menalar dan
membayangkan.
Gambar 2.17 Morphing Animation
38
3. Pengetahuan dan presentasi informasi
Kedua kriteria ini adalah untuk menilai isi dari program itu sendiri, apakah
program telah memenuhi kebutuhan pembelajaran si pembelajar atau
belum.
4. Integrasi Media
Media harus mengintegrasikan aspek dan ketrampilan bahasa yang harus
dipelajari.
5. Estetika
Untuk menarik minat siswa dalam belajar, program harus mempunyai
tampilan yang artistik.
6. Fungsi secara keseluruhan
Program yang dikembangkan harus memberikan pembelajaran yang
diinginkan oleh pembelajar. Sehingga pada waktu selesai menjalankan
sebuah program pembelajar akan merasa telah belajar sesuatu.
2.9 Flowchart
Flowchart view disebuat juga diagram tampilan adalah diagram yang
memberikan gambaran alir dari satu scene (tampilan) ke scene lainnya (Sutopo,
2003: 37). Sistem flowchart menggambarkan tahapan proses dari suatu sistem,
termasuk sistem multimedia. Sedangkan program flowchart menggambarkan
urutan-urutan instruksi dari suatu program komputer (Suyanto, 2003: 364). Tabel
2.1 menunjukkan simbol-simbol dalam program flowchart.
39
Tabel 2.1 Simbol-simbol Program Flowchart
SIMBOL NAMA FUNGSI
Terminator Mulai (START) atau selesai (STOP)
Garis Alir (Flow Line) Arah aliran program
Preparation Proses inisialisasi/ pemberian harga awal
Proses Proses perhitungan/ pengolahan data
Input/ output data Proses input/ output data,
parameter, informasi Predefined process Permulaan sub program/ proses
menjalankan sub program
Visual Display Unit (VDU) Untuk menampilkan input/ output
Decision
Perbandingan pernyataan, penyeleksian data yang
memberikan pilihan untuk langkah selanjutnya
On Page Connector Sambungan pada halaman yang
sama
Off Page Connector Sambungan pada halaman yang
berbeda
(Sumber: Suyanto, 2003: 364)
2.10 State Transition Diagram (STD)
State transition diagram (STD) menunjukkan bagaimana sistem
bertingkah laku sebagai akibat dari kejadian eksternal. Untuk melakukannya, STD
menunjukkan berbagai model tingkah laku (disebut state) sistem dan cara di mana
40
transisi dibuat dari state satu ke state lainnya. STD berfungsi sebagai dasar bagi
pemodelan tingkah laku (Pressman, 2002: 354).
Notasi state transition diagram:
1. Keadaan sistem. Setiap kotak mewakili suatu keadaan dimana sistem
mungkin berada di dalamnya.
Gambar 2.18 Simbol State
2. Perubahan sistem. Untuk menghubungkan suatu keadaan dengan keadaan
lain.
Gambar 2.19 Simbol Transition State
3. Kondisi dan aksi. Untuk melengkapi STD, dibutuhkan dua hal untuk
mengubah keadaan. Di bawah ini ilustrasi dari kondisi dan aksi yang
ditampilkan di sebelah anak panah yang menghubungkan dua keadaan.
Gambar 2.20 Simbol Kondisi dan Aksi
2.11 Storyboard
Storyboard merupakan serangkaian sketsa (gambaran kartun) dibuat
berbentuk persegi panjang yang menggambarkan suatu urutan (alur cerita)
elemen-elemen yang diusulkan untuk aplikasi multimedia (Suyanto, 2003: 375).
kondisi
aksi
Keadaan 1
Keadaan 2
41
Gambar 2.21 Form Storyboard yang Mengandung Sebuah Frame
2.12 Metode Pengembangan Multimedia Menurut Vaughan
Dalam metodologi multimedia menurut Vaughan (2004) ada beberapa
tahap yang harus dilalui dan diselesaikan terlebih dahulu sebelum memulai tahap
lainnya dan ada beberapa tahap yang dikombinasikan atau dihilangkan. Menurut
Vaughan dalam (Binanto, 2010: 264), ada empat tahap dasar dalam suatu proyek
multimedia, yaitu:
2.12.1 Perencanaan dan Pembiayaan
Tahap ini mencakup proses identifikasi kebutuhan dan tujuan, kemampuan
multimedia yang dibutuhkan, misalnya keterampilan seni grafis, musik, video dan
lain-lain. Selain itu, proses perhitungan waktu dan biaya yang dibutuhkan untuk
mengerjakan seluruh elemen juga akan dilakukan pada tahap ini. Sebaiknya
sebuah perencanaan multimedia dimulai dengan pertanyaan-pertanyaan berikut:
STORYBOARD Modul : ……………………………… Halaman : ……………………………… Nama File : ……………………………… Frame No. : ……………dari..…………… Gambar : ……………………………… Video : ……………………………… Audio : ……………………………… Navigasi Next : ……………………………… Back : ……………………………… Menu : ……………………………… Help : ……………………………… Notes : ……………………………… ........................................................................................................................................ ........................................................................................................................................ ........................................................................................................................................ ........................................................................................................................................ ........................................................................................................................................ ........................................................................................................................................ ........................................................................................................................................ ........................................................................................................................................
42
a. Apakah hal yang paling penting yang ingin dilakukan? Apakah tujuan dari
pesan yang ingin disampaikan?
b. Siapa yang akan menjadi pengguna akhir? Apakah pengguna akhir sudah
mengerti subjek yang dibuat? Apakah pengguna akhhir sudah mengerti
jargon-jargon (istilah industri) yang dibawa oleh produk? Seperti apakah
platform pemutaran multimedia pengguna akhir serta beberapa
kemampuan teknis minimum platform tersebut?
c. Apakah keinginan pengguna akhir?
d. Bagaimana pengembang mengorganisasikan proyeknya?
e. Apakah elemen multimedia (audio, video, dan visual) yang paling tepat
untuk mengirimkan pesan?
f. Apakah diperlukan interaktifitas?
g. Apakah ide berasal dari tema yang sudah ada yang dapat dikembangkan
dengan multimedia atau apakah membuat sesuatu yang baru sama sekali?
h. Apakah perangkat keras yang tersedia sudah cukup untuk mengembangkan
multimedia yang diinginkan?
i. Seberapa besar tempat penyimpanan yang tersedia dan apakah sudah
mencukupi?
j. Perangkat lunak multimedia apa saja yang sudah dipunyai?
k. Kemampuan dan keterampilan apa saja yang dimiliki terkait dengan
perangkat keras dan perangkat lunak yang sudah dimiliki?
l. Apakah dapat dikerjakan sendiri? Siapa kira-kira yang dapat membantu?
m. Berapa banyak waktu yang dimiliki?
43
n. Berapa banyak anggaran yang ada?
o. Bagaimana produk akhir didistribusikan?
p. Akankah diperlukan pembaruan dan/ atau pendukung produk akhir?
Pertanyaan-pertanyaan tersebut akan memunculkan tugas-tugas yang
sangat banyak pada proyek multimedia yang akan dikerjakan. Berikut adalah
beberapa hal yang harus diperiksa dan dijalankan terkait dengan proyek
multimedia yang akan dikerjakan:
a. Merancang kerangka instruksioanl,
b. Menyelenggarakan suatu sesi berbagi ide kreatif,
c. Menentukan platform pengiriman dan platform authoring,
d. Menguji kadar logam yang tersedia pada isi,
e. Menggambar peta navigasi proyek,
f. Memproduksi audio dan video,
g. Mendigitalkan audio dan video (jika masih analog),
h. Membuat foto (still image),
i. Membuat program dan authoring,
j. Menguji fungsionalitas,
k. Membuat storyboard,
l. Merancang antarmuka dan kontainer informasi,
m. Pencarian/ pengumpulan isi,
n. Tim assembly,
o. Membuat prototipe,
p. Melakasanakan tes ke pengguna dan merevisi desain (jika diperlukan),
44
q. Membuat grafis,
r. Membuat animasi,
s. Memperbaiki bug,
t. Melaksanakan pengujian beta,
u. Membuat golden master,
v. Replikasi,
w. Menyiapkan paket,
x. Mengirimkan atau menginstal pada situs web (jika diperlukan),
y. Memberikan bonus,
z. Pesta peluncuran.
Oleh karena itu, pembiayaan harus disusun sesuai dengan biaya pengerjaan
proyek ditambah batas keuntungan yang dimungkinkan untuk menjalankan
bisnis. Ada beberapa kelompok kategori biaya yang akan dikeluarkan
untuk memproduksi multimedia, yaitu:
a. Biaya pengembangan proyek
Gaji,
Pertemuan dengan klien,
Penguasaan isi,
Komunikasi,
Perjalanan,
Penelitian,
Persiapan kontrak dan proposal, dan
Biaya tambahan.
45
b. Biaya produksi
Manajemen
Gaji,
Komunikasi,
Perjalanan, dan
Consumable (habis pakai)
Akuisisi isi
Gaji,
Layanan penelitian, dan
Biaya untuk lisensi isi.
Pembuatan isi
Seluruh kategori isi,
Gaji,
Perangkat lunak/ perangkat keras, dan
Consumable (habis pakai)
Produksi grafis
Biaya untuk lisensi gambar atau klip animasi
Produksi audio
Biaya studio,
Biaya tenaga kerja,
Biaya untuk lisensi hak musik, dan
Penyimpanan data
Produksi video
46
Biaya studio,
Biaya tenaga kerja,
Biaya untuk lisensi stock footage,
Biaya lokasi,
Sewa peralatan, dan
Pengeditan dan capturing digital.
Authoring
Gaji,
Perangkat lunak/ perangkat keras, dan
Consumable (habis pakai).
c. Biaya pengujian
Gaji
Kelompok fokus
Sewa fasilitas,
Biaya cetak
Makanan dan tunjangan, dan
Biaya coop (pembayaran atas partisipasi)
Pengeditan
Program beta
d. Biaya distribusi
Gaji,
Dokumentasi,
Pengepakan,
47
Pemanufakturan,
Pemasaran,
Periklanan, dan
Pengiriman
2.12.2 Desain dan Produksi
Setiap rencana akan dibuat desainnya dan kemudian diproduksi menjadi
produk jadi yang bersifat sementara. Disamping itu, tahap ini mencakup
perencanaan struktur navigasi yang baik untuk antarmuka penggunanya.
Pada saat produksi dimulai, rencana proyek menjadi panduan instruksi
langkah demi langkah pembuatan produk. Produksi merupakan tahap ketika
proyek multimedia benar-benar di render untuk menghasilkan suatu produk.
2.12.3 Pengujian
Pengujian program wajib dilakukan untuk memeriksa dan memastikan
bahwa program yang dibuat sudah benar-benar sesuai dengan tujuan proyek dan
sesuai dengan keperluan klien.
2.12.4 Pengiriman
Produk yang sudah jadi nantinya selanjutnya dikemas untuk
didistribusikan ke klien atau pengguna akhir.
48
2.13 Struktur Navigasi
Struktur navigasi merupakan daftar isi dan sebuah bagian aliran logis
antarmuka interaktif (Vaughan, 2007: 367). Ada empat macam struktur navigasi
dasar yang biasa digunakan dalam proses pembuatan aplikasi multimedia yaitu:
a. Struktur Navigasi Linear
Struktur navigasi linear merupakan struktur yang mempunyai cerita
berurutan. Struktur ini menampilkan satu demi satu tampilan layer secara
berurutan menurut aturannya.
Gambar 2.22 Struktur Navigasi Linear
b. Struktur Navigasi Hirarki
Struktur navigasi hirarki sering disebut struktur navigasi bercabang, yaitu
struktur yang mengandalkan percabangan untuk menampilkan data atau gambar
pada layer dengan kriteria tertentu. Tampilan halaman utama disebut master page
(halaman utama), halaman tersebut mempunyai halaman percabangan yang
disebut slave page (halaman pendukung) dan jika dipilih akan menjadi halaman
kedua.
Gambar 2.23 Struktur Navigasi Hirarki
49
c. Struktur Navigasi Non Linear
Struktur navigasi non linear (tidak terurut) merupakan pengembangan dari
struktur navigasi linear, hanya saja pada struktur ini diperkenankan untuk
membuat percabangan. Percabangan pada struktur non linear berbeda dengan
percabangan pada struktur hirarki, pada struktur ini kedudukan semua page sama,
sehingga tidak dikenal adanya master page atau slave page.
Gambar 2.24 Struktur Navigasi Non Linear
d. Struktur Navigasi Composit (Campuran)
Struktur navigasi composit merupakan gabungan dari struktur sebelumnya
dan disebut juga struktur navigasi bebas, maksudnya adalah jika suatu tampilan
membutuhkan percabangan maka dibuat percabangan.
Gambar 2.25 Struktur Navigasi Composit (Campuran)
50
2.14 Pengolahan Citra Digital
Pengolahan citra digital adalah sebuah disiplin ilmu yang mempelajari hal-
hal yang berkaitan dengan perbaikan kualitas gambar (peningkatan kontras,
transformasi warna, restorasi citra), transformasi gambar (rotasi, translasi, skala,
transformasi geometric), melakukan pemilihan citra ciri (feature image) yang
optimal untuk tujuan analisis, melakukan proses penarikan informasi atau
deskripsi objek atau pengenalan objek yang terkandung pada citra, melakukan
kompresi atau reduksi data untuk tujuan penyimpanan data, transmisi data, dan
waktu proses data. (Sutoyo, 2009: 5)
2.14.1 Citra
Citra adalah suatu representasi (gambaran), kemiripan, atau imitasi dari
suatu objek. Citra sebagai keluaran suatu sistem perekaman data dapat bersifat
optik berupa foto, bersifat analog berupa sinyal-sinyal video seperti gambar pada
monitor televisi, atau bersifat digital yang dapat langsung disimpan pada suatu
media penyimpanan. (Sutoyo dkk, 2009: 9)
Citra yang dipakai pada penelitian ini adalah berupa citra diam (still
images) dengan format gambar raster image/ bitmap image. Citra diam adalah
citra tunggal yang tidak bergerak. Sedangkan citra bergerak (moving images)
adalah rangkaian citra diam yang ditampilkan secara beruntun (sekuensial)
sehingga memberi kesan sebagai gambar yang bergerak. (Munir, 2004: 2)
2.14.2 Definisi Pengolahan Citra
Pengolahan citra adalah pemrosesan citra, khususnya dengan
menggunakan komputer menjadi citra yang kualitasnya lebih baik sehingga citra
51
yang baru dapat diinterpretasikan dan nilai tambah informasi citra tersebut juga
dapat tersampaikan dengan baik.
Agar citra yang mengalami gangguan mudah diinterpretasi (baik oleh
manusia maupun mesin), maka citra tersebut perlu dimanipulasi menjadi citra lain
yang kualitasnya lebih baik. (Munir, 2004: 3)
Umumnya, operasi-operasi pada pengolahan citra diterapkan pada citra bila:
1. Perbaikan atau memodifkasi citra perlu dilakukan untuk meningkatkan
kualitas penampakan atau untuk menonjolkan beberapa aspek informasi
yang terkandung di dalam citra,
2. Elemen di dalam citra perlu dikelompokan, dicocokkan atau diukur,
3. Sebagian citra perlu digabung dengan bagian citra yang lain.
2.14.3 Tujuan Pengolahan Citra
Pengolahan citra bertujuan memperbaiki kualitas citra agar mudah
diinterpretasi oleh manusia atau mesin (dalam hal ini komputer). Teknik-teknik
pengolahan citra mentransformasikan citra menjadi citra yang lain. Jadi,
masukannya adalah citra dan keluarannya juga citra, namun citra keluaran
mempunyai kualitas lebih baik daripada citra masukan.
2.14.4 Citra Digital
Citra terbagi dua macam yaitu citra kontinyu dan citra diskrit. Citra
kontinyu dihasilkan dari sistem optik yang menerima sinyal analog, misalnya
mata manusia dan kamera analog. Citra diskrit dihasilkan melalui proses
digitalisasi terhadap citra kontinyu, citra diskrit disebut juga citra digital.
52
Agar dapat diolah dengan komputer digital, maka suatu citra harus
direpresentasikan secara numerik dengan nilai-nilai diskrit. Representasi citra dari
fungsi malar (kontinyu) menjadi nilai-nilai diskrit disebut digitalisasi. Citra yang
dihasilkan inilah yang disebut citra digital (digital image). Pada umumnya citra
digital berbentuk empat persegi panjang dan dimensi ukurannya dinyatakan
sebagai tinggi x lebar (lebar x panjang). (Munir, 2004: 18)
2.14.4.1 Representasi Citra Digital
Seperti yang telah dijelaskan sebelumnya, citra merupakan sebuah fungsi
dari intensitas cahaya pada bidang 2 dimensi (dwimatra). Secara matematis fungsi
intensitas cahaya disimbolkan dengan f(x), dengan (x,y) adalah koordinat pada
bidang 2 dimensi. f(x,y) adalah intensitas cahaya pada titik koordinat (x,y).
(Gambar 2.26)
Karena komputer hanya dapat mengolah isyarat digital, maka citra
harus mempunyai format tertentu yang mampu merepresentasikan objek
pencitraan dalam bentuk bilangan biner. Citra digital direpresentasikan sebagai
matriks berukuran N x M dalam bentuk: (Gambar 2.27)
f(x,y)f(x,y)
Gambar 2.26 Representasi Citra Digital
53
Pada umumnya citra digital berbentuk empat persegi panjang dan
dimensi ukurannya dinyatakan sebagai tinggi x lebar (lebar x panjang). Citra
digital yang berukuran N x M lazim dinyatakan dengan matriks yang berukuran N
baris dan M kolom. Masing-masing elemen pada citra digital (berarti elemen
matriks) disebut image element, picture element atau pixel atau pel. Jadi, citra
yang berukuran NxM mempunyai NM buah pixel. (Munir, 2004: 19)
2.14.4.2 Format Citra Bitmap
Menurut Munir (2004: 38), citra disimpan di dalam berkas (file) dengan
format tertentu. Citra digital dalam format bitmap (BMP) ada 3 macam yaitu:
1. Citra biner (monokrom)
Pada citra biner (binary image), setiap titik bernilai 0 yang dinyatakan
dengan (hitam) atau 1 yang dinyatakan dengan (putih). Setiap titik pada
citra biner membutuhkan 1 bit, yang berarti 1 byte dapat menampung 8
titik. Gambar 2.28 merupakan contoh citra biner berukuran 9 x 7 pixel dan
representasinya dalam data digital.
),()2,()1,(
),2()2,2()1,2(),1()2,1()1,1(
MNiNiNi
MiiiMiii
i
Gambar 2.27 Representasi Matriks pada Citra Digital
54
Contoh dari penggunaan citra biner adalah pada citra hasil scan text/ buku,
citra hasil deteksi tepi dan citra hasil threshold.
2. Citra aras keabuan (grayscale)
Citra ini memberikan kemungkinan warna yang lebih banyak, karena ada
nilai lain di antara 0 dan 1. Disebut aras keabuan karena ada warna abu-
abu diantara warna minimum (hitam) dan warna maksimum (putih).
(Gambar 2.29)
3. Citra warna (true color)
Citra berwarna (color images) dikenal dengan nama citra spektral, karena
warna pada citra disusun oleh tiga komponen warna dasar yang disebut
(a) (b) (c)
Gambar 2.28 Citra Biner dengan Representasi bit 0 (hitam) dan 1 (putih)
(a) dan Citra Asli dalam Bentuk Hitam Putih (b)
Gambar 2.29 Contoh Citra Grayscale 8-bit
55
komponen RGB, yaitu merah (red), hijau (green), biru (blue), sehingga
sering disebut dengan citra RGB.
Setiap komponen warna pada citra true color mempunyai intensitas sendiri
dengan nilai 0-255. Contoh warna kuning merupakan gabungan antara warna
merah dan hijau sehingga nilai RGB nya adalah R = 255, G = 255 dan B = 0, jadi
setiap pixel membutuhkan 3 byte. (Gambar 2.30)
2.14.4.3 Elemen-Elemen Citra Digital
Citra digital mengandung sejumlah elemen-elemen dasar. Elemen-
elemen dasar tersebut dimanipulasi dalam pengolahan citra dan dieksploitasi lebih
lanjut dalam computer vision. Elemen-elemen dasar yang penting di antaranya
adalah:
1. Kecerahan (brightness)
Kecerahan merupakan intensitas cahaya, kecerahan pada suatu titik
(pixel) di dalam citra bukanlah intensitas yang riil, tetapi sebenarnya
adalah intensitas rata-rata dari suatu area yang melingkupinya. Sistem
visual manusia mampu menyesuaikan tingkat kecerahan dari yang paling
rendah sampai yang paling tinggi.
Gambar 2.30 Citra Warna Asli (true color)
56
2. Kontras (contrast)
Kontras menyatakan sebaran terang (lightness) dan gelap (darkness) di
dalam sebuah citra. Citra dengan kontras rendah dicirikan oleh sebagian
besar komposisi citranya adalah gelap atau sebagian besar terang. Pada
citra dengan kontras yang baik, komposisi gelap dan terang tersebar
secara merata.
3. Kontur (contour)
Kontur adalah keadaan yang ditimbulkan oleh perubahan intensitas pada
pixel-pixel yang bertetangga. Karena adanya perubahan intensitas inilah
mata seseorang mampu mendeteksi tepi-tepi (edge) objek di dalam citra.
4. Warna (color)
Warna adalah persepsi yang dirasakan oleh sistem visual manusia
terhadap panjang gelombang cahaya yang dipantulkan oleh objek. Setiap
warna mempunyai panjang gelombang yang berbeda. Warna merah
mempunyai panjang gelombang paling tinggi, sedangkan warna ungu
mempunyai panjang gelombang paling rendah.
5. Bentuk (shape)
Bentuk adalah properti intrinsik dari objek 3 dimensi. Citra yang
dibentuk merupakan citra 2 dimensi, sedangkan objeknya adalah 3
dimensi.
57
6. Tekstur (texture)
Tekstur dicirikan sebagai distribusi spasial dari derajat keabuan di dalam
sekumpulan pixel-pixel yang bertetangga. Tekstur tidak dapat
didefinisikan untuk sebuah pixel. (Munir, 2004: 25)
2.14.5 Operasi Pengolahan Citra Digital
Secara umum operasi pengolahan citra dapat diklasifikasikan dalam
enam jenis yaitu:
1. Pemugaran citra (image restoration)
Operasi ini bertujuan menghilangkan/ meminimumkan cacat pada citra.
Tujuan pemugaran citra hampir sama dengan operasi perbaikan citra.
Bedanya pada pemugaran citra penyebab degradasi gambar diketahui.
Contoh-contoh operasi pemugaran citra:
a. Penghilangan kesamaran (deblurring)
b. Penghilangan derau (noise)
2. Pemampatan citra (image comperession)
Jenis operasi ini dilakukan agar citra dapat direpresentasikan dalam
bentuk yang lebih kompak sehingga memerlukan memori yang lebih
sedikit. Hal penting yang harus diperhatikan dalam pemampatan adalah
citra yang telah dimampatkan harus tetap mempunyai kualitas gambar
yang bagus.
58
3. Segmentasi citra (image segmentation)
Jenis operasi ini bertujuan untuk memecah suatu citra ke dalam beberapa
segmen dengan suatu kriteria tertentu. Jenis operasi ini berkaitan erat
dengan pengenalan pola.
4. Pengorakan citra (image analysis)
Jenis operasi ini bertujuan menghitung besaran kuantitatif dari citra untuk
menghasilkan deskripsinya. Teknik pengorakan citra mengekstraksi ciri-
ciri tertentu yang membantu dalam identifikasi objek. Proses segmentasi
kadangkala diperlukan untuk melokalisasi objek yang diinginkan dari
sekelilingnya. Contoh-contoh operasi pengorakan citra:
a. Pendeteksian tepi objek (edge detection)
b. Ekstraksi batas (boundary)
c. Representasi daerah (region)
5. Rekonstruksi citra (image reconstruction)
Jenis operasi ini bertujuan untuk membentuk ulang objek dari beberapa
citra hasil proyeksi. Operasi rekonstruksi citra banyak digunakan dalam
bidang medis. Misalnya beberapa foto rontgen dengan sinar X digunakan
untuk membentuk ulang gambar organ tubuh.
6. Perbaikan kualitas citra (image enhancement)
Jenis operasi ini bertujuan untuk memperbaiki kualitas citra dengan cara
memanipulasi parameter-parameter citra. Dengan operasi ini, ciri-ciri
khusus yang terdapat di dalam citra lebih ditonjolkan. (Munir, 2004: 9)
Contoh-contoh operasi perbaikan citra:
59
a. Perbaikan kontras gelap/ terang
b. Perbaikan tepian objek (edge enhancement)
c. Penajaman (sharpening)
d. Pemberian warna semu (pseudocoloring)
e. Penapisan derau (noise filtering)
2.14.6 Teknik Pengolahan Citra
Secara umum teknik pengolahan citra digital dibagi menjadi 3 tingkat
pengolahan, yakni sebagai berikut:
Tahap 1: Low-Level Processing (pengolahan tingkat rendah). Pengolahan
ini operasional-operasioanl dasar dalam pengolahan citra, seperti
pengurangan noise (noise reduction), perbaikan citra (image
enhancement) dan restorasi citra (image restoration).
Tahap 2: Mid-Level Processing (pengolahan tingkat menengah).
Pengolahan ini meliputi segmentasi pada citra, deskripsi objek, dan
klasifikasi objek secara terpisah.
Tahap 3: High-Level Processing (pengolahan tingkat tinggi), yang
meliputi analisis citra. (Basuki dkk, 2005: 11)
2.14.7 Matriks
Matriks adalah susunan skalar elemen-elemen dalam bentuk baris dan
kolom. Matriks A yang berukuran dari m baris dan n kolom (m x n) adalah
(Munir, 2003: 62):
60
Sebagaimana telah dijelaskan sebelumnya, citra digital yang berukuran N
x M (tinggi = N, lebar = M) lazim dinyatakan dengan matriks N baris dan M
kolom sebagai berikut:
Untuk citra dengan 256 derajat keabuan, harga setiap elemen matriks
adalah bilangan bulat di dalam selang [0, 255]. Karena itu, dapat menggunakan
tipe unsigned char untuk menyatakan tipe elemen matriks. Unsigned char adalah
tipe integer positif di dalam bahasa C yang rentang nilainya hanya dari 0 sampai
255.
2.15 Image Enhancement (Perbaikan Citra)
Merupakan salah satu jenis operasi pada pengolahan citra digital yang
bertujuan untuk meningkatkan kualitas tampilan citra untuk pandangan manusia
atau untuk mengkonversi suatu citra agar memiliki format yang lebih baik
sehingga citra tersebut menjadi lebih mudah diolah dengan mesin (komputer).
)1,1()1,1()0,1(
),1()1,1()0,1(),0()1,0()0,0(
),(
MNfNfNf
MfffMfff
yxf
mnmm
n
n
aaa
aaaaaa
A
21
22212
11211
61
Perbaikan suatu citra dapat dilakukan dengan operasi titik (point
operation), operasi spasial (spatial operation), operasi geometri (geometric
operation) dan operasi aritmatik (arithmetic operation). (Putra, 2010: 119)
2.15.1 Operasi Spasial (Filtering)
Pentapisan pada pengolahan citra biasa disebut dengan pentapisan
spasial (spatial filtering). Pada proses pentapisan, nilai pixel baru umumnya
dihitung berdasarkan pixel tetangga. Cara perhitungan pixel baru tersebut dapat
dikelompokkan menjadi 2, yaitu pertama, pixel baru diperoleh melalui kombinasi
linier pixel tetangga yang disebut cara dengan tapis linier dan kedua pixel baru
diperoleh langsung dari salah satu nilai pixel tetangga yang disebut juga dengan
tapis nonlinier. Proses penapisan tidak dapat dilepaskan dari teori kernel (mask)
dan konvolusi.
2.15.2 Kernel
Kernel adalah matriks yang pada umumnya berukuran kecil dengan
elemen-elemennya adalah berupa bilangan. Kernel digunakan pada proses
konvolusi. Oleh karena itu kernel disebut juga dengan convolution window
(jendela konvolusi). Ukuran kernel dapat berbeda-beda, seperti 2x2, 3x3, 5x5 dan
sebagainya. Kernel biasa juga disebut dengan tapis (filter), template, mask, serta
sliding window. (Putra, 2010: 137)
(a) (b)
Gambar 2.31 Contoh kernel (a)-(b) Berturut-turut kernel berukuran 2x2 dan 3x3 (sel dengan warna abu-abu menyatakan pusat koordinat {0,0})
62
2.15.3 Konvolusi (Convolution)
Merupakan operator sentral pengolah citra dan telah digunakan secara
luas pada berbagai piranti lunak pengolah citra.
Proses konvolusi dapat dijelaskan sebagai berikut. Kernel (sliding
window) diletakkan pada setiap pixel dari citra input dan menghasilkan pixel baru.
Nilai pixel baru dihitung dengan mengalikan setiap nilai pixel tetangga dengan
bobot yang berhubungan pada kernel dan kemudian menjumlah hasil perkalian
tersebut. Contoh citra input dan kernel ditunjukkan pada (Gambar 2.32).
U1,1 U1,2 U1,3 U1,4 U1,5 U1,6 U2,1 U2,2 U2,3 U2,4 U2,5 U2,6 U3,1 U3,2 U3,3 U3,4 U3,5 U3,6 U4,1 U4,2 U4,3 U4,4 U4,5 U4,6 U5,1 U5,2 U5,3 U5,4 U5,5 U5,6 U6,1 U6,2 U6,3 U6,4 U6,5 U6,6
(a) K1,1 K1,2 K1,3 K2,1 K2,2 K2,3
(b)
Gambar 2.32 (a) Citra Input (b) Kernel 2x3
Sesuai contoh pada (Gambar 2.32) maka nilai pixel sebagai berikut.
)()()()()()( 3,25,52,24,51,23,53,15,42,14,41,13,43,4 xKuxKuxKuxKuxKuxKuO
Operator konvolusi biasanya menggunakan tanda (*). Secara
matematika proses konvolusi U*K dapat dinyatakan sebagai berikut.
),()1,1(),(1 1
lkKljkiUjiOm
k
n
l
Dengan i = 1...M – m + 1 dan j = 1...N – n + 1. M dan N menyatakan
ukuran baris dan kolom dari citra input, sedangkan m dan n menyatakan ukuran
baris dan kolom dari kernel. Ukuran citra hasil proses konvolusi di atas adalah (M
63
– m + 1) baris dan (N – n + 1) kolom, yang berarti ukuran citra hasil proses
konvolusi lebih kecil dari ukuran citra awal. Berubahnya ukuran citra hasil ini
dapat dijelaskan dengan contoh berikut.
772377426752
44111333123441143311
1001
Dengan menyatakan bukan nilai. Nilai 5 pada konvolusi diatas diperoleh dari:
(1 x 1) + (0 x 3) + (0 x 1) + (1 x 4)
Tanda * pada hasil keluaran di atas dinyatakan sebagai bukan nilai
karena untuk melakukan proses konvolusi pada pixel tersebut, sebagian kernel
berada di luar batas ukuran citra sementara tidak ada nilai pixel di luar batas
ukuran citra. Hal ini dapat dijelaskan karena proses konvolusi di luar batas ukuran
citra tetap dilakukan dengan menambahkan sembarang nilai pixel untuk pixel di
luar batas yang umumnya digunakan atau ditambahkan nilai 0 (zero padding).
Dengan cara tersebut proses konvolusi tetap dapat dilakukan. Namun demikian,
nilai pixel hasil konvolusi di luar batas ukuran citra tidak menunjukkan nilai pixel
yang sebenarnya. (Putra, 2010: 139) (Gambar 2.33) di bawah ini menunjukkan
ilustrasi dari proses konvolusi.
64
A. Penapis Lolos Tinggi (High-Pass Filter)
Penapis lolos-tinggi merupakan penapis yang berfungsi untuk
meloloskan (memperkuat) komponen yang berfrekuensi tinggi (misal tepi atau
pinggiran objek) dan akan menurunkan komponen berfrekuensi rendah. High-pass
filter dapat digunakan pada operasi penajaman yang dilakukan dengan
melewatkan komponen citra yang memiliki frekuensi tinggi.
Citra yang telah melalui high pass filter mengakibatkan pinggiran objek
citra terlihat lebih tajam dibandingkan sekitarnya. Karena penajaman citra lebih
berpengaruh pada tepi (edge) objek, maka penajaman citra sering disebut juga
penajaman tepi (edge sharpening) atau peningkatan kualitas tepi (edge
enhancement). (Gambar 2.34) menunjukkan gambar sebuah citra Lena sebelum
dan setelah penajaman.
Gambar 2.33 Ilustrasi Hitung Konvolusi
65
Aturan penapis lolos tinggi:
1. Koefisein penapis boleh positif, negatif atau nol
2. Jumlah semua koefisien adalah 0 atau 1
Jika jumlah koefisien = 0, maka komponen berfrekuensi rendah akan turun
nilainya, sedangkan jika jumlah koefisien sama dengan 1, maka komponen
berfrekuensi rendah akan tetap sama dengan nilai semula. Contoh-contoh penapis
lolos tinggi:
0
111181111
)i(
1
111191111
)ii(
1
010151
010)iii(
1
121252
121)iv(
0
121242
121)v(
0
010141010
)vi(
Nilai koefisien yang besar di titik pusat penapis memainkan peranan kunci
dalam proses konvolusi. Pada komponen citra dengan frekuensi tinggi (yang
(a) Sebelum (b) Sesudah
Gambar 2.34 Gambar Sebuah Citra Lena Sebelum (a) dan Sesudah (b) Penajaman Citra (image sharpening)
66
berarti perubahan yang besar pada nilai intensitasnya), nilai tengah ini dikalikan
dengan nilai pixel yang dihitung. Koefisien negatif yang lebih kecil di sekitar titik
tengah penapis bekerja untuk mengurangi faktor pembobotan yang besar. Efek
nettonya adalah, pixel-pixel yang bernilai besar diperkuat, sedangkan area citra
dengan intensitas pixel konstan tidak berubah nilainya.
Penapis lolos tinggi juga digunakan untuk mendeteksi keberadaan tepi
(edge detection). Dalam hal ini, pixel-pixel tepi ditampilkan lebih terang
(highlight) sedangkan pixel-pixel bukan tepi dibuat gelap (hitam).
Dibawah ini memperlihatkan hasil konvolusi citra dengan high-pass filter
yang digambarkan dalam bentuk matriks dan direpresentasikan dalam bentuk
kurva. (Munir, 2004: 129)
44444444444444444444444444444444444
88884448888444888844488884448888444
Gambar 2.35 Representasi Matriks dan Kurva dengan High-Pass Filter
B. Penapis Lolos Rendah (Low-Pass Filter)
Low-pass filter merupakan penapis yang berfungsi sebagai penekan
komponen yang berfrekuensi tinggi (misal pixel gangguan, pixel tepi) dan
meloloskan komponen yang berfrekuensi rendah.
x
8
4
0
f(x,y)
67
Aturan untuk penapis lolos rendah adalah:
1. Semua koefisien penapis harus positif
2. Jumlah semua koefisien harus sama dengan 1
Jika jumlah semua koefisien lebih besar dari 1, maka konvolusi
menghasilkan penguatan (tidak diinginkan). Jika jumlah semua koefisen kurang
dari 1, maka yang dihasilkan adalah penurunan dan nilai mutlak setiap pixel di
seluruh bagian citra berkurang. (Munir, 2004: 125)
Operasi pelembutan dapat dilakukan pada ranah spasial maupun pada
ranah frekuensi. Pada ranah spasial, operasi pelembutan dilakukan dengan
mengganti intensitas suatu pixel dengan rata-rata dari nilai pixel tersebut dengan
nilai pixel-pixel tetangganya. Jadi, diberikan citra f(x,y) yang berukuran N x M.
Citra hasil pelembutan, g(x,y), didefinisikan sebagai berikut:
2
1
2
1
),(1),(m
mr
n
nssyrxf
dyxg
Yang dalam hal ini d adalah jumlah pixel yang terlibat dalam perhitungan
rata-rata. Contoh penapis rerata yang berukuran 3 x 3 dan 2 x 2 adalah seperti
(a) Sebelum (b) Sesudah
Gambar 2.36 Gambar Sebuah Citra Sebelum (a) dan Sesudah (b) Pelembutan Citra (image smoothing)
68
gambar di bawah ini (elemen yang bertanda menyatakan posisi (0,0) dari pixel
yang dikonvolusi):
9/19/19/19/19/19/19/19/19/1
)i(
4/14/1
4/14/1)ii(
Operasi penapisan ini mempunyai efek pemerataan derajat keabuan,
sehingga gambar yang diperoleh tampak lebih kabur kontrasnya. Efek pengaburan
ini disebut efek blurring. (Munir, 2004: 121)
2.15.4 Aras Komputasi
Citra digital direpresentasikan dengan matriks. Operasi pada citra digital
pada dasarnya adalah memanipulasi elemen-elemen matriks. Elemen matriks yang
dimanipulasi dapat berupa elemen tunggal (sebuah pixel), sekumpulan elemen
yang berdekatan, atau keseluruhan elemen matriks.
Operasi-operasi yang dilakukan pada pengolahan citra dapat
dikelompokkan ke dalam empat aras (level) komputasi, yaitu aras titik, aras lokal,
aras global dan aras objek. (Munir, 2004: 53)
1. Aras Titik
Operasi pada aras titik hanya dilakukan pada pixel tunggal di dalam citra.
Operasi titik dikenal juga dengan nama operasi pointwise. Operasi ini terdiri dari
pengaksesan pixel pada lokasi yang diberikan, memodifikasinya dengan operasi
lanjar (linear) atau nirlanjar (nonlinear) dan menempatkan nilai pixel baru pada
lokasi yang bersesuaian di dalam citra yang baru. Operasi ini diulangi untuk
keseluruhan pixel di dalam citra.
69
2. Aras Lokal
Operasi pada aras lokal menghasilkan citra keluaran yang intensitas suatu
pixel bergantung pada intensitas pixel-pixel tetangganya. Contoh operasi beraras
lokal adalah operasi konvolusi untuk mendeteksi tepi (edge detection) dan
pelembutan citra (image smoothing)
3. Aras Global
Operasi pada aras global menghasilkan citra keluaran yang intensitas suatu
pixel bergantung pada intensitas keseluruhan pixel.
4. Aras Objek
Operasi jenis ini hanya dilakukan pada objek tertentu di dalam citra.
Tujuan dari operasi pada aras objek adalah untuk mengenali objek tersebut,
misalnya dengan menghitung rata-rata intensitas, ukuran, bentuk, dan karakteristik
lain dari objek.
2.15.5 Kernel Konvolusi
Kernel konvolusi merupakan kernel yang digunakan pada proses konvolusi
yang elemen-elemennya berupa bilangan yang menyusun nilai matriks yang biasa
disebut dengan convolution window (jendela konvolusi). Berikut adalah beberapa
penggunaan kernel konvolusi dalam proses image enhancemnet.
A. Smoothing Kernel
Smoothing kernel merupakan kernel yang digunakan untuk menghaluskan
sebuah citra, kernel ini berkaitan dengan penapis lolos rendah (low-pass filter).
Tapis low-pass bertujuan untuk mempertahankan komponen berfrekuensi rendah
(perubahan nilai pixel yang bertahap) dan mengurangi komponen yang
70
berfrekuensi tinggi (perubahan nilai pixel secara mendadak) pada citra, sehingga
tapis ini sangat cocok untuk proses penghalusan citra. Semua koefisien dari tapis
low-pass adalah bilangan positif.
111111111
91
1313163131
81
(a) (b) Gambar 2.37 Tapis Low-Pass
Faktor dan pada tapis di atas adalah untuk menjamin agar nilai pixel baru
tidak berada di luar batas nilai grayscale (intensitas). Gambar 2.37 (a) adalah tapis
mean, pembentukan tapisnya menggunakan aturan bobot semua koefisiennya
sama. Sedangkan pada Gambar 2.37 (b), pembentukan tapisnya menggunakan
aturan nilai bobot pixel pusat sama (hampir sama) dengan jumlah semua bobot
nilai pixel tetangga. Selain semua koefisien harus bernilai positif, aturan kedua di
atas biasa digunakan sebagai acuan untuk membentuk tapis low-pass.
Tapis mean, tapis Gaussian adalah tapis yang tergolong low-pass karena
tapis ini mempertahankan frekuensi rendah (menghaluskan citra output).
111121121111111010
111111111
91*
0100001110016100111001110011100111000000
Gambar 2.38 Contoh Tapis Mean adalah Tapis Low-Pass
71
Pada contoh di atas, komponen frekuensi tinggi (perubahan pixel dari 1 ke
6) pada citra input dengan tapis low-pass menjadi komponen frekuensi rendah
(perubahan pixel dari 1 ke 2)
Berikut adalah contoh penerapan penggunaan salah satu smoothing kernel
3x3 dengan citra berukuran 5x5 dari teknik konvolusi.
102224151715161514
111111111
*
2127110321001615410030212
I1= (2x1)+(1x1)+(2x1)+(0x1)+(0x1)+(1x1)+(1x1)+(6x1)+(1x1)=14
I2= (1x1)+(2x1)+(0x1)+(0x1)+(1x1)+(4x1)+(6x1)+(1x1)+(0x1)=15
I3= (2x1)+(0x1)+(3x1)+(1x1)+(4x1)+(5x1)+(1x1)+(0x1)+(0x1)=16
I4= (0x1)+(0x1)+(1x1)+(1x1)+(6x1)+(1x1)+(1x1)+(2x1)+(3x1)=15
I5= (0x1)+(1x1)+(4x1)+(6x1)+(1x1)+(0x1)+(2x1)+(3x1)+(0x1)=17
I6= (1x1)+(4x1)+(5x1)+(1x1)+(0x1)+(0x1)+(3x1)+(0x1)+(1x1)=15
I7= (1x1)+(6x1)+(1x1)+(1x1)+(2x1)+(3x1)+(1x1)+(7x1)+(2x1)=24
I8= (6x1)+(1x1)+(0x1)+(2x1)+(3x1)+(0x1)+(7x1)+(2x1)+(1x1)=22
I9= (1x1)+(0x1)+(0x1)+(3x1)+(0x1)+(1x1)+(2x1)+(1x1)+(2x1)=10
B. Sharpening Kernel
Penajaman (sharpening) pada sebuah citra bertujuan untuk mempertajam
kualitas sebuah citra. Kernel sharpening itu sendiri juga berkaitan dengan tapis
high-pass filter yang merupakan kebalikan dari tapis low-pass yaitu untuk
mempertahankan (mempertajam) komponen frekuensi tinggi dan menghilangkan
(mengurangi) komponen frekuensi rendah sehingga tapis ini sangat cocok untuk
penajaman tepi citra.
72
Nilai koefisien tapis pada koordinat pusat bernilai positif dan koefisien
kelilingnya bernilai negatif. Bila proses pentapisan dilakukan di atas area yang
nilai intensitasnya konstan atau mengalami perubahan yang lamban maka nilai
pixel keluaran adalah nol atau sangat kecil. (Putra, 2010:145)
Proses penajaman pada dasarnya merupakan aplikasi dari high pass filter
atau penapis lolos tinggi ke dalam sebuah citra. Array di bawah ini adalah contoh
kernel yang biasa dipakai pada high pass filter untuk mempertajam sebuah citra.
111181111
91
010141
010
Gambar 2.39 Tapis High-Pass 3 x 3
Tampak pada contoh di atas, nilai pixel 6 pada citra input, setelah ditapis
high-pass, dipertajam menjadi 20 demikian juga semula pada citra input tidak ada
perubahan nilai pixel (nilai pixel dari 1 ke 1 pada baris ke-2,3,4) menjadi ada
perubahan nilai pixel (menjadi 2 ke 1, 1 ke 0, 0 ke 1 dan seterusnya).Contoh
perhitungan tapis high-pass yang lain adalah sebagai berikut.
2424204
151101101212
010141
010*
0100001110016100111001110011100111000000
I1 = (0x0)+(0 x-1)+(0x0)+(0 x-1)+(1x4)+(1 x-1)+(0x0)+(1 x-1)+(1x0) = 2
I2 = (0x0)+(0 x-1)+(0x0)+(1 x-1)+(1x4)+(1 x-1)+(1x0)+(1 x-1)+(1x0) = 1
73
dan seterusnya sama seperti perhitungan pada kernel smoothing sebelumnya.
C. Laplacian Kernel
Adalah operator urutan kedua atau turunan kedua dari metode perbaikan
kualitas citra, operator ini sangat baik sekali digunakan untuk menemukan bagian
yang detail dari sebuah image. Satu atau beberapa ciri dari ketajaman citra yang
tidak sempurna (seperti noise) akan diperbaiki oleh operator laplacian. Jadi
laplacian kernel berguna untuk mengembalikan detail pada suatu citra menjadi
citra yang lebih baik yang dihaluskan untuk mengurangi noise.
Dibawah ini merupakan laplacian kernel atau filter yang berukuran 3x3,
dimana dalam teknik konvolusi filter/ kernel ditempatkan.
Gambar 2.40 Contoh Filter Laplacian
Berikut adalah contoh penerapan penggunaan kernel laplacian dalam
teknik konvolusi.
105715839
26513
111181111
*
2127110321001615410030212
74
I1 = (2x-1)+(1x-1)+(2x-1)+(0x-1)+(0x8)+(1x-1)+(1x-1)+(6x-1)+(1x-1) = -13
I2 = (1x-1)+(2x-1)+(0x-1)+(0x-1)+(1x8)+(4x-1)+(6x-1)+(1x-1)+(0x-1) = 5
I3 = (2x-1)+(0x-1)+(3x-1)+(1x-1)+(4x8)+(5x-1)+(1x-1)+(0x-1)+(0x-1) = 26
2.16 Macromedia Flash Professional 8
Flash adalah authoring tool yang dapat digunakan oleh para desainer dan
developer untuk membuat sebuah presentasi, aplikasi, dan konten lainnya yang
memungkinkan interaksi dari penggunanya. Membuat project flash dapat meliputi
animasi sederhana, konten video, presentasi yang kompleks, sebuah aplikasi dan
lain-lain.
Flash Professional 8 menyediakan beberapa fitur tambahan yang dapat
mempermudah pengguna. Flash juga mempunyai bahasa pemrograman sendiri
yang diberi nama actionscript. Bahasa actionscript digunakan untuk menambah
interaktifitas dalam aplikasi yang dibuat baik dalam bentuk aplikasi sederhana
maupun yang lebih kompleks seperti aplikasi berbasis web.
Selain itu fitur terbaru yang disediakan oleh flash professional 8 adalah
tersedianya efek grafis untuk memanipulasi objek, gambar maupun animasi
berupa movie clip atau button, pada flash disebut dengan filters dan blend effects.
75
Gambar 2.41 Antarmuka Macromedia Flash Professional 8
2.17 Adobe Photoshop CS 2
Photoshop merupakan software berbasis bitmap yang merupakan produksi
dari Adobe yang banyak digunakan untuk mengolah gambar atau citra.
Penambahan fasilitas yang ada pada photoshop CS 2 yang tidak ada pada versi
sebelumnya diantaranya yaitu: penambahan tool image warp, noise reduction,
optical lens correction, smarth sharpen, all new pdf engine dan lain sebagainya.
Penambahan fitur dengan menggunakan fasilitas tools grafis yang ada di
dalamnya. Gambar 2.24 adalah tampilan atau area kerja photoshop CS 2.
76
Gambar 2.42 Antarmuka Adobe Photoshop CS 2
2.18 Matlab Simulink R2009a
Nama MATLAB merupakan singkatan dari ‘matrix laboratory’. Matlab
adalah sebuah bahasa pemrograman dengan unjuk kerja tinggi (high-performance)
untuk komputasi teknis, yang mengintegrasikan komputasi, visualisasi dan
pemrograman di dalam lingkungan yang mudah penggunaannya dalam
memecahkan persoalan dengan solusinya yang dinyatakan dengan notasi
matematik. Penggunaan MATLAB antara lain, yaitu:
Matematika dan komputasi
Pengembangan algoritma
Pemodelan, simulasi dan pembuatan ‘prototipe’
Analisa data, eksplorasi dan visualisasi
Grafik untuk sains dan teknik
Pengembangan aplikasi, termasuk pembuatan antarmuka grafis untuk
pengguna (Grapichal User Interface)
77
Matlab adalah sebuah sistem interaktif yang menggunakan elemen
dasarnya adalah array yang tidak membutuhkan dimensi. Hal ini mempermudah
untuk menyelesaikan masalah komputasi, terutama yang menyangkut matriks dan
vektor.
Fitur-fitur MATLAB untuk penyelesaian spesifik disebut ‘toolboxes’.
‘Toolboxes’ adalah koleksi komprehensif dari fungsi-fungsi MATLAB (M-files)
yang memperlebar lingkungan matlab dalam menyelesaikan kelas-kelas tertentu
dari permasalahan. Beberapa toolbox yang tersedia meliputi bidang: pengolahan
sinyal, sistem kendali, jaringan syaraf (neural network), logika fuzzy, wavelet,
simulasi dan lain sebagainya (Wijaya & Prijono, 2007: 2).
Gambar 2.43 Antarmuka MATLAB Simulink R 2009a
2.19 Cool Edit Pro 2.1
CoolEdit merupakan perangkat lunak audio yang paling populer karena
memiliki fasilitas filter. Dengan filter ini kualitas suara dan rekaman digital dapat
diolah dengan nuansa yang baru. Fasilitas Edit View menjadikan CoolEdit sebagai
alat editing yang lebih powerful, lebih user-friendly dan sebagai analisis tool,
78
mencakup fase real-time dan analisis frekuensi, filtering tingkat lanjut serta efek-
efek dinamis (Suyanto, 2003: 200).
Gambar 2.44 Antarmuka CoolEdit Pro 2.1
2.20 Ulead Video Studio 10
Ulead Video Studio 10 merupakan perangkat lunak editing yang
menyediakan pilihan terbanyak pada fungsi perekaman. Dengan fungsi tersebut
perangkat lunak mampu merekam beberapa klip secara keseluruhan dalam sekali
jalan.
Fasilitas share memungkinkan untuk menghasilkan video untuk CD,
DVD, pita, e-mail dan internet streaming. Merekam video back ke pita DV/D8
untuk ditampilkan di TV atau merekam ke VHS. Mendukung AVI, MPEG-1,
MPEG-2, Windows Media, Real Video, Quick Time dan sebagainya.
79
Gambar 2.45 Antarmuka Ulead Video Studio 10
2.21 Camtasia Studio 7
Camtasia studio merupakan software yang banyak digunakan untuk
membuat sebuah video tutorial yang dapat dimanfatkan salah satunya sebagai
bahan pembelajaran. Dengan versinya yang terbaru, memungkinkan pengguna
untuk menikmati fasilitas dari fitur terbaru seperti zoom-in tool serta variasi hasil
output yang dapat di-customize atau dapat diatur sendiri oleh pengguna.
Gambar 2.46 Antarmuka Camtasia Studio 7
80
BAB III
METODE PENELITIAN
3.1 Metode Pengumpulan Data
Dalam melakukan penelitian ini, tahap pengumpulan data dilakukan guna
mendukung pembuatan aplikasi pada tahap selanjutnya. Adapun metode
pengumpulan data yang peneliti lakukan yaitu:
3.1.1 Studi Lapangan
Pada tahap studi lapangan peneliti melakukan pengumpulan data dengan
cara observasi, wawancara dan penyebaran kuesioner seperti dijelaskan di bawah
ini.
3.1.1.1 Observasi
Langkah awal untuk merancang penelitian ini adalah dengan melakukan
observasi lapangan, yaitu mengamati proses perkuliahan yang sedang
berlangsung.
Observasi dilakukan pada Tanggal 22 Desember 2009 bertempat di Ruang
Perkuliahan Lt.6 Program Studi Teknik Informatika Fakultas Sains dan Teknologi
UIN Syarif Hidayatullah Jakarta.
Observasi yang peneliti lakukan selain sebagai analisis terhadap
permasalahan yang ada, juga nantinya akan digunakan sebagai landasan dalam
merancang konsep storyboard awal untuk pembuatan interface (antar muka) dari
aplikasi multimedia yang dibuat.
81
3.1.1.2 Wawancara
Selain melakukan pengumpulan data primer dan sekunder maupun
pengamatan, peneliti juga melakukan wawancara, sesi wawancara, dilakukan
dengan responden yaitu dosen yang berkaitan langsung dengan materi yang
peneliti bahas yaitu pengolahan citra.
Wawancara dilaksanakan pada Tanggal 8 Desember 2009, bertempat di
Ruang Dosen TI/ SI dan lobi Program Studi Teknik Informatika Fakultas Sains
dan Teknologi UIN Syarif Hidayatullah Jakarta.
Dalam hal ini Ibu Qurrotul Aini, MT selaku dosen mata kuliah Pengolahan
Citra Digital sebagai narasumber utama. Hal ini dimaksudkan untuk lebih mudah
menganalisis materi yang dibahas menjadi topik kajian penelitian serta
memberikan gambaran untuk perancangan aplikasi yang akan dilakukan.
Narasumber kedua yaitu seorang dosen multimedia Bapak M.Yusuf, S.Kom
selaku dosen praktek multimedia, pertanyaan yang diajukan sama seperti
narasumber sebelumnya. Selengkapnya hasil wawancara ditunjukkan pada
lampiran L1.
3.1.1.3 Kuesioner
Alat lain untuk mengumpulkan data adalah daftar pertanyaan, yang sering
disebutkan secara umum dengan nama kuesioner. Untuk melengkapi data primer
yang sudah dikumpulkan, kuesioner peneliti jadikan sebagai data sekunder yang
dapat menjadi alat ukur untuk mengetahui tingkat kebutuhan mahasiswa terhadap
aplikasi multimedia pembelajaran materi pengolahan citra yang akan dirancang
nantinya.
82
Penyebaran kuesioner awal penelitian dilaksanakan pada Tanggal 5
Januari 2010. Kuesioner penelitian ini berupa data dari 46 mahasiswa semester 5
pada Program Studi Teknik Informatika UIN Syarif Hidayatullah Jakarta baik
program regular maupun non regular yang sedang atau telah mengikuti mata
kuliah pengolahan citra. Peneliti membatasi hanya pada mahasiswa yang sedang
atau sudah mengikuti mata kuliah pengolahan citra dikarenakan untuk lebih
mempersempit objek penelitian yang dilakukan dan disesuaikan dengan tujuan
atau sasaran dari pembuatan aplikasi ini.
3.1.2 Studi Penelitian Sejenis
Pada tahap ini peneliti melakukan studi pustaka yang diperlukan sebagai
referensi pendukung guna melengkapi landasan teori yang berkaitan dengan
penelitian, studi pustaka dilakukan dengan mengunjungi perpustakaan, mencari
jurnal-jurnal ilmiah yang terkait dengan topik bahasan penelitian, dari internet dan
dari referensi buku teks (textbook) yang berhubungan dengan penelitian peneliti.
Referensi buku pada perpustakaan yang peneliti jadikan sebagai daftar
pustaka yaitu referensi kamus istilah bahasa Indonesia, kamus istilah komputer,
buku pengolahan citra digital dan aplikasinya, buku metode ilmiah penelitian,
buku-buku aplikasi multimedia salah satunya adalah panduan “Referensi dan
Tuntunan Perancangan Program dengan Action Script Macromedia Flash MX”.
Buku-buku dan sumber referensi penelitian ini dapat dilihat pada Daftar Pustaka.
Selain itu studi penelitian sejenis dilakukan untuk mengetahui
perkembangan dari penelitian sebelumnya. Adapun penelitian sebelumnya yang
peneliti jadikan sumber pengembangan adalah 2 penelitian dari UIN Syarif
83
Hidayatullah yaitu: Dewi Yuliarti, 2007. ”Perancangan Aplikasi Pembelajaran
Matematika untuk Kelas 6 SD Berbasis Multimedia”. Ratna Muliasari, 2008.
”Perancangan Perangkat Ajar Statistika SMP Berbasis CAI”. Paper Penelitian
Herman Dwi Surjono, 1996. ”Pengembangan Program Pengajaran Berbantuan
Komputer (CAI) dengan Sistem Authoring”. Studi Kasus: Mata Kuliah Fisika-
Tekanan Udara, IKIP Yogyakarta. Dan International Journal Sultan Al Sultan
dkk.2006. ”Developed of A Computers Aided Instruction (CAI) Package in
Remote Sensing Educational”, School of Physics USM Malaysia.
Berdasarkan studi penelitian sejenis ini, penggunaan metode yang berbeda
peneliti pilih untuk mengembangkan Aplikasi Pembelajaran Materi Pengolahan
Citra dengan Menggunakan Teknik Konvolusi Bebasis Multimedia yaitu
menggunakan metode menurut Vaughan (2004) yang terdiri dari 4 tahapan.
Penjelasan dapat dilihat pada Sub Bab 2.11, 3.2 dan Sub Bab 4.5. Selain itu
pengembangan pada halaman modul quiz juga dilakukan dengan membuat
evaluasi materi dan juga isi pertanyaan quiz yang dapat diubah (di edit).
Penjelasan dapat dilihat pada Sub Bab 4.5.2.
84
85
3.2 Metodologi Pengembangan Aplikasi Multimedia
Pada tahap ini peneliti akan menggunakan metodologi pengembangan
multimedia menurut Vaughan (2004) dalam (Binanto, 2010: 264). Dimana pada
prosesnya terdiri dari 4 tahapan dasar dalam suatu proyek multimedia, yaitu:
3.2.1 Perencanaan dan Pembiayaan
Pada tahap ini peneliti akan melakukan proses identifikasi kebutuhan dan
tujuan, kemampuan multimedia yang dibutuhkan dan semua pertanyaan dari
tahapan perencanaan yang telah diuraikan pada sub bab 2.12.1. Proses pembuatan
Aplikasi Pembelajaran Materi Pengolahan Citra dengan Menggunakan Teknik
Konvolusi Berbasis Multimedia secara lengkap akan dibahas pada sub bab 4.5.1
dan 4.5.2
Aplikasi Pembelajaran Materi Pengolahan Citra dengan Menggunakan
Teknik Konvolusi yang dibuat diharapkan dapat memberikan manfaat yang dapat
berupa penghematan-penghematan atau manfaat yang baru, sehingga dapat
bernilai atau layak untuk digunakan.
3.2.2 Desain dan Produksi
Pada tahap desain dan produksi dari Aplikasi Pembelajaran Materi
Pengolahan Citra dengan Menggunakan Teknik Konvolusi ini peneliti akan
melakukan pembuatan desain storyboard, struktur navigasi, desain bagan alir
(flowchart view), perancangan diagram transisi (state transition diagram) dan
perancangan antar muka (user interface).
86
3.2.3 Pengujian
Pada tahap pengujian ini peneliti akan melakukan pengujian dengan alpha
dan beta testing. Pengujian yang pertama dilakukan dengan alpha testing yang
terdiri dari:
1. Pengujian aplikasi secara mandiri pada komputer pribadi
2. Pengujian aplikasi pada 4 PC yang berbeda dan
3. Pengujian aplikasi dari sisi pembelajaran teknik konvolusi
Sedangkan pada beta testing aplikasi akan diuji berdasarkan:
1. Running program dari sisi end user (mahasiswa)
2. Pengujian dari sisi pembelajaran teknik konvolusi dan
3. Kesesuaian dengan syarat interaktif multimedia
Tahap pengujian dilakukan untuk memeriksa dan memastikan bahwa
program yang dibuat sudah benar-benar sesuai dengan tujuan penelitian dan
sesuai dengan keperluan end user tersebut.
3.2.4 Pengiriman
Aplikasi yang telah jadi nantinya akan dikemas dalam bentuk CD
interaktif pembelajaran dan akan didistribusikan kepada pengguna akhir.
87
BAB IV
PEMBAHASAN
Dalam bab ini, akan dijelaskan proses pembuatan aplikasi mulai dari
analisis awal penelitian hingga tahap pembuatan aplikasi multimedia.
4.1 Profil Program Studi Teknik Informatika
Sejarah Fakultas Sains dan Teknologi (FST) tidak bisa dilepaskan dari
sejarah Universitas Islam Negeri (UIN) Syarif Hidayatullah Jakarta secara
keseluruhan. Perjalanan sejarah UIN Jakarta merupakan cermin dari perjuangan
umat Islam Indonesia yang tak kenal lelah untuk memiliki sebuah lembaga
pendidikan tinggi yang mampu menghasilkan intelektual yang profesional dan
bermoral, dimulai dari berdirinya Akademi Dinas llmu Agama (ADIA) pada
tanggal 1 Juni 1957 sampai periode I960, sebagai fakultas dari IAIN Al-Jami'ah
yang berpusat di Yogyakarta (1960-1963) dan sebagai IAIN Syarif Hidayatullah
Jakarta dari tahun 1963 sampai resmi menjadi UIN Syarif Hidayatullah Jakarta
sesuai dengan Keputusan Presiden RI Nomor 31 Tahun 2002, 20 Mei 2002.
Sebelum dibentuk FST, IAIN Syarif Hidayatullah Jakarta sejak tahun
ajaran 2000/ 2001 membentuk Program Konversi UIN yang menyelenggarakan
Program Studi Agribisnis, Teknik Informatika dan Ekonomi. Pada tahun 2002,
berdasarkan Keputusan Presiden RI No. 31 Tahun 2002 tentang Perubahan IAIN
Syarif Hidayatullah Jakarta menjadi UIN Syarif Hidayatullah Jakarta dan program
studi sebagaimana tersebut diatas berubah menjadi Fakultas Sains dan Teknologi
(FST) dan Fakultas Ekonomi dan Ilmu Sosial (FEIS). FST terdiri dari program
88
studi Sosial Ekonomi Pertanian/ Agribisnis, Teknik Informatika dan Sistem
Informasi, Matematika, Fisika, Kimia, dan Biologi.
4.2 Visi, Misi dan Tujuan Pendidikan
4.2.1 Visi
Menjadi Program Studi Teknik Informatika yang terkemuka, baik secara
nasional, regional, maupun internasional yang mengintegrasikan kaidah-kaidah
keilmuan, norma-norma dan etika ke-Islaman, serta ke-Indonesiaan. (UIN,
Pedoman Akademik UIN Jakarta, 2008: 263)
4.2.2 Misi
Sesuai visi yang sudah disebutkan, maka misi Program Studi Teknik
Informatika ialah sebagai berikut:
a. Menyelenggarakan pendidikan di bidang Teknik informatika untuk
menghasilkan lulusan yang profesional dan memiliki nilai kompetitif
dengan tetap memperhatikan perkembangan dunia teknologi dan informasi
yang terus berkembang pesat dengan memadukan pemahaman teori dan
aplikasi informasi serta pemahaman ilmu agama yang relevan bagi
pengembangan teknik informatika secara berkelanjutan.
b. Menyelenggarakan proses pendidikan yang mengintegrasikan nilai-nilai
moral dan pengembangan teknik informatika serta memberikan
pencerahan dalam keyakinan Islami.
c. Menyelenggarakan penelitian dan pengembangan di bidang teknik
informatika.
89
d. Memberikan kontribusi yang signifikan terhadap kualitas hidup
masyarakat. (UIN, Pedoman Akademik UIN Jakarta, 2008: 263)
4.2.3 Tujuan Pendidikan
Sesuai visi dan misinya, maka FST-UFN bertujuan untuk menghasilkan lulusan
yang memiliki kompetensi dalam bidang keilmuan masing-masing, memiliki
kemampuan ilmu-ilmu Islam, serta memiliki kepribadian Islam. Secara lebih
spesifik, tujuan FST-UIN ialah:
1. Menghilangkan sekat-sekat dikotomi keilmuan, dengan menjadikan akidah
Islam sebagai sudut pandang dalam pengembangan sains dan teknologi
2. Menghasilkan lulusan yang mampu menjadikan Islam sebagai landasan
berfikir, bersikap dan bertindak
3. Menghasilkan lulusan yang actortive di bidang masing, sehingga memiliki
kemampuan bersaing, baik di tingkat nasional maupun internasional
4. Menghasilkan lulusan yang memiliki kepekaan dan tanggungjawab moral
untuk melakukan pengabdian terhadap masyarakat
5. Menghasilkan teknologi tepat guna yang bertolak dari resource base
masyarakat acto yang memiliki implikasi bagi pengembangan masyarakat.
90
Gambar 4.1 Struktur Organisasi FST
(Fakultas Sains dan Teknologi UIN Jakarta, 2006: 117)
Gambar 4.2 Gedung Fakultas Sains dan Teknologi
91
4.3 Kurikulum Program Studi TI UIN Syarif Hidayatullah Jakarta
Untuk mencapai tujuan, kompetensi dan agar mencapai prospek lulusan
yang disebutkan, maka Program Studi Teknik Informatika selalu mengikuti
perkembangan ilmu informatika serta melakukan penyempuranaan kurikulum.
Kurikulum terakhir yang dipakai ialah kurikulum tahun 2005 yang diterapkan
bagi mahasiswa angkatan 2005/ 2006. (UIN, Panduan Akademik TI UIN Jakarta,
2009: 264)
Pada kurikulum tahun 2006, bidang peminatan mata kuliah mulai
diintensifkan. Untuk Program Studi Teknik Informatika sendiri terdapat tiga
bidang peminatan yang ditawarkan yaitu peminatan Software Engineering,
peminatan Networking dan peminatan multimedia. Ketiga bidang peminatan ini
mempunyai rangkaian mata kuliah yang telah disusun secara sistematis sehingga
mahasiswa lebih terkonsentrasi dan dapat memilih mata kuliah dan bidang
peminatan mana yang sesuai.
Seperti telah dijelaskan sebelumnya, multimedia merupakan salah satu
bidang peminatan yang ditawarkan oleh Program Studi Teknik Informatika yang
dimulai pada semester lima perkuliahan. Konsentrasi mata kuliah multimedia
salah satunya adalah mata kuliah pengolahan citra yang ditawarkan pada semester
5 perkuliahan baik pada kelas reguler maupun non-reguler.
92
4.4 Analisa Awal
Sebelum masuk ke tahap konsep dan perancangan, peneliti terlebih dahulu
melakukan analisa awal yaitu dengan studi lapangan dengan cara observasi,
wawancara dan kuesioner.
4.4.1 Observasi
Berdasarkan hasil pengamatan dengan observasi yang peneliti lakukan di
kelas perkuliahan semester lima mata kuliah pengolahan citra, peneliti
menyimpulkan bahwa perkuliahan yang berjalan masih didominasi oleh materi
yang disampaikan oleh dosen dengan menggunakan alat bantu atau media seperti
buku, fotokopi materi, laptop dan LCD Projector ketika perkuliahan berlangsung.
4.4.2 Wawancara
Wawancara yang peneliti lakukan adalah dengan membuat daftar
pertanyaan wawancara dengan narasumber yaitu dosen mata kuliah pengolahan
citra yaitu Ibu Qurrotul Aini, MT dan satu dosen praktek multimedia di luar mata
kuliah pengolahan citra yaitu Bapak M.Yusuf, S Kom.
4.4.3 Kuesioner
Peneliti menggunakan kuesioner sebagai data primer baik sebagai
identifikasi awal maupun sebagai sumber kebijakan untuk menetapkan perpaduan
objek apa saja yang harus ada atau tidak ada pada aplikasi yang akan dibuat.
Dari hasil studi lapangan yang telah peneliti lakukan dengan observasi,
studi pustaka dan penelitian sejenis, wawancara serta penyebaran kuesioner awal
penelitian, dapat disimpulkan analisa awal terhadap permasalahan yang ada yaitu,
media buku dan materi tercetak serta pemanfaatan media elektronik yang
93
mahasiswa gunakan masih mendominasi kegiatan perkuliahan, sehingga
diperlukan media atau alat bantu yang lain untuk membantu proses penyampaian
materi kuliah teknik konvolusi.
4.4.4 Studi Pustaka
Studi pustaka yang peneliti lakukan adalah dengan memperbanyak
referensi buku multimedia, baik yang bersifat teoritis dalam bentuk buku maupun
dalam bentuk e-book dan jurnal elektronik yang peneliti dapatkan melalui media
internet serta buku-buku teknis yang berkaitan dengan pembuatan aplikasi. Selain
itu peneliti juga memperbanyak referensi buku konsep metode ilmiah untuk
menunjang penulisan dan pelaksanaan penelitian.
4.4.5 Studi Penelitian Sejenis
Dari hasil analisa terhadap penelitian sejenis yang berhubungan, peneliti
mengambil dua poin pengembangan untuk membuat aplikasi pembelajaran materi
pengolahan citra dengan menggunakan teknik konvolusi berbasis multimedia ini
yaitu, mengembangkan metode yang digunakan dari yang sebelumnya
menggunakan metode CAI menjadi menggunakan metode pengembangan aplikasi
multimedia menurut Vaughan (2004) yang terdiri dari 4 tahap pengembangan.
Kedua adalah mengembangkan dengan menambah halaman modul quiz
dari yang sebelumnya materi soal belum dapat diubah isi materinya menjadi dapat
diubah atau diedit sesuai dengan kebutuhan.
94
A. Analisis Kuesioner Awal
Penyebaran kuesioner dimaksudkan untuk mengetahui objek-objek apa
saja yang diperlukan mahasiswa yang harus ada pada aplikasi multimedia yang
akan dibuat. Kuesioner disebarkan kepada 46 mahasiswa Program Studi Tenik
Informatika baik program regular maupun non regular khususnya yang sedang
mengikuti atau telah mengikuti mata kuliah pengolahan citra.
Kuesioner terdiri dari 2 bagian yaitu: 15 pernyataan yang bernilai Sangat
Setuju, Setuju, Tidak Setuju dan Sangat Tidak Setuju. Kemudian pertanyaan yang
bernilai jawaban Ya dan Tidak.
Bagian I – Pernyataan
Pada bagian ini mahasiswa memiliki hak untuk menjawab pernyataan yang
berisi situasi dan kondisi yang dialami mahasiswa jika diberikan sebuah
aplikasi multimedia pembelajaran. Pernyataan ini dimaksudkan sebagai
identifikasi atau gambaran awal dalam pembuatan aplikasi nantinya.
Bagian II – Pertanyaan
Bagian ini berisi pertanyaan-pertanyaan yang ditujukan untuk mengetahui
seberapa jauh tingkat pemahaman mahasiswa dan juga tingkat retensi atau
daya ingat terhadap teknik konvolusi pada materi pengolahan citra yang
pernah diajarkan.
Contoh pernyataan di bawah ini adalah dua pernyataan dari 15 pernyataan
yang diajukan kepada mahasiswa yaitu:
1. Saat ini teknologi & media belajar mempunyai peran penting dalam
membantu proses pembelajaran di perkuliahan.
95
Pernyataan ini diajukan untuk mengetahui seberapa penting hubungannya
antara teknologi dan media belajar.
Tabel 4.1 Hasil Perhitungan Pernyataan 1
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
1
Sangat Setuju 30 65.22% Setuju 16 34.78% Tidak Setuju 0 0.00% Sangat Tidak Setuju 0 0.00%
Hubungan Media & Pembelajaran
Sangat Setuju 65.22%
Sangat Tidak Setuju0.00%
Tidak Setuju,0.00%
Setuju,34.78%
1
23
4
Gambar 4.3 Grafik Hubungan Media & Pembelajaran
Dari Tabel 4.1 dan grafik Gambar 4.3 dapat dilihat sebanyak 30
mahasiswa yang menyatakan Sangat Setuju terhadap pentingnya
penggunaan teknologi dan media belajar dalam membantu proses
pembelajaran di perkuliahan. Sedangkan sebanyak 16 mahasiswa atau
sekitar 34,78 % menyatakan Setuju.
2. Media penyampaian materi kuliah pengolahan citra di dalam kelas dirasa
atau dilihat sudah efektif.
96
Tabel 4.2 Hasil Perhitungan Pernyataan 2
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
2
Sangat Setuju 1 2.17% Setuju 22 47.83% Tidak Setuju 23 50.00% Sangat Tidak Setuju 0 0.00%
Efektifitas Media Dalam Kelas Perkuliahan
Setuju 47.83%
Tidak Setuju 50.00%
Sangat Setuju2.17%
Sangat Tidak Setuju 0.00%
1 2 3 4
Gambar 4.4 Grafik Efektifitas Media dalam Kelas Perkuliahan
Dari gafik Gambar 4.4 dan Tabel 4.2 dapat dilihat bahwa sebanyak 23
mahasiswa (50%) menyatakan Tidak Setuju terhadap efektifitas media
penyampaian materi kuliah yang dirasa atau dilihat sudah efektif,
sedangkan sebanyak 47,83% atau sebanyak 22 mahasiswa menyatakan
Setuju jika media penyampaian materi kuliah itu sudah efektif dan hanya
sebagian kecil mahasiswa yang menyatakan Sangat Setuju terhadap
efektifitas media saat ini yang telah berjalan dalam kelas perkuliahan.
Dan di bawah ini juga terdapat 2 dari sepuluh pertanyaan yang diajukan
kepada mahasiswa yaitu:
1. Apakah Anda mengetahui tentang materi pengolahan citra khususnya
tentang teori konvolusi?
97
Dimulai dengan pertanyaan awal yang bertujuan untuk mengetahui
seberapa jauh mahasiswa mampu mengingat materi teknik konvolusi yang
telah diajarkan. Selengkapnya dapat dilihat pada Lampiran 2.
Tabel 4.3 Pertanyaan 1
Pertanyaan Jawaban Responden
Jumlah Penjawab (orang)
Persentase (%)
1 Ya 33 71.74% Tidak 13 28.26%
Persentase Pertanyaan 1
Ya71.74%
Tidak28.26%
1
2
Gambar 4.5 Grafik Persentase Pertanyaan 1
Dari hasil perhitungan Tabel 4.3 dan persentase grafik pada Gambar 4.5
terlihat bahwa sebanyak 33 dari 46 mahasiswa atau sebesar 71,74%
menjawab mengetahui teknik konvolusi pada materi pengolahan citra,
sedangkan sebesar 28,26% menyatakan tidak tahu.
2. Menurut Anda apakah perhitungan matematis dalam teknik konvolusi sulit
untuk dipahami?
Tabel 4.4 Pertanyaan 2
Pertanyaan Jawaban Responden
Jumlah Penjawab (orang)
Persentase (%)
2 Ya 30 65.22% Tidak 16 34.78%
98
Gambar 4.6 Grafik Persentase Pertanyaan 2
Hasil persentase nilai grafik pada Gambar 4.6 terhadap pertanyaan kedua
menunjukkan bahwa sebanyak 30 responden atau 65,22% menjawab sulit
untuk memahami perhitungan matematis pada teknik konvolusi.
Sedangkan 34,78% responden sisanya menjawab tidak sulit untuk
memahami materi tersebut.
Dari hasil penelitian dengan penyebaran kuesioner awal, peneliti dapat
menyimpulkan analisa yaitu:
1. Kemampuan penggunaan teknologi multimedia berperan penting dalam
kegiatan perkuliahan bagi mahasiswa Teknik Informatika.
2. Penyampaian secara lisan/ verbal yang digunakan dosen belum cukup
efektif untuk membentuk pemahaman mahasiswa ketika dosen
menerangkan atau mengulas kembali materi kuliah pengolahan citra.
3. Media lisan/ verbal yang dosen gunakan memang bagi sebagian besar
mahasiswa dapat dipahami pada saat mata kuliah berlangsung, tetapi tidak
semua mahasiswa dapat mengingat ataupun memahami kembali materi
yang disampaikan khususnya yang bersifat perhitungan matematis.
99
4. Buku sebagai media tercetak masih perlu digunakan dalam kegiatan
perkuliahan, tetapi lebih dari 50% mahasiswa menyatakan masih ada yang
belum memahami materi pengolahan citra jika hanya dengan membaca
saja.
5. Teknik konvolusi perlu untuk dianimasikan untuk membantu memberikan
ilustrasi kepada mahasiswa mengenai teknik konvolusi pada materi
pengolahan citra tersebut.
4.5 Metode Pengembangan Aplikasi Multmedia
Metode pengembangan aplikasi multimedia menurut Vaughan (2004)
dilakukan dengan 4 tahap dasar, berikut adalah tahapan multimedia yang
dilakukan.
4.5.1 Perencanaan dan Pembiayaan
Pada tahap pertama pengembangan aplikasi multimedia ini peneliti
melakukan perencanaan terlebih dahulu yaitu dengan mendefinisikan tujuan,
konsep dari aplikasi, end user yang menggunakan serta macam aplikasi. Selain itu
proses pengumpulan dan pembuatan serta pemilihan objek multimedia juga
dilakukan guna mendukung kemampuan Aplikasi Pembelajaran Materi
Pengolahan Citra dengan Menggunakan Teknik Konvolusi ini.
A. Perencanaan awal
Pada tahap ini peneliti membuat 12 perencanaan awal sebagai acuan utama
yang akan dilakukan pada tahapan desain dan produksi selanjutnya.
100
Tabel 4.5 Tahap Perencanaan Awal
Perencanaan Keterangan
Judul
Pembuatan Aplikasi Pembelajaran Materi Pengolahan Citra dengan Menggunakan Teknik Konvolusi Berbasis Multimedia
Pengguna Akhir Dosen dan Mahasiswa
Macam Aplikasi Media Pembelajaran Interaktif Perkuliahan
Tujuan Aplikasi Informasi dan Pendidikan
Keinginan pengguna akhir
Adanya ilustrasi animasi pada operasi kernel
konvolusi (Smoothing, Sharpening dan Laplacian)
Pemilihan elemen multimedia untuk mengirimkan pesan
Teks : Menggunakan jenis font Trebuchet MS,
Arial dan Times New Roman yang berfungsi
untuk menjelaskan materi maupun sebagai
panduan untuk menjelaskan aplikasi.
Gambar : Menggunakan file berformat .png,
.jpeg, dan .bmp baik gambar yang berasal dari
internet maupun gambar hasil kreasi yang dibuat
sendiri menggunakan Adobe Photoshop CS 2 dan
Macromedia Freehand MX.
Animasi : Animasi intro, teks dan gambar serta
ilustrasi kernel konvolusi yang peneliti buat
seluruhnya menggunakan Macromedia Flash
Professional 8.
Audio : Menggunakan Sound Effect dan musik
yang didapat dari koleksi pribadi peneliti dan juga
internet dengan format .wav dan .mp3 untuk
menambah kesan hidup pada animasi khususnya
dan aplikasi secara umum.
Video : Menggunakan file berformat .avi dan
101
.mpeg yang dibuat menggunkan Ulead Video
Studio 10 dan Camtasia Studio 7.
Authoring tools yang digunakan
Macromedia Flash Pro 8, Photoshop CS 2, Matlab
Simulink 2009, Camtasia Studio 7, Ulead Video
Studio10 dan Cool Edit Pro
Interaktifitas Tersedia menu dan tombol navigasi serta ilustrasi
dalam bentuk animasi yang dapat diuji coba oleh
user.
Kemampuan teknis peneliti
Dapat menggunakan software multimedia dan grafis
khususnya Macromedia Flash (adobe flash saat ini)
Waktu pembuatan 5 bulan
Kemasan akhir CD interaktif pembelajaran.
Maintenance Dapat diperbarui/ dikembangkan dengan menambah
materi pembahasan Pengolahan Citra selanjutnya.
B. Pengumpulan Bahan (Material)
Material Collecting pada pembuatan aplikasi ini meliputi pengumpulan
data teks yang kemudian dijadikan file-file teks, file audio yang didapatkan dari
koleksi pribadi maupun di unduh melalui internet, file gambar yang sebagian
besar peneliti buat sendiri dan didapatkan melalui media internet, file video yang
juga peneliti buat dengan file gambar dan video yang sebagian besar file tersebut
peneliti unduh melalui internet, dan animasi tombol-tombol navigasi dibuat
sendiri oleh peneliti. Tabel pengumpulan bahan dapat dilihat pada lampiran 6.
Teks
Sebagian besar file teks yang digunakan sebagai sumber materi
pembelajaran teknik konvolusi peneliti ambil dari 2 buku wajib dan tambahan
102
materi kuliah pengolahan citra yaitu ”Pengolahan Citra Digital Dengan
Pendekatan Algoritmik, Rinaldi Munir: 2004” dan ”Pengolahan Citra Digital
Menggunakan Matlab Image Processing Toolbox, Marvin Ch. Wijaya & Agus
Prijono: 2007)”.
Gambar 4.7 Buku Referensi Materi Pengolahan Citra
Gambar
Material gambar untuk merancang aplikasi ini peneliti buat dengan
menggunakan software Adobe Photoshop CS 2 sebagai pengolah grafisnya dan
Macromedia Freehand MX sebagai pengolah gambar yang berbasis vektor. File-
file image, brush serta penggunaan custom shape tools yang peneliti dapatkan dari
buku desain grafis dengan photoshop.
Gambar 4.8 Pembuatan Layout Utama dan Pemberian Efek pada Gambar
103
Gambar 4.9 Pemilihan Tipe Brush Tool
Selanjutnya adalah pembuatan header image yang akan ditempatkan
sebagai judul aplikasi. Header dibuat dengan font courier dengan size: 17.2 pt dan
font impact dengan size masing-masing: 30.96 pt, 45.96 pt dan 46.96 pt, seperti
ditunjukkan oleh Gambar 4.10.
Gambar 4.10 Pembuatan Header Layar Aplikasi
Material gambar juga tak hanya peneliti buat untuk merancang layout saja
tetapi juga untuk membuat tombol-tombol navigasi yang digunakan untuk aplikasi
nantinya. Hasil akhir dari pembuatan tombol-tombol ini disimpan kedalam format
file *.png, seperti yang ditunjukkan oleh Gambar 4.11.
104
Gambar 4.11 Pembuatan Tombol-tombol Navigasi
Animasi
Perancangan utama dari aplikasi ini adalah menggabungkan elemen-
elemen yang telah dibuat sebelumnya yaitu elemen gambar, teks, audio dan video
ke dalam bentuk file animasi. Untuk menggabungkan elemen-elemen tersebut
peneliti menggunakan software Macromedia Flash Professional 8 sebagai
authoring tool untuk mengolah pembuatan aplikasi ini.
Gambar 4.12 Pembuatan Animasi dengan Macromedia Flash Professional 8
Animasi teknik konvolusi juga dibuat dengan Flash 8 dan Freehand MX
untuk membuat gambar vektornya, selanjutnya diolah menjadi animasi
perhitungan teknik konvolusi.
105
Selain animasi teknik konvolusi yang dibuat, peneliti juga membuat
animasi pada sub menu olah citra dengan teknik konvolusi. Actionscript 2.0 pada
Flash 8 peneliti manfaatkan untuk membuat animasi.
Audio
Untuk membuat aplikasi menjadi lebih hidup, file audio peneliti buat
dengan memanfaatkan software Cool Edit Pro 2.1 sebagai authoring tool
pengolahan suara, file-file audio yang dibuat selanjutnya disimpan dengan format
*.wav.
Selain itu untuk menambah unsur dramatis dari suatu aplikasi, peneliti
memberikan file audio yang tentunya disesuaikan dengan tujuan aplikasi
pembelajaran. File-file yang digunakan adalah file berformat .mp3 dan .wav yang
merupakan koleksi pribadi peneliti.
Gambar 4.13 Pengolahan Efek Suara atau Audio
Video
Elemen video yang dibuat diletakkan berdampingan dengan teori atau
elemen teks, hal ini dimaksudkan untuk menambah pemahaman mahasiswa
106
tentang materi dan teknik konvolusi. Pada tahap pembuatannya peneliti
menggunakan software Camtasia Studio 7 dan Ulead Video Studio 10. (Gambar
4.14 dan Gambar 4.15)
Gambar 4.14 Pembuatan Video Tutorial
Gambar 4.15 Pembuatan Video dengan Ulead Video Studio 10
C. Pembiayaan
Tabel 4.6 di bawah ini adalah rincian biaya-biaya yang dikeluarkan dari
pembuatan aplikasi Pembelajran Materi Pengolahan Citra dengan Menggunakan
Teknik Konvolusi Berbasis Multimedia.
107
Tabel 4.6 Pembiayaan
Jenis biaya Jumlah
a. Biaya pengembangan penelitian Analisis penelitian Rp. 200.000
b. Biaya produksi Pembuatan isi (content) Produksi grafis Produksi audio Produksi video
Rp. 125.000 Rp. 300.000 Rp. 200.000 Rp. 275.000
c. Biaya pengujian Rp. 200.000
d. Biaya distribusi/ pengiriman Rp. 350.000
e. Biaya maintenance Rp. 150.000
Total Biaya Rp. 1.800.000
4.5.2 Desain dan Produksi
1.. Design
Tahap desain dan produksi ini terdiri dari 5 desain perancangan awal
sebelum aplikasi masuk ke tahap produksi yaitu:
A. Design storyboard
B. Design bagan alir (flowchart view)
C. Design struktur navigasi
D. Perancangan diagram transisi (state transition diagram)
E. Perancangan antar muka (user interface)
108
A. Design Storyboard
Secara keseluruhan desain storyboard aplikasi ini terbagi menjadi 2 modul
utama yaitu intro dan main. Peneliti menggunakan sketsa desain storyboard untuk
penelitian ini berdasarkan referensi menurut Suyanto (2003: 375).
Pada desain storyboard modul intro, sketsa yang dirancang yaitu untuk
menggambarkan halaman awal pembuka dari aplikasi yang dibuat. Sedangkan
pada modul main sketsa yang dirancang berisi empat sub menu lain yaitu home,
petunjuk, profile dan exit. Berikut adalah rancangan storyboard yang peneliti buat.
109
1. Halaman Intro
Storyboard
Modul : 1
Halaman : Intro
Nama File : intro.swf
Animasi : intro.swf
Audio : love generation-bob sinclair.wav
Navigasi : tombol “skip” untuk langsung menuju ke halaman
menu utama
Catatan : Halaman intro merupakan halaman awal saat aplikasi
dijalankan berisi animasi teks judul aplikasi, audio, dan
gambar disertai pesan teks pembelajaran. Saat intro
berjalan uncul tombol skip di layar yang berfungsi sebagai
navigasi untuk langsung menuju halaman main stage
“pilih menu”, jika tombol skip tidak di klik maka animasi
intro akan terus dimainkan (looping) berulang sampai
tombol skip tersebut diklik.
110
2. Halaman Main
Storyboard
Modul : 2
Halaman : Main
Nama File : pilih menu.swf
Animasi : pilih menu.swf
Audio : sound2.wav
Navigasi : Terdapat 4 tombol navigasi yaitu Tombol “main menu”,
“petunjuk”, “profile” dan “exit”.
Catatan : Pada halaman “pilih menu” user dapat memilih halaman yang
ingin dijalankan. Tombol “main menu” untuk menuju ke menu
utama, tombol “petunjuk” untuk masuk ke halaman petunjuk
penggunaan aplikasi, tombol “profile” untuk masuk ke halaman
profile peneliti dan tombol “exit” untuk keluar dari aplikasi.
111
3. Halaman Home
Storyboard
Modul : 3
Halaman : Home
Nama File : pilih isi menu utama.swf
Animasi : pilih isi menu utama.swf
Audio : sound3.wav
Navigasi : Terdapat 3 tombol navigasi yaitu Tombol “kuliah”, “teknik
konvolusi”, dan “quiz”.
Catatan : Pada halaman “pilih isi menu utama” user diberi pilihan untuk
dapat melihat materi awal pengantar pengolahan citra dengan
melakukan interaksi dengan tombol “kuliah”. Selain itu user juga
dapat memilih tombol “teknik konvolusi” untuk belajar tentang
materi perhitungan teknik konvolusi itu sendiri. Dan terakhir
sebagai bahan evaluasi belajar user juga dapat memanfaatkan
fasilitas halaman “quiz” untuk mengetahui sampai sejauh mana
pemahaman materi yang telah diberikan.
112
4. Halaman Kuliah
Storyboard
Modul : 4
Halaman : Kuliah
Nama File : Kuliah.swf
Animasi : animasi gambar & video
Audio : sound4.wav
Navigasi : Terdapat 9 tombol navigasi yaitu:
1.Tombol (sejarah) : Untuk masuk ke dalam teori sejarah
2.Tombol (sekilas) : Untuk masuk ke dalam materi pendahuluan
3.Tombol (operasi & App) : Untuk masuk ke dalam teori operasi & aplikasi
4.Tombol (jenis citra) : Untuk masuk ke teori jenis-jenis citra
5.Tombol (elemen citra) : Untuk masuk ke dalam teori elemen citra
6.Tombol (format citra) : Untuk masuk ke dalam tabel perbandingan format
citra
7.Tombol (home) : Untuk kembali ke “menu utama”
8.Tombol (back) : Untuk kembali ke menu “pilih isi materi”
9.Tombol (sound on/off) : Untuk menghidupkan/ mematikan suara.
Catatan : Pada halaman “kuliah” user diberi pilihan untuk memilih materi
yang disajikan. Selain itu disamping materi yang disajikan juga
diberikan gambaran ilustrasi baik itu animasi gambar maupun
video untuk lebih mempermudah dalam memahami materi dasar
Pengolahan Citra.
113
5. Halaman Konvolusi
Storyboard Modul : 5
Halaman : Konvolusi
Nama File : konvolusi.swf
Animasi : animasi rumus
Audio : sound5.wav
Navigasi : Terdapat 5 tombol navigasi yaitu:
1.Tombol (Filter konvolusi) : Untuk masuk ke dalam menu animasi hitung citra
output
2.Tombol (Olah citra) : Untuk masuk ke dalam animasi rekayasa citra
3.Tombol (Matlab & pengolahan citra): Untuk masuk ke dalam matlab video
4.Tombol (home) : Untuk kembali ke “menu utama”
5.Tombol (back) : Untuk kembali ke menu “pilih isi materi”
Catatan : Pada halaman “konvolusi” user diberi pilihan untuk berinteraksi
dengan perhitungan pada teknik konvolusi. Pada link tombol
“rekayasa citra” user dapat melakukan pengolahan citra dengan filter
sederhana. Pada link tombol “matlab & pengolahan citra” user dapat
melihat video simulasi dengan matlab sebagai tambahan pembelajaran
materi pengolahan citra.
114
6. Halaman Quiz
Storyboard Modul : 6
Halaman : Quiz
Nama File : quiz.swf
Gambar : BG-Quiz1.png, BG-Quiz2.png, BG-Quiz3.png, BG- Quiz4.png,
BG-Quiz5.png.
Audio : sound6.wav
Navigasi : Tombol-tombol soal, tombol “next”, tombol “input nama” dan
tombol “ulangi lagi”.
Catatan : Pada halaman “Quiz” user dapat engevaluasi kemampuan
teoritisnya dengan menjawab soal-soal yang telah dibuat. Soal
bersifat multiple choice dengan pilihan jawaban a,b,c dan d. Ketika
user menjawab salah satu soal contohnya checklist jawaban benar
atau salah akan langsung terlihat sebagai evaluasi soal yang benar
dan yang salah.
115
7. Halaman Petunjuk
Storyboard Modul : 7
Halaman : Petunjuk
Nama File : petunjuk.swf
Gambar : BG petunjuk.png
Animasi : -
Audio : sound7.wav
Navigasi : Tombol pilihan angka 1-7, “tombol back”, tombol “home”, dan
tombol “sound on/ off”.
Catatan : Pada halaman “petunjuk” user bisa memanfaatkan informasi
dengan membaca instruksi penggunaan aplikasi sebelum mulai
dijalankan.
116
8. Halaman Profile
Storyboard Modul : 8
Halaman : Profile
Nama File : profile.swf
Gambar : BG profile.png
Audio : sound7.wav
Navigasi : Tombol “home”, dan tombol “sound on/off”.
Catatan : Pada halaman “profile” user dapat melihat informasi umum
tentang peneliti beserta software yang digunakan untuk membuat
aplikasi. Halaman ini dilengkapi dengan tombol “home” yang
berfungsi untuk kembali ke halaman”pilih menu” dan tombol
“sound on/ off” untuk menghidupkan atau mematikan suara.
117
B. Perancangan Flowchart View
Untuk menggambarkan tahapan instruksi dari aplikasi Pembelajaran
Materi Pengolahan Citra ini, peneliti membaginya kedalam 3 rancangan flowchart
view program yaitu: flowchart layar intro, flowchart halaman menu utama, dan
flowchart halaman pilih isi menu utama, seperti yang ditunjukkan Gambar 4.7.
Gambar 4.16 Flowchart Layar Intro
Keterangan : 1.Halaman Menu Utama (Main)
Flowchart Gambar 4.16 menggambarkan proses ketika aplikasi pertama
kali dijalankan user dapat melihat layar intro yang dimainkan sebagai pembuka
awal dari aplikasi, animasi pada layar intro akan terus dimainkan sampai user
memilih tombol ”skip intro”. Tombol ”skip intro” berfungsi menghubungkan
layar intro menuju ke halaman latar.
118
Gambar 4.17 Flowchart Halaman Menu Utama
Keterangan : 1.Halaman Menu Utama (Main) 2.Halaman Home 3.Halaman Petunjuk 4.Halaman Profile
119
Pada flowchart Gambar 4.17 digambarkan user dapat memilih 4 menu
yang tersedia, jika user memilih salah satu dari keempat menu yang ada maka
user akan masuk ke halaman 1,2,3 dan 4, jika tidak user kembali ke menu latar
dan memilih kembali menu yang diinginkan.
Gambar 4.18 Flowchart Halaman Home
Flowchart Gambar 4.18 menjelaskan user dapat mulai berinteraksi dengan
materi yaitu dengan memilih 3 menu materi pembelajaran yang tersedia, yaitu
menu ”kuliah”, ”konvolusi”, dan ”Quiz”. User dapat berpindah dari satu materi ke
materi lainnya dengan memilih tombol navigasi menu yang tersedia.
120
Gambar 4.19 Flowchart Halaman Petunjuk
Pada flowchart Gambar 4.19 halaman petunjuk ini user dapat melihat
informasi yang diperlukan sebelum menjalankan aplikasi ini. Terdapat 6 halaman
yang masing-masing menjelaskan informasi penggunaan dari aplikasi
pembelajaran multimedia pengolahan citra.
121
Gambar 4.20 Flowchart Halaman Profile
Pada flowchart Gambar 4.20 ini user dapat melihat informasi tentang
profile peneliti berisi biografi singkat dan juga informasi authoring tools software
yang dipakai. Disediakan pula tombol navigasi ”back” untuk kembali ke menu
latar.
Gambar 4.21 Flowchart Halaman Quiz
Flowchart Gambar 4.21 menggambarkan halaman Quiz yang dapat
dipergunakan user untuk melakukan evaluasi hasil belajar materi teknik konvolusi
pada pengolahan citra.
122
C. Perancangan Arsitektur Navigasi
Gambar 4.22 Desain Arsitektur Navigasi
D. Perancangan Diagram Transisi (State Transition Diagram)
Gambar 4.23 Rancangan STD Menu Utama
123
Gambar 4.24 Rancangan STD Menu Home
Gambar 4.25 Rancangan STD Menu Kuliah
124
Gambar 4.26 Rancangan STD Menu Konvolusi
Gambar 4.27 Rancangan STD Menu Quiz
125
Gambar 4.28 Rancangan STD Menu Petunjuk
E. Perancangan Antar Muka (User Interface)
Perancangan user interface dibuat dan disesuaikan dengan kebutuhan
pengguna yang mengacu pada hasil penelitian dengan menggunakan kuesioner
penelitian. Secara rinci design user interface dari aplikasi ini dirancang menjadi 9
bagian yaitu:
1. Rancangan Layar Intro
Dirancang sebagai tampilan pembuka aplikasi sebelum masuk menuju
menu utama dengan konsep seperti sebuah layar televisi hitam putih
disertai dengan animasi teks dan gambar di dalamnya. Dalam layar intro
user diberi kemudahan dengan adanya tombol navigasi ”skip” yang
berfungsi untuk menuju ke layar selanjutnya.
126
Gambar 4.29 Rancangan Layar Intro
2. Rancangan Layar Halaman Menu Utama
Halaman latar ini dirancang sebagai navigasi awal untuk user berinteraksi
dengan aplikasi. Terdapat 4 tombol navigasi yaitu: ”home” untuk menuju
ke halaman menu utama, ”petunjuk” untuk masuk ke halaman petunjuk
penggunaan aplikasi, ”profile” untuk masuk ke halaman profil pembuat
dan tombol ”exit” untuk keluar dari aplikasi.
Gambar 4.30 Rancangan Layar Halaman Menu Utama
127
3. Rancangan Menu Home
Menu home dirancang dengan 3 tombol navigasi utama di dalamnya yaitu:
tombol ”kuliah” yang berisi materi dasar pengolahan citra dan materi yang
berkaitan langsung dengan teknik konvolusi, tombol ”konvolusi” berisi
halaman dimana animasi teknik konvolusi diilustrasikan disertai pula
dengan fitur olah citra dengan filter konvolusi.
Gambar 4.31 Rancangan Menu Home
4. Rancangan Menu Petunjuk
Menu petunjuk dirancang menjadi 4 tombol navigasi halaman yaitu
tombol halaman 1-4 yang disertai dengan penjelasan fungsi dari menu
navigasi yang ada dan kegunaannya di tiap-tiap bagian halaman, sehingga
dapat mempermudah user untuk mengetahui informasi lebih awal.
128
Gambar 4.32 Rancangan Menu Petunjuk
5. Rancangan Menu Kuliah
Rancangan menu kuliah berisi 6 tombol navigasi yang masing-masing
berisi materi terkait dengan pengolahan citra dan teknik konvolusi. Pada
menu ini juga disertakan animasi gambar dan video yang dapat dilihat di
sisi kanan untuk menambah pemahaman materi yang berformat teks.
Gambar 4.33 Rancangan Menu Kuliah
6. Rancangan Menu Konvolusi
Pada menu konvolusi user nantinya diberi interaktivitas untuk memahami
materi konvolusi dan juga adanya fitur olah citra sederhana untuk
129
menunjukkan perbandingan antara perhitungan matematis dengan aplikasi
sebenarnya.
Gambar 4.34 Rancangan Menu Konvolusi
7. Rancangan Menu Quiz
Dibuat sebagai tes evaluasi kemampuan mahasiswa sebagai proses dari
hasil belajar dengan tipe soal pilihan ganda disertai dengan hasil perolehan
nilai dan keterangan.
Gambar 4.35 Rancangan Menu Quiz
130
8. Rancangan Menu Profile
Dibuat sebagai halaman info yang berisi biodata singkat beserta software/
authoring tools yang dipakai untuk membuat aplikasi ini.
Gambar 4.36 Rancangan Menu Profile
9. Rancangan Menu Exit
Menu yang dirancang sebagai akhir dari penggunaan aplikasi yang akan
langsung menutup saat user memilih untuk selesai menggunakan aplikasi.
Gambar 4.37 Rancangan Menu Exit
131
2. Produksi
Setelah semua bahan yang diperlukan terkumpul dan desain konsep telah
ditentukan sebelumnya. Pada tahap ini akan dijelaskan proses pembuatan animasi
pembelajaran teknik konvolusi.
Pertama, aplikasi dibuat dengan spesifikasi layar 1024 x 768 pixel dengan
tampilan fullscreen, nilai frame rate diatur menjadi 25 fps yang merupakan
standar maksimal dari pembuatan sebuah CD-Interaktif. Pada layar intro
dibuat sebuah animasi yang menggambarkan pesan singkat tentang
pembelajaran. Layar intro ini dilengkapi dengan tombol navigasi ‘skip
button’ untuk memudahkan user mencari shortcut menuju menu utama.
Gambar 4.38 Pembuatan Layar Intro
Tahap kedua adalah membuat halaman menu utama yang berisi 4 pililhan
tombol menu yang berisi fungsi dan penjelasan singkat dari masing-masing
halaman.
132
Gambar 4.39 Pembuatan Halaman Menu Utama
Ketiga adalah membuat halaman menu home yang berisi 3 menu pilihan
yaitu kuliah, konvolusi dan quiz.
Gambar 4.40 Pembuatan Halaman Menu Home
Pada menu home yang telah dibuat sebelumnya, dibuat pula isi dari masing-
masing pilihan menu yaitu pada link tombol kuliah dibuat 6 tombol menu
materi lain untuk mengisi materi dari teori seputar pengolahan citra dan
teknik konvolusi. Selain itu disertakan pula elemen video maupun animasi
untuk membantu pemahaman teori.
133
Pada link menu konvolusi halaman dibuat dengan satu tampilan layar dengan
3 link akses animasi teknik konvolusi yaitu: animasi filter konvolusi, simulasi
pengolahan citra dan tutorial matlab dan pengolahan citra. Dengan
menggunakan bantuan actionscript animasi dibuat dengan movie flash
terpisah yang ditempatkan berada satu path dengan modul utamanya,
sehingga pemanggilan dengan fungsi script lebih memperkecil ukuran file
dari flash movie tersebut.
Gambar 4.41 Pembuatan Halaman Isi Menu Kuliah
Menu filter konvolusi dibuat berdasarkan teori dari teknik konvolusi pada
pengolahan citra. Animasi kernel konvolusi yang dibuat merupakan teknik
visual yang menggambarkan perbaikan kualitas suatu citra dengan
mengalikan dan menjumlahkan matriks citra dengan kernel/ filter
konvolusinya.
Gambar 4.43 di bawah ini merupakan salah satu contoh dari filter/ kernel
yang digunakan dalam teknik konvolusi. Contoh adalah kernel smoothing
dimana contoh mask nya berukuran 3x3. Dengan menempatkan kotak kernel
134
pada area citra yang akan dikonvolusi ditunjukkan pada animasi digital image
with kernel overlay, selanjutnya mengalikan setiap elemen matriks cirta
dengan kernel konvolusinya. Contoh perhitungan teknik konvolusinya
ditunjukkan seperti di bawah ini.
1x25 + 1x36 + 1x21 + 1x22 + 1x50 + 1x90 + 1x83 + 1x82 + 1x8 = 417
Nilai 417 menunjukkan representasi warna matrik yang menyusun citra dari
hasil proses konvolusi tadi. Setelah perhitungan dilakukan nilai pixel yang
baru ditempatkan pada kolom store output values sebagai tempat
penyimpanan nilai sementara, kemudian bilangan-bilangan tadi dijumlah
pada kolom sum of product setelah itu tahap terakhir adalah mengisi nilai
output values yang baru yang menggambarkan nilai pixel setelah dilakukan
operasi konvolusi dengan kernel yang digunakan tadi.
Gambar 4.42 Pembuatan Halaman Menu Filter Konvolusi
135
Gambar 4.43 Pembuatan Halaman Menu Olah Citra
Sebelum membuat halaman menu matlab & pengolahan citra terlebih dahulu
dibuat content video yang akan dijadikan sebagai tutorial belajar. Proses
pembuatannya dikerjakan dengan software Camtasia Studio 7 sebagai
software untuk merekam kegiatan di layar komputer dan Matlab Simulink
sebagai software pengolahan citra. Hasil dari pembuatan tutorial dengan
kedua authoring tools tadi disimpan dengan format .avi video dengan ukuran
resolusi layar video yaitu 640 x 480 pixel untuk menyesuaikan dengan
pengaturan pada layar aplikasi. Setelah semua video selesai dibuat,
selanjutnya membuat menu pilihan yang terdiri dari 3 sesi belajar yaitu:
tombol ”lesson 1”, ”lesson 2” dan ”lesson 3”.
136
Gambar 4.44 Pembuatan Content Video
Gambar 4.45 Pembuatan Halaman Menu Matlab & Pengolahan Citra
Halaman olah citra diatas dibuat dengan mengguanakn fasilitas dari
actionscript 2.0 yang dimiliki flash dengan memanfaatkan fungsi script filter
yang ada pada action properties yang dapat dimanipulasi. Secara lengkap
listing program terdapat pada lampiran 7.
Keempat adalah proses pembuatan halaman quiz, halaman quiz ini terdiri dari
3 menu soal yaitu, menu test quiz, latihan dan mid test quiz. Pada menu test
materi soal dibuat dengan script xml sehingga dapat diedit jika diperlukan,
pada menu latihan materi soal dibuat dengan menambahkan informasi hasil
137
pembelajaran dan pada menu mid test materi soal yang ada dibuat secara
random.
Gambar 4.46 Pembuatan Halaman Menu Quiz
Gambar 4.47 Pembuatan Script Soal Quiz dengan XML
Gambar 4.48 Pembuatan Isi Materi Soal Quiz
138
Kelima proses pembuatan halaman petunjuk, halaman ini memeberitahukan
informasi kepada pengguna tentang simbol-simbol navigasi dan informasi
pendukung lainnya yang diperlukan.
Keenam adalah pembuatan halaman profile dan exit, halaman profile dibuat
sebagai informasi singkat tentang profil peneliti. Sedangkan pada halaman
exit dibuat dengan menampilkan 2 tombol navigasi yang dapat dipilih user
nantinya yaitu tombol ”replay” yang berfungsi untuk menjalankan kembali
dan tombol ”end” untuk mengakhiri aplikasi.
Gambar 4.49 Pembuatan Halaman Menu Petunjuk
Gambar 4.50 Pembuatan Halaman Menu Profile
139
Gambar 4.51 Pembuatan Halaman Menu Exit
4.5.3 Pengujian (Testing)
Peneliti pada tahap ini melakukan pengujian dengan alpha testing dan beta
testing. Pengujian dilakukan untuk memastikan apakah aplikasi dapat berjalan
baik pada lingkungan sistem operasi dari user. Berikut adalah tahap pengujian
alpha dan beta testing.
4.5.3.1 Alpha Testing
1. Pengujian Aplikasi Secara Mandiri pada Komputer Pribadi
Berikut adalah spesifikasi komputer yang peneliti gunakan:
Pentium IV 2,66 GHz Keyboard
VGA Card 256 MB Hardisk 80 GB
RAM 736 MB Mouse
CD-RW Speaker Active dan Headset
Monitor 15 inch dengan
resolusi layar 1024 x 768 pixel
140
Gambar 4.52 Pengujian Aplikasi pada PC Desktop
Pengujian awal ini berguna untuk memastikan sebelum aplikasi diuji
kepada mahasiswa (end user). Pada PC desktop yang peneliti gunakan, aplikasi
dapat berjalan dengan baik.
2. Pengujian Aplikasi pada PC Berbeda
Pengujian pada komputer berbeda bertujuan untuk memastikan apakah
aplikasi dapat dijalankan sesuai dengan spesifikasi komputer tersebut dan juga
untuk mengetahui apabila terjadi kesalahan dalam pemrogramannya.
Tabel 4.7 Uji Aplikasi pada PC Berbeda
No. Spesifikasi Komputer
Hasil harapan
Gambar Hasil Keluaran
1. Notebook (Asus) Core 2 Duo T65
2.1 GHz RAM 2 GB Hardisk 320 GB VGA Intel Gma
4500 Windows 7
Ultimate DVD RW Monitor 14 inch
Berjalan dengan baik.
Berjalan dengan baik
141
2. PC Desktop Intel Dual Core
2,8 GHz RAM 2 GB Hardisk 160 GB VGA Geforce Windows XP SP2 Speaker Aktif Monitor 16 inch
(widescreen)
Berjalan dengan baik.
Berjalan dengan baik
3. Netbook (Acer) Intel Atom 1.6
GHz Hardisk 160 GB RAM 1 GB Layar Monitor 10
inch
Berjalan dengan baik.
Berjalan dengan baik
4. PC Desktop Pentium III
Celeron 1.7 GHz RAM 224 MB Windows XP SP 2 Monitor 32 bit Speaker active
Berjalan dengan baik.
Berjalan dengan baik pada animasi. Sedangkan content video berjalan sedikit lambat
Sebagai saran peneliti menganjurkan untuk menggunakan spesifikasi
minimum dari komputer user yaitu minimal Pentium III dengan RAM 256 MB
agar aplikasi dapat berjalan stabil.
3. Pengujian Aplikasi dari Sisi Pembelajaran Teknik Konvolusi
Pengujian dari sisi pembelajaran yang dilakukan ini dilakukan untuk
mengetahui apakah materi dan animasi pada bagian teknik konvolusi yang ada
pada aplikasi dapat berjalan baik.
142
Tabel 4.8 Uji Aplikasi dari Sisi Pembelajaran Teknik Konvolusi
No. Halaman Test Case Gambar Hasil Keluaran 1. Menu
Konvolusi Klik Menu Konvolusi
Menu konvolusi tampil
2. Menu Filter Konvolusi
Klik Menu Filter Konvolusi
Menu Filter Konvolusi tampil
3. Olah Citra Select image, check box drop shadow, distance, blur, angle, check box blur, amount blur, convolution, check box glow, amount glow, distance glow dan outer glow
Fungsi GUI berjalan baik
4. Filter smoothing
Klik tombol hitung dan reset
Animasi kernel smoothing berjalan baik
5. Filter sharpening
Klik tombol hitung dan reset
Animasi kernel sharpening berjalan baik
6. Filter laplacian
Klik tombol hitung dan reset
Animasi kernel laplacian berjalan baik
7. Video Tutorial
Klik menu lesson 1, 2 dan 3, klik play, pause dan stop video
Video tutorial dapat berjalan baik
143
4.5.3.2 Beta Testing
1. Running Program dari Sisi End User (mahasiswa)
Tabel 4.9 Beta Testing oleh End User
No. Nama File Test Case
Hasil Harapan
Hasil Keluaran
Gambar
1. Intro.swf
User Me-klik tombol Skip
Masuk ke Menu utama
Menu utama ditampilkan
2. Pilih menu.swf
User memilih tombol menu Home
Halaman menu home terbuka
Halaman menu home terbuka
3. Pilih isi materi.swf
User memilih tombol menu Kuliah
Halaman menu kuliah terbuka
Halaman menu kuliah terbuka
4. Kuliah.swf
User memilih tombol Sejarah
Halaman menu Sejarah terbuka
Halaman menu Sejarah terbuka
5. Kuliah.swf
User memilih tombol Sekilas
Halaman menu Sekilas terbuka
Halaman menu Sekilas terbuka
6. Kuliah.swf
User memilih tombol Operasi & Aplikasi
Halaman menu Operasi & Aplikasi terbuka
Halaman menu Operasi & Aplikasi terbuka
7. Kuliah.swf
User memilih tombol Jenis Citra
Halaman menu Jenis Citra terbuka
Halaman menu Jenis Citra terbuka
144
8. Kuliah.swf
User memilih tombol Elemen Citra
Halaman menu Elemen Citra terbuka
Halaman menu Elemen Citra terbuka
9. Kuliah.swf
User memilih tombol Gallery Citra
Halaman menu Gallery Citra terbuka
Halaman menu Gallery Citra terbuka
10. Kuliah.swf
User Meng-klik tombol Home pada halaman menu kuliah
Kembali ke halaman Menu utama
Menu utama ditampilkan
11. Kuliah.swf
User Meng-klik tombol Back
Kembali ke halaman Pilih Menu Materi
Menu Materi ditampilkan
12. Kuliah.swf
User Meng-klik tombol Sound On/Off pada halaman menu kuliah
User Me-klik tombol Sound On/Off pada halaman menu kuliah
User Me-klik tombol Sound On/Off pada halaman menu kuliah
13. Pilih menu.swf
User memilih tombol menu Konvolusi
User memilih tombol menu Konvolusi
User memilih tombol menu Konvolusi
14. Menu konvolusi.swf
User Meng-klik tombol menu
User me-klik tombol menu Filter
User me-klik tombol menu Filter Konvolusi
145
Filter Konvolusi
Konvolusi
15. Menu konvolusi.swf
User me-klik tombol menu Olah Citra
User me-klik tombol menu Olah Citra
User me-klik tombol menu Olah Citra
16. Menu konvolusi.swf
User me-klik tombol menu Matlab & Pengolahan Citra
User me-klik tombol menu Matlab & Pengolahan Citra
User me-klik tombol menu Matlab & Pengolahan Citra
17. Filter smoothing
User mengklik tombol hitung
Hitung kernel dengan matriks citra
Nilai pixel output ditampilkan
18. Filter Sharpening
User mengklik tombol hitung
Hitung kernel dengan matriks citra
Nilai pixel output ditampilkan
19. Filter Laplacian
User mengklik tombol hitung
Hitung kernel dengan matriks citra
Nilai pixel output ditampilkan
20. Pilih menu.swf
User memilih tombol menu Petunjuk
User memilih tombol menu Petunjuk
User memilih tombol menu Petunjuk
21. Profile.swf
User memilih tombol menu Profile
User memilih tombol menu Profile
User memilih tombol menu Profile
22. Ending.swf
User memilih tombol menu Exit
User memilih tombol menu Exit
User memilih tombol menu Exit
146
23. Ending.swf
User me-klik tombol Replay
User me-klik tombol Replay
User me-klik tombol Replay
24. Ending.swf
User me-klik tombol End
User me-klik tombol End
User me-klik tombol End
2. Pengujian Aplikasi dari Sisi Pembelajaran Teknik Konvolusi
Tabel 4.10 Beta Testing dari Sisi Pembelajaran Teknik Konvolusi
No. Halaman Test Case Hasil Pengujian 1. Menu
Konvolusi Klik Menu Konvolusi Menu konvolusi tampil
2. Menu Filter Konvolusi
Klik Menu Filter Konvolusi
Menu Filter Konvolusi tampil
3. Olah Citra
Select image, check box drop shadow, distance, blur, angle, check box blur, amount blur, convolution, check box glow, amount glow, distance glow dan outer glow
Fungsi GUI berjalan baik
4. Filter smoothing
Klik tombol hitung dan reset
Animasi kernel smoothing berjalan baik
5. Filter sharpening
Klik tombol hitung dan reset
Animasi kernel sharpening berjalan baik
6. Filter laplacian
Klik tombol hitung dan reset
Animasi kernel laplacian berjalan baik
7. Video Tutorial
Klik menu lesson 1, 2 dan 3, klik play, pause dan stop video
Video tutorial dapat berjalan baik
147
3. Pengujian dengan Kesesuaian Syarat Interaktif Multimedia
Tabel 4.11 Beta Testing dengan Kesesuaian Syarat Interaktif Multimedia
No. Parameter Interaktif Halaman
1. Kemudahan navigasi
Terdapat pada halaman Intro, Menu Home, Menu Kuliah, Menu Konvolusi, Animasi Kernel Smoothing, Sharpening, Laplacian, Menu Quiz, Menu Petunjuk, Profile dan Menu Exit.
2. Kandungan kognisi
Terdapat pada Menu Materi, Ilustrasi Animasi Kernel Smoothing, Sharpening dan Laplacian, Menu Video Tutorial dan Menu Quiz.
3. Nilai pengetahuan dan persentasi informasi
Terdapat pada Menu Home, Menu Filter Konvolusi, Menu Video Tutorial, Menu Quiz dan Petunjuk.
4. Integrasi media Terdapat pada Menu Filter Konvolusi, Menu Video Tutorial dan Menu Quiz.
5. Nilai estetika
Terdapat pada Intro, Menu Home, Menu Kuliah, Menu Konvolusi, Petunjuk, Profile dan Menu Exit.
6. Memberikan pembelajaran yang diinginkan oleh pembelajar
Terdapat pada Menu Konvolusi, Menu Video tutorial, dan Menu Quiz.
Pengujian dengan syarat interaktif yang telah dilakukan berguna untuk
memastikan aplikasi yang dibuat memuat syarat interaktif multimedia.
4.5.3.3 Evaluasi
Setelah semua tahap telah selesai dikerjakan, berikutnya adalah melakukan
tes evaluasi dari aplikasi yang dibuat. Evaluasi dilakukan kepada 10 mahasiswa di
jurusan teknik informatika dan didapat hasil evaluasi sebagai berikut:
148
Tabel 4.12 Kuesioner Evaluasi Penelitian
No. Pertanyaan Ya Tidak
1. Apakah tampilan dari aplikasi media pembelajaran ini menarik?
100% 0%
2. Apakah anda mengalami kesulitan dalam menjalankan aplikasi ini?
10% 90%
3. Apakah tombol navigasi pada aplikasi ini memudahkan anda mempelajari materi teknik konvolusi?
10% 90%
4. Apakah unsur audio, video, teks, animasi dan gambar dalam aplikasi membantu pemahaman anda?
70% 30%
5. Apakah aplikasi ini dapat membantu anda untuk mengerti materi dari teknik konvolusi ?
80% 20%
6. Apakah anda mengerti ilustrasi animasi filter smoothing yang ada pada aplikasi ini?
100% 0%
7. Apakah anda mengerti ilustrasi animasi filter sharpening yang ada pada aplikasi ini?
90% 10%
8. Apakah anda mengerti ilustrasi animasi filter laplacian yang ada pada aplikasi ini?
90% 10%
9. Apakah aplikasi pembelajaran multimedia ini dapat dijadikan sebagai media presentasi dan alat bantu belajar bagi mahasiswa ?
100% 0%
10. Apakah aplikasi media pembelajaran teknik konvolusi ini mudah digunakan (user friendly) ?
100% 0%
Dari hasil perolehan akhir kuesioner penelitian pada Tabel 4.5 terhadap
aplikasi yang telah dibuat dan setelah dilakukan tahap pengujian diperoleh
evaluasi yaitu:
1. 90% mahasiswa menyatakan tidak mengalami kesulitan saat menjalankan
aplikasi.
2. Perlu adanya penambahan elemen multimedia yaitu audio, video dan teks
untuk menambah pemahaman pengguna terhadap aplikasi yang dibuat
sebelum di distribusikan.
3. Ilustrasi animasi kernel smoothing, sharpening dan laplacian pada teknik
konvolusi mudah dimengerti oleh mahasiswa dapat dilihat pada persentase
hasil pertanyaan poin 6, 7 dan 8.
149
4. Kemudahan menggunakan aplikasi ini membuat mahasiswa menyatakan
bahwa media pembelajaran teknik konvolusi yang peneliti buat dikatakan
user friendly dan dapat digunakan sebagai media atau alat bantu belajar
bagi mahasiswa.
4.5.4 Pengiriman
Setelah melewati proses pengujian dan evaluasi, akhir implementasi dari
aplikasi ini dikemas dalam bentuk CD-Interaktif dengan kapasitas 219 MB
dengan resolusi layar 1024 x 768 pixel yang dapat dipergunakan baik oleh dosen
maupun mahasiswa sebagai alat bantu atau media tambahan belajar materi teknik
konvolusi.
Gambar 4.53 Sampul CD Aplikasi
150
BAB V
KESIMPULAN DAN SARAN
5.1 Kesimpulan
Dari hasil penelitian yang telah dilakukan, didapat mendapat kesimpulan
sebagai berikut:
1. Aplikasi Pembelajaran Materi Pengolahan Citra dengan Menggunakan
Teknik Konvolusi Berbasis Multimedia ini dibuat dengan Animasi 2D dan
dibantu dengan actionscript Flash 8 agar terdapat interaktifitas dalam
teknik konvolusi tersebut, yang dapat dijalankan dengan master.exe yang
ada pada CD interaktif hasil aplikasi.
2. Pada pengujian dari sisi pembelajaran terhadap teknik konvolusi diperoleh
adanya peningkatan pemahaman materi teknik konvolusi dari sebelum
adanya aplikasi persentase mahasiswa yang mengerti sebesar 65,22%
ditunjukkan pada Tabel 4.17 Lampiran 4, setelah adanya aplikasi
persentase mahasiswa yang mengerti sebesar 80% ditunjukkan pada Tabel
4.5.
3. Dalam hal kesesuaian dengan syarat interaktif multimedia, aplikasi ini
sudah memenuhi kriteria syarat tersebut ditunjukkan pada Tabel 4.11 Sub
Bab 4.4.3.2.
151
5.2 Saran
Aplikasi pembelajaan teknik konvolusi yang dibuat ini tentulah masih jauh
dari sempurna, oleh karena itu saran bagi peneliti selanjutnya yang ingin
mengembangkan aplikasi sejenis yaitu:
1. Dalam pengembangan kedepannya, aplikasi ini diharapkan dapat
terintegrasi dengan website Fakultas Sains dan Teknologi sehingga
memudahkan mahasiswa dalam menjalankan kegiatan kuliahnya.
2. Menambahkan teknik transformasi fourier pada Aplikasi Pembelajaran
Materi Pengolahan Citra.
152
DAFTAR PUSTAKA
Anderson, H.Ronald. 1987. Pemilihan dan Pengembangan Media untuk Belajar. Jakarta: Rajawali Pers
Arlinda. 2005. Kamus Istilah Komputer dan Internet. Jakarta: Restu Agung
Arsyad, Azhar. 1997. Media Pengajaran. Jakarta: Raja Grafindo Persada
Ayun, M.Qurrota. 2008. Pengembangan Aplikasi Pembelajaran Berbasiskan Teknologi Video On Demand pada Fakultas Sains & Teknologi. UIN Syarif Hidayatullah: Skripsi Tidak Diterbitkan
Daryanto, Tri. 2005. Sistem Multimedia dan Aplikasinya. Yogyakarta: Graha Ilmu
Deporter, Bobbi dan Hernacki, Mike. 2005. Quantum Learning: Membiasakan Belajar Nyaman dan Menyenangkan. Bandung: Kaifa
Deswanti, Merlin. 2008. Perancangan & Implementasi Aplikasi Pembelajaran
B.Inggris: Telling The Time Berbasis Multimedia untuk SD Kelas V. UIN Syarif Hidayatullah: Skripsi Tidak Diterbitkan
HM, Jogiyanto. 2008. Metodologi Penelitian Sistem Informasi: Pedoman dan
Contoh Melakukan Penelitian di Bidang Sistem Informasi. Yogyakarta: Andi offset
Jayan. 2008. Desain Situs Flash untuk Orang Awam. Palembang: Maxikom
Mayer, E.Richard. 2009. Multimedia Learning: Prinsip-prinsip dan Aplikasi. Yogyakarta: ITS Press
Mayer, E.Richard. 2001. Introduction to Multimedia Learning. The Cambridge
Handbook of Multimedia Learning: Cambridge University Press Muliasari, Ratna. 2008. Perancangan Perangkat Ajar Statistika SMP Berbasis
CAI. UIN Syarif Hidayatullah: Skripsi Tidak Diterbitkan Munadi, Yudhi. 2008. Media Pembelajaran: Sebuah Pendekatan Baru. Jakarta:
Gaung Persada Press Munir, Rinaldi. 2004. Pengolahan Citra Digital dengan Pendekatan Algoritmik.
Bandung: Informatika Nazir, M. 2003. Metode Penelitian. Jakarta: Ghalia Indonesia
153
Pressman, R. S. 2002. Rekayasa Perangkat Lunak Pendekatan Praktis. Yogyakarta: Andi Offset
Rahmah, Siti. 2005. Aplikasi Perangkat Ajar Kaligrafi Kaidah Penulisan Khat
Tsuluts Berbasis Multimedia. UIN Syarif Hidayatullah: Skripsi Tidak Diterbitkan
Riberu, Tito. 2004. Referensi dan Tuntunan Perancangan Program ActionScript
Macromedia Flash MX. Jakarta: Dinastindo Sadiman, S.Arif. 1993. Media Pendidikan: Pengertian, Pengembangan, dan
Pemanfaatannya. Jakarta: Raja Grafindo Persada Saputra, Johan. 2010. Photoshop Urban Style. Jakarta: Elex Media Komputindo Semiawan, R.Conny. 2008. Belajar dan Pembelajaran Prasekolah dan Sekolah
Dasar. Jakarta: Indeks Sugiharto, Aris. 2006. Pemrograman GUI dengan MATLAB.Yogyakarta: Andi
Offset Sutopo, A. H. 2003. Multimedia Interaktif dengan Flash. Yogyakarta: Graha Ilmu
Sutoyo, T., et all. 2009. Teori Pengolahan Citra Digital. Yogyakarta: Andi Offset
Suyanto, M. 2003. Multimedia Alat untuk Meningkatkan Keunggulan Bersaing. Yogyakarta: Andi Offset
Vaughan, Tay. 2006. Multimedia Making It Work Edisi 6. Yogyakarta: Andi
Offset Wijaya, Ch.M dan Prijono, Agus. 2007. Pengolahan Citra Digital Menggunakan
Matlab Image Processing Toolbox. Bandung: Informatika Yuliarti, Dewi. 2007. Perancangan Aplikasi Pembelajaran Matematika untuk
Kelas 6 SD Berbasis Multimedia. UIN Syarif Hidayatullah: Skripsi Tidak Diterbitkan
Zeembry. 2004. 123 Tip dan Trik Actionscript Flash MX 2004. Jakarta: Elex
Media Komputindo [1]AlSultan, Sultan. 2006. Developed of A Computer Aided Instruction (CAI)
Package in Remote Sensing Educational. [Online] Tersedia: www.commission7.isprs.org/wg7. [31 Juli 2010]
154
[2]Ena, Ouda Teda. 2001. Membuat Media Pembelajaran Interaktif dengan Piranti Lunak Presentasi. Universitas Sanata Dharma Yogyakarta. [Online] Tersedia: http://www.ialf.edu. [20 September 2010]
[3]Surjono, Dwi Herman. 1996. Pengembangan Program Pengajaran Berbantuan
Komputer (CAI) Dengan Sistem Authoring. [Online] Tersedia: www.commission7.isprs.org/wg7. [31 Juli 2010]
[4]Elektronik_text,http://users.ox.ac.uk/~ctitext2/publish/occas/eurolit/burnage2.
gif, 8 Desember 2009, Pk.9.20 [5]Hypertext,http://www.cs.sfu.ca/CC/365/mark/material/notes/Chap1/hypertext.
gif, 8 Desember 2009, Pk.9.21 [6]Digitized picture, http://pubs.usgs.gov/of/1999/ofr-99-0557/html/magnetic.jpg,
8 Desember 2009, Pk.9.24 [7]Cell animation, http://farm1.static.flickr.com/52/173380481_fcf4a4b1a9_o.jpg,
8 Desember 2009, Pk.9.27 [8] Frameanimation,http://www.wemakemoneynotart.com/master6%5B1%5D.gif,
8 Desember 2009, Pk.9.28 [9] Sprite animation, http://www.envygames.com/share/sample_animation.jpg, 8
Desember 2009, Pk.9.30 [10]Pathanimation,http://www.articulate.com/rapidelearning/wpcontent/uploads/2
008/01/motionpath-thumb.jpg, 8 Desember 2009, Pk.9.31 [11]Characteranimation,http://img144.imageshack.us/i/digitalcharacteranimatiup6
.jp, 8 Desember 2009, Pk.9.33 [12]Computational animation, http://www.cecadsoft.com/fsf20/exe-wa4.gif, 8
Desember 2009, Pk.9.35 [13]Morphinganimation,http://www.reportmill.com/blog/wpcontent/uploads/2007
/07/morphing.jpg, 8 Desember 2009, Pk.9.39 [14]Pengertian Perangkat,ajar,multimedia, http://pusatbahasa.diknas.go.id/kbbi/
index.php, 5 November 2009, Pk.11.57 [15]Hyperpicture, www.kompas.com, 22 Juni 2010, Pk.8.28
[16]Conv2D,http://www.songho.ca/dsp/convolution/convolution.html# convolution_2d, 16 Juni 2010, Pk.11.56
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
1 NUR ULFAH SAM - 105091002847
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS
MULTIMEDIA (Studi Kasus: Program Studi Teknik Informatika Fakultas Sains & Teknologi UIN
Syarif Hidayatullah Jakarta)
Nur Ulfah Sam Mahasiswa Program Studi Teknik Informatika
Fakultas Sains dan Teknologi, Universitas Islam Negeri Syarif Hidayatullah Jakarta Email: [email protected]
Abstrak
Media pembelajaran berbasis multimedia dapat digunakan dalam dunia pendidikan, salah satunya pada kegiatan perkuliahan materi pengolahan citra di Program Studi Teknik Informatika. Dalam silabus mata kuliah pengolahan citra, teknik konvolusi merupakan materi awal yang diajarkan dalam topik kuliah Konvolusi & Transformasi Fourier. Berdasarkan analisis kuesioner awal penelitian diperoleh data sebanyak 65,22% atau 30 dari 46 mahasiswa yang belum mengerti materi teknik konvolusi ini. Teknik Konvolusi merupakan salah satu teknik pada pengolahan citra yang bertujuan untuk memperbaiki kualitas suatu citra atau gambar (Image Enhancement). Metode pengumpulan data yang dilakukan pada penelitian ini yaitu dengan cara studi pustaka dan penelitian sejenis, observasi, wawancara dan kuesioner. Adapun metode pengembangan aplikasi yang digunakan yaitu metode menurut Vaughan (2004) yang terdiri dari 4 tahap yaitu perencanaan dan pembiayaan, disain dan produksi, pengujian dan yang terakhir adalah pengiriman. Dalam pembuatannya aplikasi ini menggunakan software Macromedia Flash Professional 8, Adobe Photoshop CS 2, Matlab Simulink 2009, Ulead Video Studio 10 dan Camtasia Studio 7. Berdasarkan hasil pengujian yang telah dilakukan dan berdasarkan evaluasi hasil penelitian diperoleh peningkatan yaitu sebelum adanya aplikasi jumlah mahasiswa yang mengerti sebesar 65,22%, setelah diberikan aplikasi Pembelajaran Materi Pengolahan Citra dengan Menggunakan Teknik Konvolusi ini persentase jumlah mahasiswa yang mengerti menjadi 80%. Pada akhirnya output yang dihasilkan dari pembuatan aplikasi ini yaitu dalam bentuk CD-Interaktif pembelajaran dengan kapasitas file 219 MB. Untuk pengembangan berikutnya dapat ditambahkan teknik transformasi fourier untuk melanjutkan materi dari teknik konvolusi pada materi pengolahan citra tersebut. Kata Kunci: Multimedia, pembelajaran, Vaughan, konvolusi, citra digital 1. PENDAHULUAN
Latar Belakang Pengolahan citra merupakan salah satu
mata kuliah yang termasuk dalam silabus perkuliahan di Program Studi Teknik Informatika UIN Syarif Hidayatullah Jakarta yang dapat diambil oleh mahasiswa yang duduk di semester lima. Mata kuliah ini merupakan mata kuliah peminatan yang mulai ditawarkan kepada mahasiswa
angkatan 2006 dan seterusnya pada bidang peminatan multimedia.
Berdasarkan silabus mata kuliah pengolahan citra, teknik konvolusi merupakan materi awal dalam topik materi Konvolusi & Transformasi Fourier. Namun sebagai bahasan awal teknik konvolusi ini peneliti pilih karena diperlukan untuk
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
2 NUR ULFAH SAM - 105091002847
memahami landasan awal materi-materi pengolahan citra selanjutnya.
Selama ini proses belajar mata kuliah pengolahan citra di dalam kelas perkuliahan yang dilakukan oleh dosen dengan mahasiswa terlihat masih menggunakan media verbal dan tertulis dalam menyampaikan materi kuliah tersebut, tetapi tidak jarang pula menggunakan media lainnya sebagai alat bantu perkuliahan. Hal ini bisa saja tidak sepenuhnya dapat dipahami oleh seluruh mahasiswa di dalam kelas dikarenakan media penyampaian informasi dalam hal ini alat dan materi perkuliahannya yang mungkin kurang menarik di mata mahasiswa.
Berdasarkan hasil observasi yang telah dilakukan, materi teknik konvolusi mengandung ilustrasi gambar dan perhitungan yang menjelaskan teori dari teknik konvolusi tersebut, dan setelah dilakukan analisa menggunakan kuesioner awal penelitian kepada 46 mahasiswa diperoleh persentase sebesar 65,22% yang menjawab materi teknik konvolusi ini masih sulit untuk dimengerti.
Atas dasar latar belakang itulah, maka peneliti ingin membuat sebuah “APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA” Studi Kasus pada “Program Studi Teknik Informatika Fakultas Sains dan Teknologi UIN Syarif Hidayatullah Jakarta” yang dapat menjadi sebuah aplikasi untuk membantu antara proses penyampaian materi kuliah pengolahan citra yang disampaikan oleh dosen kepada mahasiswa. Perumusan Masalah 1. Bagaimana membuat sebuah aplikasi
pembelajaran materi pengolahan citra, pada operasi filter smoothing, sharpening dan laplacian dalam teknik
konvolusi dengan objek citra grayscale berbasis multimedia ini menjadi media yang interaktif dan dapat digunakan di perkuliahan untuk membantu mahasiswa dan dosen dalam mata kuliah pengolahan citra?
2. Bagaimana teknik konvolusi pada citra grayscale dapat diwujudkan/ diimplementasikan ke dalam bentuk ilustrasi animasi dua dimensi (2D)?
Tujuan Membuat sebuah aplikasi media
pembelajaran dengan menggabungkan elemen multimedia yaitu teks, animasi, video, audio dan gambar.
Membuat penerapan teknik konvolusi dengan ilustrasi animasi dengan dipadukan elemen multimedia di dalamnya. Manfaat 1. Mempermudah dalam menjelaskan
teori konvolusi pada pengolahan citra kepada mahasiswa.
2. Menjadi alat bantu yang dapat mengilustrasikan rumus atau perhitungan matematis secara lebih interaktif.
3. Mempermudah dalam memahami materi yang disampaikan secara audio visual.
4. Dapat menjadi media tambahan belajar dalam proses perkuliahan.
5. Membantu menimbulkan minat belajar mahasiswa untuk mendalami teori pengolahan citra lebih lanjut.
2. LANDASAN TEORI A. Multimedia
Adalah kombinasi dari komputer dan Video (Rosch, 1996) atau Multimedia secara umum merupakan kombinasi tiga elemen, yaitu suara, gambar, dan teks (McCormick, 1996) atau Multimedia adalah kombinasi dari paling sedikit dua media
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
3 NUR ULFAH SAM - 105091002847
input atau output dari data, media ini dapat audio (suara, musik), animasi, video, teks, grafik dan gambar (Turban dkk, 2002)atau Multimedia merupakan alat yang dapat menciptakan presentasi yang dinamis atau interaktif yang mengkombinasikan teks, grafik, animasi, audio, dan gambar video (Robin dan Linda,2001). Definisi yang lain dari Multimedia, yaitu oleh Hosfstetter (2001), Multimedia adalah pemanfaatan komputer untuk membuat dan menggabungkan link dan tool yang memungkinkan pemakai melakukan navigasi, berinteraksi, berekreasi, dan berkomunikasi. B. Pembelajaran Multimedia
Dalam kaitannya dengan pembelajaran, pembelajaran dengan multimedia mencakup tiga proses kognitif penting. (Mayer, 1997: 2)
Pertama, selecting (menyeleksi). Diaplikasikan pada informasi verbal berbasis teks dan juga informasi visual yang menyediakan image/ gambar. Kedua, organizing (mengorganisasikan). Diaplikasikan untuk membuat model berbasis verbal dan model berbasis visual dari menjadi sebuah penjelasan. Ketiga, integrating (mengintegrasikan). Pembelajar membangun hubungan antara corresponding events dalam model berbasis verbal dan model berbasis visual. C. Citra Digital
Citra terbagi dua macam yaitu citra kontinyu dan citra diskrit. Citra kontinyu dihasilkan dari sistem optik yang menerima sinyal analog, misalnya mata manusia dan kamera analog. Citra diskrit dihasilkan melalui proses digitalisasi terhadap citra kontinyu, citra diskrit disebut juga citra digital.
Agar dapat diolah dengan komputer digital, maka suatu citra harus direpresentasikan secara numerik dengan nilai-nilai diskrit. Representasi citra dari
fungsi malar (kontinyu) menjadi nilai-nilai diskrit disebut digitalisasi. Citra yang dihasilkan inilah yang disebut citra digital (digital image). (Munir, 2004: 18) D. Image Enhancement (Perbaikan
Citra) Merupakan salah satu jenis operasi
pada pengolahan citra digital yang bertujuan untuk meningkatkan kualitas tampilan citra untuk pandangan manusia atau untuk mengkonversi suatu citra agar memiliki format yang lebih baik sehingga citra tersebut menjadi lebih mudah diolah dengan mesin (komputer). E. Kernel
Kernel adalah matriks yang pada umumnya berukuran kecil dengan elemen-elemennya adalah berupa bilangan. Kernel digunakan pada proses konvolusi. Oleh karena itu kernel disebut juga dengan convolution window (jendela konvolusi). Ukuran kernel dapat berbeda-beda, seperti 2x2, 3x3, 5x5 dan sebagainya. Kernel biasa juga disebut dengan tapis (filter), template, mask, serta sliding window. (Putra, 2010: 137)
(a) (b)
Gambar 1 Contoh kernel (a)-(b) Berturut-turut kernel berukuran 2x2 dan 3x3 (sel
dengan warna abu-abu menyatakan pusat koordinat {0,0})
F. Konvolusi (Convolution)
Merupakan operator sentral pengolah citra dan telah digunakan secara luas pada berbagai piranti lunak pengolah citra.
Proses konvolusi dapat dijelaskan sebagai berikut. Kernel (sliding window) diletakkan pada setiap pixel dari citra input dan menghasilkan pixel baru. Nilai pixel baru dihitung dengan mengalikan setiap
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
4 NUR ULFAH SAM - 105091002847
nilai pixel tetangga dengan bobot yang berhubungan pada kernel dan kemudian menjumlah hasil perkalian tersebut. Contoh citra input dan kernel ditunjukkan pada (Gambar 2).
U1,1 U1,2 U1,3 U1,4 U1,5 U1,6 U2,1 U2,2 U2,3 U2,4 U2,5 U2,6 U3,1 U3,2 U3,3 U3,4 U3,5 U3,6 U4,1 U4,2 U4,3 U4,4 U4,5 U4,6 U5,1 U5,2 U5,3 U5,4 U5,5 U5,6 U6,1 U6,2 U6,3 U6,4 U6,5 U6,6
(a) K1,1 K1,2 K1,3 K2,1 K2,2 K2,3
(b) Gambar 2 (a) Citra Input (b) Kernel 2x3
Sesuai contoh pada (Gambar 2) maka
nilai pixel sebagai berikut.
)()()()()()(
3,25,52,24,51,23,5
3,15,42,14,41,13,43,4
xKuxKuxKuxKuxKuxKuO
Operator konvolusi biasanya menggunakan tanda (*). Secara matematika proses konvolusi U*K dapat dinyatakan sebagai berikut.
),()1,1(),(1 1
lkKljkiUjiOm
k
n
l
Dengan i = 1...M – m + 1 dan j = 1...N
– n + 1. M dan N menyatakan ukuran baris dan kolom dari citra input, sedangkan m dan n menyatakan ukuran baris dan kolom dari kernel. Ukuran citra hasil proses konvolusi di atas adalah (M – m + 1) baris dan (N – n + 1) kolom, yang berarti ukuran citra hasil proses konvolusi lebih kecil dari ukuran citra awal. Berubahnya ukuran citra hasil ini dapat dijelaskan dengan contoh berikut.
772377426752
44111333123441143311
1001
Dengan menyatakan bukan nilai. Nilai 5 pada konvolusi diatas diperoleh dari:
(1 x 1) + (0 x 3) + (0 x 1) + (1 x 4) = 5 Tanda pada hasil keluaran di atas
dinyatakan sebagai bukan nilai karena untuk melakukan proses konvolusi pada pixel tersebut, sebagian kernel berada di luar batas ukuran citra sementara tidak ada nilai pixel di luar batas ukuran citra. Hal ini dapat dijelaskan karena proses konvolusi di luar batas ukuran citra tetap dilakukan dengan menambahkan sembarang nilai pixel untuk pixel di luar batas yang umumnya digunakan atau ditambahkan nilai 0 (zero padding). Dengan cara tersebut proses konvolusi tetap dapat dilakukan. Namun demikian, nilai pixel hasil konvolusi di luar batas ukuran citra tidak menunjukkan nilai pixel yang sebenarnya. (Putra, 2010: 139)
G. Kernel Konvolusi Smoothing Kernel
Smoothing kernel merupakan kernel yang digunakan untuk menghaluskan sebuah citra, kernel ini berkaitan dengan penapis lolos rendah (low-pass filter). Tapis low-pass bertujuan untuk mempertahankan komponen berfrekuensi rendah (perubahan nilai pixel yang bertahap) dan mengurangi komponen yang berfrekuensi tinggi (perubahan nilai pixel secara mendadak) pada citra.
111111111
91
1313163131
81
(a) (b) Gambar 3 Tapis Low-Pass
Faktor dan pada tapis di atas adalah
untuk menjamin agar nilai pixel baru tidak berada di luar batas nilai grayscale (intensitas). Gambar 3 (a) adalah tapis mean, pembentukan tapisnya menggunakan aturan bobot semua koefisiennya sama.
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
5 NUR ULFAH SAM - 105091002847
Sedangkan pada Gambar 3 (b), pembentukan tapisnya menggunakan aturan nilai bobot pixel pusat sama (hampir sama) dengan jumlah semua bobot nilai pixel tetangga. Sharpening Kernel
Penajaman (sharpening) pada sebuah citra bertujuan untuk mempertajam kualitas sebuah citra. Kernel sharpening itu sendiri juga berkaitan dengan tapis high-pass filter yang merupakan kebalikan dari tapis low-pass yaitu untuk mempertahankan (mempertajam) komponen frekuensi tinggi dan menghilangkan (mengurangi) komponen frekuensi rendah.
111181111
91
010141
010
Gambar 4 Tapis High-Pass 3 x 3
Laplacian Kernel Adalah operator urutan kedua atau
turunan kedua dari metode perbaikan kualitas citra, operator ini sangat baik sekali digunakan untuk menemukan bagian yang detail dari sebuah image.
Gambar 5 Contoh Filter Laplacian
3. METODOLOGI PENELITIAN Pada tahap ini peneliti akan
menggunakan metodologi pengembangan multimedia menurut Vaughan (2004) dalam (Binanto, 2010: 264). Dimana pada prosesnya terdiri dari 4 tahapan dasar dalam suatu proyek multimedia, yaitu:
1. Perencanaan dan Pembiayaan
Pada tahap ini peneliti melakukan proses identifikasi kebutuhan dan tujuan, kemampuan multimedia yang
dibutuhkan. Selain itu, proses perhitungan waktu dan biaya yang dibutuhkan untuk mengerjakan seluruh elemen juga akan dilakukan pada tahap ini.
2. Desain dan Produksi Pada tahap desain dan produksi dari Aplikasi Pembelajaran Materi Pengolahan Citra dengan Menggunakan Teknik Konvolusi ini peneliti melakukan pembuatan desain storyboard, struktur navigasi, desain bagan alir (flowchart view), perancangan diagram transisi (state transition diagram) dan perancangan antar muka (user interface).
3. Pengujian Pada tahap pengujian ini peneliti melakukan pengujian dengan alpha dan beta testing. Pengujian yang pertama dilakukan dengan alpha testing yang terdiri dari: 1. Pengujian aplikasi secara mandiri
pada komputer pribadi 2. Pengujian aplikasi pada 4 PC yang
berbeda dan 3. Pengujian aplikasi dari sisi
pembelajaran teknik konvolusi Sedangkan pada beta testing aplikasi akan diuji berdasarkan: 1. Running program dari sisi end user
(mahasiswa) 2. Pengujian dari sisi pembelajaran
teknik konvolusi dan 3. Kesesuaian dengan syarat interaktif
multimedia. 4. Pengiriman
Aplikasi yang telah jadi dikemas dalam bentuk CD interaktif pembelajaran dan akan didistribusikan kepada pengguna akhir.
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
6 NUR ULFAH SAM - 105091002847
4. HASIL DAN PEMBAHASAN A. Membuat halaman menu home
Halaman menu home yang berisi 3 menu pilihan yaitu kuliah, konvolusi dan quiz.
Gambar 6 Pembuatan Halaman Menu
Home Pada link menu konvolusi halaman
dibuat dengan satu tampilan layar dengan 3 link akses animasi teknik konvolusi yaitu: animasi filter konvolusi, simulasi pengolahan citra dan tutorial matlab dan pengolahan citra. Dengan menggunakan bantuan actionscript animasi dibuat dengan movie flash terpisah yang ditempatkan berada satu path dengan modul utamanya, sehingga pemanggilan dengan fungsi script lebih memperkecil ukuran file dari flash movie tersebut.
Menu filter konvolusi dibuat berdasarkan teori dari teknik konvolusi pada pengolahan citra. Animasi kernel konvolusi yang dibuat merupakan teknik visual yang menggambarkan perbaikan kualitas suatu citra dengan mengalikan dan menjumlahkan matriks citra dengan kernel/ filter konvolusinya.
Gambar 7 ini merupakan salah satu contoh dari filter/ kernel yang digunakan dalam teknik konvolusi. Contoh adalah kernel smoothing dimana contoh mask nya berukuran 3x3. Dengan menempatkan kotak kernel pada area citra yang akan dikonvolusi ditunjukkan pada animasi
digital image with kernel overlay, selanjutnya mengalikan setiap elemen matriks cirta dengan kernel konvolusinya. Contoh perhitungan teknik konvolusinya ditunjukkan seperti berikut ini. 1x25 + 1x36 + 1x21 + 1x22 + 1x50 + 1x90 + 1x83 + 1x82 + 1x8 = 417 Nilai 417 menunjukkan representasi warna matrik yang menyusun citra dari hasil proses konvolusi tadi. Setelah perhitungan dilakukan nilai pixel yang baru ditempatkan pada kolom store output values sebagai tempat penyimpanan nilai sementara, kemudian bilangan-bilangan tadi dijumlah pada kolom sum of product setelah itu tahap terakhir adalah mengisi nilai output values yang baru yang menggambarkan nilai pixel setelah dilakukan operasi konvolusi dengan kernel yang digunakan tadi.
Gambar 7 Pembuatan Halaman Menu
Filter Konvolusi Selanjutnya adalah proses pembuatan
halaman quiz, halaman quiz ini terdiri dari 3 menu soal yaitu, menu test quiz, latihan dan mid test quiz. Pada menu test materi soal dibuat dengan script xml sehingga dapat diedit jika diperlukan. Menu quiz ini diperlukan sebagai bahan evaluasi proses pembelajaran dalam aplikasi.
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
7 NUR ULFAH SAM - 105091002847
Gambar 8 Pembuatan Halaman Menu
Quiz
Gambar 9 Pembuatan Script Soal Quiz
dengan XML
Gambar 4.48 Pembuatan Isi Materi Soal
Quiz
Dari hasil perolehan akhir kuesioner penelitian pada Tabel 4.5 terhadap aplikasi yang telah dibuat dan setelah dilakukan tahap pengujian diperoleh evaluasi yaitu: 1. 90% mahasiswa menyatakan tidak
mengalami kesulitan saat menjalankan aplikasi.
2. Ilustrasi animasi kernel smoothing, sharpening dan laplacian pada teknik konvolusi mudah dimengerti oleh mahasiswa.
3. Kemudahan menggunakan aplikasi ini membuat mahasiswa menyatakan bahwa media pembelajaran teknik konvolusi yang peneliti buat dikatakan user friendly dan dapat digunakan
sebagai media atau alat bantu belajar bagi mahasiswa.
5. KESIMPULAN DAN SARAN KESIMPULAN 1. Aplikasi Pembelajaran Materi
Pengolahan Citra dengan Menggunakan Teknik Konvolusi Berbasis Multimedia ini dibuat dengan Animasi 2D dan dibantu dengan actionscript Flash 8 agar terdapat interaktifitas dalam teknik konvolusi tersebut, yang dapat dijalankan dengan master.exe yang ada pada CD interaktif hasil aplikasi.
2. Pada pengujian dari sisi pembelajaran terhadap teknik konvolusi diperoleh adanya peningkatan pemahaman materi teknik konvolusi dari sebelum adanya aplikasi persentase mahasiswa yang mengerti sebesar 65,22%, setelah adanya aplikasi persentase mahasiswa yang mengerti sebesar 80%.
3. Dalam hal kesesuaian dengan syarat interaktif multimedia, aplikasi ini sudah memenuhi kriteria syarat tersebut.
SARAN
Saran bagi peneliti selanjutnya yang ingin mengembangkan aplikasi sejenis yaitu: 1. Dalam pengembangan kedepannya,
aplikasi ini diharapkan dapat terintegrasi dengan website Fakultas Sains dan Teknologi sehingga memudahkan mahasiswa dalam menjalankan kegiatan kuliahnya.
2. Menambahkan teknik transformasi fourier pada Aplikasi Pembelajaran Materi Pengolahan Citra.
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
8 NUR ULFAH SAM - 105091002847
DAFTAR PUSTAKA Anderson, H.Ronald. 1987. Pemilihan dan
Pengembangan Media untuk Belajar. Jakarta: Rajawali Pers
Arsyad, Azhar. 1997. Media Pengajaran.
Jakarta: Raja Grafindo Persada Mayer, E.Richard. 2009. Multimedia
Learning: Prinsip-prinsip dan Aplikasi. Yogyakarta: ITS Press
Mayer, E.Richard. 2001. Introduction to
Multimedia Learning. The Cambridge Handbook of Multimedia Learning: Cambridge University Press
Muliasari, Ratna. 2008. Perancangan
Perangkat Ajar Statistika SMP Berbasis CAI. UIN Syarif Hidayatullah: Skripsi Tidak Diterbitkan
Munir, Rinaldi. 2004. Pengolahan Citra
Digital dengan Pendekatan Algoritmik. Bandung: Informatika
Nazir, M. 2003. Metode Penelitian. Jakarta:
Ghalia Indonesia Pressman, R. S. 2002. Rekayasa Perangkat
Lunak Pendekatan Praktis. Yogyakarta: Andi Offset
Riberu, Tito. 2004. Referensi dan Tuntunan
Perancangan Program ActionScript Macromedia Flash MX. Jakarta: Dinastindo
Saputra, Johan. 2010. Photoshop Urban
Style. Jakarta: Elex Media Komputindo Sugiharto, Aris. 2006. Pemrograman GUI
dengan MATLAB.Yogyakarta: Andi Offset
Sutoyo, T., et all. 2009. Teori Pengolahan Citra Digital. Yogyakarta: Andi Offset
Suyanto, M. 2003. Multimedia Alat untuk
Meningkatkan Keunggulan Bersaing. Yogyakarta: Andi Offset
Sutopo, A. H. 2003. Multimedia Interaktif dengan Flash. Yogyakarta: Graha Ilmu
Vaughan, Tay. 2006. Multimedia Making It
Work Edisi 6. Yogyakarta: Andi Offset Wijaya, Ch.M dan Prijono, Agus. 2007.
Pengolahan Citra Digital Menggunakan Matlab Image Processing Toolbox. Bandung: Informatika
AlSultan, Sultan. 2006. Developed of A
Computer Aided Instruction (CAI) Package in Remote Sensing Educational. [Online] Tersedia: www.commission7.isprs.org/wg7. [31 Juli 2010]
Ena, Ouda Teda. 2001. Membuat Media
Pembelajaran Interaktif dengan Piranti Lunak Presentasi. Universitas Sanata Dharma Yogyakarta. [Online] Tersedia: http://www.ialf.edu. [20 September 2010]
Surjono, Dwi Herman. 1996.
Pengembangan Program Pengajaran Berbantuan Komputer (CAI) Dengan Sistem Authoring. [Online] Tersedia: www.commission7.isprs.org/wg7. [31 Juli 2010]
L1
LAMPIRAN 1
FORM WAWANCARA
1. Wawancara dengan Dosen Pengajar
Tanggal : 08 Desember 2009
Narasumber : Ibu Qurrotul Aini, MT
Lokasi : R.Prodi TI/SI (UIN Syarif Hidayatullah Jakarta)
1. Apakah media pembelajaran berbasis multimedia untuk materi pengolahan
citra sudah ada sebelumnya di FST/ TI UIN Syarif Hidayatullah Jakarta?
Narasumber: Belum
2. Bagaimana metode mengajar yang selama ini Bapak/ Ibu terapkan dalam
kegiatan belajar mengajar selama perkuliahan?
Narasumber: Presentasi dari buku
3. Media atau alat bantu apakah yang selama ini Bapak/ Ibu pergunakan sebagai
penunjang proses perkuliahan?
Narasumber: Infocus
4. Bagaimanakah respon mahasiswa yang selama ini Bapak/ Ibu lihat dengan
penerapan metode mengajar yang dilakukan?
Narasumber: Masih belum jelas
5. Media pembelajaran (aplikasi) multimedia yang seperti apakah yang Bapak/
Ibu harapkan guna membantu proses perkuliahan?
Narasumber: Interaktif dan dapat meningkatkan pemahaman materi dari
sekedar membaca buku karena susah dibayangkan.
6. Mengapa media komunikasi tersebut Bapak/ Ibu gunakan selama kegiatan
mengajar dalam perkuliahan?
Narasumber: Saat ini media tersebut yang efektif
7. Kapan aplikasi multimedia ini harus dipakai atau dijalankan dalam
perkuliahan.
Narasumber: Mulai awal pembelajaran hingga akhir pembelajaran.
L2
FORM WAWANCARA
2. Wawancara dengan Dosen Pengajar
Tanggal : 08 Desember 2009
Narasumber : Bapak M.Yusuf, S.Kom
Lokasi : Lobi TI/SI (UIN Syarif Hidayatullah Jakarta)
1. Apakah media pembelajaran berbasis multimedia untuk materi pengolahan
citra sudah ada sebelumnya di FST/ TI UIN Syarif Hidayatullah Jakarta?
Narasumber: Belum
2. Bagaimana metode mengajar yang selama ini Bapak/ Ibu terapkan dalam
kegiatan belajar mengajar selama perkuliahan?
Narasumber: Presentasi langsung dengan komputer dan LCD
3. Media atau alat bantu apakah yang selama ini Bapak/ Ibu pergunakan
sebagai penunjang proses perkuliahan?
Narasumber: PC dan Infocus
4. Bagaimanakah respon mahasiswa yang selama ini Bapak/ Ibu lihat dengan
penerapan metode mengajar yang dilakukan?
Narasumber: Jelas
5. Media pembelajaran (aplikasi) multimedia yang seperti apakah yang
Bapak/ Ibu harapkan guna membantu proses perkuliahan?
Narasumber: Yang tidak membosankan
6. Mengapa media komunikasi tersebut Bapak/ Ibu gunakan selama kegiatan
mengajar dalam perkuliahan?
Narasumber: Karena yang paling enak dipakai
7. Kapan aplikasi multimedia ini harus dipakai atau dijalankan dalam
perkuliahan.
Narasumber: Saat perkuliahan
LAMPIRAN 2
L3
L4
L5
L6
LAMPIRAN 3
Hasil Perhitungan Analisa Kuisioner Awal Penelitian
Tabel 4.1 Hasil Perhitungan Pernyataan 1
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
1
Sangat Setuju 30 65.22% Setuju 16 34.78%
Tidak Setuju 0 0.00% Sangat Tidak Setuju 0 0.00%
Hubungan Media & Pembelajaran
Sangat Setuju 65.22%
Sangat Tidak Setuju0.00%
Tidak Setuju,0.00%
Setuju,34.78%
1234
Gambar 4.1 Grafik Hubungan Media & Pembelajaran
Tabel 4.2 Hasil Perhitungan Pernyataan 2
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
2
Sangat Setuju 1 2.17% Setuju 22 47.83% Tidak Setuju 23 50.00% Sangat Tidak Setuju 0 0.00%
Efektifitas Media Dalam Kelas Perkuliahan
Setuju 47.83%
Tidak Setuju 50.00%
Sangat Setuju2.17%
Sangat Tidak Setuju 0.00%
1 2 3 4
Gambar 4.2 Grafik Efektifitas Media dalam Kelas Perkuliahan
Tabel 4.3 Hasil Perhitungan Pernyataan 3
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
3
Sangat Setuju 0 0.00% Setuju 32 69.57% Tidak Setuju 14 30.43% Sangat Tidak Setuju 0 0.00%
Kemampuan Responden Terhadap Respon Verbal
Sangat Tidak Setuju0.00%
Sangat Setuju0.00%
Tidak Setuju 30.43%
Setuju69.57%
123
4
Gambar 4.3 Grafik Kemampuan Responden Terhadap Respon Verbal
Tabel 4.4 Hasil Perhitungan Pernyataan 4
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
4
Sangat Setuju 0 0.00% Setuju 13 28.26% Tidak Setuju 31 67.39% Sangat Tidak Setuju 2 4.35%
Kemampuan Responden Mengerti Materi Lewat Media Verbal
Tidak Setuju67.39%
Sangat Tidak Setuju4.35%
Sangat Setuju0.00%
Setuju28.26%
1
234
Gambar 4.4 Grafik Kemampuan Responden Mengerti Materi
Lewat Media Verbal
L7
Tabel 4.5 Hasil Perhitungan Pernyataan 5
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
5
Sangat Setuju 2 4.35% Setuju 24 52.17% Tidak Setuju 19 41.30% Sangat Tidak Setuju 1 2.17%
Kesukaan Terhadap Media Komunikasi Verbal Yang Digunakan Dosen
Tidak Setuju41.30%
Setuju52.17%
Sangat Tidak Setuju2.17%
Sangat Setuju4.35%
123
4
Gambar 4.5 Grafik Kesukaan Terhadap Media Komunikasi Verbal yang Digunakan
Dosen
Tabel 4.6 Hasil Perhitungan Pernyataan 6
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
6
Sangat Setuju 2 4.35% Setuju 13 28.26% Tidak Setuju 26 56.52% Sangat Tidak Setuju 3 6.52% Tidak Menjawab 2 4.35%
Persentase Responden Dalam Memahami Materi Pengolahan Citra
Menggunakan Buku
Tidak Setuju56.52%
Setuju28.26%
Sangat Setuju4.35%
Tidak Menjawab4.35%
Sangat Tidak Setuju6.52%
12345
Gambar 4.6 Grafik Persentase Responden dalam Memahami Materi Pengolahan Citra
Menggunakan Buku
L8
Tabel 4.7 Hasil Perhitungan Pernyataan 7 Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
7
Sangat Setuju 0 0.00% Setuju 12 26.09% Tidak Setuju 30 65.22% Sangat Tidak Setuju 3 6.52% Tidak Menjawab 1 2.17%
Mengerti Materi Pengolahan Citra Yang Bersifat Perhitungan
Matematis
Tidak Setuju65.22%
Tidak Menjaw ab
2.17%
Sangat Tidak Setuju6.52%Sangat
Setuju0.00%
Setuju26.09%
1
2
34
5
Gambar 4.7 Grafik Jumlah Responden Mengerti Materi Pengolahan Citra yang Bersifat
Perhitungan Matematis
Tabel 4.8 Hasil Perhitungan Pernyataan 8
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
8
Sangat Setuju 0 0.00% Setuju 18 39.13% Tidak Setuju 26 56.52% Sangat Tidak Setuju 1 2.17% Tidak Menjawab 1 2.17%
Kemampuan Retensi (Daya Ingat) Responden Terhadap Materi Pengolahan
Citra
Tidak Setuju56.52%
Setuju39.13%
Sangat Tidak Setuju2.17%
Sangat Setuju0.00%
Tidak Menjawab
2.17%
12345
Gambar 4.8 Grafik Kemampuan Retensi (Daya Ingat) Responden Terhadap Materi
Pengolahan Citra
L9
Tabel 4.9 Hasil Perhitungan Pernyataan 9
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
9
Sangat Setuju 2 4.35% Setuju 19 41.30%
Tidak Setuju 21 45.65% Sangat Tidak Setuju 3 6.52%
Tidak Menjawab 1 2.17%
Kemampuan Responden Dalam Menerapkan Antara Materi Dengan Contoh Soal
Setuju41.30%
Sangat Setuju4.35%
Tidak Menjawab
2.17%
Sangat Tidak Setuju6.52%
Tidak Setuju45.65%
123
45
Gambar 4.9 Grafik Kemampuan Responden dalam Menerapkan Antara Materi dengan
Contoh Soal
Tabel 4.10 Hasil Perhitungan Pernyataan 10
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
10
Sangat Setuju 3 6.52% Setuju 36 78.26% Tidak Setuju 5 10.87% Sangat Tidak Setuju 0 0.00% Tidak Menjawab 2 4.35%
Kesukaan Responden Terhadap Ilustrasi
Setuju78.26%
Tidak Setuju10.87%
Sangat Tidak Setuju0.00%
Sangat Setuju6.52%
1234
Gambar 4.10 Grafik Kesukaan Responden Terhadap Ilustrasi
L10
Tabel 4.11 Hasil Perhitungan Pernyataan 11
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
11
Sangat Setuju 13 28.26% Setuju 31 67.39% Tidak Setuju 1 2.17% Sangat Tidak Setuju 0 0.00% Tidak Menjawab 1 2.17%
Penambahan Ilustrasi Gambar Pada Media Pembelajaran
Setuju67.39%
Sangat Setuju28.26%
Tidak Setuju2.17%
Sangat Tidak Setuju0.00%Tidak
Menjawab2.17%
12
34
5
Gambar 4.11 Grafik Penambahan Ilustrasi Gambar pada Media Pembelajaran
Tabel 4.12 Hasil Perhitungan Pernyataan 12
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
12
Sangat Setuju 6 13.04% Setuju 25 54.35% Tidak Setuju 13 28.26% Sangat Tidak Setuju 1 2.17% Tidak Menjawab 1 2.17%
Kesukaan Responden Terhadap Unsur Audio
Setuju54.35%
Sangat Setuju13.04%
Tidak Setuju28.26%
Tidak Menjawab
2.17%
Sangat Tidak Setuju2.17%
1
2
3
4
5
Gambar 4.12 Grafik Kesukaan Responden Terhadap Unsur Audio
L11
Tabel 4.13 Hasil Perhitungan Pernyataan 13
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
13
Sangat Setuju 7 15.22% Setuju 35 76.09% Tidak Setuju 3 6.52% Sangat Tidak Setuju 0 0.00% Tidak Menjawab 1 2.17%
Kesukaan Terhadap Unsur Video
Setuju76.09%
Sangat Tidak Setuju0.00%
Tidak Menjaw ab
2.17%
Tidak Setuju6.52%
Sangat Setuju15.22%
12
34
5
Gambar 4.13 Grafik Kesukaan Responden Terhadap Unsur Video
Tabel 4.14 Hasil Perhitungan Pernyataan 14
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
14
Sangat Setuju 14 30.43% Setuju 27 58.70% Tidak Setuju 3 6.52% Sangat Tidak Setuju 0 0.00% Tidak Menjawab 2 4.35%
Kesukaan Terhadap Unsur Animasi Pada Media Belajar
Setuju58.70%
Sangat Setuju30.43% Tidak Setuju
6.52%Sangat Tidak
Setuju0.00%
Tidak Menjawab
4.35%
1
2
3
4
5
Gambar 4.14 Grafik Kesukaan Responden Terhadap Unsur Animasi
L12
Tabel 4.15 Hasil Perhitungan Pernyataan 15
Pernyataan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
15
Sangat Setuju 28 60.87% Setuju 16 34.78% Tidak Setuju 1 2.17% Sangat Tidak Setuju 0 0.00% Tidak Menjawab 1 2.17%
Kesukaan Terhadap Kombinasi Unsur Audio, Video & Animasi (Multimedia)
Sangat Setuju60.87% Setuju
34.78%
Tidak Setuju2.17%
Sangat Tidak Setuju0.00%
Tidak Menjawab
2.17%
12
345
Gambar 4.15 Grafik Kesukaan Responden Terhadap Kombinasi Unsur Audio, Video &
Animasi
Tabel 4.16 Pertanyaan 1
Pertanyaan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
1 Ya 33 71.74% Tidak 13 28.26%
Persentase Pertanyaan 1
Ya71.74%
Tidak28.26%
12
Gambar 4.16 Grafik Persentase Pertanyaan 1
L13
Tabel 4.17 Pertanyaan 2
Pertanyaan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
2 Ya 30 65.22% Tidak 16 34.78%
Persentase Pertanyaan 2
Ya65.22%
Tidak34.78%
12
Gambar 4.17 Grafik Persentase Pertanyaan 2
Tabel 4.18 Pertanyaan 3
Pertanyaan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
3 Ya 17 36.96% Tidak 29 63.04%
Persentase Pertanyaan 3
Tidak63.04%
Ya36.96%
12
Gambar 4.18 Grafik Persentase Pertanyaan 3
Tabel 4.19 Pertanyaan 4
Pertanyaan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
4 Ya 9 19.57% Tidak 36 78.26% Tidak Menjawab 1 2.17%
L14
Persentase Pertanyaan 4
Ya19.57%
Tidak Menjawab
2.17%
Tidak78.26%
12
3
Gambar 4.19 Grafik Persentase Pertanyaan 4
Tabel 4.20 Pertanyaan 5
Pertanyaan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
5 Ya 24 52.17% Tidak 21 45.65% Tidak Menjawab 1 2.17%
Persentase Pertanyaan 5
Ya52.17%
Tidak Menjawab
2.17%
Tidak45.65%
123
Gambar 4.20 Grafik Persentase Pertanyaan 5
Tabel 4.21 Pertanyaan 6 Pertanyaan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
6 Ya 30 65.22% Tidak 14 30.43% Tidak Menjawab 2 4.35%
L15
Persentase Pertanyaan 6
Ya65.22% Tidak
Menjawab4.35%
Tidak30.43%
1
23
Gambar 4.21 Grafik Persentase Pertanyaan 6
Tabel 4.22 Pertanyaan 7
Pertanyaan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
7 Ya 27 58.70% Tidak 18 39.13% Tidak Menjawab 1 2.17%
Persentase Pertanyaan 7
Ya58.70%
Tidak39.13%
Tidak Menjawab
2.17%
123
Gambar 4.22 Grafik Persentase Pertanyaan 7
Tabel 4.23 Pertanyaan 8
Pertanyaan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
8 Ya 43 93.48% Tidak 2 4.35% Tidak Menjawab 1 2.17%
L16
Persentase Pertanyaan 8
Ya93.48%
Tidak Menjawab
2.17%
Tidak4.35%
1
2
3
Gambar 4.23 Grafik Persentase Pertanyaan 8
Tabel 4.24 Pertanyaan 9 Pertanyaan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
9 Ya 42 91.30% Tidak 3 6.52% Tidak Menjawab 1 2.17%
Persentase Pertanyaan 9
Tidak Menjawab
2.17%Tidak6.52%
Ya91.30%
1
23
Gambar 4.24 Grafik Persentase Pertanyaan 9
Tabel 4.25 Pertanyaan 10
Pertanyaan Jawaban Responden Jumlah Penjawab (orang) Persentase (%)
10 Ya 39 84.78% Tidak 6 13.04% Tidak Menjawab 1 2.17%
Persentase Pertanyaan 10
Ya84.78%
Tidak Menjawab
2.17%
Tidak13.04%
1
23
Gambar 4.25 Grafik Persentase Pertanyaan 10
L17
LAMPIRAN 4
Tabel Pengumpulan Data
File Gambar
No. Nama File Jenis Format Size Sumber 1. Baboon Gambar BMP 768 Kb www.informatika.org 2. Barbara Gambar BMP 257 Kb www.informatika.org 3. Bird Gambar BMP 65 Kb www.informatika.org 4. Boat Gambar BMP 257 Kb www.informatika.org 5. Cameraman Gambar BMP 65 Kb www.informatika.org 6. Circles Gambar BMP 65 Kb www.informatika.org 7. Girl Gambar BMP 65 Kb www.informatika.org 8. Lena Gambar BMP 768 Kb www.informatika.org 9. Peppers Gambar BMP 768 Kb www.informatika.org
10. Sanfransisco Gambar BMP 65 Kb www.informatika.org 11. Slope Gambar BMP 65 Kb www.informatika.org 12. Text Gambar BMP 65 Kb www.informatika.org 13. Zelda Gambar BMP 1.29 MB www.informatika.org 14. Morph-man Gambar JPEG 28 Kb www.google.com 15. Lena edge Gambar JPEG 92.4 Kb www.google.com 16. Color wheel Gambar GIF 14.9 Kb www.google.com 17. Brightness change Gambar JPEG 240 Kb www.google.com 18. Biggie Tag Shapes Gambar JPEG 68.7 Kb www.google.com 19. Design texture Gambar JPEG 192 Kb www.google.com 20. Concept contrast Gambar JPEG 134 Kb www.google.com 21. Overview Gambar JPEG 25.6 Kb www.google.com 22. Wood texture Gambar JPEG 866 Kb www.google.com
File Video
No. Nama File Jenis Format Size Sumber
1. Histori Video MPEG 2.79 MB Buatan sendiri 2. Lesson 1 Video AVI 405 MB Buatan sendiri 3. Lesson 2 Video AVI 322 MB Buatan sendiri
4. Lesson 3 Video AVI 285 MB Buatan sendiri
L18
File Audio
No. Nama File Jenis Format Size Sumber
1. Horizon-Depapepe Audio MP3 8.04 MB www.4shared.com
2. Marine Drive Audio MP3 10.7 MB www.4shared.com
3. Ameagari Audio MP3 5.73 MB www.4shared.com
4. Kazami Dori Audio MP3 6.31 MB www.4shared.com
5. Fun Time Audio MP3 2.91 MB www.4shared.com
6. Very_Slow_Guitar_Music Audio MP3 850 Kb www.4shared.com
7. Love generation Audio MP3 12.2 MB www.4shared.com
8. 1202VB08 Audio WAV 1.34 MB CD Music instrument
9. Click Audio WAV 42.6 Kb CD Maxikom
10. Cling Audio WAV 214 Kb CD Maxikom
11. Effect 42 Audio WAV 38 Kb CD Music instrument
12. Over Audio WAV 30.8 Kb CD Maxikom
13. Wuzz Audio WAV 91.2 Kb CD Maxikom
L19
LAMPIRAN 5
L20
LAMPIRAN 6
LISTING PROGRAM
Master.swf stop(); fscommand("fullscreen", "true"); fscommand("allowscale", "false"); Preloading: onEnterFrame=function() { if(getBytesLoaded()==getBytesTotal()) { gotoAndPlay(3); delete onEnterFrame; } nBytesLoaded = int(getBytesLoaded()/1024) ; nBytesTotal = int(getBytesTotal()/1024); percent = int((nBytesLoaded/nBytesTotal)*100); bar_mc.gotoAndStop(percent/2); info_preloader = "Loading " + percent + " % from " + nBytesLoaded + " Kb of " + nBytesTotal + " Kb"; } stop(); fscommand("fullscreen", "true"); fscommand("allowscale", "false"); loadMovieNum("intro.swf", 1); unloadMovieNum(1); stopAllSounds(); loadMovieNum("pilih menu.swf",3); Intro.swf setProperty("object2", _x, random(550)); setProperty("object2", _y, random(400)); setProperty("object2", _alpha, random(10)*10); setProperty("object2", _rotation, random(360)); Frame 1: a = int(Number(random(5))+1); timeGap = int((random(5))*100); startTimer = getTimer();
Frame 2: waktuNow = getTimer(); waktuDiff = timeNow-startTimer; if (Number(TimeDiff)>Number(timegap)) { _xscale = Number(int(random(5)*10))+100; setProperty("Line" & a, _xscale, xscale); setProperty("Line" & a, _x, Number(_x)+Number(random(10))); tellTarget ("Line" & a) { gotoAndPlay(1); } call("Setup"); } Frame 3: gotoAndPlay("loopit"); Music start: musik = new Sound() musik.attachSound ("intro_latar") musik.setVolume (100) musik.start (0,3) var current:Number=1; preface_text.gotoAndStop(current); picUji1.gotoAndStop(current) if (current < preface_text._totalframes) { gotoAndPlay("Loop"); current++; } if( kopi < preface_text._totalframes ) { gotoAndPlay("loop"); kopi++; } stopAllSounds(); gotoAndPlay("start musik") Tanggal & Waktu: this.onEnterFrame = function () { oWaktu = new Date();
L21
arHari = new Array("Minggu", "Senin", "Selasa", "Rabu", "Kamis", "Jumat", "Sabtu"); arBulan = new Array("Jan", "Feb", "Mar", "Apr", "Mei", "Jun", "Jul", "Agt", "Sep", "Okt", "Nov", "Des"); tgl = oWaktu.getDate(); hari = arHari[oWaktu.getDay()]; bln = arBulan[oWaktu.getMonth()]; thn = oWaktu.getFullYear(); display_tanggal = hari + ", " + tgl + " " + bln + " " + thn; jam = oWaktu.getHours(); menit = oWaktu.getMinutes(); detik = oWaktu.getSeconds(); display_waktu = jam + " : " + menit + " : " + detik; }; fscommand("fullscreen",true); stop(); Movieclip stop(); loadMovie("F5.swf","holder5"); gotoAndPlay(nextFrame); stop(); loadMovie("elemen citra.swf","holder7"); stop(); loadMovie("Gallery citra.swf","holder8"); Tombol home: on(release){ loadMovieNum("pilih menu.swf",0); } Tombol back: on(release){ loadMovieNum("pilih isi menu utama.swf",0); } Tombol Sound on/off: stop(); var my_sound3:Sound = new Sound(); my_sound3.attachSound("sound_kuliah"); my_sound3.start(); on (release) { my_sound2.start(); this.gotoAndStop(1); } Convolution.swf import flash.filters.DropShadowFilter;
import flash.filters.BlurFilter; import flash.filters.ConvolutionFilter; import flash.filters.GlowFilter; var isDropShadow:Boolean = false; var isBlur:Boolean = false; var isConvolution:Boolean = false; var isGlow:Boolean = false; var dropShadowDistance:Number = 10; var dropShadowAngle:Number = 40; var dropShadowBlur:Number = 4; var blurAmount:Number = 10; var convolutionAmount:Number = 20; var glowAmount:Number = 20; var glowAlpha:Number = 5; var glowInnerBlur:Number = 3; imageCb.addEventListener("change", toggleImage); dropShadowCh.addEventListener("click", toggleDropShadow); dropShadowDistanceNs.addEventListener("change", updateDropShadowProperties); dropShadowBlurNs.addEventListener("change", updateDropShadowProperties); dropShadowAngleNs.addEventListener("change", updateDropShadowProperties); blurCh.addEventListener("click", toggleBlur); blurAmountNs.addEventListener("change", updateBlurProperties); convolutionCh.addEventListener("click", toggleConvolution); convolutionAmountNs.addEventListener("change", updateConvolutionProperties); glowCh.addEventListener("click", toggleGlow); glowAmountNs.addEventListener("change", updateGlowProperties); glowAlphaNs.addEventListener("change", updateGlowProperties); glowInnerNs.addEventListener("change", updateGlowProperties); this.imageCb.dataProvider = [{label: "Barbara", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/Barbara1.jpg"}, {label: "Baboon", data:
L22
"G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_satu.jpg"}, {label: "Bird", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_tiga.jpg"}, {label: "Cameraman", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_empat.jpg"}, {label: "Circles", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_lima.jpg"}, {label: "Girl", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_enam.jpg"}, {label: "Lena", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_tujuh.jpg"}, {label: "Peppers", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_delapan.jpg"}, {label: "Sanfransisco", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_sembilan.jpg"}, {label: "Slope", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_sepuluh.jpg"}, {label: "Text", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_sebelas.jpg"}, {label: "Zelda", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_duabelas.jpg"}]; // Set properties of the components. dropShadowCh.label = "Drop Shadow"; dropShadowDistanceNs.maximum = 50; dropShadowDistanceNs.value = 10; dropShadowAngleNs.maximum = 360; dropShadowAngleNs.stepSize = 10; dropShadowAngleNs.value = 40; dropShadowBlurNs.value = 4; blurCh.label = "Blur"; blurAmountNs.maximum = 20; blurAmountNs.value = 10; convolutionCh.label = "Convolution"; convolutionAmountNs.maximum = 10; convolutionAmountNs.value = 10;
glowCh.label = "Glow"; glowAmountNs.maximum = 20; glowAmountNs.value = 10; glowAlphaNs.maximum = 20; glowAlphaNs.value = 5; glowInnerNs.maximum = 20; glowInnerNs.value = 4; var imageListener:Object = new Object(); imageListener.onLoadInit = function(clip:MovieClip):Void { loadingImageLbl.visible = false; }; this.createEmptyMovieClip("imageClip", 1); imageClip.createEmptyMovieClip("nestedClip", 1); imageClip._x = 370; imageClip._y = 350; var imageLoader:MovieClipLoader = new MovieClipLoader(); imageLoader.addListener(imageListener); imageLoader.loadClip(imageCb.value, imageClip.nestedClip); function toggleImage(event:Object):Void { loadingImageLbl.visible = true; imageLoader.loadClip(imageCb.value, imageClip.nestedClip); } function toggleDropShadow(event:Object):Void { isDropShadow = event.target.selected; setFilters(); } function toggleBlur(event:Object):Void { isBlur = event.target.selected; setFilters(); } function toggleConvolution(event:Object):Void { isConvolution = event.target.selected; setFilters(); } function toggleGlow(event:Object):Void {
L23
isGlow = event.target.selected; setFilters(); } function updateDropShadowProperties(event:Object):Void { dropShadowDistance = dropShadowDistanceNs.value; dropShadowBlur = dropShadowBlurNs.value; dropShadowAngle = dropShadowAngleNs.value; setFilters(); } function updateBlurProperties(event:Object):Void { blurAmount = blurAmountNs.value; setFilters(); } function updateConvolutionProperties(event:Object):Void { convolutionColor = convolutionColorNs.value; setFilters(); } function updateGlowProperties(event:Object):Void { glowAmount = glowAmountNs.value; glowAlpha = glowAlphaNs.value; glowInner = glowInnerNs.value; setFilters(); } function setFilters():Void { var filtersArr:Array = new Array(); if(isDropShadow) { var dropShadow:DropShadowFilter = new DropShadowFilter(dropShadowDistance, dropShadowAngle, 0, 100, dropShadowBlur, dropShadowBlur); filtersArr.push(dropShadow); } if(isBlur) { var blur:BlurFilter = new BlurFilter(blurAmount, blurAmount); filtersArr.push(blur); }
if(isConvolution) { var convolution:ConvolutionFilter = new ConvolutionFilter(convolutionAmount, convolutionAmount); filtersArr.push(convolution); } if(isGlow) { var glow:GlowFilter = new GlowFilter(glowAmount, glowAmount, glowAlpha, glowAlpha, glowInner, 50); filtersArr.push(glow); } imageClip.filters = filtersArr; } on(release){ loadMovie("Kernel Mask3.swf","holder3"); } Tombol Filter Konvolusi: on(release){ loadMovie("Kernel Mask3.swf","holder3"); } Tombol Olah Citra: on(release){ loadMovie("convolution.swf","holder3"); } Tombol Matlab & Pengolahan Citra: on(release){ loadMovie("tutorial.swf","holder3"); } Tombol Kuliah: on(release){ loadMovieNum("Kuliah.swf",0); } Tombol Konvolusi: on(release){ loadMovieNum("Menu Kernel Mask.swf",0); } Tombol Quiz: on(release){ loadMovieNum("pilih quiz",0); }
L24
84
Tabel 3.1 Studi Penelitian Sejenis
No. Judul Authoring tool Kelebihan Kelemahan Saran Pengembangan
1.
Yuliarti, Dewi. 2007. ”Perancangan Aplikasi Pembelajaran Matematika untuk Kelas 6 SD Berbasis Multimedia”.
Flash 8, Photoshop 7,Swishmax & Cooledit Pro
Soal-soal latihan disertai games agar terlihat menarik
Belum ada pembahasan materi evaluasi di aplikasi
Desain dibuat lebih menarik, menambah soal latihan, sertakan pembahasan soal latihan yang benar & dapat di update/edit untuk menambah soal yang ada.
2. Muliasari,Ratna.2008. ”Perancangan Perangkat Ajar Statistika SMP Berbasis CAI”.
Flash Pro 8 dan Photoshop CS
Memberikan pemahaman kepada siswa dengan tes evaluasi belajar
Perangkat ajar masih di dominasi oleh unsur teks.
Membuat penyimpanan nilai record (record keeping) untuk mengetahui perkembangan hasil belajar siswa.
3.
Surjono, Dwi H. 1996. ”Pengembangan Program Pengajaran Berbantuan Komputer (CAI) dengan Sisitem Authoring”. Studi Kasus: Mata Kuliah Fisika-Tekanan Udara.
ABC Tersedia tombol-tombol interaktif
Authoring software masih sederhana.
Menggunakan software multimedia lain atau dikombinasikan dengan software saat ini
4.
Al-Sultan, Sultan dkk. 2006. ”Developed of A Computers Aided Instruction (CAI) Package in Remote Sensing Educational”.
Flash MX,Adobe Photoshop dan Sound Forge
Menyediakan informasi yang lengkap tentang citra satelit kedua Negara yaitu Malaysia & Saudi Arabia beserta sejarahnya
Informasi yang ditampilkan masih didominasi dengan gambar dan teks pendukung serta sedikit unsur animasi.
Dapat di upload ke dalam website