BAB III PERENCANAAN DAN PEMBUATAN SISTEM Pada bab ini akan dipaparkan perencanaan dan pembuatan perangkat lunak secara keseluruhan, dimana dalam proyek akhir ini, terdiri dari dua sub besar perangkat lunak, yaitu deteksi gerakan raket dan pembuatan game. 3.1. Desain Sistem Sebelum sistem diimplementasikan, terlebih dahulu dibuat sistematika perancangan yang merepresentasikan keseluruhan sistem agar didapatkan hasil yang maksimal. Start
Capture gambar
Noise Removal (Erosi dan Dilasi)
Color Segmentation (Tresholding)
Tracking
Bounding box
Hitung luas Bounding Box
> inisialisasi? ya tidak
Mengenai sasaran? ya
Serangga mati
End
Gambar 3.1. Flowchart Sistem
25
tidak
Blok diagram sistem di atas, merupakan keseluruhan proses untuk mengimplementasikan proyek akhir ini. Dimana pada awalnya gambar yang ditangkap berupa nilai RGB. Untuk memisahkan objek yang dalam kasus ini adalah gerakan raket, dengan background yang ada, digunakan segmentasi warna menggunakan metode Tresholding, sebagaimana dijelaskan dalam bab sebelumnya. Hasil dari segmentasi warna merah akan digunakan untuk tracking gerakan raket. Setelah gerakan terdeteksi, maka akan dilakukan bounding box pada raket yang kemudian mengecek luasnya, jika luasnya lebih besar dari inisialisasi dan mengenai objek (serangga), maka objek serangga akan mati. 3.2. Proses Teknis Pengambilan Gambar Pada pembahasan ini akan memaparkan bagaimana teknis mendapatkan gambar yang nantinya akan diolah lebih lanjut. Sebagaimana yang telah dijelaskan di muka, untuk proses komunikasi hingga didapatkan objek, akan menggunakan library OpenCV yang telah tersedia secara gratis. Modul modul yang ada pada OpenCV antara lain: a. cv – fungsi-fungsi utama OpenCV, b. cvaux – fungsi tambahan (eksperimental) OpenCV, c. cxcore – dukungan struktur data dan aljabar linear, d. highgui – fungsi-fungsi yang menangani masalah GUI. Header file OpenCV: a. #include
b. #include c. #include Berikut fungsi untuk inisialisasi kamera dan window: void init() ....(1) { capture = cvCaptureFromCAM(CV_CAP_ANY); ....(2) if( !capture ){ ....(3) fprintf( stderr, "ERROR: capture is NULL \n");...(4) } cvNamedWindow("Serangga Nakal",1); ....(5) cvNamedWindow("Edge detection",0.3); ....(6) cvNamedWindow("Color segmentation",0.3); ....(7) cvNamedWindow("Capture Gambar",0.3); ....(8) }
26
cam = cvQueryFrame(capture); ....(9) if( !cam ){ ...(10) fprintf( stderr, "ERROR: frame is null...\n" ); ...(11) return -1; ...(12) }
Gambar 3.2. Fungsi init() dan QueryFrame Rincian informasi dari coding di atas dijelaskan seperti berikut : 1. Deklarasi fungsi init(), bertipe void karena tidak mengembalikan nilai tertentu. 2. Inisialisasi kamera, mengambil gambar dari kamera dan ditampung ke capture. 3. Kondisi jika kamera tidak terdeteksi. 4. Output jika kondisi pada no (3) terpenuhi. 5. Inisialisasi window “Serangga Nakal”, window utama untuk game Serangga Nakal. 6. Inisialisasi window “Edge detection”, window untuk menampilkan gambar deteksi tepi raket. 7. Inisialisasi window ”Color segmentation”, window untuk menampilkan gambar hasil segmentasi warna (merah). 8. Inisialisasi window ”Capture Gambar”, window untuk menampilkan gambar asli dari kamera. 9. Inisialisasi variabel cam. 10. Kondisi jika cam tidak mengandung nilai. 11. Output jika kondisi pada nomor (10) tidak terpenuhi. 12. Keluar dari program.
27
Hasil capture dari kamera:
Gambar 3.3. Hasil gambar dari kamera 3.3. Color segmentation Setelah koneksi dengan kamera berhasil, langkah berikutnya adalah tahap segmentasi warna (tresholding) untuk mendapatkan warna merah pada raket, berikut adalah coding untuk melakukan proses treshold pada warna merah: void segmen() { for(int i=0;i<jml;i++){ cam_seg = cvCloneImage(cam); height = cam_seg->height; width = cam_seg->width; step = cam_seg->widthStep; channels = cam_seg->nChannels; data = (uchar *)cam_seg->imageData; for(int i=0;i (0.85*(G+B))) && (R>105))&&((RG>73))&& (((G<150)||((G>=150)&&(B>140)) ))){ data[i*step+j*channels+0]=0; data[i*step+j*channels+1]=0; data[i*step+j*channels+2]=255;
28
} else{ data[i*step+j*channels+0]=0; data[i*step+j*channels+1]=0; data[i*step+j*channels+2]=0; } } } } }
Gambar 3.4. Fungsi segmen() untuk treshold warna merah Untuk mendeteksi warna merah pada raket, maka saat kamera menangkap gambar, gambar tersebut kemudian dikonversi menjadi gambar grayscale dan difilter berdasarkan warnanya, dan akan menghasilkan gambar seperti dibawah :
Gambar 3.5. Hasil gambar setelah di proses treshold 3.4. Erode, Dilate dan Canny Edge detection Setelah warna raket didapatkan, proses selanjutnya adalah Noise Removal pada warna yang terdeteksi. Proses ini biasanya disebut proses Closing, yang terdiri dari Erosi dan Dilasi. Tujuan dari Erosi dan Dilasi adalah untuk menghilangkan noise yang terbentuk disekitar raket. Kemudian dilanjutkan dengan deteksi tepi menggunakan Canny Edge detection. Dari proses Canny Edge detection, akan didapatkan gambar yang dari proses ini, ditentukan pula batas atas, bawah, kiri, dan kanan dari raket sebagai patokan dari pembentukan bounding box.
29
Gambar 3.6. Canny Edge detection Berikut coding dari proses Erosi, Dilasi, Canny, dan menentukan batas atas, bawah, kiri dan kanan raket: void tracking() { for (int i=0;i<jml;i++) { fin_img = cvCloneImage(cam); ImgGray = cvCreateImage( cvSize (cam_seg -> width, cam_seg -> height), IPL_DEPTH_8U, 1 ); cvCvtColor( cam_seg, ImgGray, CV_BGR2GRAY ); cvErode(ImgGray,ImgGray,NULL,2); cvDilate(ImgGray,ImgGray,NULL,2); cvCanny(ImgGray,ImgGray,20,90,3); height1 = ImgGray->height; width1 = ImgGray->width; step1 = ImgGray->widthStep; channels1= ImgGray->nChannels; data1 = (uchar *)ImgGray->imageData; ImgGray->origin=cam_seg->origin; atas=0; for(int i1=0;i1
30
kiri=0; for(int j2=0;j2<width1;j2++) for(int i2=0;i20;j4--) for(int i4=0;i40;i3--) for(int j3=0;j3<width1;j3++){ if (data1[i3*step1+j3*channels1]==255) { bawah=i3; } } pt1.x=kiri; pt1.y=atas; pt2.x=kiri; pt2.y=bawah; pt3.x=kanan; pt3.y=atas; pt4.x=kanan; pt4.y=bawah; } }
Gambar 3.7. Proses Erosi, Dilasi dan Canny 3.5. Bounding Box dan Mekanisme Tepukan Raket Setelah bounding box terbentuk, maka akan didapatkan luasan dari bounding box tersebut, kemudian program akan menghitung luasnya dan membandingkannya dengan inisialisasi, dan jika luasnya lebih besar atau sama dengan inisialisasi, maka akan dideteksi sebagai tepukan.
31
Awalnya penulis kesulitan dalam menentukan tepukan agar pada saat luasnya lebih besar dari inisialisasi, kondisinya tidak dalam posisi “tepuk” terus menerus, posisi ini hanya berlangsung sesaat, setelah raket ditepuk, raket harus ditarik kembali dan ditepuk sekali lagi untuk mendapatkan posisi “tepuk” lagi.
Gambar 3.8. Bounding box saat kondisi tidak ditepuk Tepukan pada raket diinisialisasikan tepat saat luasan bounding box bertambah dari luasan awal, ke luasan setelah proses cek luasan, dan luas tepukan diambil saat luasan mencapai angka maksimum. Jika pada saat itu terdapat serangga yang posisinya berada didalam area bounding box, maka secara otomatis serangga tersebut akan mati.
32
Gambar 3.9. Bounding box saat kondisi ditepuk Berikut ini coding untuk menggambar bounding box dengan warna merah: ... cvLine(cam_seg,pt1,pt2,CV_RGB(255,0,0),2,8,0); cvLine(cam_seg,pt1,pt3,CV_RGB(255,0,0),2,8,0); cvLine(cam_seg,pt2,pt4,CV_RGB(255,0,0),2,8,0); cvLine(cam_seg,pt3,pt4,CV_RGB(255,0,0),2,8,0); ...
Gambar 3.10. Coding untuk bounding box Dan dibawah ini adalah program untuk mengecek apakah terjadi tepukan atau tidak : void tepuk() {
33
for(int i=0;i<jml;i++){ int luas =dx*dy; if (luas>=40000&&tpk>=0){ tpk++; if (tpk==1){ tpk=-1; luas=0; } mati(); } else if(luas<40000) { tpk=0; } } }
Gambar 3.11. Fungsi tepuk() 3.6. Menggambar Serangga Setelah sistem berjalan dengan benar dan dapat mendeteksi tepukan raket, selanjutnya akan menggambar “serangga” yang disimbolkan dengan lingkaran dengan 2 sayap. Posisi awal serangga tersebut adalah acak, begitu juga dengan arah gerakannya. Tiap “serangga” memiliki 8 kemungkinan arah gerak, dan semuanya adalah acak.
1 2
8
7
3
6
4 5
Gambar 3.12. 8 kemungkinan arah gerak serangga
34
Pada arah pergerakan serangga yang acak, yang dirubah adalah posisi koordinat x, dan y serangga tersebut. Berikut adalah posisi x dan y serangga setelah di acak: • Jika 1 maka x tetap, y + = jarak (inc) • Jika 2 maka x + = jarak (inc), y + = jarak (inc) • Jika 3 maka x + = jarak (inc), y tetap • Jika 4 maka x + = jarak (inc), y - = jarak (inc) • Jika 5 maka x tetap, y - = jarak (inc) • Jika 6 maka x - = jarak (inc), y - = jarak (inc) • Jika 7 maka x - = jarak (inc), y tetap • Jika 8 maka x - = jarak (inc), y + = jarak (inc) Berikut adalah program untuk acak posisi awal seranga dan acak arah pergerakan serangga: void awal() { for(int i=0;i<jml;i++){ status[i]=1; pos[i].x=(rand()%640); pos[i].y=(rand()%480); } }
Gambar 3.13. Fungsi awal() untuk acak posisi awal serangga CvPoint rnd(CvPoint pos) { int x0=rand()%8; if(x0==0){pos.y=pos.y+inc;} else if(x0==1){pos.x=pos.x+inc;pos.y=pos.y+inc;} else if(x0==2){pos.x=pos.x+inc;} else if(x0==3){pos.x=pos.x+inc;pos.y=pos.y-inc;} else if(x0==4){pos.y=pos.y-inc;} else if(x0==5){pos.x=pos.x-inc;pos.y=pos.y-inc;} else if(x0==6){pos.x=pos.x-inc;} else {pos.x=pos.x-inc;pos.y=pos.y+inc;} if(pos.x>=640)pos.x=0; else if(pos.x<=0)pos.x=640; else if(pos.y>=480)pos.y=0; else if(pos.y<=0)pos.y=320;
35
return pos; }
Gambar 3.14. Fungsi rnd() untuk acak arah gerak serangga Langkah terakhir adalah membangun game. Penyusunan skenario game belum sempurna, tetapi pada dasarnya, sistem game sudah berjalan dengan normal. Tampilan awal permainan ini ada pada gambar 3.15.
Gambar 3.15. Tampilan awal game 3.7. Jalannya Permainan dan Skenario Game Pada saat game dieksekusi dari project, maka pemain harus menekan tombol “Main (Lagi)” untuk memulai memainkan game. Kemudian secara otomatis game akan masuk ke level 1.
36
Gambar 3.16. Tampilan awal level 1 Pada level ini pemain harus menyelesaikan misinya untuk membunuh serangga (musuh) yang berjumlah 10, dan pemain harus “membunuh” semuanya dalam waktu kurang dari 20 detik dengan jarak pemain dengan kamera kurang lebih adalah 20cm.
Gambar 3.17. Tampilan level 1 Jika hingga batas waktu yang ditentukan (20 detik) serangga belum mati semua, maka permainan akan berakhir, dan untuk memainkannya lagi, pemain harus menekan tombol “Main (Lagi)”.
37
Gambar 3.18. Tampilan game over Dan jika sebelum waktu habis pemain dadapat membunuh semua serangga dengan ditepuk, maka permainan akan dilanjutkan ke level berikutnya, yaitu level 2.
Gambar 3.19. Tampilan awal level 2
38
Gambar 3.20. Tampilan level 2 Pada level ini, lokasi yang harus dibersihkan adalah di kamar tidur. jumlah serangga yang harus dibunuh masih tetap ada 10, tetapi perbedaan dari level sebelumnya ada pada kecepatan gerakan serangga, serangga bergeak lebih lincah dan gesit, sehingga secara otomatis akan menyulitkan pemain untuk membunuhnya. Perbedaan yang lain adalah pada batasan luasa bounding box untuk membunuh serangga yang lebih kecil 1000 pixel dari level sebelumnya, sehingga pemain harus mundur menjauhi kamera kurang lebih sekitar 510 cm agar dapat dengan mudah menepuk serangga tersebut. Karena jarak pemain dan kamera bertambah, maka ruang gerak pemain juga bertambah, sehingga pemain harus mengangkat raket lebih tinggi untuk membunuh serangga yang ada di posisi atas layar dibandingkan dengan level sebelumnya. Pada level 3, serangga yang harus dibunuh adalah 10 tetapi dengan gerakan serangga yang lebih cepat deri level sebelumnya, dan tentu saja dengan batasan luas Bounding Box yang lebih kecil. Lokasi yang harus dibersihkan dari serangga adalah ruang makan. Pada level ini semua serangga harus sudah mati dalam waktu kurang dari 20detik. Dibutuhkan gerakan pemain yang lincah untuk dapat membunuh serangga yang bergerak cepat dalam waktu yang sedikit tersebut.
39
Gambar 3.21. Tampilan awal level 3
Gambar 3.22. Tampilan level 3 Setelah level 3 dapat dilalui, permainan akan masuk ke level selanjutnya, yaitu level 4, pada level ini pemain akan berpindah tempat menuju ke ruang keluarga untuk membunuh semua serangga dan nyamuk yang mengganggu.
40
Gambar 3.23. Tampilan awal level 4
Gambar 3.24. Tampilan level 4 Jumlah nyamuk adalah 10, dengan gerakan yang sangat cepat, waktu minimal untuk membunuh semua nyamuk adalah 20 detik, dan batasan luas bounding box yang lebih kecil 1000 pixel dari level sebelumnya. Level selanjutnya adalah level 5, dimana serangga bergerak sangat cepat sekal8i sehingga sayap serangga tampak panjang.
41
Gambar 3.25. Tampilan awal level 5 Jika pemain cukup beruntung, maka dia akan dapat melewati level ini, dan waktu minimal untuk membunuh serangga serangga tersebut adalah 20 detik. Setelah kelima level dapat diselesaikan, pemain akan memasuki Final Level, dimana musuh besar sudah menanti, pada level ini serangga yang harus dibunuh adalah Raja Serangga, ukurannya jauh lebih besar daripada serangga prajurit, si Raja juga mempunyai 9 nyawa, yang artinya pemain harus menepuknya sebanyak 9 kali yang tepat sasaran untuk dapat membunuhnya. Jika pada tepukan yang ke 5 pemain meleset, maka nyawa si Raja akan bertambah.
42
Gambar 3.26. Tampilan Final Level
Gambar 3.26. Tampilan Final Level Dan jika pemain bener benar beruntung, tenang serta cerdas dalam menghadapi Final Level, serta pemain dapat membunuh Raja serangga, maka selanjutnya pemain akan masuk ke Bonus level dimana pemain dapat mengumpulkan poin sebanyak banyaknya dalam waktu 10 detik.
43