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
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
Pembimbing 2
Victor Amrizal, M.Kom NIP. 150411288
Qurrotul Aini, MT NIP. 197303252009012001
Mengetahui, Ketua Program Studi Teknik Informatika
Yusuf Durrachman, MSc, MIT NIP. 197105222006041002
ii
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,
Penguji I
Penguji II
Arini, MT NIP. 197601312009012001
Ria Hari Gusmita, M.Kom NIP. 198208172009122002
Pembimbing I
Pembimbing II
Victor Amrizal, M.Kom NIP. 150411288
Qurrotul Aini, MT NIP. 197303252009012001
Mengetahui, Dekan Fakultas Sains Dan Teknologi
Ketua Program Studi Teknik Informatika
DR. Syopiansyah Jaya Putra, M.Sis NIP. 19681172001121001
Yusuf Durrachman, MSc.MIT NIP. 197105222006041002
iii
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
iv
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.
v
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
melaksanakan proses penelitian dan pembuatan skripsi ini.
vi
selama
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 harihari 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 SI05, 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 vii
DAFTAR ISI
Halaman
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
viii
1.6.1
Metode Pengumpulan Data ...............................................
5
1.6.2
Metode Pengembangan Aplikasi Multimedia ...................
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
1.7.
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
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.8
2.12.1
Perencanaan dan Pembiayaan ..........................................
ix
41
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
x
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
xi
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
xii
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
xiii
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) .................................
xiv
67
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
xv
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 ............................................................
xvi
129
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
xvii
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
xviii
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
xix
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 masingmasing 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.
xx
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
tersebut.
xxi
mengambil
berdasarkan
respon
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.
xxii
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 masingmasing bagian dari sebuah proyek dalam detail yang tepat.
xxiii
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.
xxiv
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.
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
1
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 DENGAN
PEMBELAJARAN MENGGUNAKAN
MATERI TEKNIK
PENGOLAHAN KONVOLUSI
CITRA
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.
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.
9
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: 256259), 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
(a) (b) Gambar 2.1 Teks Tercetak dalam Bentuk Poster (a) dan Teks buku (b) 2. Teks hasil scan Teks cetak yang dikonversi sehingga menjadi format teks yang terbaca oleh mesin dan menghasilkan scanned text. (Gambar 2.2)
Gambar 2.2 Scanned Text 3. Electronic text Jenis teks yang dapat dibaca oleh komputer dan dapat dikirim secara elektronis melalui jaringan. (Gambar 2.3)
Gambar 2.3 Contoh Teks Elektronik (Word art)
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)
Gambar 2.4 Format Hypertext 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
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 didownload 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
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)
Gambar 2.6 Clipart 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 CDROM 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)
Gambar 2.9 Cell Animation 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.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)
Gambar 2.11 Sprite Animation
3.
Animasi Lintasan (path animation) Adalah animasi dari objek yang bergerak sepanjang garis kurva yang ditentukan sebagai lintasan.(Gambar 2.12)
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)
Gambar 2.15 Character Animation 7.
Computational Animation Animasi yang menggunakan koordinat x dan y untuk memposisikan suatu objek pada layar.(Gambar 2.16)
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)
Gambar 2.17 Morphing Animation
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.
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. kondisi aksi
Keadaan 1
Keadaan 2
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).
41
STORYBOARD Modul Halaman Nama File Frame No. Gambar Video Audio
: ……………………………… : ……………………………… : ……………………………… : ……………dari..…………… : ……………………………… : ……………………………… : ………………………………
Navigasi Next : ……………………………… Back : ……………………………… Menu : ……………………………… Help : ……………………………… Notes : ……………………………… ........................................................................................................................................ ........................................................................................................................................ ........................................................................................................................................ ........................................................................................................................................ ........................................................................................................................................ ........................................................................................................................................ ........................................................................................................................................ ........................................................................................................................................
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:
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
didistribusikan ke klien atau pengguna akhir.
selanjutnya
dikemas
untuk
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)
f(x,y)
Gambar 2.26 Representasi Citra Digital 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)
53
i(1,1) i (1,2) i (2,1) i (2,2) i i ( N ,1) i ( N ,2)
i (1, M ) i (2, M ) i ( N , M )
Gambar 2.27 Representasi Matriks pada Citra Digital 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.
54
(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) 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 abuabu diantara warna minimum (hitam) dan warna maksimum (putih). (Gambar 2.29)
Gambar 2.29 Contoh Citra Grayscale 8-bit 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
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)
Gambar 2.30 Citra Warna Asli (true color)
2.14.4.3 Elemen-Elemen Citra Digital Citra digital mengandung sejumlah elemen-elemen dasar. Elemenelemen 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.
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:
2.
a.
Penghilangan kesamaran (deblurring)
b.
Penghilangan derau (noise)
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 ciriciri tertentu yang membantu dalam identifikasi objek. Proses segmentasi kadangkala diperlukan untuk melokalisasi objek yang diinginkan dari sekelilingnya. Contoh-contoh operasi pengorakan citra:
5.
a.
Pendeteksian tepi objek (edge detection)
b.
Ekstraksi batas (boundary)
c.
Representasi daerah (region)
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
a11 a12 a1n a12 a 22 a 2 n A a m1 a m2 a mn 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:
f (0,0) f (1,0) f ( x, y) f ( N 1,0)
f (0,1)
f (1,1) f ( N 1,1)
f (0, M )
f (1, M ) f ( N 1, M 1)
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).
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 U2,1 U3,1 U4,1 U5,1 U6,1
U1,2 U2,2 U3,2 U4,2 U5,2 U6,2
U1,3 U2,3 U3,3 U4,3 U5,3 U6,3
U1,4 U2,4 U3,4 U4,4 U5,4 U6,4
U1,5 U2,5 U3,5 U4,5 U5,5 U6,5
U1,6 U2,6 U3,6 U4,6 U5,6 U6,6
(a) K1,1 K2,1
K1,2 K2,2
K1,3 K2,3
(b) Gambar 2.32 (a) Citra Input (b) Kernel 2x3 Sesuai contoh pada (Gambar 2.32) maka nilai pixel sebagai berikut.
O4,3 (u4,3 xK1,1 ) (u4, 4 xK1,2 ) (u4,5 xK1,3 ) (u5,3 xK2,1 ) (u5, 4 xK2, 2 ) (u5,5 xK2,3 ) Operator
konvolusi
biasanya
menggunakan
tanda
(*).
Secara
matematika proses konvolusi U*K dapat dinyatakan sebagai berikut. m
n
O(i, j ) U (i k 1, j l 1)K (k , l ) k 1 l 1
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.
2 5 7 6
1 1 3 3 4 1 0 0 1
1 1 4 4 3 2 1 3 3 3 1 1 1 4 4
2 4 7 7 3 2 7 7
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
Gambar 2.33 Ilustrasi Hitung Konvolusi 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.
65
(a) Sebelum
(b) Sesudah
Gambar 2.34 Gambar Sebuah Citra Lena Sebelum (a) dan Sesudah (b) Penajaman Citra (image sharpening) 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:
1 1 1 (i) 1 8 1 1 1 1 0 1 2 1 (iv ) 2 5 2 1 2 1 1
1 1 1 (ii ) 1 9 1 1 1 1 1 1 2 1 ( v) 2 4 2 1 2 1 0
0 (iii ) 1 0
1 5 1
0 1 0
1 0 ( vi ) 1 0
1 4 1
0 1 0
0
Nilai koefisien yang besar di titik pusat penapis memainkan peranan kunci dalam proses konvolusi. Pada komponen citra dengan frekuensi tinggi (yang
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) 4 4 4 4 4
4
4
4
4
4
4 4
4 4
4 4
4 4
4 4
4
4
4
4
4
4
4
4
4
4
4 4 4 4 4
4 4 4 4 4
4
4
8
8
8
4
4
8
8
8
4
4
8
8
8
4 4
4 4
8 8
8 8
8 8
8 8 8 8 8
f(x,y ) 8
4
0
x
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.
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)
(a) Sebelum
(b) Sesudah
Gambar 2.36 Gambar Sebuah Citra Sebelum (a) dan Sesudah (b) Pelembutan Citra (image smoothing) 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:
g ( x, y )
1 m 2 n2 f ( x r , y s) d r m1 s n1
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
68
gambar di bawah ini (elemen yang bertanda menyatakan posisi (0,0) dari pixel yang dikonvolusi):
1 / 9 1 / 9 1 / 9 (i) 1 / 9 1 / 9 1 / 9 1 / 9 1 / 9 1 / 9
1 / 4 1 / 4 (ii ) 1 / 4 1 / 4
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.
1 1 1 9 1
1 1 1
1 3 1 3 16 8 1 3
1 1 1
(a)
1 3 1
(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). 0 0 0 0 0 0 0 0
0 1 1
0 1 1
0 1 1
1 1
1 1
1 1
1 1 0
6 1 0
1 1 1
0 0 0 1 0 1 * 1 0 9 1 0 0 0
1 1 1
0 1 1 1 1 1 1 1 1
1 1 1 2 2 1
0 1 1 1 1 1
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. 2 0 1 1 1
1
2
0
0 6 2 7
1 1 3 2
4 0 0 1
3 5 1 0 * 1 1 1 2
1 1 1
1 1 1
14
15
16
15 24
17 22
15 10
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.
1 1 1 9 1
1 8 1
1 1 1
0 1 0
1 4 1
0 1 0
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.
0 0 0 0 0 0 0 0
0
0
0
1
1
1
1
1
1
1
1
1
1 1
1 6
1 1
1
1
1
0
0
1
0 0 0 0 * 0 0 0 0
0 1 0
1 4 1
2 1 0 1 1 1 0 4 2
1 0 0 5 20 4
2 1 1 1 4 2
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.
2 0 1 1 1
1 0
2 1
0 4
6 2
1 3
0 0
7
2
1
3 5 1 0 * 1 1 1 2
1 8 1
1 1 1
13
5
26
39 7
8 5
15 10
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 efekefek 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
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.
80
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 FisikaTekanan 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.
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
87
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 1
Jawaban Responden Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju
Jumlah Penjawab (orang) 30 16 0 0
Persentase (%) 65.22% 34.78% 0.00% 0.00%
Hubungan Media & Pem belajaran
Sangat Setuju 65.22%
1 Setuju, 34.78%
2 3 4
Sangat Tidak Setuju 0.00%
Tidak Setuju, 0.00%
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)
2
Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju
1 22 23 0
Persentase (%) 2.17% 47.83% 50.00% 0.00%
Efek tifitas M edia Dalam Ke las Pe rk uliahan
Tidak Se tuju 50.00% Se tuju 47.83%
Sangat Tidak Se tuju 0.00%
Sangat Se tuju 2.17% 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 1
Jawaban Responden Ya Tidak
Jumlah Penjawab (orang) 33 13
Persentase (%) 71.74% 28.26%
Persentase Pe rtanyaan 1
1 Ya 71.74%
2 Tidak 28.26%
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 2
Jawaban Responden Ya Tidak
Jumlah Penjawab (orang) 30 16
Persentase (%) 65.22% 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 akhir
pengguna Adanya ilustrasi animasi pada operasi kernel konvolusi (Smoothing, Sharpening dan Laplacian) 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. Pemilihan elemen Animasi : Animasi intro, teks dan gambar serta multimedia untuk ilustrasi kernel konvolusi yang peneliti buat mengirimkan pesan 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. Macromedia Flash Pro 8, Photoshop CS 2, Matlab Authoring tools yang Simulink 2009, Camtasia Studio 7, Ulead Video digunakan Studio10 dan Cool Edit Pro Tersedia menu dan tombol navigasi serta ilustrasi
Interaktifitas
dalam bentuk animasi yang dapat diuji coba oleh user. Kemampuan peneliti
teknis
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. Filefile 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 a. Biaya pengembangan penelitian Analisis penelitian b. Biaya produksi Pembuatan isi (content) Produksi grafis Produksi audio Produksi video
Jumlah Rp. 200.000 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
4.5.2
Desain dan Produksi
1..
Design
Rp. 1.800.000
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
pembelajaran multimedia pengolahan citra.
penggunaan
dari
aplikasi
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 masingmasing 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. 1.
Spesifikasi Komputer 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
Hasil harapan
Berjalan dengan baik.
Gambar
Hasil Keluaran
Berjalan dengan baik
141
2.
3.
4.
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) Netbook (Acer) Intel Atom 1.6 GHz Hardisk 160 GB RAM 1 GB Layar Monitor 10 inch 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
Berjalan dengan baik.
Berjalan dengan baik
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 1. Menu Konvolusi
Test Case Klik Menu Konvolusi
2.
Menu Filter Konvolusi
Klik Menu Konvolusi
Filter
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 Klik tombol hitung dan reset
Gambar
Hasil Keluaran Menu konvolusi tampil
Menu Filter Konvolusi tampil
Fungsi GUI berjalan baik
4.
Filter smoothing
5.
Filter Klik tombol hitung sharpening 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
Animasi kernel smoothing 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.
1.
Nama File
Test Case
Hasil Harapan
Hasil Keluaran
User Meklik tombol Skip
Masuk ke Menu utama
Menu utama ditampilkan
Halaman menu home terbuka
Halaman menu home terbuka
Halaman menu kuliah terbuka
Halaman menu kuliah terbuka
Kuliah.swf
User memilih tombol Sejarah
Halaman menu Sejarah terbuka
Halaman menu Sejarah terbuka
Kuliah.swf
User memilih tombol Sekilas
Halaman menu Sekilas terbuka
Halaman menu Sekilas terbuka
Halaman menu Operasi & Aplikasi terbuka
Halaman menu Operasi & Aplikasi terbuka
Halaman menu Jenis Citra terbuka
Halaman menu Jenis Citra terbuka
Intro.swf
2.
Pilih menu.swf
3.
Pilih isi materi.swf
4.
5.
6.
7.
Kuliah.swf
Kuliah.swf
User memilih tombol menu Home User memilih tombol menu Kuliah
User memilih tombol Operasi & Aplikasi User memilih tombol Jenis Citra
Gambar
144
8.
9.
10.
11.
12.
13.
14.
Kuliah.swf
Kuliah.swf
Kuliah.swf
Kuliah.swf
Kuliah.swf
Pilih menu.swf
Menu konvolusi.s wf
User memilih tombol Elemen Citra User memilih tombol Gallery Citra User Mengklik tombol Home pada halaman menu kuliah User Mengklik tombol Back User Mengklik tombol Sound On/Off pada halaman menu kuliah User memilih tombol menu Konvolus i User Mengklik tombol menu
Halaman menu Elemen Citra terbuka Halaman menu Gallery Citra terbuka
Halaman menu Elemen Citra terbuka Halaman menu Gallery Citra terbuka
Kembali ke halaman Menu utama
Menu utama ditampilkan
Kembali ke halaman Pilih Menu Materi
Menu Materi ditampilkan
User Meklik tombol Sound On/Off pada halaman menu kuliah
User Meklik tombol Sound On/Off pada halaman menu kuliah
User memilih tombol menu Konvolusi
User memilih tombol menu Konvolusi
User meklik tombol menu Filter
User meklik tombol menu Filter Konvolusi
145
15.
16.
Menu konvolusi.s wf
Menu konvolusi.s wf
Filter Konvolus i User meklik tombol menu Olah Citra User meklik tombol menu Matlab & Pengolah an Citra
17.
Filter smoothing
User mengklik tombol hitung
18.
Filter Sharpening
User mengklik tombol hitung
Filter Laplacian
User mengklik tombol hitung
19.
20.
21.
22.
Pilih menu.swf
Profile.swf
Ending.swf
User memilih tombol menu Petunjuk User memilih tombol menu Profile User memilih tombol menu Exit
Konvolusi
User meklik tombol menu Olah Citra User meklik tombol menu Matlab & Pengolaha n Citra Hitung kernel dengan matriks citra Hitung kernel dengan matriks citra Hitung kernel dengan matriks citra User memilih tombol menu Petunjuk User memilih tombol menu Profile User memilih tombol menu Exit
User meklik tombol menu Olah Citra User meklik tombol menu Matlab & Pengolahan Citra Nilai pixel output ditampilkan
Nilai pixel output ditampilkan
Nilai pixel output ditampilkan User memilih tombol menu Petunjuk User memilih tombol menu Profile User memilih tombol menu Exit
146
23.
24.
2.
Ending.swf
User meklik tombol Replay
User meklik tombol Replay
User meklik tombol Replay
Ending.swf
User meklik tombol End
User meklik tombol End
User meklik tombol End
Pengujian Aplikasi dari Sisi Pembelajaran Teknik Konvolusi Tabel 4.10 Beta Testing dari Sisi Pembelajaran Teknik Konvolusi No. 1. 2.
Halaman Menu Konvolusi Menu Filter Konvolusi
3.
Olah Citra
4.
Filter smoothing
5.
Filter sharpening
6.
Filter laplacian
7.
Video Tutorial
Test Case
Hasil Pengujian
Menu konvolusi tampil Klik Menu Filter Menu Filter Konvolusi Konvolusi tampil Select image, check box drop shadow, distance, blur, angle, check box blur, amount blur, Fungsi GUI convolution, check box berjalan baik glow, amount glow, distance glow dan outer glow Animasi kernel Klik tombol hitung dan smoothing reset berjalan baik Animasi kernel Klik tombol hitung dan sharpening reset berjalan baik Animasi kernel Klik tombol hitung dan laplacian berjalan reset baik Klik menu lesson 1, 2 dan Video tutorial 3, klik play, pause dan dapat berjalan stop video baik Klik Menu Konvolusi
147
3.
Pengujian dengan Kesesuaian Syarat Interaktif Multimedia Tabel 4.11 Beta Testing dengan Kesesuaian Syarat Interaktif Multimedia No.
Parameter Interaktif
1.
Kemudahan navigasi
2.
Kandungan kognisi
3.
Nilai pengetahuan dan persentasi informasi
4.
Integrasi media
5.
Nilai estetika
6.
Memberikan pembelajaran yang diinginkan oleh pembelajar
Halaman Terdapat pada halaman Intro, Menu Home, Menu Kuliah, Menu Konvolusi, Animasi Kernel Smoothing, Sharpening, Laplacian, Menu Quiz, Menu Petunjuk, Profile dan Menu Exit. Terdapat pada Menu Materi, Ilustrasi Animasi Kernel Smoothing, Sharpening dan Laplacian, Menu Video Tutorial dan Menu Quiz. Terdapat pada Menu Home, Menu Filter Konvolusi, Menu Video Tutorial, Menu Quiz dan Petunjuk. Terdapat pada Menu Filter Konvolusi, Menu Video Tutorial dan Menu Quiz. Terdapat pada Intro, Menu Home, Menu Kuliah, Menu Konvolusi, Petunjuk, Profile dan Menu Exit. 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. 1. 2. 3. 4. 5. 6. 7. 8. 9. 10.
Pertanyaan Apakah tampilan dari aplikasi media pembelajaran ini menarik? Apakah anda mengalami kesulitan dalam menjalankan aplikasi ini? Apakah tombol navigasi pada aplikasi ini memudahkan anda mempelajari materi teknik konvolusi? Apakah unsur audio, video, teks, animasi dan gambar dalam aplikasi membantu pemahaman anda? Apakah aplikasi ini dapat membantu anda untuk mengerti materi dari teknik konvolusi ? Apakah anda mengerti ilustrasi animasi filter smoothing yang ada pada aplikasi ini? Apakah anda mengerti ilustrasi animasi filter sharpening yang ada pada aplikasi ini? Apakah anda mengerti ilustrasi animasi filter laplacian yang ada pada aplikasi ini? Apakah aplikasi pembelajaran multimedia ini dapat dijadikan sebagai media presentasi dan alat bantu belajar bagi mahasiswa ? Apakah aplikasi media pembelajaran teknik konvolusi ini mudah digunakan (user friendly) ?
Ya 100%
Tidak 0%
10%
90%
10%
90%
70%
30%
80%
20%
100%
0%
90%
10%
90%
10%
100%
0%
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
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.
150
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.
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
152
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]
153
[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
154
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
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
1
NUR ULFAH SAM - 105091002847
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
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.
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
Perumusan Masalah 1. Bagaimana membuat sebuah aplikasi pembelajaran materi pengolahan citra, pada operasi filter smoothing, sharpening dan laplacian dalam teknik
2
NUR ULFAH SAM - 105091002847
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
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.
fungsi malar (kontinyu) menjadi nilai-nilai diskrit disebut digitalisasi. Citra yang dihasilkan inilah yang disebut citra digital (digital image). (Munir, 2004: 18)
B.
E.
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). Kernel Kernel adalah matriks yang pada umumnya berukuran kecil dengan elemenelemennya 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)
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.
(a)
(b)
Gambar 1 Contoh kernel (a)-(b) Berturutturut kernel berukuran 2x2 dan 3x3 (sel dengan warna abu-abu menyatakan pusat koordinat {0,0})
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
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
3
NUR ULFAH SAM - 105091002847
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
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)
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 U2,1 U3,1 U4,1 U5,1 U6,1
U1,2 U2,2 U3,2 U4,2 U5,2 U6,2
U1,3 U2,3 U3,3 U4,3 U5,3 U6,3
U1,4 U2,4 U3,4 U4,4 U5,4 U6,4
U1,5 U2,5 U3,5 U4,5 U5,5 U6,5
U1,6 U2,6 U3,6 U4,6 U5,6 U6,6
(a) K1,1 K2,1
K1,2 K2,2
K1,3 K2,3
(b) Gambar 2 (a) Citra Input (b) Kernel 2x3 Sesuai contoh pada (Gambar 2) maka nilai pixel sebagai berikut.
O4,3 (u4,3 xK1,1 ) (u4,4 xK1, 2 ) (u4,5 xK1,3 ) (u5,3 xK2,1 ) (u5,4 xK2,2 ) (u5,5 xK2,3 ) Operator konvolusi biasanya menggunakan tanda (*). Secara matematika proses konvolusi U*K dapat dinyatakan sebagai berikut. m
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.
n
O(i, j) U (i k 1, j l 1)K(k, l) k 1 l 1
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. 1 1 3 3 4 2 5 7 6 1 0 1 1 4 4 3 2 4 7 7 0 1 2 1 3 3 3 3 2 7 7 1 1 1 4 4
1 1 1 9 1
1 1 1
1 1 1
1 3 1 3 16 8 1 3
1 3 1
(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.
4
NUR ULFAH SAM - 105091002847
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
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 lowpass yaitu untuk mempertahankan (mempertajam) komponen frekuensi tinggi dan menghilangkan (mengurangi) komponen frekuensi rendah. 1 1 1 9 1
1 8 1
1 1 1
0 1 0
1 4 1
2.
3.
0 1 0
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.
4.
dibutuhkan. Selain itu, proses perhitungan waktu dan biaya yang dibutuhkan untuk mengerjakan seluruh elemen juga akan dilakukan pada tahap ini. 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). 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. Pengiriman Aplikasi yang telah jadi dikemas dalam bentuk CD interaktif pembelajaran dan akan didistribusikan kepada pengguna akhir.
Perencanaan dan Pembiayaan Pada tahap ini peneliti melakukan proses identifikasi kebutuhan dan tujuan, kemampuan multimedia yang
5
NUR ULFAH SAM - 105091002847
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
4.
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.
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
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.
6
NUR ULFAH SAM - 105091002847
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
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.
Gambar 8 Pembuatan Halaman Menu Quiz
Gambar 9 Pembuatan Script Soal Quiz dengan XML
Gambar 4.48 Pembuatan Isi Materi Soal Quiz
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.
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
7
NUR ULFAH SAM - 105091002847
PEMBUATAN APLIKASI PEMBELAJARAN MATERI PENGOLAHAN CITRA DENGAN MENGGUNAKAN TEKNIK KONVOLUSI BERBASIS MULTIMEDIA (Nur Ulfah Sam)
Sutoyo, T., et all. 2009. Teori Pengolahan Citra Digital. Yogyakarta: Andi Offset
DAFTAR PUSTAKA Anderson, H.Ronald. 1987. Pemilihan dan Pengembangan Media untuk Belajar. Jakarta: Rajawali Pers
Suyanto, M. 2003. Multimedia Alat untuk Meningkatkan Keunggulan Bersaing. Yogyakarta: Andi Offset Sutopo, A. H. 2003. Multimedia Interaktif dengan Flash. Yogyakarta: Graha Ilmu
Arsyad, Azhar. 1997. Media Pengajaran. Jakarta: Raja Grafindo Persada
Vaughan, Tay. 2006. Multimedia Making It Work Edisi 6. Yogyakarta: Andi Offset
Mayer, E.Richard. 2009. Multimedia Learning: Prinsip-prinsip dan Aplikasi. Yogyakarta: ITS Press
Wijaya, Ch.M dan Prijono, Agus. 2007. Pengolahan Citra Digital Menggunakan Matlab Image Processing Toolbox. Bandung: Informatika
Mayer, E.Richard. 2001. Introduction to Multimedia Learning. The Cambridge Handbook of Multimedia Learning: Cambridge University Press
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]
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
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]
Nazir, M. 2003. Metode Penelitian. Jakarta: Ghalia Indonesia Pressman, R. S. 2002. Rekayasa Perangkat Lunak Pendekatan Praktis. Yogyakarta: Andi Offset
Surjono, Dwi Herman. 1996. Pengembangan Program Pengajaran Berbantuan Komputer (CAI) Dengan Sistem Authoring. [Online] Tersedia: www.commission7.isprs.org/wg7. [31 Juli 2010]
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
8
NUR ULFAH SAM - 105091002847
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.
L1
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
L2
LAMPIRAN 2
L3
L4
L5
LAMPIRAN 3
Hasil Perhitungan Analisa Kuisioner Awal Penelitian Tabel 4.1 Hasil Perhitungan Pernyataan 1 Pernyataan
Jawaban Responden Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju
1
Jumlah Penjawab (orang) 30 16 0 0
Persentase (%) 65.22% 34.78% 0.00% 0.00%
Hubungan Media & Pem belajaran
Sangat Setuju 65.22%
1 2
Setuju, 34.78%
3 4
Sangat Tidak Setuju 0.00%
Tidak Setuju, 0.00%
Gambar 4.1 Grafik Hubungan Media & Pembelajaran Tabel 4.2 Hasil Perhitungan Pernyataan 2 Pernyataan
Jawaban Responden
Jumlah Penjawab (orang)
2
Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju
1 22 23 0
Persentase (%) 2.17% 47.83% 50.00% 0.00%
Efe ktifitas Media Dalam Ke las Perk uliahan
Tidak Se tuju 50.00% Setuju 47.83%
Sangat Tidak Se tuju 0.00%
Sangat Setuju 2.17% 1
2
3
4
Gambar 4.2 Grafik Efektifitas Media dalam Kelas Perkuliahan
L6
Tabel 4.3 Hasil Perhitungan Pernyataan 3 Pernyataan
Jawaban Responden Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju
3
Jumlah Penjawab (orang) 0 32 14 0
Persentase (%) 0.00% 69.57% 30.43% 0.00%
Kemampuan Responden Terhadap Respon Verbal
Setuju 69.57%
Tidak Setuju 30.43%
1 2 3 4
Sangat Tidak Setuju 0.00%
Sangat Setuju 0.00%
Gambar 4.3 Grafik Kemampuan Responden Terhadap Respon Verbal Tabel 4.4 Hasil Perhitungan Pernyataan 4 Pernyataan
4
Jawaban Responden Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju
Jumlah Penjawab (orang) 0 13 31 2
Persentase (%) 0.00% 28.26% 67.39% 4.35%
Ke mam puan Res ponden M engerti Materi Lew at Media Verbal
Tidak Setuju 67.39%
1 2 3
Setuju 28.26%
4 Sangat Tidak Setuju 4.35%
Sangat Setuju 0.00%
Gambar 4.4 Grafik Kemampuan Responden Mengerti Materi Lewat Media Verbal
L7
Tabel 4.5 Hasil Perhitungan Pernyataan 5 Pernyataan 5
Jawaban Responden Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju
Jumlah Penjawab (orang) 2 24 19 1
Persentase (%) 4.35% 52.17% 41.30% 2.17%
Kesukaan Terhadap Media Komunikasi Verbal Yang Digunakan Dosen
Setuju 52.17%
Tidak Setuju 41.30% 1 2 3 4 Sangat Tidak Setuju 2.17%
Sangat Setuju 4.35%
Gambar 4.5 Grafik Kesukaan Terhadap Media Komunikasi Verbal yang Digunakan Dosen Tabel 4.6 Hasil Perhitungan Pernyataan 6 Pernyataan
6
Jawaban Responden Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju Tidak Menjawab
Jumlah Penjawab (orang) 2 13 26 3 2
Persentase (%) 4.35% 28.26% 56.52% 6.52% 4.35%
Persentase Responden Dalam Mem aham i Materi Pengolahan Citra Menggunakan Buku
Tidak Setuju 56.52%
1 2 3
Sangat Tidak Setuju 6.52%
Setuju 28.26% Sangat Setuju 4.35%
4 5
Tidak Menjawab 4.35%
Gambar 4.6 Grafik Persentase Responden dalam Memahami Materi Pengolahan Citra Menggunakan Buku
L8
Pernyataan
7
Tabel 4.7 Hasil Perhitungan Pernyataan 7 Jawaban Responden Jumlah Penjawab (orang) Sangat Setuju 0 Setuju 12 Tidak Setuju 30 Sangat Tidak Setuju 3 Tidak Menjawab 1
Persentase (%) 0.00% 26.09% 65.22% 6.52% 2.17%
Mengerti Materi Pengolahan Citra Yang Bersifat Pe rhitungan Matem atis
Tidak Setuju 65.22%
1 2 3 4
Sangat Tidak Se tuju 6.52%
Se tuju 26.09% Sangat Setuju 0.00%
5
Tidak Menjaw ab 2.17%
Gambar 4.7 Grafik Jumlah Responden Mengerti Materi Pengolahan Citra yang Bersifat Perhitungan Matematis Tabel 4.8 Hasil Perhitungan Pernyataan 8 Pernyataan
8
Jawaban Responden Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju Tidak Menjawab
Jumlah Penjawab (orang) 0 18 26 1 1
Persentase (%) 0.00% 39.13% 56.52% 2.17% 2.17%
Kemampuan Retensi (Daya Ingat) Responden Terhadap Materi Pengolahan Citra Tidak Setuju 56.52% 1 2 Sangat Tidak Setuju 2.17%
Setuju 39.13%
3 4 5
Tidak Menjawab 2.17%
Sangat Setuju 0.00%
Gambar 4.8 Grafik Kemampuan Retensi (Daya Ingat) Responden Terhadap Materi Pengolahan Citra
L9
Tabel 4.9 Hasil Perhitungan Pernyataan 9 Pernyataan
9
Jawaban Responden Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju Tidak Menjawab
Jumlah Penjawab (orang) 2 19 21 3 1
Persentase (%) 4.35% 41.30% 45.65% 6.52% 2.17%
Kem am puan Res ponden Dalam Menerapk an Antara Materi Dengan Contoh Soal
Tidak Setuju 45.65% 1 2 Setuju 41.30%
3 Sangat Tidak Se tuju 6.52%
4 5
Tidak Menjaw ab 2.17%
Sangat Setuju 4.35%
Gambar 4.9 Grafik Kemampuan Responden dalam Menerapkan Antara Materi dengan Contoh Soal Tabel 4.10 Hasil Perhitungan Pernyataan 10 Pernyataan
10
Jawaban Responden Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju Tidak Menjawab
Jumlah Penjawab (orang) 3 36 5 0 2
Persentase (%) 6.52% 78.26% 10.87% 0.00% 4.35%
Kesukaan Responden Terhadap Ilustrasi
Setuju 78.26%
1 Tidak Setuju 10.87%
2 3 4
Sangat Setuju 6.52%
Sangat Tidak Setuju 0.00%
Gambar 4.10 Grafik Kesukaan Responden Terhadap Ilustrasi
L10
Tabel 4.11 Hasil Perhitungan Pernyataan 11 Pernyataan
11
Jawaban Responden Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju Tidak Menjawab
Jumlah Penjawab (orang) 13 31 1 0 1
Persentase (%) 28.26% 67.39% 2.17% 0.00% 2.17%
Penam bahan Ilustrasi Gam bar Pada Media Pembelajaran Setuju 67.39%
1 2 3 4
Tidak Setuju 2.17%
Sangat Setuju 28.26%
5
Sangat Tidak Setuju 0.00%
Tidak Menjaw ab 2.17%
Gambar 4.11 Grafik Penambahan Ilustrasi Gambar pada Media Pembelajaran
Tabel 4.12 Hasil Perhitungan Pernyataan 12 Pernyataan
12
Jawaban Responden Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju Tidak Menjawab
Jumlah Penjawab (orang) 6 25 13 1 1
Persentase (%) 13.04% 54.35% 28.26% 2.17% 2.17%
Kesukaan Responden Terhadap Unsur Audio
Setuju 54.35%
Tidak Setuju 28.26%
1 2 3 4
Sangat Setuju 13.04%
Tidak Menjaw ab 2.17%
Sangat Tidak Setuju 2.17%
5
Gambar 4.12 Grafik Kesukaan Responden Terhadap Unsur Audio
L11
Tabel 4.13 Hasil Perhitungan Pernyataan 13 Pernyataan
13
Jawaban Responden Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju Tidak Menjawab
Jumlah Penjawab (orang) 7 35 3 0 1
Persentase (%) 15.22% 76.09% 6.52% 0.00% 2.17%
Kesukaan Terhadap Unsur Video Setuju 76.09%
1 2 3 Tidak Setuju 6.52%
4 5
Sangat Setuju 15.22% Tidak Menjaw ab 2.17%
Sangat Tidak Setuju 0.00%
Gambar 4.13 Grafik Kesukaan Responden Terhadap Unsur Video Tabel 4.14 Hasil Perhitungan Pernyataan 14 Pernyataan
14
Jawaban Responden Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju Tidak Menjawab
Jumlah Penjawab (orang) 14 27 3 0 2
Persentase (%) 30.43% 58.70% 6.52% 0.00% 4.35%
Kesukaan Terhadap Unsur Animasi Pada Media Belajar Setuju 58.70%
1 2 3 4 Sangat Setuju 30.43%
5 Tidak Menjaw ab 4.35%
Tidak Setuju 6.52% Sangat Tidak Setuju 0.00%
Gambar 4.14 Grafik Kesukaan Responden Terhadap Unsur Animasi
L12
Tabel 4.15 Hasil Perhitungan Pernyataan 15 Pernyataan
15
Jawaban Responden Sangat Setuju Setuju Tidak Setuju Sangat Tidak Setuju Tidak Menjawab
Jumlah Penjawab (orang) 28 16 1 0 1
Persentase (%) 60.87% 34.78% 2.17% 0.00% 2.17%
Kesukaan Te rhadap Kom binasi Unsur Audio, Video & Animasi (Multim edia)
1
Sangat Setuju 60.87%
Se tuju 34.78%
2 3 4 5
Tidak Se tuju 2.17% Sangat Tidak Setuju 0.00%
Tidak Menjaw ab 2.17%
Gambar 4.15 Grafik Kesukaan Responden Terhadap Kombinasi Unsur Audio, Video & Animasi Tabel 4.16 Pertanyaan 1 Pertanyaan 1
Jawaban Responden Ya Tidak
Jumlah Penjawab (orang) 33 13
Persentase (%) 71.74% 28.26%
Persentase Pertanyaan 1
1 Ya 71.74%
2 Tidak 28.26%
Gambar 4.16 Grafik Persentase Pertanyaan 1
L13
Tabel 4.17 Pertanyaan 2 Pertanyaan 2
Jawaban Responden Ya Tidak
Jumlah Penjawab (orang) 30 16
Persentase (%) 65.22% 34.78%
Pers entas e Pertanyaan 2 1 Ya 65.22%
2
Tidak 34.78%
Gambar 4.17 Grafik Persentase Pertanyaan 2
Tabel 4.18 Pertanyaan 3 Pertanyaan 3
Jawaban Responden Ya Tidak
Jumlah Penjawab (orang) 17 29
Persentase (%) 36.96% 63.04%
Persentase Pertanyaan 3 1 2 Tidak 63.04%
Ya 36.96%
Gambar 4.18 Grafik Persentase Pertanyaan 3 Tabel 4.19 Pertanyaan 4 Pertanyaan 4
Jawaban Responden Ya Tidak Tidak Menjawab
Jumlah Penjawab (orang) 9 36 1
L14
Persentase (%) 19.57% 78.26% 2.17%
Persentase Pertanyaan 4 Tidak 78.26%
1 2 3
Tidak Menjaw ab 2.17%
Ya 19.57%
Gambar 4.19 Grafik Persentase Pertanyaan 4 Tabel 4.20 Pertanyaan 5 Pertanyaan 5
Jawaban Responden Ya Tidak Tidak Menjawab
Jumlah Penjawab (orang) 24 21 1
Persentase (%) 52.17% 45.65% 2.17%
Persentase Pertanyaan 5 1 2 Tidak 45.65%
Ya 52.17%
3
Tidak Menjawab 2.17%
Gambar 4.20 Grafik Persentase Pertanyaan 5 Tabel 4.21 Pertanyaan 6 Pertanyaan Jawaban Responden Jumlah Penjawab (orang) Ya 30 6 Tidak 14 Tidak Menjawab 2
L15
Persentase (%) 65.22% 30.43% 4.35%
Persentase Pertanyaan 6 1 Tidak 30.43%
2 3
Ya 65.22%
Tidak Menjaw ab 4.35%
Gambar 4.21 Grafik Persentase Pertanyaan 6 Tabel 4.22 Pertanyaan 7 Pertanyaan 7
Jawaban Responden Ya Tidak Tidak Menjawab
Jumlah Penjawab (orang) 27 18 1
Persentase (%) 58.70% 39.13% 2.17%
Perse ntase Pertanyaan 7 1 2 Ya 58.70%
3
Tidak 39.13% Tidak Menjaw ab 2.17%
Gambar 4.22 Grafik Persentase Pertanyaan 7 Tabel 4.23 Pertanyaan 8 Pertanyaan 8
Jawaban Responden Ya Tidak Tidak Menjawab
Jumlah Penjawab (orang) 43 2 1
L16
Persentase (%) 93.48% 4.35% 2.17%
Perse ntase Pertanyaan 8 1
Ya 93.48%
2 3
Tidak Menjaw ab 2.17%
Tidak 4.35%
Gambar 4.23 Grafik Persentase Pertanyaan 8
Pertanyaan 9
Tabel 4.24 Pertanyaan 9 Jawaban Responden Jumlah Penjawab (orang) Ya 42 Tidak 3 Tidak Menjawab 1
Persentase (%) 91.30% 6.52% 2.17%
Perse ntase Pertanyaan 9 Ya 91.30%
1 2 3
Tidak Menjaw ab 2.17%
Tidak 6.52%
Gambar 4.24 Grafik Persentase Pertanyaan 9 Tabel 4.25 Pertanyaan 10 Pertanyaan 10
Jawaban Responden Ya Tidak Tidak Menjawab
Jumlah Penjawab (orang) 39 6 1
Persentase (%) 84.78% 13.04% 2.17%
Persentase Pertanyaan 10 1 2
Ya 84.78%
3
Tidak Menjaw ab 2.17%
Tidak 13.04%
Gambar 4.25 Grafik Persentase Pertanyaan 10
L17
LAMPIRAN 4 Tabel Pengumpulan Data
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
Jenis Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar Gambar
Format BMP BMP BMP BMP BMP BMP BMP BMP BMP BMP BMP BMP BMP JPEG JPEG GIF JPEG JPEG JPEG JPEG JPEG JPEG
Size 768 Kb 257 Kb 65 Kb 257 Kb 65 Kb 65 Kb 65 Kb 768 Kb 768 Kb 65 Kb 65 Kb 65 Kb 1.29 MB 28 Kb 92.4 Kb 14.9 Kb 240 Kb 68.7 Kb 192 Kb 134 Kb 25.6 Kb 866 Kb
Sumber www.informatika.org www.informatika.org www.informatika.org www.informatika.org www.informatika.org www.informatika.org www.informatika.org www.informatika.org www.informatika.org www.informatika.org www.informatika.org www.informatika.org www.informatika.org www.google.com www.google.com www.google.com www.google.com www.google.com www.google.com www.google.com www.google.com www.google.com
File Gambar No. 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. 22.
Nama File Baboon Barbara Bird Boat Cameraman Circles Girl Lena Peppers Sanfransisco Slope Text Zelda Morph-man Lena edge Color wheel Brightness change Biggie Tag Shapes Design texture Concept contrast Overview Wood texture
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 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"); }
Master.swf stop(); fscommand("fullscreen", "true"); fscommand("allowscale", "false"); Preloading: onEnterFrame=function() { if(getBytesLoaded()==getBy tesTotal()) { gotoAndPlay(3); delete onEnterFrame; } nBytesLoaded = int(getBytesLoaded()/1024) ; nBytesTotal = int(getBytesTotal()/1024);
Frame 3: gotoAndPlay("loopit");
percent = int((nBytesLoaded/nBytesTotal)*10 0); bar_mc.gotoAndStop(percent /2);
Music start: musik = new Sound() musik.attachSound ("intro_latar") musik.setVolume (100) musik.start (0,3)
info_preloader = "Loading " + percent + " % from " + nBytesLoaded + " Kb of " + nBytesTotal + " Kb"; }
var current:Number=1; preface_text.gotoAndStop(current) ; picUji1.gotoAndStop(current)
stop(); fscommand("fullscreen", "true"); fscommand("allowscale", "false"); loadMovieNum("intro.swf", 1);
if (current < preface_text._totalframes) { gotoAndPlay("Loop"); current++; }
unloadMovieNum(1); stopAllSounds(); loadMovieNum("pilih menu.swf",3); Intro.swf setProperty("object2", random(550)); setProperty("object2", random(400)); setProperty("object2", random(10)*10); setProperty("object2", random(360));
if( kopi < preface_text._totalframes ) { gotoAndPlay("loop"); kopi++; } stopAllSounds(); gotoAndPlay("start musik")
_x, _y, _alpha, _rotation,
Tanggal & Waktu: this.onEnterFrame = function () { oWaktu = new Date();
Frame 1: a = int(Number(random(5))+1); timeGap = int((random(5))*100); startTimer = getTimer();
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);
import flash.filters.BlurFilter; import flash.filters.ConvolutionFilter; import flash.filters.GlowFilter;
stop();
imageCb.addEventListener("change" , toggleImage); dropShadowCh.addEventListener("cl ick", toggleDropShadow); dropShadowDistanceNs.addEventList ener("change", updateDropShadowProperties); dropShadowBlurNs.addEventListener ("change", updateDropShadowProperties); dropShadowAngleNs.addEventListene r("change", updateDropShadowProperties); blurCh.addEventListener("click", toggleBlur); blurAmountNs.addEventListener("ch ange", updateBlurProperties);
var isDropShadow:Boolean = false; var isBlur:Boolean = false; var isConvolution:Boolean = false; var isGlow:Boolean = false;
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();
var 10; var var var
dropShadowDistance:Number =
var 20; var var var
convolutionAmount:Number =
dropShadowAngle:Number = 40; dropShadowBlur:Number = 4; blurAmount:Number = 10;
glowAmount:Number = 20; glowAlpha:Number = 5; glowInnerBlur:Number = 3;
convolutionCh.addEventListener("c lick", toggleConvolution); convolutionAmountNs.addEventListe ner("change", updateConvolutionProperties); glowCh.addEventListener("click", toggleGlow); glowAmountNs.addEventListener("ch ange", updateGlowProperties); glowAlphaNs.addEventListener("cha nge", updateGlowProperties); glowInnerNs.addEventListener("cha nge", updateGlowProperties);
my_sound3.attachSound("sound_kuli ah"); my_sound3.start();
this.imageCb.dataProvider = [{label: "Barbara", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/Barbara1.jpg"},
on (release) { my_sound2.start(); this.gotoAndStop(1); } Convolution.swf import flash.filters.DropShadowFilter;
{label: "Baboon", data:
L22
"G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_satu.jpg"},
glowCh.label = "Glow"; glowAmountNs.maximum = 20; glowAmountNs.value = 10; glowAlphaNs.maximum = 20; glowAlphaNs.value = 5; glowInnerNs.maximum = 20; glowInnerNs.value = 4;
{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"},
var imageListener:Object = new Object(); imageListener.onLoadInit = function(clip:MovieClip):Void { loadingImageLbl.visible = false; };
{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"},
this.createEmptyMovieClip("imageC lip", 1); imageClip.createEmptyMovieClip("n estedClip", 1);
{label: "Lena", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_tujuh.jpg"},
imageClip._x = 370; imageClip._y = 350; var imageLoader:MovieClipLoader = new MovieClipLoader(); imageLoader.addListener(imageList ener);
{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"},
imageLoader.loadClip(imageCb.valu e, imageClip.nestedClip); function toggleImage(event:Object):Void { loadingImageLbl.visible = true;
{label: "Slope", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_sepuluh.jpg"},
imageLoader.loadClip(imageCb.valu e, imageClip.nestedClip); }
{label: "Text", data: "G:/APLIKASI SKRIPSIQU/MASTER APP/CITRA UJI/a_sebelas.jpg"},
function toggleDropShadow(event:Object):Vo id { isDropShadow = event.target.selected; setFilters(); }
{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";
function toggleBlur(event:Object):Void { isBlur = event.target.selected; setFilters(); } function toggleConvolution(event:Object):V oid { isConvolution = event.target.selected; setFilters(); }
convolutionAmountNs.maximum = 10; convolutionAmountNs.value = 10;
function toggleGlow(event:Object):Void {
L23
isGlow = event.target.selected; setFilters();
if(isConvolution) { var convolution:ConvolutionFilter = new ConvolutionFilter(convolutionAmou nt, convolutionAmount); filtersArr.push(convolutio n); }
} function updateDropShadowProperties(event: Object):Void { dropShadowDistance = dropShadowDistanceNs.value; dropShadowBlur = dropShadowBlurNs.value; dropShadowAngle = dropShadowAngleNs.value; setFilters(); }
if(isGlow) { var glow:GlowFilter = new GlowFilter(glowAmount, glowAmount, glowAlpha, glowAlpha, glowInner, 50); filtersArr.push(glow); }
function updateBlurProperties(event:Object ):Void { blurAmount = blurAmountNs.value; setFilters(); }
imageClip.filters = filtersArr; } on(release){ loadMovie("Kernel Mask3.swf","holder3"); }
function updateConvolutionProperties(event :Object):Void { convolutionColor = convolutionColorNs.value; setFilters(); }
Tombol Filter Konvolusi: on(release){ loadMovie("Kernel Mask3.swf","holder3"); }
function updateGlowProperties(event:Object ):Void { glowAmount = glowAmountNs.value; glowAlpha = glowAlphaNs.value; glowInner = glowInnerNs.value; setFilters(); }
Tombol Olah Citra: on(release){ loadMovie("convolution.swf ","holder3"); } Tombol Matlab & Pengolahan Citra: on(release){ loadMovie("tutorial.swf"," holder3"); }
function setFilters():Void { var filtersArr:Array = new Array();
Tombol Kuliah: on(release){ loadMovieNum("Kuliah.swf", 0); }
if(isDropShadow) { var dropShadow:DropShadowFilter = new DropShadowFilter(dropShadowDistan ce, dropShadowAngle, 0, 100, dropShadowBlur, dropShadowBlur); filtersArr.push(dropShadow ); }
Tombol Konvolusi: on(release){ loadMovieNum("Menu Kernel Mask.swf",0); }
if(isBlur) { var blur:BlurFilter = new BlurFilter(blurAmount, blurAmount); filtersArr.push(blur); }
Tombol Quiz: on(release){ loadMovieNum("pilih quiz",0); }
L24
Tabel 3.1 Studi Penelitian Sejenis No .
Judul
1.
Yuliarti, Dewi. 2007. ”Perancangan Aplikasi Pembelajaran Matematika untuk Kelas 6 SD Berbasis Multimedia”.
2.
3.
4.
Authoring tool
Kelebihan
Kelemahan
Saran Pengembangan
Desain dibuat lebih menarik, Belum ada menambah soal latihan, pembahasan materi sertakan pembahasan soal evaluasi di aplikasi latihan yang benar & dapat di update/edit untuk menambah soal yang ada. Perangkat ajar masih di Membuat penyimpanan nilai Memberikan Muliasari,Ratna.2008. dominasi oleh unsur record (record keeping) Flash Pro 8 dan pemahaman kepada ”Perancangan Perangkat Ajar teks. untuk mengetahui Photoshop CS siswa dengan tes Statistika SMP Berbasis CAI”. perkembangan hasil belajar evaluasi belajar siswa. Surjono, Dwi H. 1996. Authoring software Menggunakan ”Pengembangan Program software Pengajaran Berbantuan Tersedia tombol- masih sederhana. multimedia lain atau ABC Komputer (CAI) dengan Sisitem tombol interaktif dikombinasikan dengan Authoring”. Studi Kasus: Mata software saat ini Kuliah Fisika-Tekanan Udara. Menyediakan yang Al-Sultan, Sultan dkk. 2006. informasi yang Informasi Flash masih ”Developed of A Computers lengkap tentang citra ditampilkan MX,Adobe Dapat di upload ke dalam dengan Aided Instruction (CAI) satelit kedua Negara didominasi Photoshop dan website dan teks Package in Remote Sensing yaitu Malaysia & gambar Sound Forge serta Educational”. Saudi Arabia beserta pendukung sedikit unsur animasi. sejarahnya Flash 8, Soal-soal latihan Photoshop disertai games agar 7,Swishmax & terlihat menarik Cooledit Pro
84