69 101 101 94 94
100 106 106 108 105 4,3
=|51-35 + 51-36 + 51-36 + 51-49 + 51-52 + 51-82
+ 51-80 + 51-75 | = 37
56 58
59 59
60 40
43 41
41 41
33 35
36 36
39 45
49 51
52 53
72 82
80 75
76 69 101 101 94
94 100 106 106 108 105
4,4 =|52-36 + 52-36 + 52-39
+ 52-51 + 52-53 + 52-80 + 52-75 + 52-76 |
= 30
56 58
59 59
60 40
43 41
41 41
33 35
36 36
39 45
49 51
52 53
72 82
80 75
76 69 101 101 94
94 100 106 106 108 105
4,5
Tabel 3.12 Nilai matriks piksel citra sesudah deteksi tepi dengan algoritma Homogeneity
14 39
43 58
60 66
42 37
30 88
35 1
92 56
7
3.2 Perancangan Sistem
Dalam membangun sebuah sistem perlu adanya perancangan perangkat lunak yang nantinya sangat membantu dalam pembangunan sistem. Perancangan perangkat lunak
dilakukan agar memudahkan pengguna untuk memakai sistem tersebut. Dalam
Universitas Sumatera Utara
penelitian ini perancangan perangkat lunak dibuat sebaik mungkin agar dapat berjalan sebagaimana mestinya.
Perancangan merupakan tahap lanjutan dari analisis sistem dimana pada perancangan sistem digambarkan rancangan sistem yang akan dibangun sebelum
dilakukan pengkodean kedalam suatu bahasa pemograman. Dalam perancangan sistem tidak lepas dari hasil analisis yang menjadikan sistem dapat dirancang. Desain
umum yang akan diaplikasikan bertujuan untuk memberikan gambaran secara umum tentang sistem yang akan dibangun. Perancangan sistem yang dilakukan terdiri dari
perancangan flowchart dan tampilan antarmuka Interface.
3.2.1 Perancangan Flowchart
3.2.1.1 Flowchart Umum Sistem
Flowchart umum sistem dapat dilihat pada Gambar 3.3. Mulai
Input Citra bmp Mulai
Input Citra bmp
Algoritma Prewitt
Citra Hasil Deteksi Tepi
Algoritma Homogeneity
Citra Hasil Deteksi Tepi
A B
Universitas Sumatera Utara
Gambar 3.3 Flowchart umum sistem
3.2.1.2 Flowchart Deteksi Tepi Menggunakan Algoritma Prewitt
Selesai Selesai
A B
Tampilkan Citra Hasil Deteksi Tepi
Tampilkan Citra Hasil Deteksi Tepi
Universitas Sumatera Utara
Flowchart Deteksi Tepi Menggunakan Algoritma Prewitt dapat dilihat pada Gambar 3.4.
Citra Hasil Deteksi Tepi
Selesai Membatasi gradien
sesuai batas ambang threshold
C Mulai
Input Citra
Ambil nilai piksel dari citra
Konvolusi nilai piksel dengan matriks 3x3
kernel x dan kernel y Menghitung
Gradien
C
Universitas Sumatera Utara
Gambar 3.4 Flowchart Deteksi Tepi Menggunakan Algoritma Prewitt
3.2.1.3 Flowchart Deteksi Tepi Menggunakan Algoritma Homogeneity
Flowchart deteksi tepi menggunakan algoritma homogeneity dapat dilihat pada Gambar 3.5.
Universitas Sumatera Utara
Mulai
Input Citra
Ambil nilai piksel dari citra
Pengurangan Piksel Pusat Dengan Masing-
Masing Sisi dalam matriks 3x3
D
Universitas Sumatera Utara
Gambar 3.5 Flowchart Deteksi Tepi Menggunakan Algoritma Homogeneity
3.2.2 Perancangan Unified Modeling Language UML
Penulis menggunakan Unified Modeling Language UML dalam mendesain dan merancang aplikasi Pengenalan Lagu. UML yang akan digunakan ialah use case
diagram dan activity diagram.
3.2.2.1 Indentifikasi Use Case Diagram
Untuk mengetahui actor dan use case yang akan digunakan, maka dilakukan identifikasi actor dan identifikasi use case. Setelah mendapatkan actor dan use case,
maka use case diagram dapat digambarkan.
Identifikasi actor dilakukan dengan menjawab pertanyaan-pertanyaan berikut, yaitu:
1. Siapa yang menggunakan sistem?
Jawaban: Citra Hasil
Deteksi Tepi
Selesai Menghitung
Gradien
Membatasi gradien sesuai batas
ambang threshold D
Universitas Sumatera Utara
Pengguna. 2.
Siapa yang diperlukan untuk melaksanakan fungsi pada sistem? Jawaban:
Pengguna. 3.
Bagaimana pengguna menggunakan sistem? Jawaban:
Pengguna menggunakan sistem dengan memasukkan citra RGB berformat bmp sebagai citra awal untuk dideteksi tepinya, kemudian citra tersebut
diambil nilai pikselnya. Setelah diambil, dilakukan deteksi tepi menggunakan algoritma Prewiit atau algoritma Homogeneity.
Dengan demikian actor yang diperoleh adalah pengguna. Untuk mendapatkan use case dari pengguna, maka harus ditentukan hal-hal apa saja yang dapat dilakukan
pengguna pada sistem. Adapun hal-hal yang dapat dilakukan oleh pengguna terhadap sistem adalah memasukkan citra berformat bmp.
Use case diagram yang digambarkan berdasarkan actor dan use case yang telah diperoleh. Adapun gambar use case diagram dapat dilihat pada Gambar 3.6.
Gambar 3.6 Use Case Deteksi Tepi
3.2.2.2 Use Case Deteksi Tepi
Use case deteksi tepi merupakan use case yang akan menjelaskan proses ketika pengguna menggunakan aplikasi untuk mendeteksi tepi pada citra.
Deteksi Tepi Algoritma Prewitt
atau Algoritma Homogeneity
Sistem
Input Citra uses
extends Algoritma
Homogeneity Pengguna
Algoritma Prewitt
extends
Universitas Sumatera Utara
Tabel 3.13 Dokumentasi naratif Use Case Deteksi Tepi
Nama use case Deteksi Tepi
Actor Pengguna
Deskripsi Use case ini mendeksripsikan proses mendeteksi tepi
pada citra Prakondisi
Sudah masuk ke tampilan aplikasi deteksi tepi pada citra
Bidang khas suatu kejadian
Kegiatan Pengguna Respon Sistem
1. Pilih citra bmp
2. Pilih perintah “Proses”
untuk melakukan deteksi tepi pada citra
menggunakan algoritma prewitt
3. Pilih perintah “Proses”
untuk melakukan deteksi tepi pada citra
menggunakan algoritma homogeneity
1. Sistem akan
menampilkan jendela memilih citra
2. Sistem akan
mengambil nilai piksel 3.
Sistem akan memulai untuk melakukan
deteksi tepi pada citra menggunakan
algoritma prewitt
4. Sistem akan memulai
untuk melakukan deteksi tepi pada citra
menggunakan algoritma homogeneity
5. Sistem akan
menampilkan citra hasil deteksi tepi pada
citra
Pasca kondisi Deteksi tepi pada citra selesai dilakukan
Activity diagram untuk use case deteksi tepi pada citra dapat dilihat pada Gambar 3.7
Universitas Sumatera Utara
Pengguna Sistem
Gambar 3.7 Activity Diagram Deteksi Tepi
Pilih citra berformat bmp
Tampilkan jendela pilih citra
Menampilkan citra yang dipilih
sebelumnya
Pilih perintah proses deteksi
tepi Memulai deteksi tepi
Tampilkan citra hasil
deteksi tepi Menggambil nilai
piksel
Tampilkan citra hasil
deteksi tepi Deteksi Tepi
Menggunakan Algoritma
Prewitt Deteksi Tepi
Menggunakan Algoritma
Homogeneity Mengisi nilai batas
ambang Threshold
Pilih perintah Simpan
Simpan Citra
= Algoritma Prewit = Algoritma Prewit
Universitas Sumatera Utara
3.2.3 Perancangan Tampilan Antarmuka Interface
3.2.3.1 Rancangan Jendela Utama
Rancangan Jendela Utama merupakan tampilan awal saat program dijalankan. Pada rancangan ini terdapat file dan tentang. Rancangan Jendela Utama dapat dilihat pada
Gambar 3.8. X
Gambar 3.8 Rancangan jendela utama
Keterangan: 1.
Kotak nomor 1 merupakan Menu yang berfungsi untuk menampilkan menu File atau Tentang.
2. Kotak nomor 2 merupakan Picturebox yang berfungsi sebagai tempat
menampilkan citra asli. 3.
Kotak nomor 3 merupakan CommandButton yang berfungsi untuk memilih citra yang akan dideteksi tepi.
4. Kotak nomor 4 merupakan CommandButton yang berfungsi untuk mereset
objek yang ada pada jendela. 5.
Kotak nomor 5 merupakan Picturebox yang berfungsi sebagai tempat 1
Gambar Asli Algoritma Prewitt
2 5
Proses Simpan
Besarkan Threshold
6 7
9 8
Reset Buka Gambar
3 4
10
Proses Simpan
Besarkan Threshold
11 12
14 13
Algoritma Homogeneity
15 16
File Tentang
Universitas Sumatera Utara
menampilkan citra hasil deteksi tepi menggunakan algoritma prewiit. 6.
Kotak nomor 6 merupakan Textbox yang berfungsi untuk memasukan batas ambang,
7. Kotak nomor 7 merupakan CommandButton yang berfungsi untuk memulai
proses deteksi tepi menggunakan algoritma Prewiit. 8.
Kotak nomor 8 merupakan CommandButton yang berfungsi untuk menyimpan citra hasil deteksi tepi menggunakan algoritma Prewiit.
9. Kotak nomor 9 merupakan CommandButton yang berfungsi untuk melihat
citra hasil dalam ukuran sebenarnya. 10.
Kotak nomor 10 merupakan Picturebox yang berfungsi sebagai tempat menampilkan citra hasil deteksi tepi menggunakan algoritma Homogeneity.
11. Kotak nomor 11 merupakan Textbox yang berfungsi untuk memasukan batas
ambang, 12.
Kotak nomor 12 merupakan CommandButton yang berfungsi untuk memulai proses deteksi tepi menggunakan algoritma Homogeneity.
13. Kotak nomor 13 merupakan CommandButton yang berfungsi untuk
menyimpan citra hasil deteksi tepi menggunakan algoritma Homogeneity. 14.
Kotak nomor 14 merupakan CommandButton yang berfungsi untuk melihat citra hasil dalam ukuran sebenarnya.
15. Kotak nomor 15 merupakan Textbox yang berfungsi untuk menampilkan
keterangan hasil proses deteksi tepi seperti MSE dan PSNR. 16.
Kotak nomor 16 merupakan Textbox yang berfungsi untuk menampilkan keterangan hasil proses deteksi tepi seperti MSE dan PSNR.
3.2.3.2 Rancangan Jendala Tentang
Rancangan Jendela Tentang merupakan jendela berisi keterangan mengenai aplikasi. Pada rancangan ini terdapat picturebox dan textbox. Rancangan Jendela Tentang dapat
dilihat pada Gambar 3.9.
Universitas Sumatera Utara
X
Gambar 3.9 Rancangan jendela tentang
Keterangan: 1.
Kotak nomor 1 merupakan Picturebox yang berfungsi sebagai tempat
menampilkan gambar.
2. Kotak nomor 2 merupakan Textbox yang berfungsi untuk menampilkan
keterangan tentang aplikasi.
1
2
Universitas Sumatera Utara
BAB 4
IMPLEMENTASI DAN PENGUJIAN
4.1 Implementasi Sistem
