Pengenalan Jari Tangan Sebagai Interaksi Pada Augmented Reality Bangunan Heritage Kota Medan Kawasan Matsum dan Kesawan Chapter III V
21
BAB 3
ANALISIS DAN PERANCANGAN
Bab ini akan membahas tentang implementasi metode yang digunakan untuk
mengenali gerakan tangan manusia. Adapun 2 (dua) tahap yang akan dibahas pada
bab ini, yaitu tahap analisis dan tahap perancangan system.
3.1
Data yang Digunakan
Data yang digunakan dalam penelitian ini berupa citra yang diambil secara real-time
melalui kamera web. Dalam pengambilan citra, ada beberapa aspek yang yang perlu
diperhatikan yaitu kualitas kamera web, pencahayaan(lighting) dan jarak pengambilan
gambar.
3.2
Analisis Sistem
Metode yang digunakan untuk mengenali gestur tangan manusia melalui kamera web
yang digunakan sebagai interaksi manusia-komputer untuk menjalankan instruksi
yang telah ditentukan. Penelitian ini terdiri dari beberapa langkah, adapun langkahlangkah tersebut yaitu: pengambilan citra atau gambar melalui kamera web; resizing
citra; konversi warna RGB ke HSV; pendeteksian warna kulit dengan mengatur nilai
range HSV yang diinginkan; memperbaiki citra dengan median blur utk
menghilangkan noise dandilasi; ekstraksi fitur dengan contour dan mencari convexhull dari contour yang telah tertangkap; menghitung convexity defects; menghitung
jumlah jari tangan yang terdeteksi. Setelah langkah tersebut telah dilakukan dan
berhasil maka akan didapatkan jumlah jari tangan manusia yang berupa suatu instruksi
atau perintah untuk memilih sebuah scene yang terdapat pada aplikasi Unity 3D.
Adapun arsitektur umum yang menggambarkan metode pada penelitian ini
ditunjukkan pada Gambar 3.1.
Universitas Sumatera Utara
22
Citra ditangkap
web camera
Pre-Processing
Perbaikan Citra
Konversi RGB ke HSV
Erosion
Atur range HSV
Dilation
Tresholding
Median Blur
Klasifikasi
Menghitung Jumlah Jari
Eksraksi Fitur
Contour
Convex-Hull
Output
Pemilihan Scene Unity
berdasarkan jumlah jari
yang terdeteksi
Convexity Defects
Gambar 3.1 Arsitektur Umum
3.2.1
Skin Detection
Proses segmentasi digunakan untuk mendapatkan objek yang akan diidentifikasi yang
dalam hal ini adalah citra tangan.Agar citra tangan dari pengguna yang diambil dari
kamera dapat diidentifikasi sebagai suatu perintah.
Pendeteksian objek tangan berdasarkan warna kulit ini sangat dipengaruhi oleh
intensitas cahaya pada citra dan juga kualitas dari kamera web itu sendiri dan juga
latar pengambilan objek itu sendiri.Pada penelitian ini digunakan metode warna HSV
Universitas Sumatera Utara
23
sebagai segmentasi gambar berdasarkan warna.Adapun langkah-langkah mendeteksi
warna kulit manusia sebagai berikut.
3.2.1.1 Konversi RGB ke HSV
Setelah citra tertangkap oleh kamera web, kemudian akan dikonversi ke ruang warna
HSV. Format HSV lebih cocok untuk melakukan pengolahan berdasarkan warna
daripada menggunakan RGB, karena kita mendapatkan saluran tunggal (H) yang
memegang nilai warna pixel dan dua saluran lainnya (S dan V) yang memegang
tingkat saturasi dan kecerahan tingkat pixel. Pada penelitian ini menggunakan fungsi
cvtColor() yang tersedia pada OpenCV. Berikut adalah penjelasan fungsi tersebut.
cvtColor (Mat src, Mat dst, Imgproc, int code);
Parameter:
•
Src
: citra masukan yaitu rgbaMat
•
Dst
: citra keluaran yaitu hsvMat
•
Code
: kode konversi ruang warna yaitu COLOR_BGR2HSV
3.2.1.2 Atur Range HSV
Setelah dilakukan konversi ke format HSV, selanjutnya dilakukan perubahan citra ke
dalam bentuk citra biner menggunakan proses thresholding. Deteksi warna kulit
dilakukan dengan cara menentukan rentang nilai dari H, S, dan V, Sehingga untuk
setiap piksel dalam citra, jika berada dalam range tersebut, maka akan dianggap
sebagai warna kulit, sedangkan untuk yang berada di luar range tersebut akan
dianggap sebagai background. Untuk mengecek apakah element tersebut berada di
range pada penelitian ini digunakan fungsi Core.inRange() yang tersedia pada
OpenCV. Berikut ini adalah penjelasan tentang fungsi tersebut.
inRange (Mat src, Scalar lowerb, Scalar upperb, Mat dst);
Parameter :
•
src
: citra masukan yaitu hsvMat
•
dst
: citra keluaran yaitu hsvMat
•
Lowerb
: batas bawah array
•
Upperb
: batas atas array
Universitas Sumatera Utara
24
3.2.1.3 Tresholding
Untuk setiap piksel dalam citra, jika nilai H, S, V berada dalam rentang tersebut,
maka akan dianggap sebagai warna kulit dan nilainya akan diubah menjadi 255
(warna putih). Sedangkan untuk yang berada di luar rentang itu, akan dianggap
sebagai latar belakang dan akan diubah nilainya menjadi 0 (warna hitam). Dengan
metode ini, didapatkan citra biner hasil skin detection dengan warna putih
merepresentasikan tangan pengguna dan warna hitam merepresentasikan background.
3.2.2
Perbaikan Citra
Hasil dari proses segmentasi yang berupa gambar hitam putih (binary image) yang
menunjukkan bagian kulit dari gambar masukan. Akan tetapi citra hasil segmentasi
tersebut masih terdapat noise& potongan dari beberapa benda lainnya pada citra,
seperti latar belakang gambar. Oleh karena itu, perlu dilakukan beberapa tahapan
proses morfologi untuk membersihkan gambar dari
noise& potongan
tersebut.
Adapun beberapa proses morfologi tersebut yaitu. Erosion, dilation dan median blur.
3.2.2.1 Erosion
Proses erosi membuang piksel dari gambar atau ekivalen dengan membuat piksel ON
menjadi OFF, yaitu piksel putih yang melekat pada daerah background, sehingga akan
menyebabkan piksel putih berkurang luasnya (shrinking) dengan tujuan untuk
menghilangkan piksel yang memiliki noise pada citra. Adapun fungsi yang digunakan
peneliti untuk proses erosi yaitu.
Mat element = getStructuringElement(erosion_type,Size
(2*erosion_size+1),Point(erosion_size,erosion_size));
Imgproc.erode(src, dst, element);
Parameter:
•
Src
: citra masukan
•
Dst
: citra keluaran
•
Element
: Ini adalah kernel yang akan di gunakan untuk melakukan
operasi. Jika tidak ditentukan dahulu, maka defaultnya adalah
matriks 3x3 sederhana.Akan tetapi, kita dapat menentukan
Universitas Sumatera Utara
25
bentuknya. Untuk ini, kita perlu menggunakan fungsi
getStructuringElement:
•
Erosi_type
: bentuk dari kernel, bentuk yang digunakan yaitu
MORPH_ELLIPSE yang berbentuk Ellipse
•
Erosion_size : ukuran celah linear, ukuran yang digunakan pada penelitian ini
adalah 5
3.2.2.2 Dilation
Proses dilasi adalah kebalikan dari proses erosi, membuat piksel off menjadi on,
sehingga akan
menyebabkan piksel putih bertambah luasnya. Tujuan dilakukan
proses dilasi adalah karena saat proses erosi dilakukan pada citra masukan, daerah
yang diproses termasuk juga kulit ikut mengalami shrinking sehingga perlu dilakukan
suatu proses yang mengembalikan daerah tersebut agar bagian tangan nantinya akan
terdeteksi dengan benar.
Mat element = getStructuringElement(dilation_type,Size
(2*dilation_size+1),Point(dilation_size,dilation_size));
Imgproc.dilate(src, dst, element);
Parameter:
•
Src
: citra masukan
•
Dst
: citra keluaran
•
Element
: Ini adalah kernel yang akan di gunakan untuk melakukan
operasi. Jika tidak ditentukan dahuly, maka defaultnya adalah
matriks 3x3 sederhana.Akan tetapi, kita dapat menentukan
bentuknya. Untuk ini, kita perlu menggunakan fungsi
getStructuringElement:
•
Dilation_type : bentuk dari kernel, bentuk yang digunakan yaitu
MORPH_ELLIPSE yang berbentuk Ellipse
•
Dilation_size : ukuran celah linear, ukuran yang digunakan pada penelitian ini
adalah 5
Universitas Sumatera Utara
26
3.2.2.3 Median Blur
Median blur dilakukan untuk menghilangkan noise yang masih terdapat pada citra
setelah proses dilasi, agar tidak terdefinisi sebagai titik objek.berikut adalah fungsi
yang tersedia pada library OpenCV.
medianBlur(InputArray src, OutputArray dst, int ksize);
Parameter:
•
src
: citra masukan
•
dst
: Citra keluaran
•
ksize : ukuran celah linear, biasanya lebih dari 1, contohnya: 3,
5, 7.
3.2.3
Ekstraksi Fitur
Setelah gambar melalui tahap perbaikan citra untuk membersihkan gambar dari noise ,
maka selanjutnya citra akan dilakukan proses ekstraksi fitur yang meliputi
contour,convex-hull dan convexity defects pada citra. Proses ini dilakukan untuk
mendapatkan
informasi
yang
diinginkan
untuk
proses
analisis
ataupun
pengklasifikasian data citra. Berikut ini adalah penjelasan dari masing-masing proses
yang disebutkan diatas.
3.2.3.1 Contour
kontur ditarik sekitar titik-titik putih dari tangan yang ditemukan dari hasil
thresholding citra masukan. Hasil tresholding tersebut akan terbentuk lebih dari satu
titik pada gambar karena noise dari latar belakang citra. pada penelitian ini digunakan
fungsi findcontours() yang telah tersedia oleh OpenCV untuk mendeteksi titik-titik
kontur pada citra hasil perbaikan noise sebelumnya.Berikut adalah penjelasan dari
fungsi tersebut.
findContours (src image, contours, hierarcy, mode, method, Point());
Parameter :
•
Image
: citra masukan, yaitu citra hasil proses perbaikan citra
•
Contours
: titik kontur yang terdeteksi. Setiap titik kontur yang terdeteksi
akan disimpan didalam list titik vector
Universitas Sumatera Utara
27
•
hierarchy
: keluaran berupa titik vektor yang bersifat opsional. Dalam
parameter ini disimpan berbagai informasi dari setiap titik
kontur,
misalnya titik kontur sebelumnya, titik kontur
selanjutnya, titik kontur utama, dsb.
•
Mode
: cara pendeteksian titik kontur. Pada penelitian ini dilakukan
dengan cara CV_RETR_EXTERNAL, yang mengambil semua
titik kontur dan merekontruksi penuh hirarki titik-titik kontur
yang terhubung
•
Method
: metode pendekatan titik kontur. Pada penelitian ini dilakukan
dengan
cara
CV_CHAIN_APPROX_SIMPLE,
yang
menekankan pada segmen horizontal, vertikal, dan diagonal dan
menentukan titik akhir pada kontur.
Setelah contour didapatkan pada citra masukan, maka titik-titik yang didapatkan akan
digambar membentuk sebuah gambar tangan. Fungsi yang digunakan pada penelitian
ini yaitu drawContours() yang telah tersedia pada library OpenCV.Berikut ini adalah
gambar dari proses pendeteksian contour pada penelitian ini yang dapat dilihat dari
gambar 3.2.
Gambar 3.2 Hasil dari Contour
3.2.3.2 Convex-hull
Setelah titik-titik yang dihasilkan didapatkan dan dibentuk menjadi contour pada
proses sebelumnya, maka proses selanjutnya yaitu Convex-hull. Convex hull adalah
metode yang digunakan untuk mendeteksi kontur atau obyek pada citra.Convex hull
terdiri dari titik-titik yang dihubungkan dengan garis yang mengelilingi kontur (objek
Universitas Sumatera Utara
28
pada citra). Setelah kontur-kontur didapatkan, dari kontur-kontur tersebut akan dicari
kontur yang paling besarnya (objek tangan harus yang paling besar) sebelum
dilakukan pencarian convex hullnya .Fungsi yang digunakan pada penelitian ini yaitu
convexHull(). Adapun penjelasan fungsi tersebut yaitu.
convexHull(InputArray points, OutputArray hull);
Parameter:
•
Points : titik kontur yang terdeteksi dan telah disaring.
•
Hull : hasil keluaran Convex-hull.
Berikut ini adalah gambar dari proses pendeteksian convex-hull pada penelitian ini
yang dapat dilihat dari gambar 3.3
Gambar 3.3 Hasil dari Convex-hull
3.2.3.3 Convexity defects
Setelah kontur terbesar dan Convex-hull terdeteksi, maka proses selanjutnya yaitu
Convexity defects.yang merupakan titik temu antara titik kontur dan garis Convex-hull.
Pada penelitian ini, digunakan fungsi convexityDefects() yang telah tersedia di
OpenCV untuk mendeteksi Convexity defects. Berikut ini adalah penjelasan tentang
fungsi tersebut.
convexityDefects(contour, convexHull, convexityDefects);
Parameter :
•
contour
: Titik-tik kontur terbesar yang terdeteksi
•
convexhull
: Convex-hull yang terdeteksi
Universitas Sumatera Utara
29
•
convexityDefects
: hasil keluaran Convexity Defects.
Berikut ini adalah gambar dari proses pendeteksian convex-hull pada penelitian
ini yang dapat dilihat dari gambar 3.4
Gambar 3.4 Hasil dari Convexity defects
3.3
Use Case Diagram
Use Case Diagram adalah gambaran graphical dari beberapa atau semua actor, use
case, dan interaksi diantaranya yang memperkenalkan suatu sistem.Use case dari
aplikasi Augmented Reality Bangunan Heritage Kota Medan dapat dilihat pada
Gambar 3.5
Start
Capture Video
Capture Gesture
USER
Gesture Recognition
System
Marker Detection
Scene Result
Gambar 3.5Use case diagram
Element - elemen pada Use Case Diagram :
•
User :Mempresentasikan
seseorang
atau
sesuatu(seperti
perangkat,system lain) yang berinteraksi dengan sistem. Actor
hanya berinteraksi dengan use case tetapi tidak memiliki
kontrol atas use case. Pada penelitian ini, tugas-tugas actor
Universitas Sumatera Utara
30
yaitu membuka aplikasi, scan gestur jari tangan pada saat
pemilihan scene.
•
System
: Pada aplikasi ini, system bertugas untuk penangkapan kamera,
penangkapan gesture jari user menggunakan OpenCV dan
mengenali gesture tersebut menggunakan metode yang telah
dijelaskan
diatas,
juga
mendeteksi
marker
yang
ada
menggunakan library Vuforia serta menampilkan hasil yang
ada.
3.4
Diagram Aktivitas
Diagram aktivitas atau activity diagram adalah diagram yang menggambarkan
aktivitas yang terjadi selama sistem dijalankan. Diagram aktivitas mendeskripsikan
bagaimana awal proses dimulai, keputusan tindakan yang dilakukan dan bagaimana
akhir atau hasil dari proses tersebut. Diagram aktivitas pada aplikasi ini dapat dilihat
dari gambar 3.6 berikut
USER
SISTEM
Menampilkan Halaman Video
pengenalan
Buka Aplikasi
Menampilkan Halaman Pemilihan Scene
Identifikasi Jari
Scan Jari
Tidak
Pencocokan
Ya
Identifikasi Marker AR
Halaman Scene
Setelah beberapa waktu
yang ditentukan
Gambar 3.6 Activity diagram
Universitas Sumatera Utara
31
3.5
Perancangan Antarmuka
Pada tahap ini akan dilakukan perancangan antar muka dari sistem pengenalan
gerakan tangan yang digunakan untuk pemilihan scene pada Unity. Rancangan antar
muka ini diharapkan agar dapat membuat pengguna lebih tetarik dan kemudahan
dalam pengaplikasiannya. Pada penelitian ini ada terdapat 3 halaman rancangan antar
muka,yaitu halamn utama, halaman pemilihan scene, halaman tampilan scene.
3.5.1
Rancangan Tampilan Halaman Splash
Halaman utama merupakan halam pertama yang muncul saat aplikasi dijalankan.
Rancangan halaman utama dapat dilihat pada gambar 3.7 dibawah ini
2. Animated Loader
Gambar 3.7 Rancangan Halaman Splash
Keteragan :
1. Frame ini berisi
•
Judul frame
•
Tombol Close, yang berfungsi untuk mengakhiri aplikasi tersebut,
•
Tombol Maximized Untuk memperbesar jendela Excel XP sehingga
terlihat dalam satu layar penuh. Setelah jendela Excel terlihat satu layar
penuh
Universitas Sumatera Utara
32
•
Tombol Minimize Untuk memperkecil jendela aplikasi sehingga
membentuk icon aktif pada Taskbar.
2. Animated loader yang berisi video animasi yang menjelaskan detil isi scene
yang ada.
3.5.2
Rancangan Tampilan Pemilihan Scene
Setelah rancangan halaman utama terbuka selama beberapa waktu, maka akan
berpindah secara otomatis ke halaman pemilihan scene, halaman ini berisi frame
OpenCV untuk pemilihan sceneyang diinginkan pengguna.berikut adalah penjelasan
dari rancangan halaman pemilihan sceneyang dapat dilihat pada gambar 3.8 berikut.
Gambar 3.8 Rancangan Halaman Pemilihan Scene
Keterangan :
1. Frame ini berisi
•
Judul frame
•
Tombol Close, yang berfungsi untuk mengakhiri aplikasi tersebut,
•
Tombol Maximized Untuk memperbesar jendela sehingga terlihat
dalam satu layar penuh. Setelah jendela Excel terlihat satu layar penuh
•
Tombol Minimize Untuk memperkecil jendela aplikasi sehingga
membentuk icon aktif pada Taskbar.
Universitas Sumatera Utara
33
2. Slider yang digunakan untuk mengatur range dari HSV yang berfungsi untuk
segmentasi citra pada OpenCV
3. Panel yang menampilkan hasil proses OpenCV yang berfungsi untuk
pemilihan scene dengan mengarahkan jari ke kamera web.
4. Panel yang menampilkan keseluruhan objek 3D yang ada agar pengguna dapat
memilih objek mana yang diinginkan secara terpisah selanjutnya.
3.5.3
Rancangan Halaman Scene
Setelah pengguna memilih scene mana yang akan dilihat secara terpisah pada hlaman
pemilihan sceneyang sebelumnya, maka akan mucul halaman scene yang telah dipilih
oleh pengguna. Rancangan halamanscene dapat dilihat pada gambar 3.9 berikut.
2. Scene
Gambar 3.9 Rancangan Halaman Scene
Keterangan :
1. Frame ini berisi
•
Judul frame
•
Tombol Close, yang berfungsi untuk mengakhiri aplikasi tersebut,
•
Tombol Maximized Untuk memperbesar jendela sehingga terlihat
dalam satu layar penuh. Setelah jendela Excel terlihat satu layar penuh
Universitas Sumatera Utara
34
•
Tombol Minimize Untuk memperkecil jendela aplikasi sehingga
membentuk ikon aktif pada Taskbar.
2. Panel tampilan dari Scene yang telah dipilih oleh pengguna sebelumnya.
Universitas Sumatera Utara
35
BAB 4
IMPLEMENTASI DAN PENGUJIAN SISTEM
4.1
Konfigurasi Sistem
implementasi metode-metode yang digunakan untuk pengenalan jumlah jari tangan
manusia yang digunakan untuk pemilihan scene augmented reality yang
menggunakan aplikasi Unity 3D.
4.1.1
Konfigurasi Perangkat Keras
Spesifikasi perangkat keras yang digunakan pada penelitian ini dapat dilihat dari table
4.1 berikut:
Tabel 4.1 Konfigurasi perangkat keras yang digunakan
No
Jenis Komponen
Komponen yang digunakan
1.
Processor
Intel ® CoreTM i3-4005U CPU 1.70GHz
2.
Memory
2048MB
3.
Storage
500GB
4.
Resolusi Layar
1366 x 768 pixel (14” Monitor)
5.
Kamera 1
Logitech PTZ Pro HD1080P 60fps
6.
Kamera 2
Logitech CZT HD 1080P
4.1.2 Konfigurasi Perangkat Lunak
Spesifikasi perangkat keras yang digunakan pada penelitian ini dapat dilihat dari table
4.2 berikut:
Tabel 4.2 Konfigurasi perangkat lunak yang digunakan
No
Jenis software
Software yang digunakan
Windows 8.1 Pro 64bit
1.
Sistem Operasi
2.
Game Engine
3.
Library OpenCV
OpenCV for Unity v1.2.3
4.
Library Vuforia
Vuforia for Unity v6.1.7
Unity 5.4.2f2 (64-bit)
Universitas Sumatera Utara
36
4.2
Tampilan Aplikasi
Pada tahap ini, dilakukan implementasi tampilan aplikasi sesuai dengan perancangan
antarmuka pengguna pada bab 3. Setiap tampilan pada aplikasi akan dibahas
bagaimana proses tampilan dan penggunaannya.
4.2.1
Tampilan Halaman splash
Halaman utama ini merupakan halaman yang akan muncul pertama kali saat
usermembuka aplikasi. Halaman utama berisi video animasi yang telah dibuat yang
berisi konten scene yang ada. Tampilan halaman utama dapat dilihat pada gambar 4.1
berikut.
Gambar 4.1 Tampilan halaman splash
4.2.2
Tampilan halaman pemilihan scene menggunakan OpenCV
Halaman ini adalah halaman untuk memilih scene yang tersedia yang diinginkan oleh
user.Halaman ini menampilkan sedikit bagian objek 3D yang mana menjadi konten
scene yang ada dan juga tampilan untuk memilih scene menggunakan OpenCV
dengan menghitung jumlah jari user yang diarahkan ke kamera. Berikut adalah
tampilan halaman pemilihan scene pada gambar 4.2
Universitas Sumatera Utara
37
Gambar 4.2 Tampilan Halaman Pemilihan Scene
4.2.3
TampilanHalaman Scene
Halaman ini berisi scene yang telah dipilih oleh user pada halaman pemilihan scene
sebelumnya, pada penelitian ini terdapat 2 halaman scene yang dapat dipilih oleh user
yaitu scene Kota Matsum dan scene Kesawan. Berikut adalah gambar masing-masing
dari scene yang ada yang dapat dilihat pada gambar 4.3 dan 4.4
Gambar 4.3 HalamanScene Kesawan
Universitas Sumatera Utara
38
Gambar 4.4 Halaman Scene Kota Matsum
4.3
Pengujian Hasil Pengenalan Jari Tangan
Pada pengujian Aplikasi pengenalan tangan ini, Uji coba dilakukan untuk mengetahui
apakah jumlah jari tangan dari userakanterbaca dan melakukan instruksi yang sesuai
dengan yang telah dirancang seperti pemilihan 2 scene animasi objek 3D.Pada
pengujian ini peneliti membuat 8 skenario yang mana masing-masing skenario
memiliki kondisi yang berbeda misalnya saat pencahayaan terang atau gelap dan juga
jarak jari tangan ke kamera yang mana variabel tersebut sangat mempengaruhi dari
pengenalan jari tangan.Hasil pengujian ditampilkan dalam tabel yang memperlihatkan
data hasil uji coba.
Skenario 1: Uji coba dilakukan pada backgroundwarna yang polos dan kondisi
pencahayaan yang baik dengan pengaturan range HSV diatas. Hasil pengujian
ditunjukkan oleh Tabel 4.3,
Tabel 4.3 Pengujian scenario 1
Banyak
True
False
Jumlah
pengujian
No.
Positive Positive
Jari
(n)
1
1
72
70
2
2
2
60
60
0
Akurasi
(%)
Error
(%)
97.22
100
2.78
0
Universitas Sumatera Utara
39
Gambar 4.5 Skenario 1 dengan Jumlah Jari 1
Setelah dilakukan beberapa kali pengujian, didapatkan nilai rentang HSV yang stabil
dalam pendeteksian yaitu H = 70 – 210, S = 10 – 190, dan V = 25 – 200. Nilai rentang
tersebut dijadikan nilai rentang default untuk aplikasi. Gambar 4.5 menunjukkan hasil
pengenalan jari tangan 1 pada ruangan yang cukup terang sesuai dengan skenario 1
untuk menjalankan perintah pindah ke scene Kota Matsum, jumlah jari tangan ini
dapat dikenali oleh system dengan tingkat akurasi yang tinggi, yaitu sebar 97.22% dari
72 kali percobaan, kesalahan yang mungkin terjadi pada proses ini ketika ada
perubahan intensitas cahaya yang menjadi redup menyebabkan warna daerah kulit
tangan menjadi gelap, sehingga tidak dapat dikenali sistem sebagai warna kulit dan
juga jari yang terlipat terdefenisi sebagai jari.
Gambar 4.6 skenario 1 dengan jumlah jari 2
Gambar 4.6 menunjukkan hasil pengenalan jumlah jari tangan dengan jumlah
jari 2 dengan skenario 1 untuk menjalankan perintah pindah ke scene kesawan. Dari
hasil pengujian didapatkan hasil pengenalan jumlah jari oleh system sebesar 100%
dari 60 percobaan.Dari pengujian yang dilakukan dalam skenario 1 untuk 2 perintah
tersebut, maka diperoleh hasil rata-rata akurasi sebagai berikut.
A=
97.22+100
2
= 98.61%
Universitas Sumatera Utara
40
Skenario 2: Uji coba dilakukan pada background yang polos tetapi
pencahayaan yang kurang baik dengan pengaturan range HSV diatas. Hasil pengujian
ditunjukan oleh Tabel 4.4.
Tabel 4.4 Pengujian scenario 2
No.
1
2
Banyak
Jumlah
True
False
pengujian
Jari
Positive Positive
(n)
1
75
72
3
2
85
83
2
Akurasi
(%)
Error
(%)
96
97.64
4
2.36
Gambar 4.7 Skenario 2 dengan Jumlah Jari 1
Gambar 4.8 diatas adalah pengujian pengenalan jumlah jari tangan dengan
jumlah jari 1 dengan skenario 2 dimana kondisi cahaya yang redup.Hasil pengujian
pengenalan jari tangan oleh sistem dengan instruksi pindah scene kesawan didapatkan
sebesar 96% dari 75 percobaan.Kesalahan yang mungkin terjadi dikarenakan
pendeteksian warna kulit yang gelap sehingga sistem sulit untuk mengenali objek
tangan.
Gambar 4.8 Skenario 2 dengan Jumlah Jari 2
Universitas Sumatera Utara
41
Gambar 4.9 diatas hasil pengujian jumlah jari tangan 2 pada skenario 2 dimana
cahaya pada ruangan tidak terang atau redup.Hasil jumlah jari yang dapat dikenali
oleh sistem yaitu 97.64% dari 85 percobaan.
B=
96+97.64
2
= 96.82%
Dari seluruh pengujian yang dilakukan untuk pengenalan jumlah jari tangan manusia,
efek pencahayaan cukup berpengaruh oleh sistem dalam pengenalan jari tangan. Pada
cahaya yang terang maka seluruh warna objek yang tertangkap oleh webcam akan terdefinisi
dengan baik, sebaliknya jika pencahayaan pada ruangan pengujian tersebut redup, maka
sistem akan sulit mendeteksi warna kulit dikarenakan warna objek yang terlalu gelap
sehingga tidak dapat didefinisikan sebagai warna kulit. Berikut adalah perhitungan rata-rata
akurasi pengenalan jari tangan berdasarkan cahaya.
Rata-rata Akurasi
=
=
�+�
2
98.61+96.82
2
= 97.715%
Skenario 3: Uji coba dilakukan pada jarak lebih dari 65 cm yaitu 80 cm dari
depan webcam, dengan pencahayaan yang baik dan background warna polos dengan
pengaturan range HSV diatas. Hasil pengujian ditunjukkan oleh Tabel 4.5.
Tabel 4.5 Pengujian scenario 3
No.
1
2
Banyak
Jumlah
True
False
pengujian
Jari
Positive Positive
(n)
1
50
0
50
2
65
0
65
Akurasi
(%)
Error
(%)
0
0
100
100
Universitas Sumatera Utara
42
Gambar 4.9 Skenario 3
Gambar 4.9 menunjukkan hasil pengujian pengenalan jumlah jari tangan
dengan jumlah jari lima dan satu dengan jarak dari kamera sejauh 80 dengan instruksi
sesuai dengan tabel 4.5. didapat hasil pengenalan sebesar 0% dengan 50 percobaan.
Kesalahan yang terjadi dikarenakan jarak yang terlalu jauh sehingga jarak antara jari
terlihat terlalu rapat sehingga area kontur yang terdeteksi menghasilkan nilai depth
point yang terlalu kecil.
C=
0+0
2
= 0%
Skenario 4: Uji coba dilakukan pada jarak kurang dari 50 cm yaitu 30 cm dari
depan webcam,dengan pencahayaan yang baik dan background warna polos dengan
pengaturan range HSV diatas. Hasil pengujian ditunjukkan oleh Tabel 4.10.
Tabel 4.6 Pengujian scenario 4
Banyak
Jumlah
True
False
No.
pengujian
Jari
Positive Positive
(n)
1
1
75
74
1
2
2
65
65
0
Akurasi
(%)
Error
(%)
98.66
100
1.34
0
Universitas Sumatera Utara
43
Gambar 4.10 Skenario 4
Gambar 4.10 menunjukkan hasil pengujian pengenalan jumlah jari tangan
dengan jumlah jari tangan 1 dengan jarak dari kamera sebesar 30 cm sesuai dengan
skenario 1 dengan instruksi sesuai dengan table 4.6. setelah dilakukan pengujian
didapat hasil pengenalan jumlah jari tangan oleh sistem sebesar 100% dari 75
percobaan.
D=
98.66+100
2
= 99.33%
Dari seluruh pengujian yang dilakukan untuk pengenalan jumlah jari tangan manusia,
jarak ke kamera juga cukup berpengaruh oleh sistem dalam pengenalan jari tangan. Pada
jarak yang jauh maka kontur tangan yang terdeteksi akan rapat dan menghasilkan nilai depth
point yang terlalu kecil sehingga tidak dapat dilakukan perhitungan defects.Berikut adalah
perhitungan rata-rata akurasi pengenalan jari tangan berdasarkan cahaya.
Rata-rata Akurasi
=
=
�+�
2
0+99.3
2
= 49.665%
Universitas Sumatera Utara
44
4.4
Pengujian Marker Augmented Reality
Pengujian Marker dilakukan untuk membuktikan bahwa marker dapat dideteksi oleh
AR Camera dengan baik sehingga dapat menampilkan objek 3D maupun animasi yang
telah dibuat sebelumnya. Pengujian dilakukan dengan cara membuka aplikasi , setelah
aplikasi terbuka maka AR kamera akan otomatis menyala dan akan mendeteksi
markeryang ada dengan mengarahkan kamera pada marker. Apabila marker yang
dideteksi cocok dengan marker yang telah didaftarkan pada vuforia maka akan
muncul objek 3D maupun animasi yang telah dibuat. Berikut adalah pengujian marker
berdasarkan jarak pengambilan kamera dan sudut kemiringan kamera.
4.4.1
Pengujian jarak pendeteksian
Pengujian jarak dilakukan untuk mengetahui seberapa jauh jarak marker dapat
dideteksi oleh kamera dan jarak berapa marker dideteksi lebih efektif. Hasil pengujian
dapat dilihat pada table 4.7
Tabel 4.7 Pengujian jarak deteksi
No.
Jarak
Keterangan
1.
2.5 meter
Terdeksi
dan
stabil
2.
3meter
Terdeteksi
dan
stabil
3.
5 meter
Terdeteksi
dan
stabil
3.
4.4.2
7 meter
Tidak terdeteksi
Pengujian sudut kemiringan pendeteksian
Pengujian sudut kemiringan kamera dilakukan untuk mengetahui sudut berapa kamera
dapat mendeteksi marker dan sudut berapa kamera tidak dapat mendeteksi marker.
Hasil pengujian dapat dilihat pada table 4.8
Table 4.8 Pengujian sudut kemiringan kamera
No.
Jarak
Keterangan
Universitas Sumatera Utara
45
1.
10o
Tidak terdeteksi
2.
40o
Terdeksi stabil
3.
90
Terdeteksi stabil
Universitas Sumatera Utara
46
BAB 5
KESIMPULAN DAN SARAN
Bab ini membahas tentang kesimpulan dari Pengenalan Jari tangan sebagai interaksi
augmented reality heritage kota medan .Selain itu juga memberikan saran untuk
pengembangan penelitian selanjutnya.
5.1
Kesimpulan
Setelah melakukan tahap implementasi dan menguji sistem, maka diperoleh beberapa
kesimpulan yang ditemukan pada penelitian ini, yaitu :
1. Aplikasi dapat berjalan dengan baik saat mendeteksi marker dan menampilkan
objek 3D.
2. Situasi yang baik dalam melakukan pendeteksian jumlah jari tangan yaitu
pada jarak 30 – 50 cm dan dengan pencahayaan yang cukup terang.
3. Jarak maksimal untuk pendeteksian jumlah jari tangan yaitu 65 cm
4. Pada saat pendeteksian disarankan, warna latar belakang pendeteksian
haruslah polos dan tidak bercorak serta berwarna kulit.
5. Jarak optimal pendeteksian marker didapat yaitu 2.5 – 5 meter
5.2
Saran
Saran yang dapat diberikan untuk penelitian selanjutnya adalah :
•
Penelitian selanjutnya diharapkan dapat mendeteksi objek tangan dengan latar
belakang (background) warna yang bervariasi / tidak polos.
•
Diharapkan pengembangan selanjutnya disarankanmenggunakan metode lain
agar pendeteksian tidak mudah terganggu karena objek lain masuk seperti kulit
lengan maupun kepala.
Universitas Sumatera Utara
47
•
Diharapkan penelitian selanjutnyatetap dapat mengenali jumlah jari tangan
ketika ada perubahan cahaya yang signifikan.
Universitas Sumatera Utara
BAB 3
ANALISIS DAN PERANCANGAN
Bab ini akan membahas tentang implementasi metode yang digunakan untuk
mengenali gerakan tangan manusia. Adapun 2 (dua) tahap yang akan dibahas pada
bab ini, yaitu tahap analisis dan tahap perancangan system.
3.1
Data yang Digunakan
Data yang digunakan dalam penelitian ini berupa citra yang diambil secara real-time
melalui kamera web. Dalam pengambilan citra, ada beberapa aspek yang yang perlu
diperhatikan yaitu kualitas kamera web, pencahayaan(lighting) dan jarak pengambilan
gambar.
3.2
Analisis Sistem
Metode yang digunakan untuk mengenali gestur tangan manusia melalui kamera web
yang digunakan sebagai interaksi manusia-komputer untuk menjalankan instruksi
yang telah ditentukan. Penelitian ini terdiri dari beberapa langkah, adapun langkahlangkah tersebut yaitu: pengambilan citra atau gambar melalui kamera web; resizing
citra; konversi warna RGB ke HSV; pendeteksian warna kulit dengan mengatur nilai
range HSV yang diinginkan; memperbaiki citra dengan median blur utk
menghilangkan noise dandilasi; ekstraksi fitur dengan contour dan mencari convexhull dari contour yang telah tertangkap; menghitung convexity defects; menghitung
jumlah jari tangan yang terdeteksi. Setelah langkah tersebut telah dilakukan dan
berhasil maka akan didapatkan jumlah jari tangan manusia yang berupa suatu instruksi
atau perintah untuk memilih sebuah scene yang terdapat pada aplikasi Unity 3D.
Adapun arsitektur umum yang menggambarkan metode pada penelitian ini
ditunjukkan pada Gambar 3.1.
Universitas Sumatera Utara
22
Citra ditangkap
web camera
Pre-Processing
Perbaikan Citra
Konversi RGB ke HSV
Erosion
Atur range HSV
Dilation
Tresholding
Median Blur
Klasifikasi
Menghitung Jumlah Jari
Eksraksi Fitur
Contour
Convex-Hull
Output
Pemilihan Scene Unity
berdasarkan jumlah jari
yang terdeteksi
Convexity Defects
Gambar 3.1 Arsitektur Umum
3.2.1
Skin Detection
Proses segmentasi digunakan untuk mendapatkan objek yang akan diidentifikasi yang
dalam hal ini adalah citra tangan.Agar citra tangan dari pengguna yang diambil dari
kamera dapat diidentifikasi sebagai suatu perintah.
Pendeteksian objek tangan berdasarkan warna kulit ini sangat dipengaruhi oleh
intensitas cahaya pada citra dan juga kualitas dari kamera web itu sendiri dan juga
latar pengambilan objek itu sendiri.Pada penelitian ini digunakan metode warna HSV
Universitas Sumatera Utara
23
sebagai segmentasi gambar berdasarkan warna.Adapun langkah-langkah mendeteksi
warna kulit manusia sebagai berikut.
3.2.1.1 Konversi RGB ke HSV
Setelah citra tertangkap oleh kamera web, kemudian akan dikonversi ke ruang warna
HSV. Format HSV lebih cocok untuk melakukan pengolahan berdasarkan warna
daripada menggunakan RGB, karena kita mendapatkan saluran tunggal (H) yang
memegang nilai warna pixel dan dua saluran lainnya (S dan V) yang memegang
tingkat saturasi dan kecerahan tingkat pixel. Pada penelitian ini menggunakan fungsi
cvtColor() yang tersedia pada OpenCV. Berikut adalah penjelasan fungsi tersebut.
cvtColor (Mat src, Mat dst, Imgproc, int code);
Parameter:
•
Src
: citra masukan yaitu rgbaMat
•
Dst
: citra keluaran yaitu hsvMat
•
Code
: kode konversi ruang warna yaitu COLOR_BGR2HSV
3.2.1.2 Atur Range HSV
Setelah dilakukan konversi ke format HSV, selanjutnya dilakukan perubahan citra ke
dalam bentuk citra biner menggunakan proses thresholding. Deteksi warna kulit
dilakukan dengan cara menentukan rentang nilai dari H, S, dan V, Sehingga untuk
setiap piksel dalam citra, jika berada dalam range tersebut, maka akan dianggap
sebagai warna kulit, sedangkan untuk yang berada di luar range tersebut akan
dianggap sebagai background. Untuk mengecek apakah element tersebut berada di
range pada penelitian ini digunakan fungsi Core.inRange() yang tersedia pada
OpenCV. Berikut ini adalah penjelasan tentang fungsi tersebut.
inRange (Mat src, Scalar lowerb, Scalar upperb, Mat dst);
Parameter :
•
src
: citra masukan yaitu hsvMat
•
dst
: citra keluaran yaitu hsvMat
•
Lowerb
: batas bawah array
•
Upperb
: batas atas array
Universitas Sumatera Utara
24
3.2.1.3 Tresholding
Untuk setiap piksel dalam citra, jika nilai H, S, V berada dalam rentang tersebut,
maka akan dianggap sebagai warna kulit dan nilainya akan diubah menjadi 255
(warna putih). Sedangkan untuk yang berada di luar rentang itu, akan dianggap
sebagai latar belakang dan akan diubah nilainya menjadi 0 (warna hitam). Dengan
metode ini, didapatkan citra biner hasil skin detection dengan warna putih
merepresentasikan tangan pengguna dan warna hitam merepresentasikan background.
3.2.2
Perbaikan Citra
Hasil dari proses segmentasi yang berupa gambar hitam putih (binary image) yang
menunjukkan bagian kulit dari gambar masukan. Akan tetapi citra hasil segmentasi
tersebut masih terdapat noise& potongan dari beberapa benda lainnya pada citra,
seperti latar belakang gambar. Oleh karena itu, perlu dilakukan beberapa tahapan
proses morfologi untuk membersihkan gambar dari
noise& potongan
tersebut.
Adapun beberapa proses morfologi tersebut yaitu. Erosion, dilation dan median blur.
3.2.2.1 Erosion
Proses erosi membuang piksel dari gambar atau ekivalen dengan membuat piksel ON
menjadi OFF, yaitu piksel putih yang melekat pada daerah background, sehingga akan
menyebabkan piksel putih berkurang luasnya (shrinking) dengan tujuan untuk
menghilangkan piksel yang memiliki noise pada citra. Adapun fungsi yang digunakan
peneliti untuk proses erosi yaitu.
Mat element = getStructuringElement(erosion_type,Size
(2*erosion_size+1),Point(erosion_size,erosion_size));
Imgproc.erode(src, dst, element);
Parameter:
•
Src
: citra masukan
•
Dst
: citra keluaran
•
Element
: Ini adalah kernel yang akan di gunakan untuk melakukan
operasi. Jika tidak ditentukan dahulu, maka defaultnya adalah
matriks 3x3 sederhana.Akan tetapi, kita dapat menentukan
Universitas Sumatera Utara
25
bentuknya. Untuk ini, kita perlu menggunakan fungsi
getStructuringElement:
•
Erosi_type
: bentuk dari kernel, bentuk yang digunakan yaitu
MORPH_ELLIPSE yang berbentuk Ellipse
•
Erosion_size : ukuran celah linear, ukuran yang digunakan pada penelitian ini
adalah 5
3.2.2.2 Dilation
Proses dilasi adalah kebalikan dari proses erosi, membuat piksel off menjadi on,
sehingga akan
menyebabkan piksel putih bertambah luasnya. Tujuan dilakukan
proses dilasi adalah karena saat proses erosi dilakukan pada citra masukan, daerah
yang diproses termasuk juga kulit ikut mengalami shrinking sehingga perlu dilakukan
suatu proses yang mengembalikan daerah tersebut agar bagian tangan nantinya akan
terdeteksi dengan benar.
Mat element = getStructuringElement(dilation_type,Size
(2*dilation_size+1),Point(dilation_size,dilation_size));
Imgproc.dilate(src, dst, element);
Parameter:
•
Src
: citra masukan
•
Dst
: citra keluaran
•
Element
: Ini adalah kernel yang akan di gunakan untuk melakukan
operasi. Jika tidak ditentukan dahuly, maka defaultnya adalah
matriks 3x3 sederhana.Akan tetapi, kita dapat menentukan
bentuknya. Untuk ini, kita perlu menggunakan fungsi
getStructuringElement:
•
Dilation_type : bentuk dari kernel, bentuk yang digunakan yaitu
MORPH_ELLIPSE yang berbentuk Ellipse
•
Dilation_size : ukuran celah linear, ukuran yang digunakan pada penelitian ini
adalah 5
Universitas Sumatera Utara
26
3.2.2.3 Median Blur
Median blur dilakukan untuk menghilangkan noise yang masih terdapat pada citra
setelah proses dilasi, agar tidak terdefinisi sebagai titik objek.berikut adalah fungsi
yang tersedia pada library OpenCV.
medianBlur(InputArray src, OutputArray dst, int ksize);
Parameter:
•
src
: citra masukan
•
dst
: Citra keluaran
•
ksize : ukuran celah linear, biasanya lebih dari 1, contohnya: 3,
5, 7.
3.2.3
Ekstraksi Fitur
Setelah gambar melalui tahap perbaikan citra untuk membersihkan gambar dari noise ,
maka selanjutnya citra akan dilakukan proses ekstraksi fitur yang meliputi
contour,convex-hull dan convexity defects pada citra. Proses ini dilakukan untuk
mendapatkan
informasi
yang
diinginkan
untuk
proses
analisis
ataupun
pengklasifikasian data citra. Berikut ini adalah penjelasan dari masing-masing proses
yang disebutkan diatas.
3.2.3.1 Contour
kontur ditarik sekitar titik-titik putih dari tangan yang ditemukan dari hasil
thresholding citra masukan. Hasil tresholding tersebut akan terbentuk lebih dari satu
titik pada gambar karena noise dari latar belakang citra. pada penelitian ini digunakan
fungsi findcontours() yang telah tersedia oleh OpenCV untuk mendeteksi titik-titik
kontur pada citra hasil perbaikan noise sebelumnya.Berikut adalah penjelasan dari
fungsi tersebut.
findContours (src image, contours, hierarcy, mode, method, Point());
Parameter :
•
Image
: citra masukan, yaitu citra hasil proses perbaikan citra
•
Contours
: titik kontur yang terdeteksi. Setiap titik kontur yang terdeteksi
akan disimpan didalam list titik vector
Universitas Sumatera Utara
27
•
hierarchy
: keluaran berupa titik vektor yang bersifat opsional. Dalam
parameter ini disimpan berbagai informasi dari setiap titik
kontur,
misalnya titik kontur sebelumnya, titik kontur
selanjutnya, titik kontur utama, dsb.
•
Mode
: cara pendeteksian titik kontur. Pada penelitian ini dilakukan
dengan cara CV_RETR_EXTERNAL, yang mengambil semua
titik kontur dan merekontruksi penuh hirarki titik-titik kontur
yang terhubung
•
Method
: metode pendekatan titik kontur. Pada penelitian ini dilakukan
dengan
cara
CV_CHAIN_APPROX_SIMPLE,
yang
menekankan pada segmen horizontal, vertikal, dan diagonal dan
menentukan titik akhir pada kontur.
Setelah contour didapatkan pada citra masukan, maka titik-titik yang didapatkan akan
digambar membentuk sebuah gambar tangan. Fungsi yang digunakan pada penelitian
ini yaitu drawContours() yang telah tersedia pada library OpenCV.Berikut ini adalah
gambar dari proses pendeteksian contour pada penelitian ini yang dapat dilihat dari
gambar 3.2.
Gambar 3.2 Hasil dari Contour
3.2.3.2 Convex-hull
Setelah titik-titik yang dihasilkan didapatkan dan dibentuk menjadi contour pada
proses sebelumnya, maka proses selanjutnya yaitu Convex-hull. Convex hull adalah
metode yang digunakan untuk mendeteksi kontur atau obyek pada citra.Convex hull
terdiri dari titik-titik yang dihubungkan dengan garis yang mengelilingi kontur (objek
Universitas Sumatera Utara
28
pada citra). Setelah kontur-kontur didapatkan, dari kontur-kontur tersebut akan dicari
kontur yang paling besarnya (objek tangan harus yang paling besar) sebelum
dilakukan pencarian convex hullnya .Fungsi yang digunakan pada penelitian ini yaitu
convexHull(). Adapun penjelasan fungsi tersebut yaitu.
convexHull(InputArray points, OutputArray hull);
Parameter:
•
Points : titik kontur yang terdeteksi dan telah disaring.
•
Hull : hasil keluaran Convex-hull.
Berikut ini adalah gambar dari proses pendeteksian convex-hull pada penelitian ini
yang dapat dilihat dari gambar 3.3
Gambar 3.3 Hasil dari Convex-hull
3.2.3.3 Convexity defects
Setelah kontur terbesar dan Convex-hull terdeteksi, maka proses selanjutnya yaitu
Convexity defects.yang merupakan titik temu antara titik kontur dan garis Convex-hull.
Pada penelitian ini, digunakan fungsi convexityDefects() yang telah tersedia di
OpenCV untuk mendeteksi Convexity defects. Berikut ini adalah penjelasan tentang
fungsi tersebut.
convexityDefects(contour, convexHull, convexityDefects);
Parameter :
•
contour
: Titik-tik kontur terbesar yang terdeteksi
•
convexhull
: Convex-hull yang terdeteksi
Universitas Sumatera Utara
29
•
convexityDefects
: hasil keluaran Convexity Defects.
Berikut ini adalah gambar dari proses pendeteksian convex-hull pada penelitian
ini yang dapat dilihat dari gambar 3.4
Gambar 3.4 Hasil dari Convexity defects
3.3
Use Case Diagram
Use Case Diagram adalah gambaran graphical dari beberapa atau semua actor, use
case, dan interaksi diantaranya yang memperkenalkan suatu sistem.Use case dari
aplikasi Augmented Reality Bangunan Heritage Kota Medan dapat dilihat pada
Gambar 3.5
Start
Capture Video
Capture Gesture
USER
Gesture Recognition
System
Marker Detection
Scene Result
Gambar 3.5Use case diagram
Element - elemen pada Use Case Diagram :
•
User :Mempresentasikan
seseorang
atau
sesuatu(seperti
perangkat,system lain) yang berinteraksi dengan sistem. Actor
hanya berinteraksi dengan use case tetapi tidak memiliki
kontrol atas use case. Pada penelitian ini, tugas-tugas actor
Universitas Sumatera Utara
30
yaitu membuka aplikasi, scan gestur jari tangan pada saat
pemilihan scene.
•
System
: Pada aplikasi ini, system bertugas untuk penangkapan kamera,
penangkapan gesture jari user menggunakan OpenCV dan
mengenali gesture tersebut menggunakan metode yang telah
dijelaskan
diatas,
juga
mendeteksi
marker
yang
ada
menggunakan library Vuforia serta menampilkan hasil yang
ada.
3.4
Diagram Aktivitas
Diagram aktivitas atau activity diagram adalah diagram yang menggambarkan
aktivitas yang terjadi selama sistem dijalankan. Diagram aktivitas mendeskripsikan
bagaimana awal proses dimulai, keputusan tindakan yang dilakukan dan bagaimana
akhir atau hasil dari proses tersebut. Diagram aktivitas pada aplikasi ini dapat dilihat
dari gambar 3.6 berikut
USER
SISTEM
Menampilkan Halaman Video
pengenalan
Buka Aplikasi
Menampilkan Halaman Pemilihan Scene
Identifikasi Jari
Scan Jari
Tidak
Pencocokan
Ya
Identifikasi Marker AR
Halaman Scene
Setelah beberapa waktu
yang ditentukan
Gambar 3.6 Activity diagram
Universitas Sumatera Utara
31
3.5
Perancangan Antarmuka
Pada tahap ini akan dilakukan perancangan antar muka dari sistem pengenalan
gerakan tangan yang digunakan untuk pemilihan scene pada Unity. Rancangan antar
muka ini diharapkan agar dapat membuat pengguna lebih tetarik dan kemudahan
dalam pengaplikasiannya. Pada penelitian ini ada terdapat 3 halaman rancangan antar
muka,yaitu halamn utama, halaman pemilihan scene, halaman tampilan scene.
3.5.1
Rancangan Tampilan Halaman Splash
Halaman utama merupakan halam pertama yang muncul saat aplikasi dijalankan.
Rancangan halaman utama dapat dilihat pada gambar 3.7 dibawah ini
2. Animated Loader
Gambar 3.7 Rancangan Halaman Splash
Keteragan :
1. Frame ini berisi
•
Judul frame
•
Tombol Close, yang berfungsi untuk mengakhiri aplikasi tersebut,
•
Tombol Maximized Untuk memperbesar jendela Excel XP sehingga
terlihat dalam satu layar penuh. Setelah jendela Excel terlihat satu layar
penuh
Universitas Sumatera Utara
32
•
Tombol Minimize Untuk memperkecil jendela aplikasi sehingga
membentuk icon aktif pada Taskbar.
2. Animated loader yang berisi video animasi yang menjelaskan detil isi scene
yang ada.
3.5.2
Rancangan Tampilan Pemilihan Scene
Setelah rancangan halaman utama terbuka selama beberapa waktu, maka akan
berpindah secara otomatis ke halaman pemilihan scene, halaman ini berisi frame
OpenCV untuk pemilihan sceneyang diinginkan pengguna.berikut adalah penjelasan
dari rancangan halaman pemilihan sceneyang dapat dilihat pada gambar 3.8 berikut.
Gambar 3.8 Rancangan Halaman Pemilihan Scene
Keterangan :
1. Frame ini berisi
•
Judul frame
•
Tombol Close, yang berfungsi untuk mengakhiri aplikasi tersebut,
•
Tombol Maximized Untuk memperbesar jendela sehingga terlihat
dalam satu layar penuh. Setelah jendela Excel terlihat satu layar penuh
•
Tombol Minimize Untuk memperkecil jendela aplikasi sehingga
membentuk icon aktif pada Taskbar.
Universitas Sumatera Utara
33
2. Slider yang digunakan untuk mengatur range dari HSV yang berfungsi untuk
segmentasi citra pada OpenCV
3. Panel yang menampilkan hasil proses OpenCV yang berfungsi untuk
pemilihan scene dengan mengarahkan jari ke kamera web.
4. Panel yang menampilkan keseluruhan objek 3D yang ada agar pengguna dapat
memilih objek mana yang diinginkan secara terpisah selanjutnya.
3.5.3
Rancangan Halaman Scene
Setelah pengguna memilih scene mana yang akan dilihat secara terpisah pada hlaman
pemilihan sceneyang sebelumnya, maka akan mucul halaman scene yang telah dipilih
oleh pengguna. Rancangan halamanscene dapat dilihat pada gambar 3.9 berikut.
2. Scene
Gambar 3.9 Rancangan Halaman Scene
Keterangan :
1. Frame ini berisi
•
Judul frame
•
Tombol Close, yang berfungsi untuk mengakhiri aplikasi tersebut,
•
Tombol Maximized Untuk memperbesar jendela sehingga terlihat
dalam satu layar penuh. Setelah jendela Excel terlihat satu layar penuh
Universitas Sumatera Utara
34
•
Tombol Minimize Untuk memperkecil jendela aplikasi sehingga
membentuk ikon aktif pada Taskbar.
2. Panel tampilan dari Scene yang telah dipilih oleh pengguna sebelumnya.
Universitas Sumatera Utara
35
BAB 4
IMPLEMENTASI DAN PENGUJIAN SISTEM
4.1
Konfigurasi Sistem
implementasi metode-metode yang digunakan untuk pengenalan jumlah jari tangan
manusia yang digunakan untuk pemilihan scene augmented reality yang
menggunakan aplikasi Unity 3D.
4.1.1
Konfigurasi Perangkat Keras
Spesifikasi perangkat keras yang digunakan pada penelitian ini dapat dilihat dari table
4.1 berikut:
Tabel 4.1 Konfigurasi perangkat keras yang digunakan
No
Jenis Komponen
Komponen yang digunakan
1.
Processor
Intel ® CoreTM i3-4005U CPU 1.70GHz
2.
Memory
2048MB
3.
Storage
500GB
4.
Resolusi Layar
1366 x 768 pixel (14” Monitor)
5.
Kamera 1
Logitech PTZ Pro HD1080P 60fps
6.
Kamera 2
Logitech CZT HD 1080P
4.1.2 Konfigurasi Perangkat Lunak
Spesifikasi perangkat keras yang digunakan pada penelitian ini dapat dilihat dari table
4.2 berikut:
Tabel 4.2 Konfigurasi perangkat lunak yang digunakan
No
Jenis software
Software yang digunakan
Windows 8.1 Pro 64bit
1.
Sistem Operasi
2.
Game Engine
3.
Library OpenCV
OpenCV for Unity v1.2.3
4.
Library Vuforia
Vuforia for Unity v6.1.7
Unity 5.4.2f2 (64-bit)
Universitas Sumatera Utara
36
4.2
Tampilan Aplikasi
Pada tahap ini, dilakukan implementasi tampilan aplikasi sesuai dengan perancangan
antarmuka pengguna pada bab 3. Setiap tampilan pada aplikasi akan dibahas
bagaimana proses tampilan dan penggunaannya.
4.2.1
Tampilan Halaman splash
Halaman utama ini merupakan halaman yang akan muncul pertama kali saat
usermembuka aplikasi. Halaman utama berisi video animasi yang telah dibuat yang
berisi konten scene yang ada. Tampilan halaman utama dapat dilihat pada gambar 4.1
berikut.
Gambar 4.1 Tampilan halaman splash
4.2.2
Tampilan halaman pemilihan scene menggunakan OpenCV
Halaman ini adalah halaman untuk memilih scene yang tersedia yang diinginkan oleh
user.Halaman ini menampilkan sedikit bagian objek 3D yang mana menjadi konten
scene yang ada dan juga tampilan untuk memilih scene menggunakan OpenCV
dengan menghitung jumlah jari user yang diarahkan ke kamera. Berikut adalah
tampilan halaman pemilihan scene pada gambar 4.2
Universitas Sumatera Utara
37
Gambar 4.2 Tampilan Halaman Pemilihan Scene
4.2.3
TampilanHalaman Scene
Halaman ini berisi scene yang telah dipilih oleh user pada halaman pemilihan scene
sebelumnya, pada penelitian ini terdapat 2 halaman scene yang dapat dipilih oleh user
yaitu scene Kota Matsum dan scene Kesawan. Berikut adalah gambar masing-masing
dari scene yang ada yang dapat dilihat pada gambar 4.3 dan 4.4
Gambar 4.3 HalamanScene Kesawan
Universitas Sumatera Utara
38
Gambar 4.4 Halaman Scene Kota Matsum
4.3
Pengujian Hasil Pengenalan Jari Tangan
Pada pengujian Aplikasi pengenalan tangan ini, Uji coba dilakukan untuk mengetahui
apakah jumlah jari tangan dari userakanterbaca dan melakukan instruksi yang sesuai
dengan yang telah dirancang seperti pemilihan 2 scene animasi objek 3D.Pada
pengujian ini peneliti membuat 8 skenario yang mana masing-masing skenario
memiliki kondisi yang berbeda misalnya saat pencahayaan terang atau gelap dan juga
jarak jari tangan ke kamera yang mana variabel tersebut sangat mempengaruhi dari
pengenalan jari tangan.Hasil pengujian ditampilkan dalam tabel yang memperlihatkan
data hasil uji coba.
Skenario 1: Uji coba dilakukan pada backgroundwarna yang polos dan kondisi
pencahayaan yang baik dengan pengaturan range HSV diatas. Hasil pengujian
ditunjukkan oleh Tabel 4.3,
Tabel 4.3 Pengujian scenario 1
Banyak
True
False
Jumlah
pengujian
No.
Positive Positive
Jari
(n)
1
1
72
70
2
2
2
60
60
0
Akurasi
(%)
Error
(%)
97.22
100
2.78
0
Universitas Sumatera Utara
39
Gambar 4.5 Skenario 1 dengan Jumlah Jari 1
Setelah dilakukan beberapa kali pengujian, didapatkan nilai rentang HSV yang stabil
dalam pendeteksian yaitu H = 70 – 210, S = 10 – 190, dan V = 25 – 200. Nilai rentang
tersebut dijadikan nilai rentang default untuk aplikasi. Gambar 4.5 menunjukkan hasil
pengenalan jari tangan 1 pada ruangan yang cukup terang sesuai dengan skenario 1
untuk menjalankan perintah pindah ke scene Kota Matsum, jumlah jari tangan ini
dapat dikenali oleh system dengan tingkat akurasi yang tinggi, yaitu sebar 97.22% dari
72 kali percobaan, kesalahan yang mungkin terjadi pada proses ini ketika ada
perubahan intensitas cahaya yang menjadi redup menyebabkan warna daerah kulit
tangan menjadi gelap, sehingga tidak dapat dikenali sistem sebagai warna kulit dan
juga jari yang terlipat terdefenisi sebagai jari.
Gambar 4.6 skenario 1 dengan jumlah jari 2
Gambar 4.6 menunjukkan hasil pengenalan jumlah jari tangan dengan jumlah
jari 2 dengan skenario 1 untuk menjalankan perintah pindah ke scene kesawan. Dari
hasil pengujian didapatkan hasil pengenalan jumlah jari oleh system sebesar 100%
dari 60 percobaan.Dari pengujian yang dilakukan dalam skenario 1 untuk 2 perintah
tersebut, maka diperoleh hasil rata-rata akurasi sebagai berikut.
A=
97.22+100
2
= 98.61%
Universitas Sumatera Utara
40
Skenario 2: Uji coba dilakukan pada background yang polos tetapi
pencahayaan yang kurang baik dengan pengaturan range HSV diatas. Hasil pengujian
ditunjukan oleh Tabel 4.4.
Tabel 4.4 Pengujian scenario 2
No.
1
2
Banyak
Jumlah
True
False
pengujian
Jari
Positive Positive
(n)
1
75
72
3
2
85
83
2
Akurasi
(%)
Error
(%)
96
97.64
4
2.36
Gambar 4.7 Skenario 2 dengan Jumlah Jari 1
Gambar 4.8 diatas adalah pengujian pengenalan jumlah jari tangan dengan
jumlah jari 1 dengan skenario 2 dimana kondisi cahaya yang redup.Hasil pengujian
pengenalan jari tangan oleh sistem dengan instruksi pindah scene kesawan didapatkan
sebesar 96% dari 75 percobaan.Kesalahan yang mungkin terjadi dikarenakan
pendeteksian warna kulit yang gelap sehingga sistem sulit untuk mengenali objek
tangan.
Gambar 4.8 Skenario 2 dengan Jumlah Jari 2
Universitas Sumatera Utara
41
Gambar 4.9 diatas hasil pengujian jumlah jari tangan 2 pada skenario 2 dimana
cahaya pada ruangan tidak terang atau redup.Hasil jumlah jari yang dapat dikenali
oleh sistem yaitu 97.64% dari 85 percobaan.
B=
96+97.64
2
= 96.82%
Dari seluruh pengujian yang dilakukan untuk pengenalan jumlah jari tangan manusia,
efek pencahayaan cukup berpengaruh oleh sistem dalam pengenalan jari tangan. Pada
cahaya yang terang maka seluruh warna objek yang tertangkap oleh webcam akan terdefinisi
dengan baik, sebaliknya jika pencahayaan pada ruangan pengujian tersebut redup, maka
sistem akan sulit mendeteksi warna kulit dikarenakan warna objek yang terlalu gelap
sehingga tidak dapat didefinisikan sebagai warna kulit. Berikut adalah perhitungan rata-rata
akurasi pengenalan jari tangan berdasarkan cahaya.
Rata-rata Akurasi
=
=
�+�
2
98.61+96.82
2
= 97.715%
Skenario 3: Uji coba dilakukan pada jarak lebih dari 65 cm yaitu 80 cm dari
depan webcam, dengan pencahayaan yang baik dan background warna polos dengan
pengaturan range HSV diatas. Hasil pengujian ditunjukkan oleh Tabel 4.5.
Tabel 4.5 Pengujian scenario 3
No.
1
2
Banyak
Jumlah
True
False
pengujian
Jari
Positive Positive
(n)
1
50
0
50
2
65
0
65
Akurasi
(%)
Error
(%)
0
0
100
100
Universitas Sumatera Utara
42
Gambar 4.9 Skenario 3
Gambar 4.9 menunjukkan hasil pengujian pengenalan jumlah jari tangan
dengan jumlah jari lima dan satu dengan jarak dari kamera sejauh 80 dengan instruksi
sesuai dengan tabel 4.5. didapat hasil pengenalan sebesar 0% dengan 50 percobaan.
Kesalahan yang terjadi dikarenakan jarak yang terlalu jauh sehingga jarak antara jari
terlihat terlalu rapat sehingga area kontur yang terdeteksi menghasilkan nilai depth
point yang terlalu kecil.
C=
0+0
2
= 0%
Skenario 4: Uji coba dilakukan pada jarak kurang dari 50 cm yaitu 30 cm dari
depan webcam,dengan pencahayaan yang baik dan background warna polos dengan
pengaturan range HSV diatas. Hasil pengujian ditunjukkan oleh Tabel 4.10.
Tabel 4.6 Pengujian scenario 4
Banyak
Jumlah
True
False
No.
pengujian
Jari
Positive Positive
(n)
1
1
75
74
1
2
2
65
65
0
Akurasi
(%)
Error
(%)
98.66
100
1.34
0
Universitas Sumatera Utara
43
Gambar 4.10 Skenario 4
Gambar 4.10 menunjukkan hasil pengujian pengenalan jumlah jari tangan
dengan jumlah jari tangan 1 dengan jarak dari kamera sebesar 30 cm sesuai dengan
skenario 1 dengan instruksi sesuai dengan table 4.6. setelah dilakukan pengujian
didapat hasil pengenalan jumlah jari tangan oleh sistem sebesar 100% dari 75
percobaan.
D=
98.66+100
2
= 99.33%
Dari seluruh pengujian yang dilakukan untuk pengenalan jumlah jari tangan manusia,
jarak ke kamera juga cukup berpengaruh oleh sistem dalam pengenalan jari tangan. Pada
jarak yang jauh maka kontur tangan yang terdeteksi akan rapat dan menghasilkan nilai depth
point yang terlalu kecil sehingga tidak dapat dilakukan perhitungan defects.Berikut adalah
perhitungan rata-rata akurasi pengenalan jari tangan berdasarkan cahaya.
Rata-rata Akurasi
=
=
�+�
2
0+99.3
2
= 49.665%
Universitas Sumatera Utara
44
4.4
Pengujian Marker Augmented Reality
Pengujian Marker dilakukan untuk membuktikan bahwa marker dapat dideteksi oleh
AR Camera dengan baik sehingga dapat menampilkan objek 3D maupun animasi yang
telah dibuat sebelumnya. Pengujian dilakukan dengan cara membuka aplikasi , setelah
aplikasi terbuka maka AR kamera akan otomatis menyala dan akan mendeteksi
markeryang ada dengan mengarahkan kamera pada marker. Apabila marker yang
dideteksi cocok dengan marker yang telah didaftarkan pada vuforia maka akan
muncul objek 3D maupun animasi yang telah dibuat. Berikut adalah pengujian marker
berdasarkan jarak pengambilan kamera dan sudut kemiringan kamera.
4.4.1
Pengujian jarak pendeteksian
Pengujian jarak dilakukan untuk mengetahui seberapa jauh jarak marker dapat
dideteksi oleh kamera dan jarak berapa marker dideteksi lebih efektif. Hasil pengujian
dapat dilihat pada table 4.7
Tabel 4.7 Pengujian jarak deteksi
No.
Jarak
Keterangan
1.
2.5 meter
Terdeksi
dan
stabil
2.
3meter
Terdeteksi
dan
stabil
3.
5 meter
Terdeteksi
dan
stabil
3.
4.4.2
7 meter
Tidak terdeteksi
Pengujian sudut kemiringan pendeteksian
Pengujian sudut kemiringan kamera dilakukan untuk mengetahui sudut berapa kamera
dapat mendeteksi marker dan sudut berapa kamera tidak dapat mendeteksi marker.
Hasil pengujian dapat dilihat pada table 4.8
Table 4.8 Pengujian sudut kemiringan kamera
No.
Jarak
Keterangan
Universitas Sumatera Utara
45
1.
10o
Tidak terdeteksi
2.
40o
Terdeksi stabil
3.
90
Terdeteksi stabil
Universitas Sumatera Utara
46
BAB 5
KESIMPULAN DAN SARAN
Bab ini membahas tentang kesimpulan dari Pengenalan Jari tangan sebagai interaksi
augmented reality heritage kota medan .Selain itu juga memberikan saran untuk
pengembangan penelitian selanjutnya.
5.1
Kesimpulan
Setelah melakukan tahap implementasi dan menguji sistem, maka diperoleh beberapa
kesimpulan yang ditemukan pada penelitian ini, yaitu :
1. Aplikasi dapat berjalan dengan baik saat mendeteksi marker dan menampilkan
objek 3D.
2. Situasi yang baik dalam melakukan pendeteksian jumlah jari tangan yaitu
pada jarak 30 – 50 cm dan dengan pencahayaan yang cukup terang.
3. Jarak maksimal untuk pendeteksian jumlah jari tangan yaitu 65 cm
4. Pada saat pendeteksian disarankan, warna latar belakang pendeteksian
haruslah polos dan tidak bercorak serta berwarna kulit.
5. Jarak optimal pendeteksian marker didapat yaitu 2.5 – 5 meter
5.2
Saran
Saran yang dapat diberikan untuk penelitian selanjutnya adalah :
•
Penelitian selanjutnya diharapkan dapat mendeteksi objek tangan dengan latar
belakang (background) warna yang bervariasi / tidak polos.
•
Diharapkan pengembangan selanjutnya disarankanmenggunakan metode lain
agar pendeteksian tidak mudah terganggu karena objek lain masuk seperti kulit
lengan maupun kepala.
Universitas Sumatera Utara
47
•
Diharapkan penelitian selanjutnyatetap dapat mengenali jumlah jari tangan
ketika ada perubahan cahaya yang signifikan.
Universitas Sumatera Utara