PERANCANGAN DAN REALISASI SISTEM PENDETEKSI GERAKAN SEBAGAI NATURAL USER INTERFACE ( NUI ) MENGGUNAKAN BAHASA C# Disusun oleh : Jeffry 0822023 Jurusan Teknik Elektro, Fakultas Teknik, Universitas Kristen Maranatha, Jl.Prof.Drg.Suria Sumantri, MPH no.65, Bandung, Indonesia, Email :
[email protected]
ABSTRAK Perancangan sistem pendeteksi gerakan interaktif adalah suatu program yang dirancang untuk memberikan efek interaktif melalui gerakan yang dilakukan user. Pendeteksi gerakan interaktif ini menggunakan dua buah komponen utama yaitu komputer dan webcam. Webcam dirancang agar dapat mendeteksi pergerakan yang terjadi pada interactive space di antara layar komputer dan webcam. Setiap gerakan yang terjadi pada interactive space, tersebut akan direpresentasikan pada layar komputer. Pemrograman yang dilakukan dengan menggunakan bahasa pemrograman C# dan library AForge.Net Framework pada Microsoft Visual Studio 2010. AForge.Net Framework ini digunakan karena dirancang khusus untuk memberikan filter pemrosesan gambar pada bahasa pemrograman C#. Perancangan dimulai dengan membuat dua buah program yaitu pendeteksi gerakan dan efek air pada gambar. Kedua program tersebut akan digabungkan sehingga didapatkan satu buah aplikasi pendeteksi gerakan interaktif. Setelah program dibuat, eksperimen dilakukan terhadap aplikasi agar mendapatkan hasil yang optimal. Eksperimen dilakukan terhadap pengaruh pencahayaan, pengaruh jarak bidang interactive space,. Berdasarkan pengaruh pencahayaan, didapatkan bahwa aplikasi harus dilakukan pada keadaan terang. Berdasarkan pengaruh luas bidang interactive space, didapat bahwa pada distance ( jarak webcam ke layar laptop) 1,5 meter gerakan cursor mouse dengan layar mendekati hasil yang diharapkan. Pada pemrosesan efek air dilakukan beberapa penyesuaian agar hasil optimal, yaitu penetapan radius put drop sebesar 20 pixel dan penentuan timer sebesar 100ms. Kata kunci : interactive space, webcam, bahasa C#, pendeteksi gerakan, AForge.Net Framework, efek air. vii Universitas Kristen Maranatha
DESIGNING AND REALISATION MOVING DETECTION SYSTEM AS NATURAL USER INTERFACE (NUI) USING C# LANGUAGE Write by : Jeffry 0822023 Dept of Electrical Enginering, Faculty of Enginering, Maranatha Cristian University , Prof.Drg.Suria Sumantri Street, MPH no.65, Bandung, Indonesia, Email :
[email protected]
ABSTRACT The designing of interactive moving detection system is program which build to give interactive effect while the user doing movement. This interactive moving detection use two main component, that is computer and webcam. Webcam was designing to detect motion in interactive space between computer and webcam. Every motion did in the interactive space will being representative in computer’s monitor. The program using C# language’s program and library AForge.Net Framework in Microsoft Visual Studio 2010. AForge.Net Framework used because it was build to image filtering in C# language’s program. The first step of designing is make two main program, that is motion detection and water effect in the image. Next step is merge both of the program until the interactive motion detection application made. After that, to make the optimal result, the experiment did. The experiment did to known how the lighting and the distance of interactive space can effect this program. Among to the light effect, this application must doing in the bright condition. Among to the distance of interactive space, has known that in the distance ( webcam to the computer’s monitor) 1,5 metre , the motion of mouse’s cursor are almost have expected result. In the water effect processing, it has been change to get the optimal result, for example the radius of put drop are 20 pixel and the timer elapsed every 100 ms. Keywords: interactive space , webcam ,C# language, motion detection, AForge.Net Framework , water effect viii Universitas Kristen Maranatha
DAFTAR ISI
Halaman Judul ..................................................................................................
i
Lembar Pengesahan ..........................................................................................
ii
Pernyataan Orisinalitas Tugas Akhir…….......................................................
iii
Pernyataan Publikasi Tugas Akhir……...........................................................
iv
Kata Pengantar .................................................................................................
v
Abstrak .............................................................................................................
vii
Abstract ............................................................................................................
viii
Daftar Isi ...........................................................................................................
ix
Daftar Tabel ......................................................................................................
xii
Daftar Gambar ..................................................................................................
xiii
Daftar Lampiran ...............................................................................................
xiv
BAB I
PENDAHULUAN
1.1. Latar Belakang .................................................................................... 1 1.2. Identifikasi Masalah ...........................................................................
2
1.3. Perumusan Masalah ............................................................................
2
1.4. Tujuan dan Manfaat ............................................................................ 2 1.5. Pembatasan Masalah ........................................................................... 3 1.6. Sistematika Penulisan dan Metodologi Penelitian .............................. 3
BAB II LANDASAN TEORI 2.1
Computer Vision………………….. ................................................... 5
2.2
Image Processing ……….…………………………………………… 6
2.3
Natural User Interface ( NUI) …………………………………..…..
8
2.4
AForge.Net ……………... ………….…………...……………....…
11 ix
Universitas Kristen Maranatha
2.4.1. Grayscale Class……………………………………………….
11
2.4.2. Difference Class …………………………………………….
13
2.4.3. Threshold Class ……………………………………………..
14
2.4.4. Erosion Class ………………………………………………..
15
BAB III PERANCANGAN DAN PENDETEKSI GERAKAN DAN EFEK AIR 3.1
Perancangan Letak Pendeteksi Gerakan …………………….....…..
17
3.2
Perancangan Pendeteksi Gerakan Pada Webcam...............................
18
3.2.1. Pengambilan Gambar oleh Webcam ………………………….
18
3.2.2. Proses Pendeteksi Gerakan…………………………………….
21
3.2.3.Pengolahan motion detection menjadi pergerakan cursor mouse 28 3.3 Perancangan Efek Air ……………………………………………….. 36
BAB IV DATA PENGAMATAN DAN ANALISA DATA 4.1
Implementasi dan Analisis Pendeteksi Gerakan.................................
42
4.1.1 Pendeteksi Gerakan Pada Webcam........................................
42
4.1.2 Pencarian titik putih dan perbandingan letak terhadap titik pada layar yang diinginkan ......................................... 4.1.3 Proses pembentukan efek air................................................
44 47
BAB V KESIMPULAN DAN SARAN 5.1. Kesimpulan ........................................................................................
48
5.2. Saran ..................................................................................................
49
DAFTAR PUSTAKA .....................................................................................
50
LAMPIRAN A LAMPIRAN B
x Universitas Kristen Maranatha
DAFTAR TABEL Tabel 4.1 Tabel pengaruh pencahayaan..........................................................
43
Tabel 4.2 Tabel Pengaruh Interactive Space....................................................
46
xi Universitas Kristen Maranatha
DAFTAR GAMBAR
Gambar 2.1 Computer Vision………………………………… ………….….
5
Gambar 2.2 Representasi 24-bit RGB …………………………...………......
7
Gambar 2.3 Pixel sebuah gambar ……………………………………………
7
Gambar 2.4 Perkembangan CLI , GUI dan NUI ……………………...……
8
Gambar 2.5 Grayscale Filter………………………..…………………………..
12
Gambar 2.6 Difference Filter ………………………..………………………
14
Gambar 2.7 Threshold Filter …………………………………...……...……
15
Gambar 2.8 Erosion Filter …………………………………………………..
16
Gambar 3.1 Penempatan Pendeteksi Gerakan ………………….……….…..
17
Gambar 3.2 Flowchart Pengambilan Gambar oleh Webcam …................…..
18
Gambar 3.3 Flowchart Capture Device …………….......………….………..
19
Gambar 3.4 Tampilan Capture Device Form …..….………………………..
20
Gambar 3.5 Tampilan Aplikasi Webcam …….…........……………………..
20
Gambar 3.6 Urutan pengunaan Filter AForge.Net …………………...….….
21
Gambar 3.7 Flowchart Pendeteksi Gerakan …….……….....…….…………
22
Gambar 3.8 Tampilan Menu Motion …….....................................................
23
Gambar 3.9 Flowchart Motion Detection……..........……………………….
24
Gambar 3.10 Hasil pendeteksi gerakan …………........................……….…
28
Gambar 3.11 Flowchart Penghitung Pixel Putih …………….....….……….
29
Gambar 3.12 Hasil dari motion to white pixel detection …….........………..
30
Gambar 3.13 Flowchart motion to white pixel ………….................….…….
31
Gambar 3.14 Flowchart Vertex …………………….……………………….
32
Gambar 3.15 Tampilan aplikasi penghitung pixel putih..................................
33
Gambar 3.16 Flowchart gerakan penganti mouse…….................….....……..
35
Gambar 3.17 Proses Buffer pada efek air …….......................................…..
36
Gambar 3.18 Interpretasi efek air pada gambar 2 dimensi………… ……….
36 xii
Universitas Kristen Maranatha
Gambar 3.19 Gambar terjadinya put drop …………………......……………
37
Gambar 3.20 Gambar pixel efek gelombang air ................................................
38
Gambar 3.21 Flowchart Proses Efek Air …………………………......…......
40
Gambar 4.1 Pendeteksi gerakan pada webcam...............................................
43
Gambar 4.2 Perbandingan letak gerakan terhadap titik pada layar yang diinginkan ..........................................................................................................................
44
Gambar 4.3 Efek Air pada aplikasi Pembentuk Efek Air…………………….
46
xiii Universitas Kristen Maranatha
DAFTAR LAMPIRAN
LAMPIRAN A LIST PROGRAM AFORGE.NET ..............................................................
A-1
LAMPIRAN B LIST PROGRAM MOTION DETECTION WITH WATER EFFECT.......
B-1
xiv Universitas Kristen Maranatha
